@section('title', $podcast->name)

@section('head')
    <link rel="stylesheet" href="{{ assetv('/assets/css/pages/siteconfig.css') }}">
    <link rel="stylesheet" href="{{ assetv('/assets/css/pages/sitepods.css') }}">
@endsection

@php
    $breadcrumb = [
        ['label' => __('site.menu_item_3')],
        ['label' => __('site.menu_item_7'), 'url' => route('site.podcasts.r')],
        ['label' => $podcast->name],
    ];

    $base = 'https://' . $serverData->name . '/contents/' . session('siteID') . '/podcasts/';
    $used = $diskSpace ? min(100, round($diskSpace->usedKB / max(1, $diskSpace->plan_spaceKB) * 100)) : null;
@endphp

@include('includes/header-novo')

<main class="app-main">

    @include('includes.breadcrumb')

    <header class="page-head">
        <div class="pdhead">
            <span class="pdhead__cover">
                @if($podcast->img)
                    <img src="{{ str_starts_with($podcast->img, '/') ? $podcast->img : $base . $podcast->img }}" alt="">
                @endif
                <i class="fa-solid fa-podcast pdcard__ph"></i>
            </span>

            <div>
                <h1 class="page-title">{{ $podcast->name }}</h1>
                <p class="page-sub">{{ trans_choice('site.page_pods_ep_count', $allEps->count(), ['n' => $allEps->count()]) }}</p>
            </div>
        </div>

        <div class="page-head__acts">
            <a class="btn btn--ghost" href="{{ route('site.podcasts.r') }}">
                <i class="fa-solid fa-arrow-left"></i> {{ __('site.menu_item_7') }}
            </a>
            <button class="btn btn--primary epnew" type="button">
                <i class="fa-solid fa-plus"></i> {{ __('site.page_pods_ep_new') }}
            </button>
        </div>
    </header>

    @include('includes.flash')

    {{-- espaço do plano: o envio falha no fim se não couber, então avisa antes --}}
    @if($diskSpace)
        <section class="pdspace">
            <div class="pdspace__text">
                <strong>{{ __('site.page_pods_space') }}</strong>
                <span>{{ formatBytes($diskSpace->usedKB) }} {{ __('site.page_pods_space_of') }} {{ formatBytes($diskSpace->plan_spaceKB) }}</span>
            </div>
            <span class="pdspace__bar">
                <span class="pdspace__fill {{ $used >= 90 ? 'is-full' : '' }}" style="width: {{ $used }}%"></span>
            </span>
        </section>
    @endif

    <div class="eplist"
         data-podcast="{{ $podcast->id }}"
         data-url-store="{{ route('site.podcastsEps.c.do', $podcast->id) }}"
         data-url-update="{{ url('site/podcast/' . $podcast->id . '/eps/edit') }}"
         data-url-check="{{ route('site.podcastsEps.checkName', $podcast->id) }}"
         data-hash="{{ $epHash }}"
         data-url-order="{{ route('site.podcastsEps.updateOrder') }}"
         data-msg-delete-title="{{ __('site.page_pods_ep_alert_title') }}"
         data-msg-delete-text="{{ __('site.page_pods_ep_alert_text') }}"
         data-msg-delete-btn="{{ __('site.btn_remove') }}"
         data-msg-name-taken="{{ __('site.page_pods_ep_name_taken') }}"
         data-msg-name-invalid="{{ __('site.page_pods_ep_name_invalid') }}"
         data-msg-space="{{ __('site.page_pods_no_space') }}"
         data-msg-error="{{ __('site.page_pods_api_error') }}">

        @if($allEps->count() == 0)
            <div class="cempty">
                <span class="apierr__ico"><i class="fa-solid fa-microphone-lines"></i></span>
                <p class="apierr__text">{{ __('site.page_pods_eps_empty') }}</p>
                <button class="btn btn--primary epnew" type="button">
                    <i class="fa-solid fa-plus"></i> {{ __('site.page_pods_ep_new') }}
                </button>
            </div>
        @else
            <p class="lhint"><i class="fa-solid fa-arrows-up-down-left-right"></i> {{ __('site.page_pods_ep_order_hint') }}</p>

            <div class="eptable">
                @foreach($allEps as $ep)
                    @php $live = $ep->status === '1'; @endphp

                    <article class="eprow {{ $live ? '' : 'is-off' }}"
                             data-id="{{ $ep->id }}"
                             data-name="{{ $ep->name }}"
                             data-desc="{{ $ep->description }}"
                             data-status="{{ $ep->status }}"
                             data-type="{{ $ep->type }}"
                             data-url="{{ $ep->url }}">

                        <span class="epnum">{{ $ep->ep_number }}</span>

                        <span class="epkind {{ $ep->type === '2' ? 'epkind--file' : '' }}"
                              title="{{ $ep->type === '2' ? __('site.page_pods_type_file') : __('site.page_pods_type_yt') }}">
                            <i class="{{ $ep->type === '2' ? 'fa-solid fa-file-audio' : 'fa-brands fa-youtube' }}"></i>
                        </span>

                        <div class="eprow__text">
                            <span class="eprow__top">
                                <strong class="eprow__name" title="{{ $ep->name }}">{{ $ep->name }}</strong>

                                @unless($live)
                                    <span class="pdoff pdoff--inline">{{ __('site.page_pods_draft') }}</span>
                                @endunless
                            </span>

                            <span class="eprow__desc">{{ $ep->description ?: __('site.page_pods_eps_no_desc') }}</span>
                        </div>

                        <span class="eprow__acts">
                            <button class="pact pact--edit eprow__edit" type="button" title="{{ __('site.action_edit') }}">
                                <i class="fa-solid fa-pen"></i>
                            </button>
                            <button class="pact pact--del eprow__del" type="button" title="{{ __('site.btn_remove') }}">
                                <i class="fa-solid fa-trash"></i>
                            </button>
                        </span>

                        <form class="eprow__form" method="POST" action="{{ route('site.podcastsEps.d', [$podcast->id, $ep->id]) }}">@method('DELETE')</form>
                    </article>
                @endforeach
            </div>
        @endif
    </div>

    <div class="modal epmodal" hidden>
        <div class="modal__card modal__card--wide" role="dialog" aria-modal="true">
            <h2 class="modal__title epmodal__title">{{ __('site.page_pods_ep_new') }}</h2>

            <div class="epmodal__body">
                <div class="kinds epmodal__kinds">
                    <label class="kind">
                        <input type="radio" name="ep_type" value="1" checked>
                        <span class="kind__ico"><i class="fa-brands fa-youtube"></i></span>
                        <span class="kind__text">
                            <strong>{{ __('site.page_pods_type_yt') }}</strong>
                            <small>{{ __('site.page_pods_type_yt_help') }}</small>
                        </span>
                        <span class="kind__tick"><i class="fa-solid fa-check"></i></span>
                    </label>

                    <label class="kind">
                        <input type="radio" name="ep_type" value="2">
                        <span class="kind__ico"><i class="fa-solid fa-file-audio"></i></span>
                        <span class="kind__text">
                            <strong>{{ __('site.page_pods_type_file') }}</strong>
                            <small>{{ __('site.page_pods_type_file_help') }}</small>
                        </span>
                        <span class="kind__tick"><i class="fa-solid fa-check"></i></span>
                    </label>
                </div>

                <label class="field">
                    <span class="field__label">{{ __('site.page_pods_ep_name') }}</span>
                    <input class="input epmodal__name" type="text" maxlength="255" autocomplete="off">
                    <span class="field__help">{{ __('site.page_pods_ep_name_help') }}</span>
                </label>

                <label class="field">
                    <span class="field__label">{{ __('site.page_pods_ep_desc') }}</span>
                    <input class="input epmodal__desc" type="text" maxlength="100" autocomplete="off">
                </label>

                <label class="field epmodal__url">
                    <span class="field__label">{{ __('site.page_pods_ep_url') }}</span>
                    <input class="input epmodal__urlinput" type="text" autocomplete="off"
                           placeholder="https://www.youtube.com/watch?v=">
                </label>

                <label class="field epmodal__file" hidden>
                    <span class="field__label">{{ __('site.page_pods_ep_file') }}</span>
                    <input class="input epmodal__fileinput" type="file" accept="audio/*">
                    <span class="field__help">{{ __('site.page_pods_ep_file_help') }}</span>
                </label>

                <label class="row">
                    <span class="row__text">
                        <strong>{{ __('site.page_pods_ep_publish') }}</strong>
                        <small>{{ __('site.page_pods_ep_publish_help') }}</small>
                    </span>
                    <span class="switch">
                        <input type="checkbox" class="epmodal__status" checked>
                        <span class="switch__track"><span class="switch__knob"></span></span>
                    </span>
                </label>
            </div>

            <p class="modal__error epmodal__error" hidden></p>

            <div class="modal__foot">
                <button class="btn btn--ghost epmodal__cancel" type="button">{{ __('site.btn_cancel') }}</button>
                <button class="btn btn--primary epmodal__ok" type="button">
                    @include('includes.spinner')
                    <span class="btn__label">{{ __('general.action_save_changes') }}</span>
                </button>
            </div>
        </div>
    </div>

</main>

@section('scripts')
    <script src="{{ assetv('/assets/js/site-podcasts.js') }}"></script>
@endsection

@include('includes/footer-novo')