@section('title', ($isTemplate ?? false) ? __('radio.playlists_edit_template') : (Route::currentRouteName() === 'radio.playlists.c' ? __('radio.playlists_create') : __('radio.playlists_edit_title')))
@section('head')
    <link href="/assets/css/playlist-manager.css?v=1.0.103" rel="stylesheet" type="text/css">
    <link href="/assets/js/pages/jquery-ui.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="/assets/js/plugins/sweetalert2/sweetalert2.min.css">
@endsection
@include('includes/header')
@include('includes/topRadio')
<div class="content">

    <div class="row">
        <div class="col-12">
            <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center py-2">
                <div class="flex-grow-1">
                    <h1 class="h3 fw-bold mb-2">
                        {{ $isTemplate ? __('radio.playlists_edit_template') : (Route::currentRouteName() === 'radio.playlists.c' ? __('radio.playlists_create') : __('radio.playlists_edit_title')) }}
                    </h1>
                </div>
                <nav class="flex-shrink-0 mt-3 mt-sm-0 ms-sm-3" aria-label="breadcrumb">
                    <ol class="breadcrumb breadcrumb-alt push mb-0">
                        <li class="breadcrumb-item">
                            <a href="{{ route('radio.home.r') }}">{{ __('radio.menu_item_1') }}</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="{{ route('radio.playlists.r') }}">{{ __('radio.menu_item_2_sub_2') }}</a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">{{ $isTemplate ? __('radio.playlists_edit_template') : (Route::currentRouteName() === 'radio.playlists.c' ? __('radio.playlists_create') : __('radio.playlists_edit_title')) }}</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">

            <div class="block block-rounded genBlockPl">
                <div class="block-content">

                 <div class="row ps-3 pe-3 mb-3">
                     <div class="col-md-6 p-0">
                    <div class="form-floating mb-1 h-width">
                        <input type="hidden" name="id" value="">
                        <input type="text" class="form-control" id="name" name="name" autocomplete="off"
                               onkeyup="this.value = this.value.replace(/[^a-záàâãéèêíïóôõöúçñÁÀÂÃÉÈÍÏÓÔÕÖÚÇÑA-Z0-9 \.]/g, ''); limit(this);"
                               value="{{ (Route::currentRouteName() === 'radio.playlists.u' ? $playlistData->name : '') }}">
                        <label class="float-name" for="float-name">{{ __('radio.playlists_name_label') }}</label>
                    </div>
                         <div class="errormsg d-none text-danger animated fadeIn"></div>
                     </div>
                 </div>
				 
				 <div class="row ps-3 pe-3 mb-3 limitmsg d-none">
                     <div class="col-md-12 p-0">
				 <div class="alert alert-secondary mb-0"><h3 class="alert-heading h4 my-2">{{ __('radio.alert_attention') }}</h3><p class="mb-0">{!! __('radio.playlists_limit_warning') !!}</p></div>
				</div>
				</div>
				
                   <div class="row ps-3 pe-3 mb-3 playlistStage">
                       <div class="col-md-6 p-0">
                           <div class="block block-rounded block-bordered listSongs">
                           <ul class="nav nav-tabs nav-tabs-block align-items-center" role="tablist">
                               <li class="nav-item navBlock01">
                                   <button class="nav-link typeBtn text-md-start btnType-1 active" onclick="nav('');" id="">
                                       <div class="flex-grow-1 d-flex justify-content-between align-items-center">
                                           <div class="mb-0 text-center">
                                               <i class="fa fa-folder-open mus-color fa-2x pb-1"></i>
                                               <dt class="fs-6 fw-semibold h1-info-block01">{{ __('radio.fm_tab_musics') }}</dt>
                                           </div>
                                       </div>
                                   </button>
                               </li>
                               <li class="nav-item navBlock01">
                                   <button class="nav-link typeBtn text-md-start btnType-2" onclick="nav('Comerciais');" id="Comerciais">
                                       <div class="flex-grow-1 d-flex justify-content-between align-items-center">
                                           <div class="mb-0 text-center">
                                               <i class="fa fa-folder ann-color fa-2x pb-1"></i>
                                               <dt class="fs-6 fw-semibold h1-info-block01">{{ __('radio.fm_tab_ads') }}</dt>
                                           </div>
                                       </div>
                                   </button>
                               </li>
                               <li class="nav-item navBlock01">
                                   <button class="nav-link typeBtn text-md-start btnType-3" onclick="nav('Vinhetas');" id="Vinhetas">
                                       <div class="flex-grow-1 d-flex justify-content-between align-items-center">
                                           <div class="mb-0 text-center">
                                               <i class="fa fa-folder vin-color fa-2x pb-1"></i>
                                               <dt class="fs-6 fw-semibold h1-info-block01">{{ __('radio.library_tab_vinhetas') }}</dt>
                                           </div>
                                       </div>
                                   </button>
                               </li>
							   <li class="nav-item navBlock01">
                                   <button class="nav-link typeBtn text-md-start btnType-5" onclick="nav('Podcasts');" id="Podcasts">
                                       <div class="flex-grow-1 d-flex justify-content-between align-items-center">
                                           <div class="mb-0 text-center">
                                               <i class="fa fa-folder pod-color fa-2x pb-1"></i>
                                               <dt class="fs-6 fw-semibold h1-info-block01">{{ __('radio.app_mod_podcasts') }}</dt>
                                           </div>
                                       </div>
                                   </button>
                               </li>
                               <li class="nav-item navBlock01">
                                   <button class="nav-link typeBtn text-md-start btnType-4" onclick="nav('','','1');" id="Adicionais">
                                       <div class="flex-grow-1 d-flex justify-content-between align-items-center">
                                           <div class="mb-0 text-center">
                                               <i class="fa fa-plus-circle add-color fa-2x pb-1"></i>
                                               <dt class="fs-6 fw-semibold h1-info-block01">{{ __('general.sec_additional') }}</dt>
                                           </div>
                                       </div>
                                   </button>
                               </li>
                           </ul>
                               <div class="block-content p-0">
                                   <div class="p-2 mb-0">
                                       <div class="input-group">
                                           <input type="text" class="form-control" id="search" placeholder="{{ __('radio.fm_search_placeholder') }}" autocomplete="off">
                                           <button type="button" class="ms-2 btn rounded-pill btn-alt-info d-none clSearch" onclick="nav('','')">{{ __('radio.playlists_clear_search') }}</button>
                                       </div>
                                   </div>
                                   <div class="d-flex align-items-center pt-2 pb-2 topborder">
                                       <div class="flex-shrink-0 ms-2 me-1">
                                           <input type="checkbox" class="form-check-input checkAll">
                                       </div>
                                       <div class="flex-shrink-1 ms-2">
                                           <i class="fa fa-folder-open me-2"></i>
                                       </div>
                                       <div class="flex-shrink-2 curLoc t-overflow"><b>Músicas</b></div>

                                       <div class="ml-auto me-2">
                                       <button class="btn btn-light pl-unmark fs-sm fw-normal btn-xs mb-0 d-none">{{ __('radio.action_unselect_all') }}</button>
                                       <button class="btn btn-primary pl-addto fs-sm fw-normal btn-xs mb-0 d-none">{{ __('radio.playlists_add_to') }}</button>
                                       </div>
                                   </div>
                                   <input type="hidden" class="cLocation" value=""/>
                                   <div class="fl-manager"></div>
                               </div>
                           </div>
                       </div>

                       <div class="col-md-6 pe-0">
                           <div class="block block-rounded block-bordered plblock position-relative">

                               <div id="list-container" class="disable-selection"  style="margin-top: 0;">
                                   <div class="block-items" style="margin-top: 0;">
                                       <a id="ouvirRadio" onclick="stopPPlayer();" style="top: 75px;right: 20px;position: absolute;z-index: 9598;background: white;display:none;" class="btn btn-sm">
                                           <i class="fa fa-stop-circle" style="font-size: 15px;line-height: 23px;"></i></a>
                                       <div class="block-item block-item-archive" data-path="">
                                           <div class="player-progress-bar">
                                               <div class="player-progress-bar-value" style="width: 0px;"></div>
                                           </div>
                                           <div class="block-item-internal">
                                               <div class="block-item-name" style="margin-top: -1px;margin-bottom: 1px;">&nbsp;</div>
                                           </div>
                                       </div>
                                   </div>
                               </div>

                               <div class="block-header pt-3 pb-3 d-flex">
                                   <h3 class="block-title hupper">
                                       Playlist (<span id="totalpl_itens">0</span>)
                                   </h3>
                                   <div class="ml-auto">
                                       <div class="custom-select">
                                           <input type="hidden" name="type" id="type" value="{{ (Route::currentRouteName() === 'radio.playlists.u' ? $playlistData->type : '0') }}">
                                           <div class="selected-value with-icon">
                                               <div class="selected-icon">
                                                   <div class="icon-container">
                                                       @if($isTemplate ? $playlistData->type === '1' : (Route::currentRouteName() === 'radio.playlists.u' && $playlistData->type === '1'))
                                                           <i class="fa fa-random"></i>
                                                       @else
                                                           <i class="fa fa-reorder"></i>
                                                       @endif
                                                   </div>
                                               </div>
                                               <div class="selected-label">{{ ($isTemplate ? $playlistData->type == '1' : (Route::currentRouteName() === 'radio.playlists.u' && $playlistData->type == '1')) ? __('radio.pl_mode_random') : __('radio.pl_mode_sequential') }}</div>
                                               <div class="selected-caret">
                                                   <i class="fa fa-caret-down"></i>
                                               </div>
                                           </div>
                                           <div class="opt-container">
                                               <div class="options options-align-right">
                                                   <div class="option" data-value="0" data-label="{{ __('radio.pl_mode_sequential') }}" data-icon="reorder">
                                                       <div class="option-icon">
                                                           <i class="fa fa-reorder"></i>
                                                       </div>
                                                       <div class="option-info">
                                                           <div class="option-label">
                                                               {{ __('radio.pl_mode_sequential') }}                        </div>
                                                           <div class="option-description">
                                                               {{ __('radio.pl_mode_sequential_desc') }}
                                                           </div>
                                                       </div>
                                                   </div>
                                                   <div class="option" data-value="1" data-label="{{ __('radio.pl_mode_random') }}" data-icon="random">
                                                       <div class="option-icon">
                                                           <i class="fa fa-random"></i>
                                                       </div>
                                                       <div class="option-info">
                                                           <div class="option-label">
                                                               {{ __('radio.pl_mode_random') }}                        </div>
                                                           <div class="option-description">
                                                               {{ __('radio.pl_mode_random_desc') }}
                                                           </div>
                                                       </div>
                                                   </div>
                                               </div>
                                           </div>
                                       </div>
                                   </div>
                               </div>
							   <div class="mx-2 mb-2">
									<input type="text" id="pl-search" class="form-control " placeholder="{{ __('radio.fm_search_placeholder') }}" autocomplete="off">
							   </div>
                               <div class="d-flex align-items-center pt-2 pb-2 border-1 border-top border-bottom">
                                   <span class="ms-3 me-2" style="flex-shrink:0; width:1em;"></span>
                                   <div class="flex-shrink-0 pl-timers fw-bold">
                                       {{ __('radio.pl_starts_at') }}
                                   </div>
                                   <div class="flex-shrink-1 t-overflow fw-bold">{{ __('radio.pl_table_file') }}</div>
                                   <div class="flex-shrink-2 text-end ml-auto me-2">
									   <button class="btn btn-light pl-unmark-pl fs-sm fw-normal btn-xs d-none">{{ __('radio.action_unselect') }}</button>
									   <button class="btn btn-danger pl-remsel fs-sm fw-normal btn-xs d-none">{{ __('site.btn_remselect') }}</button>
                                       <button class="btn btn-warning pl-custom fs-sm fw-normal btn-xs" onclick="customize()">{{ __('radio.pl_action_interleave') }}</button>
                                       <button class="btn shuffle btn-secondary fs-sm fw-normal btn-xs">{{ __('radio.pl_action_shuffle') }}</button>
                                       <button class="btn btn-danger pl-rall fs-sm fw-normal btn-xs">{{ __('radio.app_action_clear') }}</button>
                                   </div>
                               </div>

                               <div class="block-content p-0">
                                <ul class="list-group striped-list fl-playlist ui-sortable position-relative ui-sortable">

                                </ul>
                               </div>
                               <div class="card-footer border-top-0 d-flex align-items-center">
                                   <div class="d-flex align-items-center">
                                       <h6 class="mb-0">{{ __('radio.pl_total_time') }}</h6>
                                       <div class="ms-1 pt-1 h5 mb-0 fw-bold pl-total-time">00:00:00</div>
                                   </div>
                                   <div class="ml-auto mb-0 rem_d">
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_PRO" onclick="deleteByType('tp-addp')" style="background: #b68eff; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_HRC" onclick="deleteByType('tp-time')" style="background: #f7c99a; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_PRG" onclick="deleteByType('tp-add')" style="background: #e99af7; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_PROF" onclick="deleteByType('tp-addf')" style="background: #f79acf; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_CAM" onclick="deleteByType('tp-camp')" style="background: #7de0ce; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_COM" onclick="deleteByType('tp-com')" style="background: #F9BCB2; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_VIN" onclick="deleteByType('tp-vin')" style="background: #7dccff; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_POD" onclick="deleteByType('tp-pod')" style="background: #6C7AE0; display: none;"><i class="fa fa-times"></i></button>
                                       <button class="btn fs-sm fw-normal btn-xs nbr D_MUS"  onclick="deleteByType('tp-audio')" style="background: #6cf9a5; display: none;"><i class="fa fa-times"></i></button>
                                   </div>

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

                   <div class="mb-4 d-flex gap-2">
						<button type="button" class="btn btn-primary btnSavePl" onclick="createPlaylist()">{{ $isTemplate ? __('radio.playlists_templates_use') : (Route::currentRouteName() === 'radio.playlists.u' ? __('general.action_save') : __('radio.fm_btn_create')) }}</button>
						<button type="button" class="btn btn-danger" onclick="history.go(-1)">{{ __('radio.app_action_cancel') }}</button>
					</div>


                </div>
            </div>

        </div>
    </div>




