@extends('layouts.admin.main')
@section('title', 'Program')
@section('style')
    <link href="{{ asset('assets/plugins/datepicker/datepicker.min.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ asset('assets/plugins/select2/select2.min.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ asset('assets/plugins/switchery/switchery.min.css') }}" rel="stylesheet" type="text/css">
    <link href="{{asset('assets/plugins/summernote/summernote-bs4.css')}}" rel="stylesheet" type="text/css">

@endsection
@section('rightbar-content')  
<meta name="csrf-token" content="{{ csrf_token() }}">             
<div class="breadcrumbbar">
  <div class="row align-items-center">
    <div class="col-md-8 col-lg-8">
      <h4 class="page-title">{{!empty($albumData) ? __('adminWords.update').' '.__('adminWords.album') : __('adminWords.create').' Program' }}</h4>
      <div class="breadcrumb-list">
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="{{url('/')}}">{{__('adminWords.home')}}</a></li>
          <li class="breadcrumb-item"><a href="#">Program</a></li>
        </ol>
      </div>
    </div> 
  </div>          
</div>
  
<div class="contentbar">  
    <div class="row">
        <div class="col-lg-12">
            <div class="card m-b-30">
                <div class="card-header"> 
                    <div class="text-right">   
                        <a class="btn btn-primary" href="{{ url('/program') }}">{{ __('adminWords.go_back') }}</a>&nbsp;
                    </div>                               
                    <div class="row align-items-center">
                        <div class="col-6">
                        <h5 class="card-title mb-0"> {{!empty($albumData) ? __('adminWords.update').' '.__('adminWords.album') : __('adminWords.create').' Program'}}</h5>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                <div class="admin-form">
                    
                <form action="{{ route('save_program') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="col-lg-6"> 
                            <div class="form-group{{ $errors->has('album_name') ? ' has-error' : '' }}">
                                <label for="album_name">Program Name<sup>*</sup></label> 
                                 <input type="text" name="program_name" class="form-control" required>
                            </div>   
                            
                            
                            <div class="form-group">
                                  <label for="artist_name">Presenter Name <button class="btn btn-primary add_presenters" style="float: right;" data-toggle="modal" data-target="#addPresentermodal">Add Presenter</button></label>
                                  <!-- <input type="text" name="artist_name" class="form-control" required> -->
                                  <select name="artist_name[]" id="artist_name" class="form-control multipleSelectWithSearch require presenter-list" multiple="multiple" data-placeholder="Select Presenter">
                                      @if(!empty($artists))
                                      @foreach($artists as $artist)
                                         <option value="{{ $artist->id }}">{{ $artist->artist_name  }}</option>
                                      @endforeach
                                      @endif
                                  </select>
                            </div>

                            <div class="form-group">
                                <label for="artist_name">Guest Name</label>
                                <!-- <input type="text" name="artist_name" class="form-control" required> -->
                                <select name="guest[]" id="guest" class="form-control multipleSelectWithSearch guest-list" multiple="multiple" data-placeholder="Select Guest">
                                  
                                    
                                </select>
                          </div>
                                    
                          {{--  <div class="form-group{{ $errors->has('copyright') ? ' has-error' : '' }}">
                                {!! Form::label('copyright', __('adminWords.copyright')) !!}
                                {!! Form::text('copyright', null, ['class' => 'form-control', 'placeholder'=>__('adminWords.enter').' '.__('adminWords.copyright')]) !!}
                            </div>--}}
                        
                            <div class="form-group{{ $errors->has('song_list') ? ' has-error' : '' }}">
                                <label for="song_list">{{__('adminWords.select').' '.__('adminWords.song')}}</label> 
                                <select name="song_list[]" id="" class="form-control multipleSelectWithSearch" data-placeholder="{{__('adminWords.choose')}}"  multiple="multiple">
                                    @foreach($song_list as $song)
                                        <option value="{{$song->id}}" @if(isset($albumData) && !empty($albumData)) @foreach(json_decode($albumData->song_list) as $sid) {{ $sid == $song->id ? "selected" : "" }} @endforeach @endif >{{ $song->audio_title }}</option> 
                                    @endforeach
                                </select>
                            </div>
                            
                          {{--  <div class="form-group{{ $errors->has('language_id') ? ' has-error' : '' }}">
                                    <label for="language">{{ __('adminWords.select').' '.__('adminWords.language') }}<sup>*</sup></label> 
                                    {!! Form::select('language', $language, (!empty($albumData) ? $albumData->language : ''), ['class' => 'form-control select2WithSearch require','placeholder' => __('adminWords.choose',),'required' => 'required']) !!}
                                    <small class="text-danger">{{ $errors->first('language') }}</small>
                                </div> --}}

                            <div class="form-group">
                                  <label for="type">Program Type <em class="text-danger">*</em></label>
                                  <select name="type[]" id="type" class="form-control multipleSelectWithSearch" multiple="multiple" required>
                                       <option value="1">Prime Time Program</option>
                                       <option value="2">Specialist Program</option>
                                       <option value="3">Live Program</option>
                                       <option value="4">Pre-Recorded Program</option>
                                  </select>
                            </div>
                           
                            <div class="form-group">
                                   <label for="start_time">Start Time</label>
                                   <input type="time" name="start_time" class="form-control" placeholder="Enter Start Time" onchange="checkOverlap()" required>
                            </div>

                            <div class="form-group">
                                   <label for="end_time">End Time</label>
                                   <input type="time" name="end_time" class="form-control" placeholder="Enter End Time" onchange="checkOverlap()" required>
                            </div>
                            <small class="TimeMsg"></small>
                            
                            <div class="form-group">
                                <label for="end_time">Schedule</label> 

                                @php 
                                    //week days 
                                    $days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
                                @endphp
                                <ul>
                                @foreach($days as $day)
                                <li>
                                    <input type="checkbox" class="program_days" name="days[]" value="{{$day}}"> {{$day}}
                                </li>
                                @endforeach
                            </ul>
                            </div>





                            
                            <!-- <div class="form-group">
                                <label for="time">Time <em class="text-danger">*</em></label>
                                <input type="text" name="time" class="form-control" placeholder="Enter Time" required>
                            </div> -->

                            <div class="form-group{{ $errors->has('description') ? ' has-error' : '' }}">
                                {!! Form::label('description', __('Description')) !!}
                                <!-- {!! Form::textarea('description', null, ['class' => 'form-control', 'rows' => '3', 'placeholder'=> __('adminWords.enter').' '.__('adminWords.description')]) !!} -->
                                {!! Form::textarea('description', null, ['id' => 'summernote','class' => 'form-control require' ,'required']) !!}
                                <small class="text-danger">{{ $errors->first('adminWords.description') }}</small>
                            </div>  
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group{{ $errors->has('weekdays') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('Weekdays') !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('weekdays', 1, (!empty($albumData) &&   $albumData->weekdays == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('weekdays') }}</small>
                            </div>

                            <div class="form-group{{ $errors->has('repeat_program') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('Repeat') !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('repeat_program', 1, (!empty($program) &&   $program->repeat_program == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('repeat_program') }}</small>
                            </div>


                            <div class="form-group{{ $errors->has('status') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('status', __('adminWords.status')) !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('status', 1, (!empty($albumData) &&   $albumData->status == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('status') }}</small>
                            </div>
                            <div class="form-group{{ $errors->has('is_featured') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('is_featured', __('adminWords.featured')) !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('is_featured', 1, (!empty($albumData) &&   $albumData->is_featured == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('is_featured') }}</small>
                            </div>
                           {{-- <div class="form-group{{ $errors->has('is_trending') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('is_trending', __('adminWords.trending')) !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('is_trending', 1, (!empty($albumData) &&   $albumData->is_trending == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('is_trending') }}</small>
                            </div>
                            <div class="form-group{{ $errors->has('is_recommended') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('is_recommended', __('adminWords.recommended')) !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('is_recommended', 1, (!empty($albumData) &&   $albumData->is_recommended == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('is_recommended') }}</small>
                            </div>
                            <div class="form-group{{ $errors->has('is_verified') ? ' has-error' : '' }} switch-main-block">
                                <div class="row">
                                    <div class="col-lg-3">
                                        {!! Form::label('is_verified', __('adminWords.verified')) !!}
                                    </div>
                                    <div class="col-lg-2">
                                        {!! Form::checkbox('is_verified', 1, (!empty($albumData) &&   $albumData->is_verified == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                    </div>
                                </div>
                                <small class="text-danger">{{ $errors->first('is_verified') }}</small>
                            </div> --}}
                            <div class="form-group{{$errors->has('image') ? 'has-error' : ''}}">
                                <label for="image" class="col-lg-12">{{ __('adminWords.album').' '.__('adminWords.image') }}<sup>*</sup></label> 
                                <label for="image" class="btn btn-danger js-labelFile" data-toggle="tooltip" data-original-title="Album Image">
                                <i class="icon fas fa-check"></i>
                                {!! Form::file('image',['class' => 'form-control hide basicImage', 'data-label'=>'albumImage', 'name'=>'image', 'data-ext'=>"['jpg','jpeg','png']", 'data-image-id'=>'album_image', 'id'=>'image']) !!}
                                <span class="js-fileName">{{__('adminWords.choose_image')}}</span>
                                </label>
                                <input type="hidden" name="image" id="image_name" value="{{(!empty($albumData) ? $albumData->image:'')}}">
                                <span class="image_title" id="albumImage">{{(!empty($albumData) && $albumData->image != '' ? $albumData->image : __('adminWords.choose_image') )}}</span>
                                <small class="text-danger">{{ $errors->first('image')}}</small>
                                <input type="hidden" name="image" id="album_image" />
                                <p class="note_tooltip">Note: {{ __('adminWords.recommended').' size - 500X500 px' }} </p>
                            </div>

                            <div class="form-group{{$errors->has('presenter_banner') ? 'has-error' : ''}}">
                                <label for="presenter_banner" class="col-lg-12">{{ __('Presenter').' '.__('Banner Image') }}<sup>*</sup></label> 
                                <label for="presenter_banner" class="btn btn-danger js-labelFile" data-toggle="tooltip" data-original-title="Album Image">
                                    <i class="icon fas fa-check"></i>
                                {!! Form::file('presenter_banner',['class' => 'form-control hide basicImage', 'data-label'=>'PresenterBannerImage', 'name'=>'presenter_banner', 'data-ext'=>"['jpg','jpeg','png']", 'data-image-id'=>'presenter_banner_image', 'id'=>'presenter_banner']) !!}
                                <span class="js-fileName">{{__('adminWords.choose_image')}}</span>
                                </label>
                                <input type="hidden" name="presenter_banner" id="presenter_banner_name" value="{{(!empty($albumData) ? $albumData->presenter_banner:'')}}">
                                <span class="presenterimage_title" id="PresenterBannerImage">{{(!empty($albumData) && $albumData->presenter_banner != '' ? $albumData->presenter_banner : __('adminWords.choose_image') )}}</span>
                                <small class="text-danger">{{ $errors->first('image')}}</small>
                                <input type="hidden" name="presenter_banner" id="presenter_banner_image" />
                               {{-- <p class="note_tooltip">Note: {{ __('adminWords.recommended').' size - 500X500 px' }} </p> --}}
                            </div>
                            
                            <div class="form-group{{$errors->has('supporting_video') ? 'has-error' : ''}}">
                                <label for="supporting_video" class="col-lg-12">Supporting Video (optional)</label>
                                <input type="file" name="supporting_video" id="supporting_video" accept="video/*" class="form-control">
                                <small class="text-muted">Optional: Upload a supporting video for this program (mp4, webm, etc.).</small>
                                <small class="text-danger">{{ $errors->first('supporting_video') }}</small>
                            </div>
                            
                        </div>
                        <div class="col-lg-8">
                            <div class="form-group"> 
                                    <button type="submit" class="btn btn-primary submitbtn"><i class="fas fa-check-circle"></i> {{!empty($albumData) ? __('adminWords.update') : __('adminWords.add') }}</button>  
                                @if(empty($albumData))
                                    <button type="reset" class="btn btn-danger"><i class="fas fa-ban"></i> {{__('adminWords.reset')}}</button>
                                @endif  
                            </div>
                            <div class="clear-both"></div>
                        </div>
                    </div>
                   </form>
                </div>
                 
            </div>
        </div>
    </div>
</div>


                        <div class="modal fade" id="addPresentermodal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                            <div class="modal-dialog modal-lg" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h5 class="modal-title" id="exampleModalLabel">Add Presenter</h5>
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                        </button>
                                    </div>
                                        <div class="modal-body">
                                        <div class="admin-form">
                    
                                            <form action="#" method="post" enctype="multipart/form-data" id="add_presenter_form">
                                                @csrf
                                                    <div class="row">
                                                        <div class="col-lg-12 col-md-12"> 
                                                            <div class="form-group{{ $errors->has('artist_name') ? ' has-error' : '' }}">
                                                                <label for="artist_name">{{ __('Presenter Name') }}<sup>*</sup></label> 
                                                                {!! Form::text('artist_name', null, ['class' => 'form-control require', 'placeholder'=>__('adminWords.enter').' '.__('Presenter Name')]) !!}
                                                                <small class="text-danger">{{ $errors->first('artist_name') }}</small>
                                                            </div>    
                                                                    
                                                            
                                                            <div class="form-group{{ $errors->has('description') ? ' has-error' : '' }}">
                                                                {!! Form::label('description', __('adminWords.description') ) !!}
                                                                <!-- {!! Form::textarea('description', null, ['class' => 'form-control', 'rows' => '6', 'placeholder'=> __('adminWords.enter').' '.__('adminWords.description') ]) !!} -->
                                                                {!! Form::textarea('artist_description', null, ['id' => 'summernote','class' => 'form-control require' ,'required']) !!}

                                                                <small class="text-danger">{{ $errors->first('description') }}</small>
                                                            </div>  
                                                        <!-- </div>
                                                        
                                                        <div class="col-lg-6"> -->
                                                            <div class="form-group{{ $errors->has('artist_genre') ? ' has-error' : '' }}">
                                                                <label for="artist_genre">{{ __('adminWords.select').' '.__('adminWords.artist_genres') }}<sup>*</sup></label> 
                                                                {!! Form::select('artist_genre_id', $artistGenre, (isset($artistData) && $artistData->is_album_movie == 0 ? $artistData->artist_genre_id : ''), ['class' => 'form-control select2WithSearch require','placeholder' => __('adminWords.choose'), 'name'=>'artist_genre']) !!}
                                                                <small class="text-danger">{{ $errors->first('artist_genre') }}</small>
                                                            </div> 
                                                            <div class="form-group{{ $errors->has('status') ? ' has-error' : '' }} switch-main-block">
                                                                <div class="row">
                                                                    <div class="col-lg-3">
                                                                        {!! Form::label('status', __('adminWords.status') ) !!}
                                                                    </div>
                                                                    <div class="col-lg-2">
                                                                        {!! Form::checkbox('artist_status', 1, (isset($artistData) && $artistData->artist_status == 0 ? 0 : 1), ['class' => 'js-switch-primary']) !!}
                                                                    </div>
                                                                </div>
                                                                <small class="text-danger">{{ $errors->first('artist_status') }}</small>
                                                            </div>
                                                            
                                                            <div class="form-group{{$errors->has('presenter_image') ? 'has-error' : ''}}">
                                                                <label for="presenter_image" class="col-lg-12">{{ __('Presenter Image') }}<sup>*</sup></label> 
                                                                <label for="presenter_image" class="btn btn-danger js-labelFile" data-toggle="tooltip" data-original-title="Presenter Image">
                                                                <i class="icon fas fa-check"></i>
                                                                {!! Form::file('presenter_image',['class' => 'form-control hide basicImage', 'data-label'=>'PresenterImage', 'id'=>'presenter_image', 'name'=>'presenter_image', 'data-ext'=>"['jpg','jpeg','png']", 'data-image-id'=>'presenter_pic', 'data-image'=>__('adminWords.image_error')]) !!}
                                                                <span class="js-fileName">{{ __('adminWords.choose_image') }}</span>
                                                                </label>
                                                                <input type="hidden" name="presenter_image" id="presenter_image_name" value="{{(isset($artistData) ? $artistData->image:'')}}">
                                                                <span class="presenter_image_title" id="PresenterImage">{{(isset($artistData) && $artistData->image != '' ? $artistData->image : __('adminWords.choose_image') )}}</span>
                                                                <small class="text-danger">{{ $errors->first('image')}}</small>
                                                                <input type="hidden" id="presenter_pic" value="{{(isset($artistData) ? $artistData->image:'')}}" name="image" />
                                                                <p class="note_tooltip">Note: {{ __('adminWords.recommended').' size - 500X500 px' }} </p>
                                                            </div>
                                                        </div>  
                                                    </div>
                                        </div>
                                        </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                        <button type="button" id="add_presenter" class="btn btn-primary">Add</button>
                                    </div>
                                    </form>
                                </div>
                            </div>
                        </div>
@endsection 
@section('script')
<script src="{{ asset('assets/plugins/datepicker/datepicker.min.js') }}"></script> 
    <script src="{{ asset('assets/plugins/select2/select2.min.js') }}"></script> 
    <script src="{{ asset('assets/plugins/datepicker/i18n/datepicker.en.js') }}"></script> 
    <script src="{{ asset('assets/plugins/switchery/switchery.min.js') }}"></script> 
    <script src="{{ asset('assets/js/mrcls-custom.js') }}"></script>  
    <script src="{{asset('assets/plugins/summernote/summernote-bs4.min.js')}}"></script>

    <script>
        $(document).ready(function(){
            $('#Dashboard-tab').trigger('click');
            $('.program_days').change(checkOverlap)
            // When select multiple presenters in presenter-list, need to display that in guest-list too
            
            $('.presenter-list').change(function(){
                console.log($(this).val());
                let presenterList = $(this).val();
                let presenterListHtml = '';
                if(presenterList != null){
                    presenterList.forEach(function(item){
                        presenterListText = $('.presenter-list option[value="'+item+'"]').text();
                        presenterListHtml += '<option value="'+item+'">'+presenterListText+'</option>';
                    });
                }
                $('.guest-list').html(presenterListHtml);
            });

        });


        function checkOverlap(){
            let startTime = $('input[name=start_time]').val();
            let endTime = $('input[name=end_time]').val();
            
            // days variable get all selected days .program_days
            let days = [];
            $('.program_days').each(function(){
                if($(this).is(':checked')){
                    days.push($(this).val());
                }
            });

            if(startTime != "" && endTime != ""){
                $.ajax({
                    type:"POST",
                    url:"{{ route('check_overlap') }}",
                    data:{
                        startTime:startTime,
                        endTime:endTime,
                        days:days,
                        _token:'{{csrf_token()}}',
                    },
                    success:function(response){
                        var data = JSON.parse(response);
                        console.log(data[0].message);

                        if(data[0].status == "true"){
                             $('.TimeMsg').removeClass('text-danger');
                             $('.TimeMsg').addClass('text-info');
                             $('.submitbtn').attr('disabled', false);
                        }else{
                            $('.TimeMsg').removeClass('text-info');
                            $('.TimeMsg').addClass('text-danger');
                            $('.submitbtn').attr('disabled', true);
                        }
                        $('.TimeMsg').html(data[0].message);
                    },
                    error:function(){
                        alert('error');
                    }
                });
            }
        }


       $('.add_presenters').click(function(e){
             e.preventDefault();
            $('#add_presenter_form')[0].reset();
       });


        $('#add_presenter').click(function(){
            //  let data = $('#add_presenter_form').serialize();
             var file_data = $('#presenter_image').prop('files')[0];   
             var artistName = $('input[name=artist_name]').val();
             var description = $('textarea[name=artist_description]').val();
             var artistGenre = $('select[name=artist_genre]').val();
             var status = $('input[name=artist_status]').val();
             var csrfToken = $('meta[name="csrf-token"]').attr('content');
             var form_data = new FormData();  

             form_data.append('file', file_data);
             form_data.append('artist_name', artistName);
             form_data.append('description', description);
             form_data.append('artist_genre_id', artistGenre);
             form_data.append('artist_status', status);
            //  form_data.append('_token', csrfToken);

             $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                type: "POST",
                url: "{{ route('add_presenter')  }}", // <-- point to server-side PHP script 
                dataType: 'text',  // <-- what to expect back from the PHP script, if anything
                cache: false,
                contentType: false,
                processData: false,
                data:form_data,
                success:function(response){
                    var resp = JSON.parse(response);
                    console.log(resp);
                    if(resp == "added"){
                        getAllPresenters();
                        toastr.success("Presenter Added Successfully");
                    }else{
                        getAllPresenters();
                        toastr.warning("Presenter Not Added");
                    }
                    $('#addPresentermodal').modal('hide');
                }
                 
             });
        });


        function getAllPresenters(){
            $.ajax({
                type:"post",
                url:"{{ route('get_all_presenters') }}",
                data:{
                    _token:"{{ csrf_token()  }}",
                },
                success:function(response){
                    var data = JSON.parse(response);
                    console.log(data);
                    $('#artist_name').val("");
                    $('#artist_name').html(data);
                }
           });
        }
    </script>
@endsection