@extends('layout.master')
@section('title', 'Edit Activity')
@section('css')
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous">
    </script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.min.css"
        crossorigin="anonymous">
    <link href="{{ asset('css/fileinput.css') }}" rel="stylesheet" />
    <style>
        .dropdown.bootstrap-select>.btn,
        .dropdown.bootstrap-select>.btn:hover,
        .dropdown.bootstrap-select>.btn:active,
        .dropdown.bootstrap-select>.btn:visited,
        .dropdown.bootstrap-select>.btn:focus {
            background-color: transparent;
            color: #495057;
            text-transform: none;
            font-family: "Roboto", "Helvetica", "Arial", sans-serif;
        }

        /*#editactivity label.col-sm-3.col-form-label{
            margin: 2rem auto !important;
        }*/
        #editactivity .card-body .row {
            margin-bottom: 0px;
        }

        #editactivity label.col-sm-3.col-form-label.img-align {
            margin: 2rem auto !important;
        }

        .english img,
        .gujarati img,
        .hindi img {
            width: 150px;
            padding-left: 10px;
            padding-bottom: 10px;
        }

        .file-field .file-path-wrapper .english,
        .file-field .file-path-wrapper .gujarati,
        .file-field .file-path-wrapper .hindi {
            margin-top: -15px;
        }

        .file-drag-handle {
            display: none;
        }

        body {
            overflow: hidden;
        }

        .table-responsive {
            overflow-x: hidden !important;
            overflow-y: auto !important;
        }

        .bmd-form-group .form-control,
        .bmd-form-group label,
        .bmd-form-group input::placeholder {
            line-height: 3.5;
        }

        input[type="text"],
        input[type="password"],
        input[type="email"],
        input[type="url"],
        input[type="time"],
        input[type="date"],
        input[type="datetime-local"],
        input[type="tel"],
        input[type="number"],
        input[type="search"],
        textarea.materialize-textarea {
            margin: 0 auto;
            padding: 0;
        }

        .form-control {
            background: none;
        }

        .activity_section .form-control[type="url"] {
            border-bottom: 1px solid #9e9e9e;
        }

        input.file-path::placeholder {
            line-height: 2;
        }

        textarea.form-control {
            border-bottom: 1px solid #9e9e9e;
        }

        .bootstrap-select {
            background-image: none !important;
            padding: 0 !important;
        }

        .help-block {
            color: #f50404 !important;
        }

        #addactivity .dropdown-menu.show {
            max-height: 325px !important;
        }

        #addactivity div#schedule-ivf-programs-div {
            display: none;
        }

        #addactivity div#schedule-normal-programs-div {
            display: none;
        }

        #addactivity div#schedule-pregnancy-programs-div {
            display: none;
        }

        .select2-container--default .select2-results__option--highlighted[aria-selected] {
            background-color: rgb(38, 178, 229) !important;
        }

        #addactivity input[type=search]:focus:not([readonly]) {
            border-bottom: none;
            box-shadow: none;
        }

        input.select2-search__field::placeholder {
            color: #AAAAAA;
            opacity: 1;
        }

        default.select2-container--focus .select2-selection--multiple {
            border: none;
            outline: 0;
        }

        .select2-container--default .select2-selection--multiple {
            border-bottom: 1px solid #9e9e9e !important;
            background-color: white !important;
            border: none;
            border-radius: 0px;
            cursor: text;
        }

        .select2-container--default.select2-container--focus .select2-selection--multiple {
            border: none;
            outline: 0;
        }

    </style>

    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
@stop