</div>

</div>

</main>


<div id="fl-player"></div>
<div id="pl-player"></div>


<div class="modal fade" id="mod-customize" tabindex="-1" role="dialog" aria-labelledby="modal-block-fadein" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="block block-rounded block-transparent mb-0">
                <div class="block-header block-header-default">
                    <h3 class="block-title">{{ __('radio.pl_action_interleave') }}</h3>
                    <div class="block-options">
                        <button type="button" class="btn-block-option" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-fw fa-times"></i>
                        </button>
                    </div>
                </div>
                <div class="block-content cont-customize">

                    <div class="mb-4 d-flex align-items-center">
                        <input type="number" min="1" max="999" onkeyup="enforceMinMax(this)" class="form-control form-control-lg" id="c1" style="width:90px">
                        <span class="ms-2 me-2 fw-semibold">{{ __('radio.pl_interleave_every') }}</span>
                        <input type="number" min="1" max="999" onkeyup="enforceMinMax(this)" class="form-control form-control-lg" id="c2" style="width:90px">
                        <select class="form-select ms-2" id="c_type" style="width:200px">
                            <option value="1">{{ __('radio.pl_interleave_type_all') }}</option>
                            <option value="2">{{ __('radio.pl_interleave_type_music') }}</option>
                            <option value="8">{{ __('radio.pl_interleave_type_podcast') }}</option>
                            <option value="3">{{ __('radio.pl_interleave_type_short') }}</option>
                            <option value="4">{{ __('radio.pl_interleave_type_program') }}</option>
							<option value="5">{{ __('radio.pl_interleave_type_weekend') }}</option>
                        </select>
                    </div>

                </div>
                <div class="block-content block-content-full text-end bg-body bl-customize">
                    <button type="button" class="btn btn-sm btn-alt-secondary me-1" data-bs-dismiss="modal">{{ __('radio.app_action_cancel') }}</button>
                    <button type="button" class="btn btn-sm btn-primary" onclick="doCustomizePl()">{{ __('radio.pl_action_interleave') }}</button>
                </div>
            </div>
        </div>
        </div>
    </div>
