@extends('templates.backend')

@section('page-title', isset($page_title) ? $page_title : 'View Marker')

@section('breadcrumbs')
    {!! App\Helpers\Breadcrumbs::generate([
        'Markers'       => ['backend.markers.index'],
        $marker->name   => null,
    ]); !!}
@stop

@section('content')

	@if(($live_map_url = config('misc.live_map_url')) && $marker->is_active)
        <a href="{{ $live_map_url }}?marker={{ $marker->id }}" target="_blank" class="btn btn-primary">View On Live Map</a>
	@else
        <a href="#" class="btn btn-primary" disabled="disabled" title="Cannot preview Inactive markers">View On Live Map</a>
	@endif
    {!! link_to_route('backend.markers.edit.get', 'Edit Marker', [$marker->id], ['class' => 'btn btn-warning']) !!}
    {!! link_to_route('backend.markers.destroy', 'Delete Marker', [$marker->id], ['class' => 'btn btn-danger']) !!}
    <br />
    <br />

    <ul class="nav nav-tabs">
        <li class="active"><a data-toggle="tab" href="#marker">Marker</a></li>
        <li><a data-toggle="tab" href="#category">Category</a></li>
        <li><a data-toggle="tab" href="#gps_preview">GPS Preview</a></li>
        <li><a data-toggle="tab" href="#extras">Extras</a></li>
        <li><a data-toggle="tab" href="#image">Image</a></li>
        <li><a data-toggle="tab" href="#icon">Icon</a></li>
    </ul>

    <div class="tab-content">
        <div id="marker" class="tab-pane fade in active">
            @include('backend.markers._partials.snapshot')
        </div>
        <div id="category" class="tab-pane fade">
            {!! link_to_route('backend.categories.show', 'View Category', [$marker->category_id], ['class' => 'btn btn-primary']) !!}
            @include('backend.categories._partials.snapshot', ['category' => $marker->category])
        </div>
        <div id="gps_preview" class="tab-pane fade">
            <iframe
                    width="300"
                    height="170"
                    frameborder="0"
                    scrolling="no"
                    marginheight="0"
                    marginwidth="0"
                    src="https://maps.google.com/maps?q={{ $marker->latitude }},{{ $marker->longitude }}&hl=es;z=14&amp;output=embed"
            >
            </iframe>
        </div>
        <div id="extras" class="tab-pane fade">
            <pre>NULL
</pre>
        </div>
        <div id="image" class="tab-pane fade">
            @if($image_url = $marker->getImageUrl('image'))
                {!! link_to_route('backend.markers.delete_image', 'Delete Image', [$marker->id], ['class' => 'btn btn-danger']) !!}
                <br />
                <br />
                <img src="{{ $image_url }}" />
            @else
                None
            @endif
        </div>
        <div id="icon" class="tab-pane fade">
            @if($icon_url = $marker->getImageUrl('icon'))
                {!! link_to_route('backend.markers.delete_icon', 'Delete Icon', [$marker->id], ['class' => 'btn btn-danger']) !!}
                <br />
                <br />
                <img src="{{ $icon_url }}" />
            @else
                None
            @endif
        </div>
    </div>
@stop