@section('content')
    <div class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12">
                    <form id="editactivity" action="{{ route('activities.update', $single->id) }}" method="POST"
                        enctype="multipart/form-data">

                        @method('put')
                        @csrf
                        <div class="card">
                            <div class="card-header card-header-warning">
                                <h4 class="card-title">Edit Activity</h4>
                            </div>
                            <div class="card-body">

                                <div class="row">
                                    <label class="col-sm-3 col-form-label">Activity Title (English)<span
                                            class="text-danger"> * </span></label>
                                    <div class="col-sm-8">
                                        <div class="form-group bmd-form-group">
                                            <input type="text" class="form-control" id="title_en" name="title_en"
                                                placeholder="Enter Activity Title in English"
                                                value="{{ $single->title_en }}">
                                            @if ($errors->has('title_en'))
                                                <div class="error">
                                                    <strong>{{ $errors->first('title_en') }}</strong></div>
                                            @endif
                                        </div>

                                    </div>
                                    <label class="col-sm-3 col-form-label">Activity Title (Gujarati)<span
                                            class="text-danger"> * </span></label>
                                    <div class="col-sm-8">
                                        <div class="form-group bmd-form-group">
                                            <input type="text" class="form-control" id="title_gu" name="title_gu"
                                                placeholder="Enter Activity Title in Gujarati"
                                                value="{{ $single->title_gu }}">
                                            @if ($errors->has('title_gu'))
                                                <div class="error">
                                                    <strong>{{ $errors->first('title_gu') }}</strong></div>
                                            @endif
                                        </div>

                                    </div>
                                    <label class="col-sm-3 col-form-label">Activity Title (Hindi)<span
                                            class="text-danger"> * </span></label>
                                    <div class="col-sm-8">
                                        <div class="form-group bmd-form-group">
                                            <input type="text" class="form-control" id="title_hi" name="title_hi"
                                                placeholder="Enter Activity Title in Hindi" value="{{ $single->title_hi }}">
                                            @if ($errors->has('title_hi'))
                                                <div class="error">
                                                    <strong>{{ $errors->first('title_hi') }}</strong></div>
                                            @endif
                                        </div>

                                    </div>
                                </div>

                                <div class="row">
                                    <label class="col-sm-12 col-form-label">Activity Media</label>
                                </div>
                                <div class="row">

                                    <label class="col-sm-3 col-form-label">Select Your Media Type <span
                                            class="text-danger"> * </span></label>
                                    <div class="col-sm-8">
                                        <div class="form-group bmd-form-group">
                                            <select name="media_type" id="media_type"
                                                class="form-control  selectpicker p-1 " data-actions-box="true"
                                                title="Select Activity Media Type" data-selected-text-format="count > 2"
                                                data-size="5">

                                                <option {{ $single->media_type == 'image' ? 'selected' : '' }} value="image">
                                                    {{ 'Image' }}</option>
                                                <option {{ $single->media_type == 'video' ? 'selected' : '' }} value="video">
                                                    {{ 'Video' }}</option>
                                                <option {{ $single->media_type == 'audio' ? 'selected' : '' }} value="audio">
                                                    {{ 'Audio' }}</option>
                                            </select>


                                        </div>
                                    </div>
                                </div>
                                <div class="row" id="thumbnailsection">
                                    <label class="col-sm-3  col-form-label">Select Thumbnail<span
                                        class="text-danger"> *</span></label>
                                    <div class="col-sm-8">
                                        <div class="form-group bmd-form-group">
                                            

                                        <select name="activity_thumbnail" id="activity_thumbnail"
                                            class="form-control  selectpicker p-1 " data-live-search="true" data-actions-box="true"
                                            title="Select Activity Thumbnail" data-selected-text-format="count > 2"
                                            data-size="5">
                                            <option value="">Select Activity thumbnail</option>
                                            @foreach ($activity_thumbnail as $image_name)
                                                <option value="{{ $image_name->id }}" @if($single->activity_thumbnail_id==$image_name->id) selected @endif>{{ $image_name->name }} </option>
                                            @endforeach
                                        </select>

                                        </div>
                                        @if ($errors->has('activity_thumbnail'))
                                        <div class="error">
                                            <strong>{{ $errors->first('activity_thumbnail') }}</strong></div>
                                         @endif
                                    </div>
                                </div>


                                <!-- en thumbnail -->
                                <div class="row mt-4 d-none" id="div_audio_en_thumbnail">
                                    <label class="col-sm-3 mt-2 col-form-label">Select Media Image</label>
                                    <div class="col-sm-8" id="eng_thumbnail"></div>
                                </div>
                                <!-- en thumbnail -->

                                <div class="row mt-4">
                                    <label class="col-sm-3 col-form-label mt-2">Select English Media
                                        <span class="text-danger"> * </span>
                                    </label>

                                    <div class="col-sm-8" id="eng">
                                        @if ($errors->has('media_en') || $errors->has('video_eng'))
                                            <div class="error">
                                                <strong>{{ $errors->first('media_en') }}</strong></div>
                                        @endif
                                    </div>
                                </div>


                                <div class="row mt-4">
                                    <label class="col-sm-3 col-form-label mt-2">Select Gujarati Media
                                        <span class="text-danger"> * </span>
                                    </label>
                                    <div class="col-sm-8" id="guj">
                                        @if ($errors->has('media_gu') || $errors->has('video_guj'))
                                            <div class="error">
                                                <strong>{{ $errors->first('media_gu') }}</strong></div>
                                        @endif
                                    </div>
                                </div>

                                <div class="row mt-4">
                                    <label class="col-sm-3 col-form-label mt-2">Select Hindi Media
                                        <span class="text-danger"> * </span>
                                    </label>

                                    <div class="col-sm-8" id="hin">
                                        @if ($errors->has('media_hi') || $errors->has('video_hin'))
                                            <div class="error">
                                                <strong>{{ $errors->first('media_hi') }}</strong></div>
                                        @endif
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-12 col-sm-12">
                                        <label class="col-sm-3 col-form-label"> Activity Description</label>
                                        <div class="row">
                                            <label class="col-sm-3 col-form-label mt-1">Description (English)</label>
                                            <div class="col-sm-8">
                                                <div class="form-group bmd-form-group">
                                                    <textarea class="form-control " name="description_en"
                                                        id="description_en" rows="3"
                                                        placeholder="Enter Description(English)">{{ $single->description_en }}</textarea>
                                                    @if ($errors->has('description_en'))
                                                        <div class="error">
                                                            <strong>{{ $errors->first('description_en') }}</strong></div>
                                                    @endif
                                                </div>
                                            </div>

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

                                <div class="col-md-12 col-sm-12">
                                    <div class="row">
                                        <label class="col-sm-3 col-form-label mt-1">Description (Gujarati)</label>
                                        <div class="col-sm-8">
                                            <div class="form-group bmd-form-group">
                                                <textarea class="form-control " id="description_gu" name="description_gu"
                                                    rows="3"
                                                    placeholder="Enter Description (Gujarati)">{{ $single->description_gu }}</textarea>
                                                @if ($errors->has('description_gu'))
                                                    <div class="error">
                                                        <strong>{{ $errors->first('description_gu') }}</strong></div>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12 col-sm-12">
                                    <div class="row">
                                        <label class="col-sm-3 col-form-label mt-1">Description (Hindi)</label>
                                        <div class="col-sm-8">
                                            <div class="form-group bmd-form-group">
                                                <textarea class="form-control " id="description_hi" name="description_hi"
                                                    rows="3"
                                                    placeholder="Enter Description (Hindi)">{{ $single->description_hi }}</textarea>
                                                @if ($errors->has('description_hi'))
                                                    <div class="error">
                                                        <strong>{{ $errors->first('description_hi') }}</strong></div>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>


                                <div class="row">
                                    <div class="col-md-12 col-sm-12">
                                        <label class="col-sm-3 col-form-label"> Activity Reminder Audio</label>
                                        
                                <div class="row" id="thumbnailsection">
                                    <label class="col-sm-3  col-form-label">Select Reminder Audio<span
                                        class="text-danger"> *</span></label>
                                    <div class="col-sm-8">
                                        <div class="form-group bmd-form-group">
                                            

                                        <select name="activity_reminder_audio_id" id="activity_reminder_audio_id"
                                            class="form-control  selectpicker p-1 " data-live-search="true" data-actions-box="true"
                                            title="Select Activity Reminder Audio" data-selected-text-format="count > 2"
                                            data-size="5">
                                            <option value="">Select Activity Reminder Audio</option>
                                            @foreach ($reminder_audios as $audio_name)
                                                <option value="{{ $audio_name->id }}" @if($single->activity_reminder_audio_id==$audio_name->id) selected @endif>{{ $audio_name->name }} </option>
                                            @endforeach
                                        </select>

                                        </div>
                                        @if ($errors->has('activity_reminder_audio_id'))
                                        <div class="error">
                                            <strong>{{ $errors->first('activity_reminder_audio_id') }}</strong></div>
                                         @endif
                                    </div>
                                </div>
                                <input id="normal" name="activity_of" value="{{$single->activity_of}}" type="hidden">
                                <div id="activity-of-parent-div">
                                    <div class="row">
                                        <label class="col-sm-3 col-form-label">Activity For<span
                                                class="text-danger"> * </span></label>
                                        <div class="form-group col-sm-8 bmd-form-group">
                                            <input id="normalpregnant" name="activity_of" value="Normal" type="radio"  @if($single->activity_of =="Normal") checked @endif/>
                                            <label for="normalpregnant">Normal</label>

                                            <input id="yoga" name="activity_of" value="Yoga" type="radio"  @if($single->activity_of =="Yoga") checked @endif/>
                                            <label for="yoga">Yoga</label>

                                            <input id="diet" name="activity_of" value="Diet" type="radio" @if($single->activity_of =="Diet") checked @endif/>
                                            <label for="diet">Diet</label>
                                            @if ($errors->has('activity_of'))
                                                <div class="error">
                                                    <strong>{{ $errors->first('activity_of') }}</strong></div>
                                            @endif
                                            <div id="activity_of_error_message" class="error">
                                                <strong></strong></div>
                                        </div>
                                    </div>
                                </div>
                                    </div>
                                </div>
                                
                                @if ($single->activity_of != "SpecialActivity")
                                <!-- show-hide-start -->

                                    <div id="special-activity-div">
                                        @if($single->pregnancy_status == "Planning" || $single->pregnancy_status == "Both")
                                        <div id="schedule-ivf-programs-div">
                                            <div class="col-md-12 col-sm-12">
                                                <label class="col-sm-3 col-form-label">Schedule IVF Programs</label>
                                            </div>

                                            @foreach ($planning_activity_types as $key => $planning_activity_type)
                                                <div class="row">
                                                    <label
                                                        class="col-sm-3 col-form-label mt-0">{{ $planning_activity_type->name }}</label>
                                                    <div class="col-sm-8">
                                                        <div class="form-group bmd-form-group">
                                                             <select name="ivf[{{ $planning_activity_type->id }}][]"
                                                                id="my_blessed_baby_ivf_{{ $planning_activity_type->id }}" data-id="{{ $planning_activity_type->id }}"
                                                                 class="form-control select2 select2-hidden-accessible my_blessed_baby_ivf"
                                                            multiple="multiple" data-placeholder="Select day" style="width: 100%;"
                                                            tabindex="-1" aria-hidden="true">
                                                                <option value="all">Select All</option>
                                                                <option value="deselectall" title="{{$planning_activity_type->id}}">Deselect All</option>
                                                                @foreach ($programs_ivf as $keys => $ivf)
                                                                    <option value="{{ $ivf->id }}" title="{{ $ivf->program_for_day }}"
                                                                    @if(!empty($selected_programs_ivf[$planning_activity_type->id][$ivf->id]) && $selected_programs_ivf[$planning_activity_type->id][$ivf->id]['activity_type_id'] == $planning_activity_type->id && $selected_programs_ivf[$planning_activity_type->id][$ivf->id]['programs_id'] == $ivf->id) selected @endif>Day
                                                                        {{ $ivf->program_for_day }}</option>
                                                                @endforeach
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endforeach
                                        </div>

                                        <div id="schedule-normal-programs-div">
                                            <div class="col-md-12 col-sm-12">
                                                <label class="col-sm-3 col-form-label">Schedule Normal Programs</label>
                                            </div>

                                            @foreach ($planning_activity_types as $key => $planning_activity_type)
                                                <div class="row">
                                                    <label
                                                        class="col-sm-3 col-form-label mt-0" >{{ $planning_activity_type->name }}</label>
                                                    <div class="col-sm-8">
                                                        <div class="form-group bmd-form-group">
                                                            <select name="normal[{{ $planning_activity_type->id }}][]"
                                                                id="my_blessed_baby_normal_{{ $planning_activity_type->id }}" data-id="{{ $planning_activity_type->id }}"
                                                                class="form-control select2 select2-hidden-accessible my_blessed_baby_normal"
                                                            multiple="multiple" data-placeholder="Select day" style="width: 100%;"
                                                            tabindex="-1" aria-hidden="true">
                                                                <option value="all">Select All</option>
                                                                <option value="deselectall" title="{{$planning_activity_type->id}}">Deselect All</option>
                                                                @foreach ($programs_normal as $keys => $normal)
                                                                    <option value="{{ $normal->id }}" title="{{ $normal->program_for_day }}"
                                                                         @if(!empty($selected_programs_normal[$planning_activity_type->id][$normal->id]) && $selected_programs_normal[$planning_activity_type->id][$normal->id]['activity_type_id'] == $planning_activity_type->id && $selected_programs_normal[$planning_activity_type->id][$normal->id]['programs_id'] == $normal->id) selected @endif>Day
                                                                        {{ $normal->program_for_day }}</option>
                                                                @endforeach
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endforeach
                                        </div>
                                        @endif
                                        @if($single->pregnancy_status == "Pregnancy"  || $single->pregnancy_status == "Both")
                                        <div class="col-md-12 col-sm-12">
                                            <label class="col-sm-3 col-form-label">Schedule Pregnancy Programs</label>
                                        </div>
                                        <div id="schedule-pregnancy-programs-div">
                                            @foreach ($pregnant_activity_types as $key => $pregnant_activity_type)
                                                <div class="row">
                                                    <label
                                                        class="col-sm-3 col-form-label  mt-0">{{ $pregnant_activity_type->name }}</label>
                                                    <div class="col-sm-8">
                                                        <div class="form-group bmd-form-group">
                                                            <select name="pregnant[{{ $pregnant_activity_type->id }}][]"
                                                                id="my_blessed_baby_pregnant_{{ $pregnant_activity_type->id }}" data-id="{{ $pregnant_activity_type->id }}"
                                                                class="form-control select2 select2-hidden-accessible my_blessed_baby_pregnant" multiple="multiple" data-placeholder="Select day" style="width: 100%;"
                                                            tabindex="-1" aria-hidden="true">
                                                                 <option value="all">Select All</option>
                                                                 <option value="deselectall" title="{{$pregnant_activity_type->id}}">Deselect All</option>
                                                                @foreach ($programs_pregnant as $keys => $pregnant)>
                                                                    <option value="{{ $pregnant->id }}" title="{{ $pregnant->program_for_day }}"
                                                                      @if(!empty($selected_programs_pregnant[$pregnant_activity_type->id][$pregnant->id]) && $selected_programs_pregnant[$pregnant_activity_type->id][$pregnant->id]['activity_type_id'] == $pregnant_activity_type->id && $selected_programs_pregnant[$pregnant_activity_type->id][$pregnant->id]['programs_id'] == $pregnant->id) selected @endif>Day
                                                                        {{ $pregnant->program_for_day }}</option>
                                                                @endforeach
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endforeach
                                        </div>
                                         @endif

                                    </div>
                                <!-- show-hide-end -->
                                @endif
                            </div>
                            <div class="text-center p-3">
                                <a href="{{ route('activities') }}" class="btn btn-danger w-25">Cancel</a>
                                <input type="submit" class="btn btn-info w-25" name="submit" value="SAVE">
                            </div>
                        </div>


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

        </div>
    </div>
  

