@extends('layout.master')
@section('title', 'Add Activity')
@section('css')
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.min.css"
        crossorigin="anonymous">

    <link href="https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-fileinput@5.2.5/css/fileinput.min.css" media="all"
        rel="stylesheet" type="text/css" />

    <link href="{{ asset('css/fileinput.css') }}" rel="stylesheet" />
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" rel="stylesheet" />
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" rel="stylesheet" />

    <style>
        .english img {
            width: 150px;
            margin: 0 15px 15px 15px;
        }

        .gujarati img {
            width: 150px;
            margin: 0 15px 15px 15px;
        }

        .hindi img {
            width: 150px;
            margin: 0 15px 15px 15px;
        }

        .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;
        }

        .file-field.input-field .btn.btn-info {
            margin-top: 0px;
        }

        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: 0px auto !important;
            padding: 0;
            border-bottom: 1px solid #9e9e9e;
            line-height: 3.5 !important;
            ;
        }

        .btn:not(:disabled):not(.disabled) {
            cursor: pointer;
            margin: -7px 3px 0px 0px;
        }

        .help-block {
            color: #ff0000 !important;
            font-size: 12px !important;
            font-weight: normal !important;
        }

        .kv-file-upload {
            visibility: hidden;
        }

        .file-upload-indicator {
            visibility: hidden;
        }

        .btn-file {
            background-color: #26b2e5 !important;
        }

        .btn:not(:disabled):not(.disabled) {
            margin: 0px 3px 0px 0px !important;
        }

        /* browse button css */
        #editbabyactivity input.file-caption-name.form-control.kv-fileinput-caption {
            margin-top: 8px !important;
        }

        /*#editbabyactivity  input.file-caption-name.form-control.kv-fileinput-caption.is-valid {
            margin-top: 8px;
        }*/
        
        /* select2 day */
        .select2-container--default .select2-results__option--highlighted[aria-selected] {
            background-color: rgb(38, 178, 229) !important;
        }
        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>
@stop

