@extends('layouts.legacy')

@php
    use Illuminate\Support\Str;
    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>

                @if (!empty($category->rootid) && $category->rootid > 0)
                    <div id="location_bar">
                        <a href="/{{ $category->category_name }}/{{ $category->category_id }}">{{ $category->category_name }}</a>
                        @if (!empty($category->rootid))
                            &raquo;
                            <a href="/{{ $group }}/{{ Str::slug($category->category_name) }}/{{ $category->category_id }}">{{ $category->category_name }}</a>
                        @endif
                        :
                    </div>
                @endif

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

        @if ($artworks->count())
            <div class="container_photo gallery_box">
                @foreach ($artworks as $art)
                    @include('web.partials._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>
                <li><a href="/Photography/3" title="Stock Photography"><i class="fa fa-photo fa-fw"></i> Photography</a></li>
                <li><a href="/Wallpapers/2" title="Desktop Wallpapers"><i class="fa fa-photo fa-fw"></i> Wallpapers</a></li>
                <li><a href="/Skins/1" title="Skins for Applications"><i class="fa fa-photo fa-fw"></i> Skins</a></li>
                <li><a href="/Other/4" title="Other Artworks"><i class="fa fa-photo fa-fw"></i> Other</a></li>
            </ul>

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

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