</div>

@include('includes/footer')

</div>
<script src="/assets/js/lib/jquery.min.js"></script>
<script src="/assets/js/main.min.js"></script>
<script src="/assets/js/pages/bootbox.all.min.js"></script>
<script src="/assets/js/pages/hash.js"></script>
<script src="/assets/js/pages/jquery-ui.min.js"></script>
<script src="/assets/js/plugins/sweetalert2/sweetalert2.min.js"></script>
{{--<script>var file_srv = "{{ $getServerDetails->name }}.{{ env('BASE_SERVER_URL') }}"; var file_hash = "{{ EncryptBras($streamData->port) }}"; let sumDUr = 0; var routeDo = '{{ (Route::currentRouteName() === 'radio.playlists.u' ? route('radio.playlists.u.do',$playlistData->id) : route('radio.playlists.c.do')) }}'; var hasU = {{ (Route::currentRouteName() === 'radio.playlists.u' ? '1' : '0') }}; @if(Route::currentRouteName() === 'radio.playlists.u') var idP = {{ $playlistData->id }}; @endif
</script>--}}
<script>
    var file_srv = "{{ $getServerDetails->name }}.{{ env('BASE_SERVER_URL') }}";
    var file_hash = "{{ EncryptBras($streamData->port) }}";

    @if($isTemplate && $templateData)
        @php [$templateName, $templatePort] = explode('||', $templateData); @endphp
        var template_file = "{{ $templateName }}.{{ env('BASE_SERVER_URL') }}||{{ EncryptBras((int)$templatePort) }}";
    @else
        var template_file = null;
    @endif

    let sumDUr = 0;
    var routeDo = '{{ ($isTemplate || Route::currentRouteName() !== 'radio.playlists.u') ? route('radio.playlists.c.do') : route('radio.playlists.u.do', $playlistData->id) }}';
    var hasU = {{ (Route::currentRouteName() === 'radio.playlists.u' ? '1' : '0') }};

    @if(Route::currentRouteName() === 'radio.playlists.u')
        var idP = {{ $playlistData->id }};
    @endif
