@extends('layouts.admin')
@section('css')
    <style>
        .weekday-container {
            display: inline-flex;
            width: 100%;
            /*justify-content: space-between;*/
        }
        .row_container {
            border: 4px solid #e2e2e2;
            border-radius: 16px;
            padding: 5px;
            margin: 5px;
        }
        </style>
    <link rel="stylesheet" href="{{ asset('assets/css/jquery.fileuploader.min.css') }}" />
@endsection
@section('content')
<div class="page-header text-uppercase">
    <ul class="list-unstyled space-list m-0">
        <li>
            <p>{{ $data->id ?  __('advertisements.edit') :  __('advertisements.add') }}</p>
        </li>
        <li>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{route('admin.dashboard')}}">{{__('common.home') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"><a href="{{route('advertisements.index')}}">{{ __('advertisements.title') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page">{{ $data->id ?  __('advertisements.edit') :  __('advertisements.add') }}</li>
                </ol>
            </nav>
        </li>
    </ul>
    @include('layouts.partials.messages')
</div>
<div class="admin-area-col">
    <div class="row">
        <div class="col-12">
            <div class="round-white-bg box-shadow">
                <div class="error-msg font-14"></div>
                {{ Form::open(array('route' => $routes, 'method' => 'POST' ,'id' => 'ajaxSave','files' => true))}}

                <div class="row row_container">
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.store-name'), array('class' => 'control-label'))}}
                        {{ Form::select('store',$stores, $data->store_id, array('class' => 'form-control select2 ajaxSelect', 'id'=>'store', 'data-url' => route('advertisements.get-device-by-store'), 'data-target' => 'device', 'data-live-search'=>'true','title'=>__('common.select-option'))) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.screen'), array('class' => 'control-label'))}}
                        {{ Form::select('screen[]', isset($screens) ? $screens : [], explode(',', $data->device_id), array('class' => 'form-control','id'=>'device','multiple'=>'true','data-live-search'=>'true')) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.name'), array('class' => 'control-label'))}}
                        {{ Form::text('name',$data->title, array('class' => 'form-control')) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.description'), array('class' => 'control-label'))}}
                        {{ Form::textarea('description',$data->description, array('class' => 'form-control','cols'=>2,'rows'=>2)) }}
                    </div>

                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.from'), array('class' => 'control-label'))}}
                        {{ Form::text('from', dateFormat($data->from_date, DISPLAY_DATETIME2), array('class' => 'form-control datepicker-input-sch')) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.to'), array('class' => 'control-label'))}}
                        {{ Form::text('to', dateFormat($data->to_date, DISPLAY_DATETIME2), array('class' => 'form-control datepicker-input-sch')) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.priority'), array('class' => 'control-label'))}}
                        {{ Form::select('priority',adsPriority(),$data->priority, array('class' => 'form-control','id'=>'device')) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        {{Form::label('id', __('advertisements.status'), array('class' => 'control-label'))}}
                        {{ Form::select('status',activeStatus(),isset($data->status) ? $data->status : 1, array('class' => 'form-control','id'=>'status')) }}
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        <label class="control-label">{{ __('advertisements.banner') }}</label>
                        <div class="custom-file-upload-control">
                            <div class="font13">
                                {{ Form::file('image[]', ['class' => 'gallery', 'id' => 'main_advt', 'multiple' => true, 'accept' => 'image/*'])}}
                            </div>
                            <p class="text-danger font13 font-italic mb-1">{{ __('advertisements.note-size') }}</p>
                        </div>
                        @php $haveImages = false; @endphp
                        @if(isset($bannerImages) && count($bannerImages) > 0)
                        <div class="form-group row">
                            <div class="img-scroll-list">
                                @foreach ($bannerImages as $img)

                                    @if($img->is_night == 0)
                                    @php $haveImages = true; @endphp
                                        <div class="col-12">
                                            <div class="thumbnail popup-gallery">
                                                <a href="{{getImagePath($img->image)}}" target="_blank">
                                                    <img src="{{getImagePath($img->image)}}" alt="" class="img-fluid">
                                                </a>
                                            </div>
                                            @if(count($bannerImages) > 1)
                                            <a class="remove-image __route" data-url="{{ route('advertisements.drop-advt-image', $img->id) }}" title="Delete" href="javascript:void(0);" style="display: inline;">&#215;</a>
                                            @endif
                                        </div>
                                    @endif
                                @endforeach
                            </div>
                        </div>  
                        @endif
                        @if(!$haveImages && file_exists($data->image))
                        <div class="ad-image-preview-col mt-3" style="width: 90%;">
                            <img src="{{getImagePath($data->image)}}" alt="" class="img-fluid">
                        </div>
                        @endif
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                        <label class="control-label">{{ __('advertisements.video') }}</label>
                        <div class="custom-file-upload-control">
                            <div class="custom-file-upload-container font13">
                                {{ Form::file('video', ['class' => '__preview_video', 'data-target' => '__preview_video_target', 'accept' => 'video/*'])}}
                                <ul class="list-inline">
                                    <li class="list-inline-item">
                                        <a href="javascript:void(0)" class="btn btn-primary font13">{{ __('common.choose-file')}}</a>
                                    </li>
                                    <li class="list-inline-item text-muted image-name-placeholder">
                                        {{ __('common.no-file')}}
                                    </li>
                                </ul>
                            </div>
                        </div>
                        @if(!empty($data->video))
                        <div class="ad-image-preview-col mt-3">
                            <p class="text-danger font13 font-italic mb-1">&nbsp;</p>
                            <p class="font-medium">{{ __('advertisements.review')}}</p>
                            <video class="__preview_video_target" width="320" height="240" controls="">
                                <source src="{{getImagePath($data->video)}}" type="video/mp4">
                            </video>
                        </div>
                        @endif
                    </div>
                </div>
                {{-- Night meny section start --}}
                <div class="row row_container mt-4 mb-4">
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5 mb-0 mx-1">
                        <div class="weekday-container">
                            {{Form::label('id', __('advertisements.night_meny'), array('class' => 'control-label'))}}
                            <label class="yummy-switch-label ml-2">
                                {{ Form::checkbox('night_meny_status', 1, $data->night_meny_status == 1 ? true : false, ['id' => 'night_meny_status']) }}
                                <span class="yummy-switch-box"></span>
                            </label>
                        </div>
                    </div>
                    <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">

                    </div>
                    <div class="row mx-1 night_meny_info" {!! ($data->night_meny_status == 1) ? '' : 'style="display: none;"' !!}>
                        <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                            {{Form::label('id', __('advertisements.weeks'), array('class' => 'control-label'))}}
                            <div id="weekdays2"> </div>
                            <input type="hidden" name="night_meny_weekdays" id="weekday_night_open" value="{!! $data->night_meny_weekdays ?? '' !!}">
                        </div>
                        <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                            <div class="row">
                                <div class="custom-input-group colored-field-group col-xs-12 col-sm-6">
                                    {{Form::label('id', __('advertisements.start_time'), array('class' => 'control-label'))}}
                                    {{ Form::text('night_meny_from_time', $data->night_meny_from_time, ['class' => 'form-control t-picker start_time']) }}
                                </div>
                                <div class="custom-input-group colored-field-group col-xs-12 col-sm-6">
                                    {{Form::label('id', __('advertisements.end_time'), array('class' => 'control-label'))}}
                                    {{ Form::text('night_meny_to_time',$data->night_meny_to_time, ['class' => 'form-control t-picker end_time']) }}
                                </div>
                            </div>
                        </div>

                        <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                            <label class="control-label">{{ __('advertisements.night_meny_banner') }}</label>
                            <div class="custom-file-upload-control">
                                <div class="font13">
                                    {{ Form::file('night_meny_image[]', ['class' => 'gallery', 'id' => 'night_advt', 'multiple' => true, 'accept' => 'image/*'])}}
                                </div>
                                <p class="text-danger font13 font-italic mb-1">{{ __('advertisements.note-size') }}</p>
                            </div>
                            @php $haveNightImages = false; @endphp
                            @if(isset($bannerImages) && count($bannerImages) > 0)
                            <div class="form-group row">
                                <div class="img-scroll-list">
                                    @foreach ($bannerImages as $img)
                                        @if($img->is_night == 1)
                                            @php $haveNightImages = true; @endphp
                                            <div class="col-12">
                                                <div class="thumbnail popup-gallery">
                                                    <a href="{{getImagePath($img->image)}}" target="_blank">
                                                        <img src="{{getImagePath($img->image)}}" alt="" class="img-fluid">
                                                    </a>
                                                </div>
                                                <a class="remove-image __route" data-url="{{ route('advertisements.drop-advt-image', $img->id) }}" title="Delete" href="javascript:void(0);" style="display: inline;">&#215;</a>
                                            </div>
                                        @endif
                                    @endforeach
                                </div>
                            </div>  
                            @endif
                            @if(!$haveNightImages && file_exists($data->night_meny_image))
                                <div class="ad-image-preview-col mt-3" style="width: 90%;">
                                    <img src="{{getImagePath($data->night_meny_image)}}" alt="" class="img-fluid">
                                </div>  
                            @endif
                        </div>

                        <div class="custom-input-group colored-field-group col-xs-12 col-sm-5">
                            <label class="control-label">{{ __('advertisements.night_meny_video') }}</label>
                            <div class="custom-file-upload-control">
                                <div class="custom-file-upload-container font13">
                                    {{ Form::file('night_meny_video', ['class' => '__preview_video', 'data-target' => '__night_preview_video_target', 'accept' => 'video/*'])}}
                                    <ul class="list-inline">
                                        <li class="list-inline-item">
                                            <a href="javascript:void(0)" class="btn btn-primary font13">{{ __('common.choose-file')}}</a>
                                        </li>
                                        <li class="list-inline-item text-muted image-name-placeholder">
                                            {{ __('common.no-file')}}
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            @if(!empty($data->night_meny_video))
                            <div class="ad-image-preview-col mt-3">
                                <p class="text-danger font13 font-italic mb-1">&nbsp;</p>
                                <p class="font-medium">{{ __('advertisements.review')}}</p>
                                <video class="__night_preview_video_target" width="320" height="240" controls="">
                                    <source src="{{getImagePath($data->night_meny_video)}}" type="video/mp4">
                                </video>
                            </div>
                            @endif
                        </div>
                    </div>
                    {{-- Night meny section end --}}
                </div>

                <div class="form-group mt-2 text-left">
                    <ul class="list-inline">
                        <li class="list-inline-item">
                            {{ Form::submit( __('common.save'), array('class' => 'btn btn-primary width80'));}}
                        </li>
                        {{-- <li class="list-inline-item">
                            {{ Form::reset( __('common.cancel'), array('class' => 'btn btn-default width80'));}}
                        </li> --}}
                    </ul>
                </div>
                {{ Form::close()}}
            </div>
        </div>
    </div>
</div>

@endsection

@section('script')
    <script src="{{ asset('assets/js/jquery.fileuploader.min.js')}}"></script>
    <script src="{{ asset('assets/js/jquery.fileuploader.custom.js')}}"></script>
<script>
    $('#device').selectpicker();

    $(document).on('change', '#night_meny_status', function(){
        if($(this).prop('checked')) {
            $('.night_meny_info').show();
        } else {
            $('.night_meny_info').hide();
        }
    });

    $(function() {
        if ($("#weekday_night_open").length > 0 && $("#weekday_night_open").val() != '') {
            let weekdays = $("#weekday_night_open").val();
            var strarray = weekdays.split(',');
            let weekdayArr = [];
            for (var i = 0; i < strarray.length; i++) {
                weekdayArr.push(parseInt(strarray[i]));
            }
            $('#weekdays2').weekdays({
                days: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'], //Monday starts at 0
                selectedIndexes: weekdayArr
            });
        } else {
            if($("#weekdays2").length > 0){
                $('#weekdays2').weekdays({
                    days: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'] //Monday starts at 0
                });
            }
        }
    });

    $(document).on("click", "#weekdays2 .weekdays-day", function() {
        let weekdays = $('#weekdays2').selectedIndexes();
        let weekdaystring = '';
        for (let i = 0; i < weekdays.length; i++) {
            if (i == (weekdays.length - 1)) {
                weekdaystring += weekdays[i];
            } else {
                weekdaystring += weekdays[i] + ',';
            }
        }
        $("#weekday_night_open").val(weekdaystring);
    });
    $(".t-picker").datetimepicker({
        format: 'HH:mm',
        icons: {
            up: 'fa fa-angle-up',
            down: 'fa fa-angle-down'
        },
    });
</script>
@endsection