@extends('layouts.admin')

@section('header')
Stanovi / Uredi #{{$property->id}}
@endsection

@section('content')
<div class="tab-wrapper tab-primary">
	<ul class="nav nav-tabs">
		<li class="active"><a href="#details" data-toggle="tab">Detalji</a></li>
		<li><a href="#images" data-toggle="tab">Galerija</a></li>
		<li><a href="#documents" data-toggle="tab">Dokumenti</a></li>
		<li><a href="#rooms" data-toggle="tab">Prostorije</a></li>
	</ul>
	<div class="tab-content">
		<!-- Details -->    
		<div class="tab-pane active" id="details">
			{!! Form::model($property, ['method' => 'PUT', 'route' => ['admin.property.update', $property], 'files' => true]) !!}
			@include('property._form')
			{!! Form::close() !!}  
		</div>
		<!-- Images -->
		<div class="tab-pane" id="images">
			<!-- jQuery File Upload -->
			<!-- The fileinput-button span is used to style the file input field as button -->
			<span class="btn btn-success fileinput-button">        
				<i class="glyphicon glyphicon-plus"></i>
				<span>Odaberite slike</span>
				<!-- The file input field used as target for the file upload widget -->
				<input type="file" name="file" class="fileupload" data-url="{{route('admin.upload.store')}}" data-form-data='{"model": "property", "id": {{$property->id}}}' multiple>
			</span>
			<br>
			<br>
			<!-- The global progress bar -->
			<div id="progress" class="progress">
				<div class="progress-bar progress-bar-success"></div>
			</div>
			@include('upload.images', ['uploads' => $property->images])
		</div>
		<!-- Documents -->
		<div class="tab-pane" id="documents">
			<!-- jQuery File Upload -->
			<!-- The fileinput-button span is used to style the file input field as button -->
			<span class="btn btn-success fileinput-button">        
				<i class="glyphicon glyphicon-plus"></i>
				<span>Odaberite dokumente</span>
				<!-- The file input field used as target for the file upload widget -->
				<input type="file" name="file" class="fileupload" data-url="{{route('admin.upload.store')}}" data-form-data='{"model": "property", "id": {{$property->id}}}' multiple>
			</span>
			<br>
			<br>
			<!-- The global progress bar -->
			<div id="progress" class="progress">
				<div class="progress-bar progress-bar-success"></div>
			</div>
			@include('upload.documents', ['uploads' => $property->documents])
		</div>
		<!-- Rooms -->
		<div class="tab-pane" id="rooms">
			<div class="row">
				<div class="col-md-12">
					<a class="btn btn-success" href="#" id="add"><i class="glyphicon glyphicon-plus"></i> Novi unos</a>
				</div>
			</div>
			{!! Form::open(['route' => ['admin.property.room', $property]]) !!}
			<div class="table-responsive">  
				<table class="table" id="dynamic_field">  
					<thead>
						<tr>
							<th>
								<label class="control-label">Vrsta prostorije</label>
							</th>
							<th>
								<label class="control-label">Površina</label>
							</th>
							<th>
								&nbsp;
							</th>
						</tr>
					</thead>
					<tbody>
						@foreach($property->rooms as $key => $room)
						<tr>
							<td>
								<select name="rooms[{{$key}}][room_type_id]" class="form-control" required>
									<option value=""></option>
									@foreach($room_types as $key2 => $room_type)
									<option value="{{$key2}}" {{$key2 == $room->room_type->id ? 'selected' : ''}}>{{$room_type}}</option>
									@endforeach
								</select>
							</td>
							<td>
								<div class="input-group">
									<input type="text" name="rooms[{{$key}}][surface]" class="form-control" value="{{$room->surface}}" required />
									<span class="input-group-addon">m<sup>2</sup></span>
								</div>
							</td>
							<td><button type="button" class="btn btn-danger remove"><span class="glyphicon glyphicon-trash"></span></button></td>
						</tr>
						@endforeach
					</tbody>
				</table>  
				<div class="form-group">
					{!! Form::submit('Spremi', ['class' => 'btn btn-primary']) !!}
				</div>
			</div>
			{!! Form::close() !!}
		</div>
	</div>
</div>
@endsection

@section('scripts')
<script>
	$(document).ready(function(){

		var i = {{$property->rooms->count()}};  

		$(document).on('click', '#add', function(){
			var html = '';
			html += '<tr>';
			html += '<td><select name="rooms['+i+'][room_type_id]" class="form-control" required>';
			html += '<option value=""></option>';
			
			@foreach($room_types as $key => $room_type)
			html += '<option value="{{$key}}">{{$room_type}}</option>';
			@endforeach		

			html += '</select></td>';
			html += '<td>';
			html += '<div class="input-group">';
			html += '<input type="text" name="rooms['+i+'][surface]" class="form-control" required />';
			html += '<span class="input-group-addon">m<sup>2</sup></span>';
			html += '</div>';
			html += '</td>';
			html += '<td><button type="button" class="btn btn-danger remove"><span class="glyphicon glyphicon-trash"></span></button></td>';
			html += '</tr>';
			$('#dynamic_field').append(html);
			i++;
		});

		$(document).on('click', '.remove', function(){
			$(this).closest('tr').remove();
		});
	});
</script>
@append