@extends('layouts.app')

@section('title',$image->filename)

@section('breadcrumb')
<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="/">Home</a></li>
    <li class="breadcrumb-item" aria-current="page"><a href="{{ route('image.index') }}">Bilder</a></li>
    <li class="breadcrumb-item active" aria-current="page">{{ $image->filename }}</li>
  </ol>
</nav>
@endsection

@section('content')
<h2>{{ $image->filename }}</h2>
@include('includes.errors')

<div class="row">
  <div class="col-4 text-center">
	<img class="img-fluid" src="{{ asset('assets/'.$image->preview()) }}">
  </div>
  <div class="col">
    <div><strong>Dateiname:</strong></div>
    <div>{{ $image->filename }}</div>
    <div><strong>Original-Dateiname:</strong></div>
    <div>{{ $image->original_filename }}</div>
    <div><strong>MyPicturemaxx-Kennung:</strong></div>
    <div>{{ $image->mypicturemaxx_number or '&nbsp;' }}</div>
    <div><strong>Lieferant:</strong></div>
    <div>
      @if ( $image->supplier )
      <a href="{{ action('SupplierController@edit',$image->supplier) }}">{{ $image->supplier->name }}</a>
      @else
      &nbsp;
      @endif
    </div>
    <div><strong>Serie:</strong></div>
    <div>
      @if ($image->imageSet)
      <a href="/imageset/{{ $image->imageSet->id }}">{{ $image->imageSet->title }}</a>
      @else
      &nbsp;
      @endif
    </div>
    <div class="mt-3">
      @if ( $image->editable() )
      <a href="{{ action('ImageController@edit',$image) }}" role="button" class="btn btn-primary">Bearbeiten</a>
      @endif
      <button class="btn btn-danger" data-toggle="modal" data-target="#deleteimage_modal">Löschen</button>
      @if ( $image->status != 'archive' && !empty($image->mypicturemaxx_number) && !empty($image->supplier) )
      <button class="btn btn-info" data-toggle="modal" data-target="#archiveimage_modal">Ins Archiv</button>
      @endif
    </div>
  </div>
</div>

<h3 class="mt-3">Metadaten</h3>
<nav class="nav mb-3">
  <ul class="nav nav-pills" id="meta-tabs" role="tablist">
    @if ( !$image->isarchive() )
    <li class="nav-item">
      <a id="current-tab" href="#current" data-toggle="tab" role="tab" class="nav-link active">Aktuelle Metadaten</a>
    </li>
    @endif
    <li class="nav-item">
      <a id="original-tab" href="#original" data-toggle="tab" role="tab" class="nav-link{{ ($image->isarchive() ? ' active':'') }}">Originale Metadaten</a>
    </li>
  </ul>
</nav>

<div class="tab-content" id="meta-tabs-content">
  <div class="tab-pane{{ !$image->isarchive() ? ' show active' : '' }}" id="current" role="tabpanel">
    @foreach ($current_meta as $meta_key => $meta_value)
    <div class="row">
      <div class="col-3">{{ studly_case($meta_key) }}</div>
              <div class="col">
          @if (!empty($meta_value))
          {!! nl2br(e($meta_value)) !!}
          @else
          &nbsp;
          @endif
      </div>
    </div>
    @endforeach
  </div>


  <div class="tab-pane{{ $image->isarchive() ? ' show active' : '' }}" id="original" role="tabpanel">
    <div class="mb-1"><button data-toggle="modal" data-target="#detailedmeta_modal" type="button" class="btn btn-outline-primary btn-sm">Detaillierte Metadaten anzeigen</button></div>
    @foreach (collect($image->metadata)->except(['id','image_id','created_at','updated_at','archive'])->toArray() as $meta_key => $meta_value)
    <div class="row">
        <div class="col-3">{{ studly_case($meta_key) }}</div>
                <div class="col">
          @if (!empty($meta_value))
          {!! nl2br(e($meta_value)) !!}
          @else
          &nbsp;
          @endif
        </div>
    </div>
    @endforeach
  </div>
</div>

<div class="modal fade" id="deleteimage_modal" tabindex="-1" role="dialog" aria-labelledby="deleteimage_modal_title" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      {!! Form::open(['action' => ['ImageController@destroy',$image],'method' => 'delete']); !!}
      <div class="modal-header">
        <h5 class="modal-title" id="deleteimage_modal_title">Bild löschen</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        Bild <strong>{{ $image->filename }} </strong> löschen?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Abbrechen</button>
        <button type="submit" class="btn btn-danger">Löschen</button>
      </div>
    </div>
    {!! Form::close() !!}
  </div>
</div>

<div class="modal fade" id="archiveimage_modal" tabindex="-1" role="dialog" aria-labelledby="archiveimage_modal_title" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      {!! Form::open(['action' => ['ImageController@moveToArchive',$image],'method' => 'put']); !!}
      <div class="modal-header">
        <h5 class="modal-title" id="archiveimage_modal_title">Ins Archiv</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>Bild <strong>{{ $image->filename }} </strong> ins Archiv verschieben?</p>
        <p>Das Originalbild und die angepassten Metadaten werden gelöscht, die originalen Metadaten und die Vorschaubilder werden behalten.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Abbrechen</button>
        <button type="submit" class="btn btn-primary">Bestätigen</button>
      </div>
    </div>
    {!! Form::close() !!}
  </div>
</div>

<div class="modal fade " id="detailedmeta_modal" tabindex="-1" role="dialog" aria-labelledby="detailedmeta_modal_title" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="detailedmeta_modal_title">Metadaten</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
              </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
@endsection