@extends('layouts.app')

@section('content')

<div class="card">
    <div class="card-header">

        <h5  class="my-1 float-left">{{ isset($gallery->name) ? $gallery->name : 'Gallery' }}</h5>

        <div class="float-right">

            <form method="POST" action="{!! route('galleries.gallery.destroy', $gallery->id) !!}" accept-charset="UTF-8">
            <input name="_method" value="DELETE" type="hidden">
            {{ csrf_field() }}
                <div class="btn-group btn-group-sm" role="group">
                    <a href="{{ route('galleries.gallery.index') }}" class="btn btn-primary" title="แสดง Gallery ทั้งหมด">
                        <i class="fas fa-fw fa-th-list" aria-hidden="true"></i>
                    </a>

                    <a href="{{ route('galleries.gallery.create') }}" class="btn btn-success" title="เพิ่ม Gallery ใหม่">
                        <i class="fas fa-fw fa-plus" aria-hidden="true"></i>
                    </a>
                    
                    <a href="{{ route('galleries.gallery.edit', $gallery->id ) }}" class="btn btn-primary" title="แก้ไขข้อมูล Gallery">
                        <i class="fas fa-fw fa-pencil-alt" aria-hidden="true"></i>
                    </a>

                    <button type="submit" class="btn btn-danger" title="ลบ Gallery ทิ้ง" onclick="return confirm(&quot;คลิก OK เพื่อยืนยันการลบ Gallery?&quot;)">
                        <i class="fas fa-fw fa-trash-alt" aria-hidden="true"></i>
                    </button>
                </div>
            </form>

        </div>

    </div>

    <div class="card-body">
         
            <div class="row">
				<div class="col-sm-2">ชื่อคลังภาพ</div>
				<div class="col-sm-4">{{ $gallery->name }}</div>
			</div>
            <div class="row">
				<div class="col-sm-2">แสดงสาธารณะ</div>
				<div class="col-sm-4">{{ $gallery->is_public }}</div>
			</div>
            <div class="row">
				<div class="col-sm-2">วันที่เผยแพร่</div>
				<div class="col-sm-4">{{ $gallery->public_date }}</div>
			</div>
            <div class="row">
				<div class="col-sm-2">ผู้บันทึก</div>
				<div class="col-sm-4">{{ optional($gallery->user)->name }}</div>
			</div>
            <div class="row">
				<div class="col-sm-2">วันที่เพิ่มข้อมูล</div>
				<div class="col-sm-4">{{ $gallery->created_at }}</div>
			</div>
            <div class="row">
				<div class="col-sm-2">วันที่ปรับปรุงล่าสุด</div>
				<div class="col-sm-4">{{ $gallery->updated_at }}</div>
			</div>

        

    </div>
    
</div>
<br>

<div class="card">
<div class="card-body">
<div class="row">
<div class="col-sm-4 offset-sm-8">
	<button class="btn btn-info" data-toggle="modal" data-target="#exampleModal">เพิ่มภาพเข้าคลังภาพ</button>
    </div>
</div><hr>

<div class="row">
   @foreach($galleryImages as $galleryImage)
   
   	<div class="col-sm-4">
    <div class="card">  <div class="card-body" style="padding:5px;">
    	<img src="{{asset($galleryImage->image)}}" class="img-100">
        <p>{{ $galleryImage->text }}</p>
          <form method="POST" action="{!! route('gallery_images.gallery_image.destroy', $galleryImage->id) !!}" accept-charset="UTF-8">
                                <input name="_method" value="DELETE" type="hidden">
                                {{ csrf_field() }}

                                    <div class="btn-group btn-group-sm float-right" role="group">
                                         
                                        <a href="{{ route('gallery_images.gallery_image.edit', $galleryImage->id ) }}" class="btn btn-primary" title="แก้ไขข้อมูล Gallery Image">
                                            <i class=" fas fa-fw fa-pencil-alt" aria-hidden="true"></i>
                                        </a>

                                        <button type="submit" class="btn btn-danger" title="ลบ Gallery Image ทิ้ง" onclick="return confirm(&quot;คลิก OK เพื่อยืนยันการลบ Gallery Image&quot;)">
                                            <i class=" fas fa-fw fa-trash-alt" aria-hidden="true"></i>
                                        </button>
                                    </div>

                                </form>
    </div>   </div>
   </div>
   @endforeach

</div>
</div>
</div>



<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">อัพโหลดภาพเข้าคลังภาพ</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div> <form method="POST" action="{{ route('gallery_images.gallery_image.store') }}" accept-charset="UTF-8" id="create_gallery_image_form" name="create_gallery_image_form" class="form-horizontal" enctype="multipart/form-data">
      <div class="modal-body">
    
            {{ csrf_field() }}
     <input type="hidden" name="galleries_id" value="{{$gallery->id}}">
     <div class="form-group row {{ $errors->has('image') ? 'has-error' : '' }}">
    <label for="image" class="col-md-2 control-label">ภาพ</label>
    <div class="col-md-10">
        <input class="form-control" name="image[]" type="file" id="image"  multiple accept="image/jpeg" placeholder="ระบุ ภาพ">
        {!! $errors->first('image', '<p class="form-text text-muted">:message</p>') !!}
    </div>
</div>

<div class="form-group row {{ $errors->has('text') ? 'has-error' : '' }}">
    <label for="text" class="col-md-2 control-label">คำอธิบายภาพ</label>
    <div class="col-md-10">
        <input class="form-control" name="text" type="text" id="text"  maxlength="250" placeholder="ระบุ คำอธิบายภาพ">
        {!! $errors->first('text', '<p class="form-text text-muted">:message</p>') !!}
    </div>
</div>
     
     
  
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">ปิด</button>
        <button type="submit" class="btn btn-primary">อัพโหลด</button>
      </div>   </form>
    </div>
  </div>
</div>
@endsection