@section('content')
    <div class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12">
                    <form id="editbabyactivity" method="POST" action="{{ route('baby_activities.update', $single->id) }}"
                        enctype="multipart/form-data">
                        @csrf
                        <div class="card">
                            <div class="card-header card-header-warning ">
                                <h4 class="card-title">Edit Baby Activity</h4>
                            </div>
                            <div class="card-body">                                
                                <div class="row">
                                    <label class="col-sm-3 col-form-label mt-2">Activity Day<span class="text-danger"> *</span></label>
                                    <div class="col-sm-8">
                                    <div class="form-group bmd-form-group">
                                         <select name="day[]"
                                            id="day" class="form-control select2 select2-hidden-accessible day" multiple="multiple" data-placeholder="Select day" style="width: 100%;" tabindex="-1" aria-hidden="true">
                                            <option value="all">Select All</option>
                                            <option value="deselectall">Deselect All</option>
                                            @foreach (range(1, 31) as $y)
                                                <option value="{{ $y }}" title="{{ $y }}" @if (in_array($y, $single->explode_day))selected @endif >Day {{ $y }}</option>
                                            @endforeach
                                        </select>
                                        <div id="error_day" class="error">
                                                <strong></strong>
                                        </div>
                                    </div>
                                </div>
                                </div>
                                
                                <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="mother_activity" name="activity_of" value="mother_activity" type="radio"  @if($single->activity_of =="mother_activity") checked @endif/>
                                            <label for="mother_activity">Mother</label>

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

                                            <input id="extra_activity" name="activity_of" value="extra_activity" type="radio" @if($single->activity_of =="extra_activity") checked @endif/>
                                            <label for="extra_activity">Extra Activity</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 class="row">
                                    <label class="col-sm-3 col-form-label  mt-0">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>
                                </div>

                                <div class="row">
                                    <label class="col-sm-3 col-form-label  mt-0">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>
                                </div>

                                <div class="row">
                                    <label class="col-sm-3 col-form-label  mt-0">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" id="activity_thumbnail_id"
                                                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 any one</option>
                                                @foreach ($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_id'))
                                        <div class="error">
                                       <strong>{{ $errors->first('activity_thumbnail_id') }}</strong></div>
                                    @endif
                                    </div>
                                </div>

                                <div class="row mt-4" 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>

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

                                    <div class="col-sm-8" class='imgsize' id="eng"></div>
                                    @if ($errors->has('media_en'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('media_en') }}</strong></div>
                                    @endif
                                    @if ($errors->has('audio_en'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('audio_en') }}</strong></div>
                                    @endif

                                    @if ($errors->has('video_eng'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('video_eng') }}</strong></div>
                                    @endif

                                    @if ($errors->has('pdf_en'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('pdf_en') }}</strong></div>
                                    @endif
                                </div>

                                <div class="row">
                                    <label class="col-sm-3 col-form-label mt-4">Select Gujarati Media<span
                                            class="text-danger"> * </span></label>
                                    <div class="col-sm-8" class='imgsize' id="guj"></div>
                                    @if ($errors->has('media_gu'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('media_gu') }}</strong></div>
                                    @endif

                                    @if ($errors->has('audio_gu'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('audio_gu') }}</strong></div>
                                    @endif

                                    @if ($errors->has('video_guj'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('video_guj') }}</strong></div>
                                    @endif

                                    @if ($errors->has('pdf_gu'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('pdf_gu') }}</strong></div>
                                    @endif
                                </div>

                                <div class="row">
                                    <label class="col-sm-3 col-form-label mt-4">Select Hindi Media
                                        <span class="text-danger"> * </span>
                                    </label>
                                    <div class="col-sm-8" id="hin"></div>
                                    @if ($errors->has('media_hi'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('media_hi') }}</strong></div>
                                    @endif

                                    @if ($errors->has('audio_hi'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('audio_hi') }}</strong></div>
                                    @endif

                                    @if ($errors->has('video_hin'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('video_hin') }}</strong></div>
                                    @endif

                                    @if ($errors->has('pdf_hi'))
                                        <div class="error" style="margin-left: 24pc;">
                                            <strong>{{ $errors->first('pdf_hi') }}</strong></div>
                                    @endif
                                </div>

                                <div class="row">
                                    <label class="col-sm-12 col-form-label">Activity Description</label>
                                </div>
                                <div class="row">
                                    <label class="col-sm-3 col-form-label mt-1">Description (English)
                                        <span class="text-danger"> * </span> </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 class="error">
                                                            <strong id="error_description_en"></strong></div>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <label class="col-sm-3 col-form-label mt-1">Description (Gujarati)
                                        <span class="text-danger"> * </span></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 class="error">
                                                            <strong id="error_description_gu"></strong></div>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <label class="col-sm-3 col-form-label mt-1">Description (Hindi)
                                        <span class="text-danger"> * </span></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 class="error">
                                                            <strong id="error_description_hi"></strong>
                                                    </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="text-center p-3">
                                <a href="{{ route('baby_activities') }}" class="btn btn-danger w-25">Cancel</a>
                                <input type="submit" class="btn btn-theme w-25" id="updateactivity" name="button"
                                    value="SAVE">
                            </div>
                        </div>

                    </form>

                </div>
            </div>
        </div>
    </div>
    {{--  @dd($single->en_audio_full_path_thumbnail);  --}}

@stop
@section('script')
    <style>
        .table-responsive {
            overflow-x: hidden !important;
            overflow-y: auto !important;
        }

        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;
        }

    </style>
    <script>
        var controller_url = "{{ route('baby_activities') }}";
        var baby_activity_id = "{{ $single->id }}";
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js">
    </script>

    <script src="https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-fileinput@5.2.5/js/plugins/piexif.min.js"
        type="text/javascript"></script>

    <script src="https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-fileinput@5.2.5/js/plugins/sortable.min.js"
        type="text/javascript"></script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous">
    </script>

    <script src="https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-fileinput@5.2.5/js/fileinput.min.js"></script>

    <script src="https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-fileinput@5.2.5/js/locales/LANG.js"></script>

    <script src="{{ asset('js/babyactivities/edit.js') }}" type="text/javascript"></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>
        var media_type = "{{ $single->media_type }}";

        var audio_eng = "{{ asset('uploads/baby_activities/' . $single->id . '/media_en/' . $single->media_en) }}";
        var audio_guj = "{{ asset('uploads/baby_activities/' . $single->id . '/media_gu/' . $single->media_gu) }}";
        var audio_hin = "{{ asset('uploads/baby_activities/' . $single->id . '/media_hi/' . $single->media_hi) }}";

        var pdf_en = "{{ asset('uploads/baby_activities/' . $single->id . '/media_en/' . $single->media_en) }}";
        var pdf_gu = "{{ asset('uploads/baby_activities/' . $single->id . '/media_gu/' . $single->media_gu) }}";
        var pdf_hi = "{{ asset('uploads/baby_activities/' . $single->id . '/media_hi/' . $single->media_hi) }}";

        var video_en = "{{ $single->media_en }}";
        var video_hi = "{{ $single->media_hi }}";
        var video_gu = "{{ $single->media_gu }}";


        jQuery(document).ready(function() {
            
            $('.select2').select2({
                closeOnSelect: false,
                theme: 'default', // classic
            });
            
            $('#media_type').on('change', function() {
                var post = $(this).val();
                if (post == 'video' && media_type == 'video') {
                    $('#div_audio_en_thumbnail').hide();
                    // $('#thumbnailsection').hide();
                    var my_eng =
                        "<div class='form-group bmd-form-group mt-4'><input type='text' class='form-control ' name='video_eng' id='video_eng' value=" +
                        video_en + " placeholder='Enter Activity Video Link (English)' ></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 mt-4'><input type='text' class='form-control ' name='video_guj' id='video_guj' value=" +
                        video_gu + " placeholder='Enter Activity Video Link (Gujarati)' ></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 mt-4'><input type='text' class='form-control ' name='video_hin' id='video_hin' value=" +
                        video_hi + " placeholder='Enter Activity Video Link  (Hindi)' ></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 == 'video' && media_type != 'video') {
                    $('#div_audio_en_thumbnail').hide();
                    // $('#thumbnailsection').hide();
                    var my_eng =
                        "<div class='form-group bmd-form-group mt-4'><input type='text' class='form-control' name='video_eng' id='video_eng'  placeholder='Enter Activity Video Link (English)' ></div>";

                    var my_guj =
                        "<div class='form-group bmd-form-group mt-4'><input type='text' class='form-control' name='video_guj' id='video_guj'  placeholder='Enter Activity Video Link (Gujarati)' ></div>";

                    var my_hin =
                        "<div class='form-group bmd-form-group mt-4'><input type='text' class='form-control' name='video_hin' id='video_hin' placeholder='Enter Activity Video Link  (Hindi)' ></div>";

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

                    $('#video_eng').rules("add", {
                        required: true,
                    });
                    $('#video_guj').rules("add", {
                        required: true,
                    });
                    $('#video_hin').rules("add", {
                        required: true,
                    });
                } else if (post == 'audio' && media_type == 'audio') {
                    $('#div_audio_en_thumbnail').show();
                    // $('#thumbnailsection').show();

                    var my_eng =
                        "<div class = 'file-field input-field'><input type='file' name='audio_en' id='audio_en'/><p id='audio_en_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";

                    var my_guj =
                        "<div class = 'file-field input-field'><input type='file' name='audio_gu' id='audio_gu'/><p id='audio_gu_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";

                    var my_hin =
                        "<div class = 'file-field input-field'><input type='file' name='audio_hi' id='audio_hi'/><p id='audio_hi_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";

                    $('#eng').html(my_eng);
                    $('#guj').html(my_guj);
                    $('#hin').html(my_hin);
                    
                    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);

                    // fileinput-start
                    // fileinput for english audio
                    $("#audio_en").fileinput({
                        @if ($single->media_en != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_en_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_en != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_en }}',
                                width: '120px',
                                //url: "{{ $single['audio_en_file_name'] }}",
                                url: "{{ route('baby_activities.deleteaudio', $single->id) }}",
                                showRemove: true,
                                extra: {
                                    'lang': 'en',
                                    '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput for gujarati audio
                    $("#audio_gu").fileinput({
                        @if ($single->media_gu != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_gu_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_gu != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_gu }}',
                                width: '120px',
                                //url: "{{ $single['audio_gu_file_name'] }}",
                                url: "{{ route('baby_activities.deleteaudio', $single->id) }}",
                                showRemove: true,
                                extra: {
                                    'lang': 'gu',
                                    '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput for hindi audio
                    $("#audio_hi").fileinput({
                        @if ($single->media_hi != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_hi_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_hi != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_hi }}',
                                width: '120px',
                                //url: "{{ $single['audio_hi_file_name'] }}",
                                url: "{{ route('baby_activities.deleteaudio', $single->id) }}",
                                showRemove: true,
                                extra: {
                                    'lang': 'hi',
                                    '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    $("#audio_en_thumbnail").fileinput({
                        @if (!empty($single->full_en_audio_path_thumbnail) && $single->media_type == 'audio')
                            initialPreview : "{{ $single->full_en_audio_path_thumbnail }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        showCancel: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: true,
                        showDrag: false,
                        allowedFileExtensions: ['jpg', 'jpeg', 'png'],
                        allowedPreviewTypes: ['image'],
                        initialPreviewConfig: [

                            @if (!empty($single->full_en_audio_path_thumbnail))
                                {
                                showDrag:false,
                                initialPreviewAsData: true,
                                caption: '{{ $single->audio_en_thumbnail }}',
                                width: '120px',
                                url: "{{ route('babyactivities.deletethumbnailpic', $single->id) }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput-end

                } else if (post == 'audio' && media_type != 'audio') {
                    $('#div_audio_en_thumbnail').show();
                    // $('#thumbnailsection').show();
                    var my_eng =
                        "<div class = 'file-field input-field'><input type='file' name='audio_en' id='audio_en'/><p id='audio_en_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";

                    var my_guj =
                        "<div class = 'file-field input-field'><input type='file' name='audio_gu' id='audio_gu'/><p id='audio_gu_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";

                    var my_hin =
                        "<div class = 'file-field input-field'><input type='file' name='audio_hi' id='audio_hi'/><p id='audio_hi_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";

                    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').html(my_eng);
                    $('#guj').html(my_guj);
                    $('#hin').html(my_hin);

                    $('#eng_thumbnail').html(my_audio_en_thumbnail);
                    $('#audio_en').rules("add", {
                        required: true,
                    });
                    $('#audio_gu').rules("add", {
                        required: true,
                    });
                    $('#audio_hi').rules("add", {
                        required: true,
                    });

                    // fileinput-start
                    // fileinput for english audio
                    $("#audio_en").fileinput({
                        @if ($single->media_en != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_en_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_en != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_en }}',
                                width: '120px',
                                url: "{{ $single['audio_en_file_name'] }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput for gujarati audio
                    $("#audio_gu").fileinput({
                        @if ($single->media_gu != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_gu_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_gu != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_gu }}',
                                width: '120px',
                                url: "{{ $single['audio_gu_file_name'] }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput for hindi audio
                    $("#audio_hi").fileinput({
                        @if ($single->media_hi != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_hi_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_hi != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_hi }}',
                                width: '120px',
                                url: "{{ $single['audio_hi_file_name'] }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    $('#eng_thumbnail').html(my_audio_en_thumbnail);
                    $("#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
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        showCancel: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['jpg', 'jpeg', 'png'],
                        allowedPreviewTypes: ['image'],
                        initialPreviewConfig: [

                            @if (!empty($single->full_en_audio_path_thumbnail))
                                {
                                showDrag:false,
                                initialPreviewAsData: true,
                                caption: '{{ $single->audio_en_thumbnail }}',
                                width: '120px',
                                url: "{{ $single->full_en_audio_path_thumbnail }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],

                    });
                    
                    // fileinput-end

                } else if (post == 'pdf' && media_type == 'pdf') {
                    $('#div_audio_en_thumbnail').hide();
                    // $('#thumbnailsection').show();
                    var my_eng =
                        "<div class = 'file-field input-field'><input type='file' name='pdf_en' id='pdf_en'/><p id='pdf_en_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";
                    //var my_eng = "<input type='file' name='pdf_en' id='pdf_en'/><p id='pdf_en_error' class='error'></p>";

                    var my_guj =
                        "<div class = 'file-field input-field'><input type='file' name='pdf_gu' id='pdf_gu'/><p id='pdf_gu_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";
                    //var my_guj = "<input type='file' name='pdf_gu' id='pdf_gu'/><p id='pdf_gu_error' class='error'></p>";

                    var my_hin =
                        "<div class = 'file-field input-field'><input type='file' name='pdf_hi' id='pdf_hi'/><p id='pdf_hi_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";
                    //var my_hin = "<input type='file' name='pdf_hi' id='pdf_hi'/><p id='pdf_hi_error' class='error'></p>";

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

                    // fileinput for english pdf            
                    $("#pdf_en").fileinput({
                        overwriteInitial: false,
                        validateInitialCount: true,
                        initialPreview: "{{ $single['pdf_en_file_name'] }}",
                        initialPreviewAsData: true,
                        showUpload: false,
                        showRemove: false,
                        initialPreviewFileType: 'pdf',
                        allowedFileExtensions: ["pdf"],
                        initialPreviewConfig: [{
                            caption: '{{ $single->media_en }}',
                            width: '120px',
                            url: "{{ $single['pdf_en_file_name'] }}",
                            extra: {
                                '_token': '{{ csrf_token() }}',
                                'pdf': 'pdf',
                            },
                        }, ],
                        uploadUrl: '/file-upload-batch/2',
                        maxFilePreviewSize: 20000
                    });
                    // fileinput for gujarati pdf
                    $("#pdf_gu").fileinput({
                        overwriteInitial: false,
                        validateInitialCount: true,
                        initialPreview: "{{ $single['pdf_gu_file_name'] }}",
                        initialPreviewAsData: true,
                        showUpload: false,
                        showRemove: false,
                        initialPreviewFileType: 'pdf',
                        allowedFileExtensions: ["pdf"],
                        initialPreviewConfig: [{
                            caption: '{{ $single->media_gu }}',
                            width: '120px',
                            url: "{{ $single['pdf_gu_file_name'] }}",
                            extra: {
                                '_token': '{{ csrf_token() }}',
                                'pdf': 'pdf',
                            },
                        }, ],
                        uploadUrl: '/file-upload-batch/2',
                        maxFilePreviewSize: 20000
                    });
                    // fileinput for hindi pdf   
                    $("#pdf_hi").fileinput({
                        overwriteInitial: false,
                        validateInitialCount: true,
                        initialPreview: "{{ $single['pdf_hi_file_name'] }}",
                        initialPreviewAsData: true,
                        showUpload: false,
                        showRemove: false,
                        initialPreviewFileType: 'pdf',
                        allowedFileExtensions: ["pdf"],
                        initialPreviewConfig: [{
                            caption: '{{ $single->media_hi }}',
                            width: '120px',
                            url: "{{ $single['pdf_hi_file_name'] }}",
                            extra: {
                                '_token': '{{ csrf_token() }}',
                                'pdf': 'pdf',
                            },
                        }, ],
                        uploadUrl: '/file-upload-batch/2',
                        maxFilePreviewSize: 20000
                    });

                } else if (post == 'pdf' && media_type != 'pdf') {
                    $('#div_audio_en_thumbnail').hide();
                    var my_eng =
                        "<div class = 'file-field input-field'><input type='file' name='pdf_en' id='pdf_en'/><p id='pdf_en_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";
                    //var my_eng = "<input type='file' name='pdf_en' id='pdf_en'/><p id='pdf_en_error' class='error'></p>";

                    var my_guj =
                        "<div class = 'file-field input-field'><input type='file' name='pdf_gu' id='pdf_gu'/><p id='pdf_gu_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";
                    //var my_guj = "<input type='file' name='pdf_gu' id='pdf_gu'/><p id='pdf_gu_error' class='error'></p>";

                    var my_hin =
                        "<div class = 'file-field input-field'><input type='file' name='pdf_hi' id='pdf_hi'/><p id='pdf_hi_error' class='error'></p></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div>";
                    //var my_hin = "<input type='file' name='pdf_hi' id='pdf_hi'/><p id='pdf_hi_error' class='error'></p>";

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

                    // fileinput for english pdf            
                    $("#pdf_en").fileinput({
                        showRemove: false,
                        showPreview: true,
                        showUploadStats: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        allowedFileExtensions: ['pdf'],
                        allowedPreviewTypes: ['pdf'],
                        maxFilePreviewSize: 20000,

                        uploadUrl: "/file-upload-batch/2",
                        showUpload: false,
                        uploadAsync: false,
                        //overwriteInitial: false,
                        @if ($single->media_en != null && $single->media_type == 'pdf')
                            initialPreview : "{{ $single['pdf_en_file_name'] }}",
                        @endif
                        initialPreviewAsData: true, // defaults markup
                        initialPreviewFileType: 'pdf', // image is the default and can be overridden in config below
                        initialPreviewConfig: [
                            @if ($single->media_en != null && $single->media_type == 'pdf')
                                {
                                type:'pdf',
                                showDrag:false,
                                showRemove:false,
                                initialPreviewAsData: true,
                                filetype: "pdf",
                                caption: '{{ $single->media_en }}',
                                width: '120px',
                                url: "{{ $single['pdf_en_file_name'] }}",
                                downloadUrl: false
                                },
                            @endif
                        ],
                        uploadExtraData: {
                            img_key: "1000",
                            img_keywords: "happy, nature",
                        },
                        preferIconicPreview: true, // this will force thumbnails to display icons for following file extensions
                        previewFileIconSettings: { // configure your icon file extensions
                            'pdf': '<i class="fas fa-file-pdf text-danger"></i>',
                        },
                        previewFileExtSettings: {}
                    });
                    // fileinput for gujarati pdf
                    $("#pdf_gu").fileinput({
                        showRemove: false,
                        showPreview: true,
                        showUploadStats: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        allowedFileExtensions: ['pdf'],
                        allowedPreviewTypes: ['pdf'],
                        maxFilePreviewSize: 20000,

                        uploadUrl: "/file-upload-batch/2",
                        showUpload: false,
                        uploadAsync: false,
                        //overwriteInitial: false,
                        @if ($single->media_gu != null && $single->media_type == 'pdf')
                            initialPreview : "{{ $single['pdf_gu_file_name'] }}",
                        @endif
                        initialPreviewAsData: true, // defaults markup
                        initialPreviewFileType: 'pdf', // image is the default and can be overridden in config below
                        initialPreviewConfig: [
                            @if ($single->media_gu != null && $single->media_type == 'pdf')
                                {
                                type:'pdf',
                                showDrag:false,
                                showRemove:false,
                                initialPreviewAsData: true,
                                filetype: "pdf",
                                caption: '{{ $single->media_gu }}',
                                width: '120px',
                                url: "{{ $single['pdf_gu_file_name'] }}",
                                downloadUrl: false
                                },
                            @endif
                        ],
                        uploadExtraData: {
                            img_key: "1000",
                            img_keywords: "happy, nature",
                        },
                        preferIconicPreview: true, // this will force thumbnails to display icons for following file extensions
                        previewFileIconSettings: { // configure your icon file extensions
                            'pdf': '<i class="fas fa-file-pdf text-danger"></i>',
                        },
                        previewFileExtSettings: {}
                    });
                    // fileinput for hindi pdf   
                    $("#pdf_hi").fileinput({
                        showRemove: false,
                        showPreview: true,
                        showUploadStats: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        allowedFileExtensions: ['pdf'],
                        allowedPreviewTypes: ['pdf'],
                        maxFilePreviewSize: 20000,

                        uploadUrl: "/file-upload-batch/2",
                        showUpload: false,
                        uploadAsync: false,
                        //overwriteInitial: false,
                        @if ($single->media_hi != null && $single->media_type == 'pdf')
                            initialPreview : "{{ $single['pdf_hi_file_name'] }}",
                        @endif
                        initialPreviewAsData: true, // defaults markup
                        initialPreviewFileType: 'pdf', // image is the default and can be overridden in config below
                        initialPreviewConfig: [
                            @if ($single->media_hi != null && $single->media_type == 'pdf')
                                {
                                type:'pdf',
                                showDrag:false,
                                showRemove:false,
                                initialPreviewAsData: true,
                                filetype: "pdf",
                                caption: '{{ $single->media_hi }}',
                                width: '120px',
                                url: "{{ $single['pdf_hi_file_name'] }}",
                                downloadUrl: false
                                },
                            @endif
                        ],
                        uploadExtraData: {
                            img_key: "1000",
                            img_keywords: "happy, nature",
                        },
                        preferIconicPreview: true, // this will force thumbnails to display icons for following file extensions
                        previewFileIconSettings: { // configure your icon file extensions
                            'pdf': '<i class="fas fa-file-pdf text-danger"></i>',
                        },
                        previewFileExtSettings: {}
                    });


                    $('#pdf_en').rules("add", {
                        required: true,
                    });
                    $('#pdf_gu').rules("add", {
                        required: true,
                    });
                    $('#pdf_hi').rules("add", {
                        required: true,
                    });
                } else if (post == 'image' && media_type == 'image') {
                    $('#div_audio_en_thumbnail').show();
                    // $('#thumbnailsection').show();
                    var my_eng =
                        "<div class = 'file-field input-field'><input type = 'file' multiple  name='media_en[]' id='media_en' class='media_en'/></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div> <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 =
                        "<div class = 'file-field input-field'><input type = 'file' multiple  name='media_gu[]' id='media_gu' class='media_gu'/></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_gu' class='errorColor'></i></div><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 =
                        "<div class = 'file-field input-field'><input type = 'file' multiple  name='media_hi[]' id='media_hi' class='media_hi'/></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_hindi' class='errorColor'></i></div><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);
                    $('#guj').html(my_guj);
                    $('#hin').html(my_hin);

                    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);

                    $("#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
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        showCancel: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['jpg', 'jpeg', 'png'],
                        allowedPreviewTypes: ['image'],
                        initialPreviewConfig: [

                            @if (!empty($single->full_en_audio_path_thumbnail))
                                {
                                showDrag:false,
                                initialPreviewAsData: true,
                                caption: '{{ $single->audio_en_thumbnail }}',
                                width: '120px',
                                url: "{{ $single->full_en_audio_path_thumbnail }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],

                    });
                    
                    myFunction();
                } else if (post == 'image' && media_type != 'image') {
                    $('#div_audio_en_thumbnail').show();
                    $('#thumbnailsection').show();
                    var my_eng =
                        "<div class = 'file-field input-field'><input type = 'file' multiple  name='media_en[]' id='media_en' class='media_en'/></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_en' class='errorColor'></i></div><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 =
                        "<div class = 'file-field input-field'><input type = 'file' multiple  name='media_gu[]' id='media_gu' class='media_gu'/></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_gu' class='errorColor'></i></div><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 =
                        "<div class = 'file-field input-field'><input type = 'file' multiple  name='media_hi[]' id='media_hi' class='media_hi'/></div><div class = 'file-path-wrapper'><input type='hidden' name='media_link' value=''><i id='error_hindi' class='errorColor'></i></div><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);
                    $('#guj').html(my_guj);
                    $('#hin').html(my_hin);
                    $('#eng_thumbnail').html(my_audio_en_thumbnail);
                   

                    // fileinput-start
                    // fileinput for english audio
                    $("#audio_en").fileinput({
                        @if ($single->media_en != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_en_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_en != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_en }}',
                                width: '120px',
                                url: "{{ $single['audio_en_file_name'] }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput for gujarati audio
                    $("#audio_gu").fileinput({
                        @if ($single->media_gu != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_gu_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_gu != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_gu }}',
                                width: '120px',
                                url: "{{ $single['audio_gu_file_name'] }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput for hindi audio
                    $("#audio_hi").fileinput({
                        @if ($single->media_hi != null && $single->media_type == 'audio')
                            initialPreview : "{{ $single['audio_hi_file_name'] }}",
                        @endif
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['mp3', 'mp4'],
                        allowedPreviewTypes: ['audio'],
                        initialPreviewConfig: [

                            @if ($single->media_hi != null && $single->media_type == 'audio')
                                {
                                type:'audio',
                                showDrag:false,
                                initialPreviewAsData: true,
                                filetype: "audio/mp4",
                                caption: '{{ $single->media_hi }}',
                                width: '120px',
                                url: "{{ $single['audio_hi_file_name'] }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],
                    });
                    // fileinput-end

                    $("#media_hi").fileinput({
                        showRemove: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        dropZoneEnabled: false,
                        showDrag: false,
                        uploadUrl: '/file-upload-batch/2',
                        allowedFileExtensions: ["jpg", "png", "jpeg"],
                        maxFilePreviewSize: 20000
                    });
                    $("#media_gu").fileinput({
                        showRemove: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        removeFromPreviewOnError: true,
                        dropZoneEnabled: false,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,

                        uploadUrl: '/file-upload-batch/2',
                        allowedFileExtensions: ["jpg", "png", "jpeg"],
                        maxFilePreviewSize: 20000
                    });
                    $("#media_en").fileinput({
                        showRemove: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        removeFromPreviewOnError: true,
                        dropZoneEnabled: false,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,

                        uploadUrl: '/file-upload-batch/2',
                        allowedFileExtensions: ["jpg", "png", "jpeg"],
                        maxFilePreviewSize: 20000
                    });

                    $('#media_en').rules("add", {
                        required: true,
                    });
                    $('#media_gu').rules("add", {
                        required: true,
                    });
                    $('#media_hi').rules("add", {
                        required: true,
                    });

                    $("#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
                        initialPreviewAsData: true,
                        showUpload: false,
                        showPreview: true,
                        showUploadStats: true,
                        showRemove: false,
                        showCancel: false,
                        removeFromPreviewOnError: true,
                        overwriteInitial: true,
                        initialPreviewShowDelete: false,
                        showDrag: false,
                        allowedFileExtensions: ['jpg', 'jpeg', 'png'],
                        allowedPreviewTypes: ['image'],
                        initialPreviewConfig: [

                            @if (!empty($single->full_en_audio_path_thumbnail))
                                {
                                showDrag:false,
                                initialPreviewAsData: true,
                                caption: '{{ $single->audio_en_thumbnail }}',
                                width: '120px',
                                url: "{{ $single->full_en_audio_path_thumbnail }}",
                                extra: {
                                '_token': '{{ csrf_token() }}'
                                },
                                },
                            @endif
                        ],

                    });

                }

            });

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


        $(document).ready(function() {
            myFunction();
        });

        function myFunction() {
            var url_hi = [];
            var url_en = [];
            var url_gu = [];

            var image_hi_id = [];
            var image_en_id = [];
            var image_gu_id = [];
            @foreach ($single->activity_images as $key => $images)
                @if ($images->media_language == 'hi')
                    @if ($images->image_hi_file_name)
                        url_hi.push("{{ $images->image_hi_file_name }}");
                        image_hi_id.push("{{ $images->id }}");
                    @endif
                @endif
                @if ($images->media_language == 'en')
                    @if ($images->image_en_file_name)
                        url_en.push("{{ $images->image_en_file_name }}");
                        image_en_id.push("{{ $images->id }}");
                    @endif
                @endif
                @if ($images->media_language == 'gu')
                    @if ($images->image_gu_file_name)
                        url_gu.push("{{ $images->image_gu_file_name }}");
                        image_gu_id.push("{{ $images->id }}");
                    @endif
                @endif
            @endforeach
            $("#media_hi").fileinput({
                showRemove: true,
                overwriteInitial: false,
                validateInitialCount: true,
                initialPreview: url_hi,
                initialPreviewAsData: true,
                showUpload: false,
                dropZoneEnabled: false,
                showPreview: true,
                showUploadStats: true,
                removeFromPreviewOnError: true,
                overwriteInitial: true,
                //initialPreviewShowDelete:false,
                showDrag: false,

                allowedFileExtensions: ["jpg", "png", "jpeg"],
                initialPreviewConfig: [
                    @foreach ($single->activity_images as $key => $images)
                        @if ($images->media_language == 'hi')
                            {
                            caption: '{{ $images->media_image }}',
                            width: '120px',
                            url: "{{ URL::asset('admin/delete/baby_activities/image/') }}/{{ $images->id }}",
                            extra: {
                            '_token': '{{ csrf_token() }}'
                            }
                            },
                        @endif
                    @endforeach
                ],
                uploadUrl: '/file-upload-batch/2',
                maxFilePreviewSize: 20000
            });
            $("#media_gu").fileinput({
                showRemove: true,
                overwriteInitial: false,
                validateInitialCount: true,
                initialPreview: url_gu,
                initialPreviewAsData: true,
                showUpload: false,
                dropZoneEnabled: false,
                showPreview: true,
                showUploadStats: true,
                //showRemove: false,
                removeFromPreviewOnError: true,
                overwriteInitial: true,
                // initialPreviewShowDelete:false,
                showDrag: false,


                allowedFileExtensions: ["jpg", "png", "jpeg"],
                initialPreviewConfig: [
                    @foreach ($single->activity_images as $key => $images)
                        @if ($images->media_language == 'gu')
                            {
                            caption: '{{ $images->media_image }}',
                            width: '120px',
                            url: "{{ URL::asset('admin/delete/baby_activities/image/') }}/{{ $images->id }}",
                            extra: {
                            '_token': '{{ csrf_token() }}'
                            }
                            },
                        @endif
                    @endforeach
                ],
                uploadUrl: '/file-upload-batch/2',
                maxFilePreviewSize: 20000
            });
            $("#media_en").fileinput({
                showRemove: true,
                overwriteInitial: false,
                validateInitialCount: true,
                initialPreview: url_en,
                initialPreviewAsData: true,
                showUpload: false,
                dropZoneEnabled: false,
                showPreview: true,
                showUploadStats: true,
                //showRemove: false,
                removeFromPreviewOnError: true,
                overwriteInitial: true,
                //initialPreviewShowDelete:false,
                showDrag: false,

                allowedFileExtensions: ["jpg", "png", "jpeg"],
                initialPreviewConfig: [
                    @foreach ($single->activity_images as $key => $images)
                        @if ($images->media_language == 'en')
                            {
                            caption: '{{ $images->media_image }}',
                            width: '120px',
                            url: "{{ URL::asset('admin/delete/baby_activities/image/') }}/{{ $images->id }}",
                            extra: {
                            '_token': '{{ csrf_token() }}'
                            }
                            },
                        @endif
                    @endforeach
                ],
                uploadUrl: '/file-upload-batch/2',
                maxFilePreviewSize: 20000,
            });

        }

        // fileinput-start
        // fileinput for english audio
        $("#audio_en").fileinput({
            @if ($single->media_en != null && $single->media_type == 'audio')
                initialPreview : "{{ $single['audio_en_file_name'] }}",
            @endif
            initialPreviewAsData: true,
            showUpload: false,
            showPreview: true,
            showUploadStats: true,
            showRemove: false,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            initialPreviewShowDelete: false,
            showDrag: false,
            allowedFileExtensions: ['mp3', 'mp4'],
            allowedPreviewTypes: ['audio'],
            initialPreviewConfig: [

                @if ($single->media_en != null && $single->media_type == 'audio')
                    {
                    type:'audio',
                    showDrag:false,
                    initialPreviewAsData: true,
                    filetype: "audio/mp4",
                    caption: '{{ $single->media_en }}',
                    width: '120px',
                    url: "{{ $single['audio_en_file_name'] }}",
                    extra: {
                    '_token': '{{ csrf_token() }}'
                    },
                    },
                @endif
            ],
        });
        // fileinput for gujarati audio
        $("#audio_gu").fileinput({
            @if ($single->media_gu != null && $single->media_type == 'audio')
                initialPreview : "{{ $single['audio_gu_file_name'] }}",
            @endif
            initialPreviewAsData: true,
            showUpload: false,
            showPreview: true,
            showUploadStats: true,
            showRemove: false,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            initialPreviewShowDelete: false,
            showDrag: false,
            allowedFileExtensions: ['mp3', 'mp4'],
            allowedPreviewTypes: ['audio'],
            initialPreviewConfig: [

                @if ($single->media_gu != null && $single->media_type == 'audio')
                    {
                    type:'audio',
                    showDrag:false,
                    initialPreviewAsData: true,
                    filetype: "audio/mp4",
                    caption: '{{ $single->media_gu }}',
                    width: '120px',
                    url: "{{ $single['audio_gu_file_name'] }}",
                    extra: {
                    '_token': '{{ csrf_token() }}'
                    },
                    },
                @endif
            ],
        });
        // fileinput for hindi audio
        $("#audio_hi").fileinput({
            @if ($single->media_hi != null && $single->media_type == 'audio')
                initialPreview : "{{ $single['audio_hi_file_name'] }}",
            @endif
            initialPreviewAsData: true,
            showUpload: false,
            showPreview: true,
            showUploadStats: true,
            showRemove: false,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            initialPreviewShowDelete: false,
            showDrag: false,
            allowedFileExtensions: ['mp3', 'mp4'],
            allowedPreviewTypes: ['audio'],
            initialPreviewConfig: [

                @if ($single->media_hi != null && $single->media_type == 'audio')
                    {
                    type:'audio',
                    showDrag:false,
                    initialPreviewAsData: true,
                    filetype: "audio/mp4",
                    caption: '{{ $single->media_hi }}',
                    width: '120px',
                    url: "{{ $single['audio_hi_file_name'] }}",
                    extra: {
                    '_token': '{{ csrf_token() }}'
                    },
                    },
                @endif
            ],
        });

        $("#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
            initialPreviewAsData: true,
            showUpload: false,
            showPreview: true,
            showUploadStats: true,
            showRemove: false,
            showCancel: false,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            initialPreviewShowDelete: false,
            showDrag: false,
            allowedFileExtensions: ['jpg', 'jpeg', 'png'],
            allowedPreviewTypes: ['image'],
            initialPreviewConfig: [

                @if (!empty($single->full_en_audio_path_thumbnail))
                    {
                    showDrag:false,
                    initialPreviewAsData: true,
                    caption: '{{ $single->audio_en_thumbnail }}',
                    width: '120px',
                    url: "{{ $single->full_en_audio_path_thumbnail }}",
                    extra: {
                    '_token': '{{ csrf_token() }}'
                    },
                    },
                @endif
            ],
        });
        // fileinput for english pdf            
        $("#pdf_en").fileinput({
            showRemove: false,
            showPreview: true,
            showUploadStats: true,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            allowedFileExtensions: ['pdf'],
            allowedPreviewTypes: ['pdf'],
            maxFilePreviewSize: 20000,

            uploadUrl: "/file-upload-batch/2",
            showUpload: false,
            uploadAsync: false,
            //overwriteInitial: false,
            @if ($single->media_en != null && $single->media_type == 'pdf')
                initialPreview : "{{ $single['pdf_en_file_name'] }}",
            @endif
            initialPreviewAsData: true, // defaults markup
            initialPreviewFileType: 'pdf', // image is the default and can be overridden in config below
            initialPreviewConfig: [
                @if ($single->media_en != null && $single->media_type == 'pdf')
                    {
                    type:'pdf',
                    showDrag:false,
                    showRemove:false,
                    initialPreviewAsData: true,
                    filetype: "pdf",
                    caption: '{{ $single->media_en }}',
                    width: '120px',
                    url: "{{ $single['pdf_en_file_name'] }}",
                    downloadUrl: false
                    },
                @endif
            ],
            uploadExtraData: {
                img_key: "1000",
                img_keywords: "happy, nature",
            },
            preferIconicPreview: true, // this will force thumbnails to display icons for following file extensions
            previewFileIconSettings: { // configure your icon file extensions
                'pdf': '<i class="fas fa-file-pdf text-danger"></i>',
            },
            previewFileExtSettings: {}
        });
        // fileinput for gujarati pdf
        $("#pdf_gu").fileinput({
            showRemove: false,
            showPreview: true,
            showUploadStats: true,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            allowedFileExtensions: ['pdf'],
            allowedPreviewTypes: ['pdf'],
            maxFilePreviewSize: 20000,

            uploadUrl: "/file-upload-batch/2",
            showUpload: false,
            uploadAsync: false,
            //overwriteInitial: false,
            @if ($single->media_gu != null && $single->media_type == 'pdf')
                initialPreview : "{{ $single['pdf_gu_file_name'] }}",
            @endif
            initialPreviewAsData: true, // defaults markup
            initialPreviewFileType: 'pdf', // image is the default and can be overridden in config below
            initialPreviewConfig: [
                @if ($single->media_gu != null && $single->media_type == 'pdf')
                    {
                    type:'pdf',
                    showDrag:false,
                    showRemove:false,
                    initialPreviewAsData: true,
                    filetype: "pdf",
                    caption: '{{ $single->media_gu }}',
                    width: '120px',
                    url: "{{ $single['pdf_gu_file_name'] }}",
                    downloadUrl: false
                    },
                @endif
            ],
            uploadExtraData: {
                img_key: "1000",
                img_keywords: "happy, nature",
            },
            preferIconicPreview: true, // this will force thumbnails to display icons for following file extensions
            previewFileIconSettings: { // configure your icon file extensions
                'pdf': '<i class="fas fa-file-pdf text-danger"></i>',
            },
            previewFileExtSettings: {}
        });
        // fileinput for hindi pdf   
        $("#pdf_hi").fileinput({
            showRemove: false,
            showPreview: true,
            showUploadStats: true,
            removeFromPreviewOnError: true,
            overwriteInitial: true,
            allowedFileExtensions: ['pdf'],
            allowedPreviewTypes: ['pdf'],
            maxFilePreviewSize: 20000,

            uploadUrl: "/file-upload-batch/2",
            showUpload: false,
            uploadAsync: false,
            //overwriteInitial: false,
            @if ($single->media_hi != null && $single->media_type == 'pdf')
                initialPreview : "{{ $single['pdf_hi_file_name'] }}",
            @endif
            initialPreviewAsData: true, // defaults markup
            initialPreviewFileType: 'pdf', // image is the default and can be overridden in config below
            initialPreviewConfig: [
                @if ($single->media_hi != null && $single->media_type == 'pdf')
                    {
                    type:'pdf',
                    showDrag:false,
                    showRemove:false,
                    initialPreviewAsData: true,
                    filetype: "pdf",
                    caption: '{{ $single->media_hi }}',
                    width: '120px',
                    url: "{{ $single['pdf_hi_file_name'] }}",
                    downloadUrl: false
                    },
                @endif
            ],
            uploadExtraData: {
                img_key: "1000",
                img_keywords: "happy, nature",
            },
            preferIconicPreview: true, // this will force thumbnails to display icons for following file extensions
            previewFileIconSettings: { // configure your icon file extensions
                'pdf': '<i class="fas fa-file-pdf text-danger"></i>',
            },
            previewFileExtSettings: {}
        });
        // fileinput-end
    </script>
@stop