@stop
@section('script')

    <script>
        var controller_url = "{{ route('activities') }}";
        var activities_id = '{{ $single->id }}';
    </script>

    <script src="{{ asset('js/image/fileinput.js') }}" type="text/javascript"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/js/select2.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js">

    </script>
    <script>
        // $('#thumbnailsection').show();
        $("#div_audio_en_thumbnail").removeClass('d-none');
        
        var video_eng = "{{ $single->media_en }}";
        var video_guj = "{{ $single->media_gu }}";
        var video_hin = "{{ $single->media_hi }}";

        if (media_type == 'image') {
            
            var my_eng =
                "<div class='file-loading'><input id='media_en' name='media_en[]' type='file' class='file' multiple data-upload-url='#'></div>   <strong><span class='text-danger' id='error_img_en'> </span></strong><div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

            $('#eng').html(my_eng);

            var my_guj =
                "<div class='file-loading'><input id='media_gu' name='media_gu[]' type='file' class='file' multiple data-upload-url='#'></div>  <strong><span class='text-danger' id='error_img_gu'> </span></strong> <div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

            $('#guj').html(my_guj);

            var my_hin =
                "<div class='file-loading'><input id='media_hi' name='media_hi[]' type='file' class='file' multiple data-upload-url='#'></div>  <strong><span class='text-danger' id='error_img_hi'> </span></strong><div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

            $('#hin').html(my_hin);

              // thumbnail
              var my_audio_en_thumbnail =
              "<div class='file-loading'><input id='audio_en_thumbnail' name='audio_en_thumbnail' type='file' class='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_en_thumbnail'> </span></strong><div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";
   
              $('#eng_thumbnail').html(my_audio_en_thumbnail);

        } else if (media_type == 'audio') {
            $("#div_audio_en_thumbnail").removeClass('d-none');
            $("#div_audio_gu_thumbnail").removeClass('d-none');
            $("#div_audio_hi_thumbnail").removeClass('d-none');

            var my_en_audio =
                "<div class='file-loading'><input id='audio_en' name='media_en' type='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_en'> </span></strong>";
            $('#eng').html(my_en_audio);
            var my_gu_audio =
                "<div class='file-loading'><input id='audio_gu' name='media_gu' type='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_gu'> </span></strong>";
            $('#guj').html(my_gu_audio);
            var my_hi_audio =
                "<div class='file-loading'><input id='audio_hi' name='media_hi' type='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_hi'> </span></strong>";
            $('#hin').html(my_hi_audio);

            // thumbnail
            var my_audio_en_thumbnail =
                "<div class='file-loading'><input id='audio_en_thumbnail' name='audio_en_thumbnail' type='file' class='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_en_thumbnail'> </span></strong> <div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

            $('#eng_thumbnail').html(my_audio_en_thumbnail);


        } else if (media_type == 'video') {
            var my_eng =
                "<div class='form-group bmd-form-group'><input type='text' class='form-control ' name='video_eng' id='video_eng' value=" +
                video_eng + " placeholder='Enter Activity Video Link (English)' ></div>";
            $('#eng').html(my_eng);

            var my_guj =
                "<div class='form-group bmd-form-group'><input type='text' class='form-control ' name='video_guj' id='video_guj' value=" +
                video_guj + " placeholder='Enter Activity Video Link (Gujarati)' ></div>";
            $('#guj').html(my_guj);

            var my_hin =
                "<div class='form-group bmd-form-group'><input type='text' class='form-control ' name='video_hin' id='video_hin' value=" +
                video_hin + " placeholder='Enter Activity Video Link  (Hindi)' ></div>";
            $('#hin').html(my_hin);
        }

        $('#media_type').on('change', function() {
            var post = $(this).val();
            if (post == 'video') {
                // $('#thumbnailsection').hide();
                $("#div_audio_en_thumbnail").addClass('d-none');
                $("#div_audio_gu_thumbnail").addClass('d-none');
                $("#div_audio_hi_thumbnail").addClass('d-none');

                @if ($single->media_type != 'video')
                    video_eng= '';
                    video_guj= '';
                    video_hin= '';
                @endif
                var my_eng =
                    "<div class='form-group bmd-form-group'><input type='text' class='form-control ' name='video_eng' id='video_eng'  rows='2' placeholder='Enter Activity Video Link (English)' value="+video_eng+"></div>";
                @if ($single->video_en_thumbnail)
                    var thumbnail="{{$single->video_en_thumbnail}}";
                    my_eng+="<div class='row mt-0'><div class='col-sm-12 col-md-12 mb-2 p-0'><a href='"+thumbnail+"' target='_blank'>English Video Thumbnail Preview</a></div></div>";
                @endif

                var my_guj =
                    "<div class='form-group bmd-form-group'><input type='text' class='form-control ' name='video_guj' id='video_guj'  rows='2' placeholder='Enter Activity Video Link (Gujarati)' value="+video_guj+"></div>";
                @if ($single->video_gu_thumbnail)
                    var thumbnail="{{$single->video_gu_thumbnail}}";
                    my_guj+="<div class='row mt-0'><div class='col-sm-12 col-md-12 mb-2 p-0'><a href="+thumbnail+" target='_blank'>Gujarati Video Thumbnail Preview</a></div></div>";
                @endif

                var my_hin =
                    "<div class='form-group bmd-form-group'><input type='text' class='form-control ' name='video_hin' id='video_hin'  rows='2' placeholder='Enter Activity Video Link  (Hindi)' value="+video_hin +"></div>";
                @if ($single->video_hi_thumbnail)
                    var thumbnail="{{$single->video_hi_thumbnail}}";
                    my_hin+="<div class='row mt-0'><div class='col-sm-12 col-md-12 mb-2 p-0'><a href="+thumbnail+" target='_blank'>Hindi Video Thumbnail Preview</a></div></div>";
                @endif

                $('#eng').html(my_eng);
                $('#guj').html(my_guj);
                $('#hin').html(my_hin);

            } else if (post == 'audio') {
                // $('#thumbnailsection').show();
                $("#div_audio_en_thumbnail").removeClass('d-none');

                var my_en_audio =
                    "<div class='file-loading'><input id='audio_en' name='media_en' type='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_en'> </span></strong>";

                var my_gu_audio =
                    "<div class='file-loading'><input id='audio_gu' name='media_gu' type='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_gu'> </span></strong>";

                var my_hi_audio =
                    "<div class='file-loading'><input id='audio_hi' name='media_hi' type='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_hi'> </span></strong>";

                // thumbnail
                var my_audio_en_thumbnail =
                    "<div class='file-loading'><input id='audio_en_thumbnail' name='audio_en_thumbnail' type='file' class='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_en_thumbnail'> </span></strong><div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

                $('#eng_thumbnail').html(my_audio_en_thumbnail);

                $('#eng').html(my_en_audio);
                $('#guj').html(my_gu_audio);
                $('#hin').html(my_hi_audio);

                $("#audio_en").fileinput({
                    @if (!empty($single->full_en_audio_path))
                        initialPreview : "{{ $single->full_en_audio_path }}",
                    @endif
                    initialPreviewAsData: true,
                    showUpload: false,
                    showPreview: true,
                    showUploadStats: true,
                    showRemove: true,
                    showCancel: false,
                    removeFromPreviewOnError: true,
                    overwriteInitial: true,
                    initialPreviewShowDelete: false,
                    showDrag: false,
                    allowedFileExtensions: ['mp3', 'mp4'],
                    allowedPreviewTypes: ['audio'],
                    maxFilePreviewSize: 20000,
                    initialPreviewConfig: [

                        @if (!empty($single->full_en_audio_path))
                            {
                            type:'audio',
                            showDrag:false,
                            initialPreviewAsData: true,
                            filetype: "audio/mp4",
                            caption: '{{ $single->media_en }}',
                            width: '120px',
                            //url: "{{ $single->full_en_audio_path }}",
                            url: "{{ route('activities.deleteaudio', $single->id) }}",
                            showRemove: true,
                            extra: {
                                'lang': 'en',
                                '_token': '{{ csrf_token() }}'
                            },
                            },
                        @endif
                    ],

                });
                $("#audio_gu").fileinput({
                    @if (!empty($single->full_gu_audio_path))
                        initialPreview : "{{ $single->full_gu_audio_path }}",
                    @endif
                    initialPreviewAsData: true,
                    showUpload: false,
                    showPreview: true,
                    showUploadStats: true,
                    showCancel: false,
                    showRemove: true,
                    removeFromPreviewOnError: true,
                    overwriteInitial: true,
                    initialPreviewShowDelete: false,
                    showDrag: false,
                    allowedFileExtensions: ['mp3', 'mp4'],
                    allowedPreviewTypes: ['audio'],
                    maxFilePreviewSize: 20000,
                    initialPreviewConfig: [

                        @if (!empty($single->full_gu_audio_path))
                            {
                            type:'audio',
                            showDrag:false,
                            initialPreviewAsData: true,
                            filetype: "audio/mp4",
                            caption: '{{ $single->media_gu }}',
                            width: '120px',
                            //url: "{{ $single->full_gu_audio_path }}",
                            url: "{{ route('activities.deleteaudio', $single->id) }}",
                            showRemove: true,
                            extra: {
                                'lang': 'gu',
                                '_token': '{{ csrf_token() }}'
                            },
                            },
                        @endif
                    ],

                });
                $("#audio_hi").fileinput({
                    @if (!empty($single->full_hi_audio_path))
                        initialPreview : "{{ $single->full_hi_audio_path }}",
                    @endif
                    initialPreviewAsData: true,
                    showUpload: false,
                    showPreview: true,
                    showUploadStats: true,
                    showCancel: false,
                    showRemove: true,
                    removeFromPreviewOnError: true,
                    overwriteInitial: true,
                    initialPreviewShowDelete: false,
                    showDrag: false,
                    allowedFileExtensions: ['mp3', 'mp4'],
                    allowedPreviewTypes: ['audio'],
                    maxFilePreviewSize: 20000,
                    initialPreviewConfig: [

                        @if (!empty($single->full_hi_audio_path))
                            {
                            type:'audio',
                            showDrag:false,
                            initialPreviewAsData: true,
                            filetype: "audio/mp4",
                            caption: '{{ $single->media_hi }}',
                            width: '120px',
                            //url: "{{ $single->full_hi_audio_path }}",
                            url: "{{ route('activities.deleteaudio', $single->id) }}",
                            showRemove: true,
                            extra: {
                                'lang': 'hi',
                                '_token': '{{ csrf_token() }}'
                            },
                            },
                        @endif
                    ],

                });

                // thumbnail

                
                
                $("#audio_en_thumbnail").fileinput({
                        initialPreview : "{{ $single->full_en_audio_path_thumbnail }}",
                    overwriteInitial: true,
                    validateInitialCount: true,
                    initialPreviewAsData: true,
                    showUpload: false,
                    showCancel:false,
                    showRemove:false,
                    dropZoneEnabled: false,
                    allowedFileExtensions: ['jpg', 'jpeg', 'png'],
                    allowedPreviewTypes: ['image'],
                    initialPreviewConfig: [

                        @if (!empty($single->full_en_audio_path_thumbnail) && $single->media_type == 'audio'|| $single->media_type == 'image')
                            {
                            
                            caption: '{{ $single->audio_en_thumbnail }}',
                            width: '120px',
                            url: "{{ route('activities.deletethumbnailpic', $single->id) }}",
                            extra: {
                            '_token': '{{ csrf_token() }}'
                            },
                            },
                        @endif
                    ],

                });

            } else if (post == 'image') {
                // $('#thumbnailsection').show();
                
                $("#div_audio_gu_thumbnail").addClass('d-none');
                $("#div_audio_hi_thumbnail").addClass('d-none');
                $("#div_audio_en_thumbnail").removeClass('d-none');
                // thumbnail
                var my_audio_en_thumbnail =
                "<div class='file-loading'><input id='audio_en_thumbnail' name='audio_en_thumbnail' type='file' class='file' data-upload-url='#'></div><strong><span class='text-danger' id='error_audio_en_thumbnail'> </span></strong><div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";
     
                $('#eng_thumbnail').html(my_audio_en_thumbnail);

                var my_eng_img =
                    "<div class='file-loading'><input id='media_en' name='media_en[]' type='file' class='file' multiple data-upload-url='#'></div> <strong><span class='text-danger' id='error_img_en'> </span></strong> <div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

                var my_guj_img =
                    "<div class='file-loading'><input id='media_gu' name='media_gu[]' type='file' class='file' multiple data-upload-url='#'></div> <strong><span class='text-danger' id='error_img_gu'> </span></strong> <div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

                var my_hin_img =
                    "<div class='file-loading'><input id='media_hi' name='media_hi[]' type='file' class='file' multiple data-upload-url='#'></div> <strong><span class='text-danger' id='error_img_hi'> </span></strong> <div style='col-sm-12'><small class='text-danger'>Once you click on delete icon, Image will be deleted and it's not revertable</small></div>";

                $('#eng').html(my_eng_img);
                $('#guj').html(my_guj_img);
                $('#hin').html(my_hin_img);



                var url_eng_image = [];
                var image_eng_id = [];
                @foreach ($eng_image as $images)
                    @if (!empty($images->en_media_image_url))
                        url_eng_image.push("{{ $images->en_media_image_url }}");
                        image_eng_id.push("{{ $images->id }}");
                    @endif
                @endforeach
                $("#media_en").fileinput({
                    overwriteInitial: false,
                    initialPreview: url_eng_image,
                    initialPreviewAsData: true,
                    showUpload: false,
                    dropZoneEnabled: false,
                    showCancel: false,
                    initialPreviewConfig: [
                        @foreach ($eng_image as $key => $images)
                            @if ($images)
                                {
                                initialPreviewAsData: true,
                                caption: '{{ $images->media_image }}',
                                width: '120px',
                                url:"{{ route('activities.deletepic', ['id' => $images->id]) }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        @endforeach
                    ],
                    uploadUrl: '/file-upload-batch/2',
                    maxFilePreviewSize: 20000
                });

                var url_hin_image = [];
                var image_hin_id = [];
                @foreach ($hin_image as $images)
                    @if (!empty($images->hi_media_image_url))
                        url_hin_image.push("{{ $images->hi_media_image_url }}");
                        image_hin_id.push("{{ $images->id }}");
                    @endif
                @endforeach
                $("#media_hi").fileinput({
                    overwriteInitial: false,
                    initialPreview: url_hin_image,
                    initialPreviewAsData: true,
                    showUpload: false,
                    dropZoneEnabled: false,
                    showCancel: false,
                    initialPreviewConfig: [
                        @foreach ($hin_image as $key => $images)
                            @if ($images)
                                {
                                initialPreviewAsData: true,
                                caption: '{{ $images->media_image }}',
                                width: '120px',
                                url:"{{ route('activities.deletepic', ['id' => $images->id]) }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        @endforeach
                    ],
                    uploadUrl: '/file-upload-batch/2',
                    maxFilePreviewSize: 20000
                });

                var url_guj_image = [];
                var image_guj_id = [];
                @foreach ($guj_image as $images)
                    @if (!empty($images->gu_media_image_url))
                        url_guj_image.push("{{ $images->gu_media_image_url }}");
                        image_guj_id.push("{{ $images->id }}");
                    @endif
                @endforeach
                $("#media_gu").fileinput({
                    overwriteInitial: false,
                    initialPreview: url_guj_image,
                    initialPreviewAsData: true,
                    showUpload: false,
                    dropZoneEnabled: false,
                    showCancel: false,
                    initialPreviewConfig: [
                        @foreach ($guj_image as $key => $images)
                            @if ($images)
                                {
                                initialPreviewAsData: true,
                                caption: '{{ $images->media_image }}',
                                width: '120px',
                                url:"{{ route('activities.deletepic', ['id' => $images->id]) }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        @endforeach
                    ],
                    uploadUrl: '/file-upload-batch/2',
                    maxFilePreviewSize: 20000
                });

                $("#audio_en_thumbnail").fileinput({
                    @if (!empty($single->full_en_audio_path_thumbnail) && $single->media_type == 'audio' || $single->media_type == 'image')
                        initialPreview : "{{ $single->full_en_audio_path_thumbnail }}",
                    @endif
                    overwriteInitial: true,
                    validateInitialCount: true,
                    initialPreviewAsData: true,
                    showUpload: false,
                    showCancel:false,
                    showRemove:false,
                    dropZoneEnabled: false,
                    allowedFileExtensions: ['jpg', 'jpeg', 'png'],
                    allowedPreviewTypes: ['image'],
                    initialPreviewConfig: [

                        @if (!empty($single->full_en_audio_path_thumbnail))
                            {
                            
                            caption: '{{ $single->audio_en_thumbnail }}',
                            width: '120px',
                            url: "{{ route('activities.deletethumbnailpic', $single->id) }}",
                            extra: {
                            '_token': '{{ csrf_token() }}'
                            },
                            },
                        @endif
                    ],

                });

            }

        });
        $("#media_type").trigger('change');

        /*$(document).ready(function() {

            $("#reminder_audio_en").fileinput({
                @if (!empty($single->full_reminder_en_audio_path))
                    initialPreview : "{{ $single->full_reminder_en_audio_path }}",
                @endif
                initialPreviewAsData: true,
                showUpload: false,
                showPreview: true,
                showUploadStats: true,
                showRemove: false,
                showCancel: false,
                removeFromPreviewOnError: true,
                overwriteInitial: true,
                initialPreviewShowDelete: false,
                showDrag: false,
                allowedFileExtensions: ['mp3', 'mp4'],
                allowedPreviewTypes: ['audio'],
                initialPreviewConfig: [

                    @if (!empty($single->full_reminder_en_audio_path))
                        {
                        type:'audio',
                        showDrag:false,
                        initialPreviewAsData: true,
                        filetype: "audio/mp4",
                        caption: '{{ $single->reminder_audio_en }}',
                        width: '120px',
                        url: "{{ $single->full_reminder_en_audio_path }}",
                        extra: {
                        '_token': '{{ csrf_token() }}'
                        },
                        },
                    @endif
                ],

            });

            $("#reminder_audio_gu").fileinput({
                @if (!empty($single->full_reminder_gu_audio_path))
                    initialPreview : "{{ $single->full_reminder_gu_audio_path }}",
                @endif
                initialPreviewAsData: true,
                showUpload: false,
                showPreview: true,
                showUploadStats: true,
                showRemove: false,
                removeFromPreviewOnError: true,
                showCancel: false,
                overwriteInitial: true,
                initialPreviewShowDelete: false,
                showDrag: false,
                allowedFileExtensions: ['mp3', 'mp4'],
                allowedPreviewTypes: ['audio'],
                initialPreviewConfig: [

                    @if (!empty($single->full_reminder_gu_audio_path))
                        {
                        type:'audio',
                        showDrag:false,
                        initialPreviewAsData: true,
                        filetype: "audio/mp4",
                        caption: '{{ $single->reminder_audio_gu }}',
                        width: '120px',
                        url: "{{ $single->full_reminder_gu_audio_path }}",
                        extra: {
                        '_token': '{{ csrf_token() }}'
                        },
                        },
                    @endif
                ],

            });

            $("#reminder_audio_hi").fileinput({
                @if (!empty($single->full_reminder_hi_audio_path))
                    initialPreview : "{{ $single->full_reminder_hi_audio_path }}",
                @endif
                initialPreviewAsData: true,
                showUpload: false,
                showPreview: true,
                showUploadStats: true,
                showRemove: false,
                removeFromPreviewOnError: true,
                showCancel: false,
                overwriteInitial: true,
                initialPreviewShowDelete: false,
                showDrag: false,
                allowedFileExtensions: ['mp3', 'mp4'],
                allowedPreviewTypes: ['audio'],
                initialPreviewConfig: [

                    @if (!empty($single->full_reminder_hi_audio_path))
                        {
                        type:'audio',
                        showDrag:false,
                        initialPreviewAsData: true,
                        filetype: "audio/mp4",
                        caption: '{{ $single->reminder_audio_hi }}',
                        width: '120px',
                        url: "{{ $single->full_reminder_hi_audio_path }}",
                        extra: {
                        '_token': '{{ csrf_token() }}'
                        },
                        },
                    @endif
                ],

            });

        });*/
    </script>

    <script src="{{ asset('js/activity/edit.js') }}" type="text/javascript"></script>
  
@stop