@extends('portal.layouts.app', ['activePage' => 'gallery', 'titlePage' => __('Gallery')])

@section('content')
    <div class="content">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="card card-product" data-count="2">
                        <div class="card-header card-header-image" data-header-animation="true">

                            <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                                <ol class="carousel-indicators">
                                    @foreach(Storage::disk('public')->files($gallery->slug) as $index=>$image)
                                        <li style="width: 100px;
    height: 100px;" data-target="#carouselExampleIndicators" class="{{$index== 1 ? 'active': ''}}"
                                            data-slide-to="{{$index}}"><img
                                                class="d-block w-100" style="width: 100px;
    height: 100px;" src="{{Storage::disk('public')->url($image)}}"
                                                alt="{{$image}}"></li>
                                    @endforeach
                                </ol>
                                <div class="carousel-inner">
                                    @foreach(Storage::disk('public')->files($gallery->slug) as $index=>$image)
                                        <div class="carousel-item {{$index== 0 ? 'active': ''}}">
                                            <img class="d-block w-100" src="{{Storage::disk('public')->url($image)}}"
                                                 alt="{{$image}}">
                                        </div>
                                    @endforeach

                                </div>
                                <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button"
                                   data-slide="prev">
                                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                    <span class="sr-only">Previous</span>
                                </a>
                                <a class="carousel-control-next" href="#carouselExampleIndicators" role="button"
                                   data-slide="next">
                                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                    <span class="sr-only">Next</span>
                                </a>
                            </div>

                        </div>
                        <div class="card-body">
                            <div class="card-actions text-center">
                                <button type="button" class="btn btn-danger btn-link fix-broken-card">
                                    <i class="material-icons">build</i> Fix Header!
                                </button>
                                {{--<button type="button" class="btn btn-default btn-link" rel="tooltip"
                                        data-placement="bottom" title="" data-original-title="View">
                                    <i class="material-icons">art_track</i>
                                </button>--}}
                                @if(Auth::user()->role->name == 'admin')
                                    @if ($gallery->status !== 'Approved')
                                        <a href="{{route('gallery.approve',['gallery'=>$gallery])}}" class="btn btn-success btn-link" rel="tooltip"
                                           data-placement="bottom" title="" data-original-title="Approve">
                                            <i class="material-icons">check</i>
                                        </a>
                                    @endif
                                        @if ($gallery->status === 'Approved')
                                    <a href="{{route('gallery.hide',['gallery'=>$gallery])}}" class="btn btn-danger btn-link" rel="tooltip"
                                       data-placement="bottom" title="" data-original-title="Hide">
                                        <i class="material-icons">close</i>
                                    </a>
                                        @endif
                                        <a href="{{route('gallery.hide',['gallery'=>$gallery])}}" class="btn btn-danger btn-link" rel="tooltip"
                                           data-placement="bottom" title="" data-original-title="Hide">
                                            <i class="material-icons">trash</i>
                                        </a>
                                @endif
                            </div>
                            <h4 class="card-title">
                                <a>{{$gallery->title}}</a>
                                <span class="badge badge-pill badge-success pull-right">{{$gallery->status}}</span
                            </h4>
                            <div class="card-description">
                                {{$gallery->description}}
                            </div>
                        </div>
                        <div class="card-footer">
                            <div class="price">
                                <h4>{{$gallery->photographer->name}}</h4>

                            </div>
                            <div class="stats">
                                <p class="card-category"><i class="material-icons">category</i>
                                    {{$gallery->category->name}}
                                    <br>
                                </p>

                                <p class="card-category"><i class="material-icons">local_offer</i>
                                    @foreach(explode(',', $gallery->tags) as $tag)
                                        <span class="badge badge-pill badge-primary">{{$tag}}</span>
                                    @endforeach
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')

@endsection
@section('style')

@endsection