@extends('adminlte::layouts.app')

@section('htmlheader_title')
	Photo - {{ $o->id }}
@endsection

@section('contentheader_title')
	Photo
@endsection
@section('contentheader_description')
	#{{ $o->id }}
@endsection
@section('page_title')
	#{{ $o->id }}
@endsection

@section('main-content')
	<div class="row">
		<div class="col-md-10 col-md-offset-1">
			<div class="panel panel-default">
				<div class="panel-heading">
					Photo {{ $photo->id }}<?php if ($photo->remove) : ?> - <strong>PENDING DELETE</strong><?php endif?>
				</div>

				<div class="panel-body">
					<div class="col-md-2">
						<a href="{{ url('/p/view/'.$photo->id) }}"><img src="{{ url('/p/thumbnail/'.$photo->id) }}" width="200px"></a>
					<div class="text-center">
					<ul class="pagination">
						<li <?php if (! $x = $photo->previous()) : ?>class="disabled"<?php endif ?>><a href="{{ $x ? url('/p/info/'.$x->id) : '#' }}">&lt;&lt;</a></li>
						<li <?php if (! $x = $photo->next()) : ?>class="disabled"<?php endif ?>><a href="{{ $x ? url('/p/info/'.$x->id) : '#' }}">&gt;&gt;</a></li>
					</ul>
					</div>

					</div>
					<div class="col-md-10">
						<div class="dl-horizontal">
							<dt>Signature</dt><dd>{{ $photo->signature(TRUE) }}</dd>
							<dt>Filename</dt><dd>{{ $photo->file_path(TRUE) }}<dd>
							<?php if ($photo->shouldMove()) : ?>
								<dt>NEW Filename</dt><dd>{{ $photo->file_path(TRUE,TRUE) }}<dd>
							<?php endif ?>
							<dt>Size</dt><dd>{{ $photo->file_size() }}<dd>
							<dt>Dimensions</dt><dd>{{ $photo->width }} x {{ $photo->height }} @ {{ $photo->orientation }}<dd>
							<br/>
							<dt>Date Taken</dt><dd>{{ $photo->date_taken() }}<dd>
							<dt>Camera</dt><dd>{{ $photo->make }}<dd>
							<dt>Model</dt><dd>{{ $photo->model }}<dd>
							<dt>Software</dt><dd>{{ $photo->software }}<dd>
							<br/>
							<dt>Location</dt><dd>
							<?php if ($photo->gps() == 'UNKNOWN') : ?>
								UNKNOWN
							<?php else : ?>
								<div id="map" style="width: 400px; height: 300px"></div>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var myLatLng = {lat: {{ $photo->gps_lat }}, lng: {{ $photo->gps_lon }}};
  var map = new google.maps.Map(document.getElementById("map"), {
	zoom: 16,
	center: myLatLng,
	mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var marker = new google.maps.Marker({
	map: map,
	position: myLatLng,
  });
</script>
							<?php endif ?>
							</dd>
							<br/>
							<dt>Exif Data</dt><dd>
								<table>
								<?php foreach ($photo->properties() as $k => $v) : ?>
								<tr><th>{{ $k }}<><td>{{ $v }}<td></tr>
								<?php endforeach ?>
								</table>
							</dd>
						</div>
					</div>

					<?php if ($photo->remove) : ?>
					<form action="{{ url('/p/undelete/'.$photo->id) }}" method="POST">
						<button class="btn btn-default">Undelete</button>
					<?php else : ?>
					<form action="{{ url('/p/delete/'.$photo->id) }}" method="POST">
						<button class="btn btn-default">Delete</button>
					<?php endif ?>
						{{ csrf_field() }}
					</form>
				</div>
			</div>
		</div>
	</div>
@endsection