@section('title', __('radio.schedule_edit_title'))
@section('head')
    <link rel="stylesheet" href="/assets/js/plugins/select2/css/select2.min.css">
    <link rel="stylesheet" href="/assets/js/plugins/jquery-clock-timepicker/bootstrap-clockpicker.min.css">
    <link rel="stylesheet" href="/assets/css/daterangepicker.css"/>
    <link rel="stylesheet" href="/assets/js/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css?v=1.0.100">
@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">
                        {{ __('radio.schedule_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="javascript:void(0)">{{ __('radio.menu_item_2') }}</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="{{ route('radio.schedules.r') }}">{{ __('radio.menu_item_2_sub_3') }}</a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">{{ __('radio.schedule_edit_title') }}</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>

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

            <div class="block block-rounded">
                <div class="block-content">
                    <form action="{{ route('radio.schedules.u.do',$currentSchedule[0]->id) }}" method="POST">

                        <div class="mb-4 h-width">
                            <label class="form-label">{{ __('radio.schedule_label_playlist') }}</label>
                            <select class="form-select js-select2" name="playlist_id">
                                <option value="" selected="">{{ __('radio.home_block_ajax_autodj_stoped_option') }}</option>
                                @foreach($listPlaylists as $playlist)
                                    <option value="{{ $playlist->id }}" {{ ($currentSchedulePl->id == $playlist->id ? 'selected' : '') }}>{{ $playlist->name }}</option>
                                @endforeach
                            </select>
                            @if (\Session::has('error_playlist')) <div id="msgError_playlist" class="form-text text-danger"> {!! \Session::get('error_playlist') !!} </div> @endif
                        </div>
						
						<div class="mb-4 h-width">
                            <label class="form-label">{{ __('general.table_status') }}</label>
                            <select class="form-select" id="status" name="status">
                                <option value="1" {{ ($currentSchedule[0]->status == '1' ? 'selected' : '') }}>{{ __('general.status_active') }}</option>
                                <option value="0" {{ ($currentSchedule[0]->status == '0' ? 'selected' : '') }}>{{ __('radio.schedule_status_disabled') }}</option>
                            </select>
                        </div>

                        <div class="sched-week {{ ($currentSchedule[0]->type == '2' ? 'd-none' : '') }}">

                        <div class="mb-3 @if (\Session::has('error_days')) erro-inp @endif ">
                            <label class="form-label">{{ __('radio.schedule_label_weekdays') }}</label> <button type="button" onclick="toCheck()" class="ms-2 btn btnsel btn-xs btn-secondary">{{ __('radio.schedule_days_select_all') }}</button>
                            <div class="space-x-1">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="sun" name="sun" {{ ($currentSchedule[0]->sun == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="sun">{{ __('site.page_scheduling_weekday_0') }}</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="mon" name="mon" {{ ($currentSchedule[0]->mon == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="mon">{{ __('radio.schedule_day_mon') }}</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="tue" name="tue" {{ ($currentSchedule[0]->tue == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="tue">{{ __('radio.schedule_day_tue') }}</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="wed" name="wed" {{ ($currentSchedule[0]->wed == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="wed">{{ __('radio.schedule_day_wed') }}</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="thu" name="thu" {{ ($currentSchedule[0]->thu == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="thu">{{ __('radio.schedule_day_thu') }}</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="fri" name="fri" {{ ($currentSchedule[0]->fri == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="fri">{{ __('radio.schedule_day_fri') }}</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" value="1" id="sat" name="sat" {{ ($currentSchedule[0]->sat == '1' ? 'checked' : '') }}>
                                    <label class="form-check-label" for="sat">{{ __('site.page_scheduling_weekday_6') }}</label>
                                </div>
                            </div>
                            @if (\Session::has('error_days')) <div id="msgError_days" class="form-text text-danger"> {!! \Session::get('error_days') !!} </div> @endif
                        </div>

                    </div>

                        <div class="sched-date {{ ($currentSchedule[0]->type == '2' ? '' : 'd-none') }}">

                            <div class="mb-3 h-width @if (\Session::has('error_date')) erro-inp @endif">
                                <label class="form-label" for="start">{{ __('radio.schedule_label_start_date') }}</label>
                                <input type="text" class="form-control @if (\Session::has('error_date')) is-invalid @endif" id="date" name="date" placeholder="dd/mm/yyyy" value="{{ date('d/m/Y',strtotime($currentSchedule[0]->date)) }}" autocomplete="off">
                                @if (\Session::has('error_date')) <div id="msgError_date" class="form-text text-danger"> {!! \Session::get('error_date') !!} </div> @endif
                            </div>

                        </div>

                        <div class="mb-3 h-width  @if (\Session::has('error_time')) erro-inp @endif ">
                            <label class="form-label">{{ __('radio.schedule_label_start_time') }}</label>
                            <input type="text" class="form-control sm-input" id="time" name="time" value="{{ $currentSchedule[0]->time }}" autocomplete="off">
                            @if (\Session::has('error_time')) <div id="msgError_time" class="form-text text-danger"> {!! \Session::get('error_time') !!} </div> @endif
                        </div>

                        <div class="mb-3 h-width">
                            <label class="form-label">{{ __('radio.schedule_label_skip') }}</label>
                            <select class="form-select" id="skip" name="skip">
                                <option value="1" {{ ($currentSchedule[0]->skip == '1' ? 'selected' : '') }}>{{ __('radio.schedule_skip_yes') }}</option>
                                <option value="0" {{ ($currentSchedule[0]->skip == '0' ? 'selected' : '') }}>{{ __('radio.schedule_skip_no') }}</option>
                            </select>
                            <small class="text-danger msgSkip d-none"><i class="fa fa-circle-exclamation"></i> {{ __('radio.schedule_skip_warning') }} <a class="link-fx text-danger" href="#">{{ __('radio.schedule_read_more') }} &raquo;</a></small>
                        </div>

                        <div class="mb-4 h-width">
                            <label class="form-label">{{ __('radio.schedule_label_end_option') }}</label>
                            <select class="form-select" id="endOption" name="endOption">
                                <option value="0" {{ ($currentSchedule[0]->end == '0' ? 'selected' : '') }}>{{ __('radio.schedule_end_keep') }}</option>
                                <option value="1" {{ ($currentSchedule[0]->end == '1' ? 'selected' : '') }}>{{ __('radio.schedule_end_other') }}</option>
                            </select>
                        </div>

                        <div class="mb-4 h-width endSelect">
                            <label class="form-label">{{ __('radio.schedule_label_end_playlist') }}</label>
                            <select class="form-select js-select3" id="endSelect" name="endSelect">
                                <option value="">{{ __('radio.schedule_end_select_placeholder') }}</option>
                            </select>
                        </div>


                        <div class="mb-4">
                            <button type="submit" class="btn btn-primary">{{ __('general.action_save') }}</button>
                        </div>


                </form>
            </div>

        </div>
    </div>



</div>

</div>

</main>


@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/plugins/select2/js/select2.full.min.js"></script>
<script src="/assets/js/plugins/jquery.maskedinput/jquery.maskedinput.min.js"></script>
<script src="/assets/js/plugins/jquery-clock-timepicker/jquery-clock-timepicker.min.js"></script>
<script src="/assets/js/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
<script src="/assets/js/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.pt-BR.min.js" charset="UTF-8"></script>
<script src="/assets/js/pages/graph/moment.min.js"></script>
<script src="/assets/js/pages/graph/daterangepicker.js"></script>
<script>
    var txt_selectAll = 'Selecionar todos';
    var txt_deselectAll = 'Desmarcar todos';

    function toCheck(){
        var checkeds = $('input[type=checkbox]:checked').length;
        if(checkeds >= 2){
            $('input:checkbox').prop('checked', false);
            $('.btnsel').text(txt_selectAll);
        }else{
            $('input:checkbox').prop('checked', true);
            $('.btnsel').text(txt_deselectAll);
        }
    }

    $(".js-select2").select2();
    $(".js-select3").select2();

    $('#date').datepicker({
        autoclose: true,
        startDate: '{{ date('d/m/Y') }}',
        endDate: '{{ date("d/m/Y", strtotime("+1 year")) }}',
        format: 'dd/mm/yyyy',
        language: 'pt-BR'
    });

    $("#time").mask("99:99");
    $('#time').clockpicker({
        placement: 'bottom',
        align: 'left',
        autoclose: true,
        'default': 'now'
    });

    function loadOptions(){
        $('#endSelect').empty();
        $.post( "{{ route('ajaxSchedule') }}", { id: $('.js-select2').val() }) .done(function( data ) {
            $.each(data, function(i, item) {
                $('#endSelect').append($('<option>', {
                    value: item.id,
                    text : item.name
                }));
            });
            $(".js-select3").val("{{ $currentSchedule[0]->end_playlist }}");
        });
    }


    $("#skip").change(function() {
        if($(this).val() == 0){
            $('.msgSkip').removeClass('d-none');
        }else{
            $('.msgSkip').addClass('d-none');
        }
    });

    @if($currentSchedule[0]->skip == '0')
    $('.msgSkip').removeClass('d-none');
    @endif

    @if($currentSchedule[0]->end == '1')
    $('.endSelect').removeClass('d-none');
    loadOptions();
    @else
    $('.endSelect').addClass('d-none');
    @endif

    $( "#endOption" ).change(function() {
        if(this.value == '1'){
            $('.endSelect').removeClass('d-none');
            loadOptions();
        }else{
            $('.endSelect').addClass('d-none');
        }
    });

    $(".js-select2").change(function() {
        loadOptions();
    });


    @if (\Session::has('error_playlist'))
    $('.select2-selection').addClass('has-error');
    @endif


</script>
</body>
</html>