</script>
<script>
    window.LNG = Object.assign(window.LNG || {}, {
        action_unselect: @json(__('radio.action_unselect')),
        action_unselect_all: @json(__('radio.action_unselect_all')),
        pl_unselect_count: @json(__('radio.pl_js_unselect_count')),
        action_cancel: @json(__('radio.app_action_cancel')),
        action_confirm: @json(__('site.action_confirm')),
        action_remove: @json(__('general.action_remove')),
        btn_remselect: @json(__('site.btn_remselect')),
        playlists_clear_search: @json(__('radio.playlists_clear_search')),
        fm_send_files: @json(__('radio.fm_send_files')),
        fm_empty_no_files_title: @json(__('radio.pl_js_no_files_title')),
        fm_empty_no_files_desc: @json(__('radio.pl_js_no_files_desc')),
        fm_empty_open_library: @json(__('radio.pl_js_open_library')),
        fm_empty_or: @json(__('radio.pl_js_or')),
        fm_no_audio_found: @json(__('radio.pl_js_no_audio_found')),
        fm_search_no_results: @json(__('radio.pl_js_search_no_results')),
        pl_clear_confirm_title: @json(__('radio.pl_js_clear_title')),
        pl_clear_confirm_text: @json(__('radio.pl_js_clear_text')),
        pl_shuffle_confirm_title: @json(__('radio.pl_js_shuffle_title')),
        pl_shuffle_confirm_text: @json(__('radio.pl_js_shuffle_text')),
        pl_remove_selected_confirm_one: @json(__('radio.pl_js_remove_selected_one')),
        pl_remove_selected_confirm_many: @json(__('radio.pl_js_remove_selected_many')),
    });
