@extends('layouts.legacy')

@php
    use App\Banner;
@endphp

@section('content')
<div class="container-fluid legacy-page category-wrapper">
    @php Banner::ShowResponsiveAd(); @endphp

    <div id="category-artworks">
        <div class="effect2 page-header-wrap">
            <header class="page-heading">
                <div class="category-display"><i class="fa fa-bars fa-fw"></i></div>

                <div id="location_bar">
                    <a href="/{{ $contentType->slug }}" title="{{ $contentType->name }}">{{ $contentType->name }}</a>
                    @foreach ($category->breadcrumbs as $crumb)
                        &raquo; <a href="{{ $crumb->url }}" title="{{ $crumb->name }}">{{ $crumb->name }}</a>
                    @endforeach
                    :
                </div>

                <h1 class="page-header">{{ $category->name }}</h1>
                <p style="clear:both">{!! $category->description ?? ($contentType->name . ' artworks on Skinbase.') !!}</p>
            </header>
        </div>

        @if ($artworks->count())
            <div class="container_photo gallery_box">
                @foreach ($artworks as $art)
                    @include('legacy._artwork_card', ['art' => $art])
                @endforeach
            </div>
        @else
            <div class="panel panel-default effect2">
                <div class="panel-heading"><strong>No Artworks Yet</strong></div>
                <div class="panel-body">
                    <p>Once uploads arrive they will appear here. Check back soon.</p>
                </div>
            </div>
        @endif

        <div class="paginationMenu text-center">
            {{ $artworks->withQueryString()->links('pagination::bootstrap-4') }}
        </div>
    </div>

    <div id="category-list">
        <div id="artwork_subcategories">
            <div class="category-toggle"><i class="fa fa-bars fa-fw"></i></div>

            <h5 class="browse_categories">Main Categories:</h5>
            <ul>
                @foreach ($rootCategories as $root)
                    <li>
                        <a href="{{ $root->url }}" title="{{ $root->name }}"><i class="fa fa-photo fa-fw"></i> {{ $root->name }}</a>
                    </li>
                @endforeach
            </ul>

            <h5 class="browse_categories">Browse Subcategories:</h5>
            <ul class="scrollContent" data-mcs-theme="dark">
                @foreach ($subcategories as $sub)
                    @php $selected = $sub->id === $category->id ? 'selected_group' : ''; @endphp
                    <li class="subgroup {{ $selected }}">
                        <a href="{{ $sub->url }}">{{ $sub->name }}</a>
                    </li>
                @endforeach
            </ul>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script src="/js/legacy-gallery-init.js"></script>
@endpush