</script>
<script src="/assets/js/pages/playlist-manager.js?v=1.0.132"></script>
<script>window.LNG = Object.assign(window.LNG || {}, {
    action_close: @json(__('radio.action_close')),
    pl_interleave_need_audios: @json(__('radio.pl_js_interleave_need_audios')),
    pl_fill_all_fields: @json(__('radio.pl_js_fill_all_fields')),
    pl_interleaving: @json(__('radio.pl_js_interleaving')),
    pl_type_audios: @json(__('radio.pl_js_type_audios')),
    pl_type_musics: @json(__('radio.pl_js_type_musics')),
    pl_type_shorts: @json(__('radio.pl_js_type_shorts')),
    pl_type_programs: @json(__('radio.pl_js_type_programs')),
    pl_warning_title: @json(__('radio.pl_js_warning_title')),
    pl_interleave_none: @json(__('radio.pl_js_interleave_none')),
    pl_field_required: @json(__('radio.pl_js_field_required')),
    pl_min_one_file: @json(__('radio.pl_js_min_one_file')),
    pl_remove_musics: @json(__('radio.pl_js_remove_musics')),
    pl_remove_ads: @json(__('radio.pl_js_remove_ads')),
    pl_remove_jingles: @json(__('radio.pl_js_remove_jingles')),
    pl_remove_shorts: @json(__('radio.pl_js_remove_shorts')),
    pl_remove_time_checks: @json(__('radio.pl_js_remove_time_checks')),
    pl_remove_programs: @json(__('radio.pl_js_remove_programs')),
    pl_remove_weekend: @json(__('radio.pl_js_remove_weekend')),
    pl_remove_campaigns: @json(__('radio.pl_js_remove_campaigns')),
    pl_remove_podcasts: @json(__('radio.pl_js_remove_podcasts')),
    pl_remove_music_library: @json(__('radio.pl_js_remove_music_library')),
    pl_drop_here: @json(__('radio.pl_js_drop_here')),
    pl_place_here: @json(__('radio.pl_js_place_here'))
});</script>
<script src="/assets/js/pages/playlist-ui.js?v=1.0.121"></script>
</body>
</html>