@extends('backend.template.main')
@push('breadcrumb')
    @include('backend.shared._breadcrumb', [
    'breadcrumb' => $breadcrumb,

    ])
@endpush
@section('content')

    {!! Form::open(['url' => Config::get('sysconfig.prefix').'/contents/'.$content->id, 'files' => true,'id' => 'my-form','method' => 'PATCH']) !!}

    <div class="page-header">
        <div class="row">
            <div class="col-lg-6">
                <button type="submit" name="btnPublish" value="publish"
                        class="btn btn-white btn-primary btn-bold no-border">
                    <i class="ace-icon fa fa-database  bigger-120 blue"></i>
                    {{trans('translate.btn_save')}}
                </button>
                <button type="submit" name="btnapply" value="apply" id="btnapply"
                        class="btn btn-white btn-primary btn-bold no-border">
                    <i class="ace-icon fa fa-retweet  bigger-120 green"></i>
                    {{trans('translate.btn_apply')}}
                </button>
                <a href="{{ url()->previous() }}" class="btn btn-white btn-danger btn-bold no-border">
                    <i class="ace-icon fa fa-reply  bigger-120 blue"></i>
                    {{trans('translate.btn_cancel')}}
                </a>
            </div>
            <div class="col-lg-6">
                @include('flash::message')
            </div>
        </div>

    </div>
    <div class="row">
        <div class="col-md-12 col-xs-12 col-lg-12">
            <div class="row">
                <div class="col-xs-12">

                    <div class="widget-box">

                        <div class="widget-header widget-header-blue widget-header-flat">
                            <h4 class="widget-title lighter">{{ __('menu.content')}}</h4>

                        </div>
                        <div class="widget-body">
                            <div class="widget-main">
                                <div class="form-horizontal">
                                    <div class="form-group @if ($errors->has('txtname')) has-error @endif">
                                        {!!Form::label('name','Title',['class' => 'col-sm-3 control-label no-padding-right required'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::text('txtname',old('txtname',$content->title),['class' => 'form-control','id'=>'name'])!!}
                                            @if ($errors->has('txtname')) <p
                                                class="help-block">{{ $errors->first('txtname') }}</p> @endif
                                        </div>
                                    </div>
                                    <div class="form-group @if ($errors->has('txtslug')) has-error @endif">
                                        {!!Form::label('slug','Slug',['class' => 'col-sm-3 control-label no-padding-right required'])!!}
                                        <div class="col-sm-5">

                                            <div class="input-group">
                                                {!!Form::text('txtslug',old('txtslug',$content->slug),['class' => 'form-control','id' => 'slug' ])!!}
                                                <span class="input-group-btn">
                                                <button class="btn btn-sm btn-default" type="button" id="new-slug">
                                                    <i class="ace-icon fa fa-flag bigger-110"></i>
                                                    Update
                                                </button>
                                            </span>
                                            </div>

                                            @if ($errors->has('txtslug')) <p
                                                class="help-block">{{ $errors->first('txtslug') }}</p> @endif
                                        </div>
                                    </div>

                                    <div class="form-group ">
                                        {!!Form::label('aliase','Aliase',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::text('txtaliase',old('txtaliase',$content->aliase),['class' => 'form-control'])!!}

                                        </div>
                                    </div>
                                    <div class="form-group">
                                        {!!Form::label('contentcategory','Category',['class' => 'col-sm-3 control-label no-padding-right required'])!!}
                                        <div class="col-sm-5">
                                            {{--{!!Form::select('contentcategory',$contentCategory,old('contentcategory',$content->category_id),['class' => 'form-control'])!!}--}}
                                            <select class="form-control" name="contentcategory">
                                                <option value="">Please Select Category</option>
                                                {!! CommonFunction::generateSubCagetoryCombobox(0,'',$content->category_id)!!}
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group @if($errors->has('featuredfile')) has-error @endif">
                                        {!!Form::label('featuredfile','Featured Image',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::file('featuredfile',['id' =>'featuredfile'])!!}
                                            @if ($errors->has('featuredfile')) <p
                                                class="help-block">{{ $errors->first('featuredfile') }}</p> @endif
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        {!!Form::label('shortdesc','Brief',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::textarea('shortdesc',old('shortdesc',$content->short_desc),['rows' => 5,'class' => 'form-control'])!!}
                                        </div>
                                    </div>


                                    <div class="form-group">
                                        {!!Form::label('','Body',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <section id="frm-entry" class="col-sm-7 no-padding-left no-padding-right">
                                            @foreach($content->getContentEntry as $item)
                                                @if($item->type=='text')
                                                    @include('backend.shared._entryform.addtext', ['entryid' => $item->ordering,'entrytext' => $item->body,'record_id' => $item->id,'entrytitle' => $item->title ] )
                                                @elseif($item->type == 'image')
                                                    @include('backend.shared._entryform.addimage',['entryid' => $item->ordering,'record_id' => $item->id])
                                                    @php
                                                        $imagarr[$item->ordering] = $item->body
                                                    @endphp

                                                @endif
                                            @endforeach
                                            @if($content->date_event != '')
                                                @include('backend.shared._entryform.addEventTime',['date_event' => $content->date_event,'id' => $content->id])
                                            @endif
                                            <div id="loader"></div>
                                        </section>
                                        {!!Form::hidden('entrycount',$content->getContentEntry->max('ordering'),['id' => 'entrycount'])!!}
                                    </div>
                                    <div class="form-group">
                                        {!!Form::label('','Add New Entry',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-9" id="btn-entry-form">
                                            <a class="btn btn-info add-entry-frm" href="javascript:void(0)"
                                               id="entry-text" data-type="text">
                                                <i class="ace-icon fa fa-file-text align-top bigger-125"></i>
                                                Description
                                            </a>
                                            <a class="btn btn-info add-entry-frm" href="javascript:void(0)"
                                               id="entry-image" data-type="image">
                                                <i class="ace-icon fa fa-picture-o align-top bigger-125"></i>
                                                Image
                                            </a>
                                            <a class="btn btn-info add-entry-frm" href="javascript:void(0)"
                                               id="entry-event" data-type="date">
                                                <i class="ace-icon fa fa-calendar align-top bigger-125"></i>
                                                Event Time
                                            </a>
                                            <a class="btn btn-info add-entry-frm" href="javascript:void(0)"
                                               id="entry-youtube" data-type="youtube">
                                                <i class="ace-icon fa fa-youtube-play  align-top bigger-125"></i>
                                                Youtube
                                            </a>
                                            <a class="btn btn-info add-entry-frm" href="javascript:void(0)"
                                               id="entry-facebook" data-type="facebook">
                                                <i class="ace-icon fa fa-facebook  align-top bigger-125"></i>
                                                Facebook
                                            </a>
                                            <a class="btn btn-info add-entry-frm" href="javascript:void(0)"
                                               id="entry-gallery" data-type="gallery">
                                                <i class="ace-icon fa fa-th-large  align-top bigger-125"></i>
                                                Gallery
                                            </a>

                                        </div>
                                    </div>
                                    <div class="form-group">
                                        {!!Form::label('tagskey','Tags Key',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::text('txttagskey',old('txttagskey',$content->tags),['class' => 'form-control','id' => 'txttagskey'])!!}
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        {!!Form::label('status','Publish',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-1">
                                            <label>
                                                <input name="chkstatus" class="ace ace-switch ace-switch-4 btn-flat"
                                                       type="checkbox" @if($content->status ==1) checked @endif >
                                                <span class="lbl"></span>
                                            </label>
                                        </div>

                                        <div class="col-sm-2">
                                            <label>
                                                Front Page
                                                <input name="chkfeatured" class="ace ace-switch ace-switch-4 btn-flat"
                                                       type="checkbox" @if($content->is_featured ==1) checked @endif >
                                                <span class="lbl"></span>
                                            </label>
                                        </div>
                                    </div>

                                    <hr/>
                                    <div class="form-group">
                                        {!!Form::label('metakey','Meta Key',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::text('txtmetakey',old('txtmetakey',$content->meta_key),['class' => 'form-control','id' => 'metakeyword'])!!}
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        {!!Form::label('metadesc','Meta Description',['class' => 'col-sm-3 control-label no-padding-right'])!!}
                                        <div class="col-sm-5">
                                            {!!Form::text('txtmetadesc',old('txtmetadesc',$content->meta_desc),['class' => 'form-control'])!!}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {!!Form::close()!!}
@endsection
@push('css_plugin')
    <link rel="stylesheet" href="{{ asset('backend/assets/css/daterangepicker.css') }}"/>
    <link href="{{asset('backend/assets/fileinput/css/fileinput.css')}}" media="all" rel="stylesheet" type="text/css"/>
    <link href="{{asset('backend/assets/fileinput/themes/explorer-fas/theme.css')}}" media="all" rel="stylesheet"
          type="text/css"/>
@endpush
@push('css')
    <style>
        .tags {
            width: 100%;
        }

        #frm-entry {
            min-height: 180px;
        }

        /* Center the loader */
        #loader {
            position: absolute;
            left: 50%;
            /* top: 50%;*/
            bottom: 0px;
            z-index: 100;
            width: 150px;
            height: 150px;
            margin: -75px 0 0 -75px;
            border: 10px solid #f3f3f3;
            border-radius: 50%;
            border-top: 10px solid #3498db;
            width: 80px;
            height: 80px;
            -webkit-animation: spin 2s linear infinite;
            animation: spin 2s linear infinite;
            background-color: #eee;
        }

        @-webkit-keyframes spin {
            0% {
                -webkit-transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
            }
        }

        @keyframes spin {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(360deg);
            }
        }

        /* Add animation to "page content" */
        .animate-bottom {
            position: relative;
            -webkit-animation-name: animatebottom;
            -webkit-animation-duration: 1s;
            animation-name: animatebottom;
            animation-duration: 1s
        }

        @-webkit-keyframes animatebottom {
            from {
                bottom: -100px;
                opacity: 0
            }
            to {
                bottom: 0px;
                opacity: 1
            }
        }

        @keyframes animatebottom {
            from {
                bottom: -100px;
                opacity: 0
            }
            to {
                bottom: 0;
                opacity: 1
            }
        }

        .entry-frm-remove .ace-icon {
            color: #fff;
        }

        .entry-frm-remove .ace-icon:hover {
            color: #ffcccc;
        }

        .alert {
            padding: 10px;
            margin-bottom: 0px;
            border: 1px solid transparent;
            border-radius: 4px;
        }
    </style>
@endpush

@push('jslink')

    <script type="text/javascript" src="{{ asset('vendor/jsvalidation/js/jsvalidation.js')}}"></script>
    <script src="{{asset('backend/assets/js/bootstrap-tag.js')}}"></script>
    <script src="{{asset('backend/assets/js/jquery.ui.touch-punch.js')}}"></script>
    <script src="{{ asset('backend/assets/js/date-time/moment.js') }}"></script>
    <script src="{{ asset('backend/assets/js/date-time/bootstrap-datepicker.js') }}"></script>
    <script src="{{ asset('backend/assets/js/date-time/daterangepicker.js') }}"></script>

    <script src="{{asset('backend/assets/fileinput/js/fileinput.js')}}" type="text/javascript"></script>
    <script src="{{asset('backend/assets/fileinput/themes/fas/theme.js')}}" type="text/javascript"></script>

@endpush

@push('jsscript')

    @include('backend.shared._tinymce',['textarea' => '.bodydesc'])
    {!!JsValidator::formRequest('App\Http\Requests\ContentRequest', '#my-form')!!}
    <script type="text/javascript">
        jQuery(document).ready(function () {
            @if ($content->date_event != '')
            $(this).find("#entry-event").addClass("disabled");
            @endif
            tinymce.init(loadtinymce);
            $('.viewimage').ace_file_input({
                style: 'well',
                btn_choose: 'Drop files here or click to choose',
                btn_change: null,
                no_icon: 'ace-icon fa fa-cloud-upload',
                droppable: true,
                thumbnail: 'fit', //small | fit
                maxSize: 2000000,
                allowExt: ['jpg', 'jpeg', 'png', 'gif', 'tif', 'tiff', 'bmp'],
                allowMime: ['image/jpg', 'image/jpeg', 'image/png', 'image/gif', 'image/tif', 'image/tiff', 'image/bmp'] //html5 browsers only
            });
            $('.widget-container-col').sortable({
                connectWith: '.widget-container-col',
                items: '> .widget-box',
                handle: ace.vars['touch'] ? '.widget-header' : false,
                cancel: '.fullscreen',
                opacity: 0.8,
                revert: true,
                forceHelperSize: true,
                placeholder: 'widget-placeholder',
                forcePlaceholderSize: true,
                tolerance: 'pointer',
                cursor: 'move',
                start: function (e, ui) {
                    $(ui.item).find('textarea').each(function () {
                        tinymce.execCommand('mceRemoveEditor', false, $(this).attr('id'));
                    });
                },
                stop: function (e, ui) {
                    $(ui.item).find('textarea').each(function () {
                        tinymce.execCommand('mceAddEditor', true, $(this).attr('id'));
                    });
                }
            });
            $('.widget-container-col input').bind('click.sortable mousedown.sortable', function (ev) {
                ev.target.focus();
            });
            document.getElementById("loader").style.display = "none";
            $('#featuredfile').ace_file_input('show_file_list', [{
                type: 'image',
                name: '{{asset("storage/".$content->image)}}'
            }]);
            @if (isset($imagarr))
            @foreach($imagarr as $key => $value)
            $('#moreimage_{{$key}}').ace_file_input('show_file_list', [{
                type: 'image',
                name: '{{asset("storage/".$value)}}'
            }]);
            @endforeach
            @endif
            entryRemoveFrm();
        });

        /*var form = document.getElementById("my-form");
        document.getElementById("btnapply").addEventListener("click", function () {
          hiddeninput = '<input type="hidden" value="apply" name="btnapply"/>';
          $('.page-header').append(hiddeninput);
          form.submit();
        });
        */
        $('#featuredfile').ace_file_input({
            style: 'well',
            btn_choose: 'Drop files here or click to choose',
            btn_change: null,
            no_icon: 'ace-icon fa fa-cloud-upload',
            droppable: true,
            thumbnail: 'fit', //small | fit
            maxSize: 2000000,
            allowExt: ['jpg', 'jpeg', 'png', 'gif', 'tif', 'tiff', 'bmp'],
            allowMime: ['image/jpg', 'image/jpeg', 'image/png', 'image/gif', 'image/tif', 'image/tiff', 'image/bmp'], //html5 browsers only


        }).on('file.error.ace', function (event, info) {
            if (info.error_count['size']) {
                Swal(
                    'Information!',
                    'Your file is big 2MB.',
                    'info'
                )
            } else if (info.error_count['ext']) {
                Swal(
                    'Information!',
                    'Your file invalid extension',
                    'info'
                )
            }
            event.preventDefault();
        });
        var tag_input = $('#metakeyword,#txttagskey');
        tag_input.tag(
            {
                placeholder: tag_input.attr('placeholder'),
            }
        );
        $('#new-slug').on('click', function () {
            var slug = slugify($('input#name').val());
            $('#slug').val(slug);
        });
        $('.add-entry-frm').on('click', function (e) {
            e.preventDefault();
            type = $(this).data('type');
            entryid = $('#entrycount').val();
            $.ajax({
                url: '{{ url(_ADMIN_PREFIX_URL."/addnewform")}}',
                type: "GET",
                data: {type, entryid},
                dataType: "json",
                beforeSend: function () {
                    document.getElementById("loader").style.display = "block";
                },
                success: function (data) {
                    $('#frm-entry').append(data.loadform).ready(function () {

                        if (type === 'text') {
                            tinymce.init(loadtinymce);
                        } else if (type === 'image') {
                            $('.viewimage').ace_file_input({
                                style: 'well',
                                btn_choose: 'Drop files here or click to choose',
                                btn_change: null,
                                no_icon: 'ace-icon fa fa-cloud-upload',
                                droppable: true,
                                thumbnail: 'fit', //small | fit
                                maxSize: 2000000,
                                allowExt: ['jpg', 'jpeg', 'png', 'gif', 'tif', 'tiff', 'bmp'],
                                allowMime: ['image/jpg', 'image/jpeg', 'image/png', 'image/gif', 'image/tif', 'image/tiff', 'image/bmp'] //html5 browsers only
                            });
                        } else if (type === 'date') {
                            $('input[name=date-range-picker]').daterangepicker({
                                'applyClass': 'btn-sm btn-success',
                                'cancelClass': 'btn-sm btn-default',
                                locale: {
                                    applyLabel: 'Apply',
                                    cancelLabel: 'Cancel',
                                }
                            });
                            $(this).find("#entry-event").addClass("disabled");
                        } else if (type === 'gallery') {

                            entryGallery();
                            $(this).find("#entry-gallery").addClass("disabled");
                        }
                        $('.widget-container-col').sortable({
                            connectWith: '.widget-container-col',
                            items: '> .widget-box',
                            handle: ace.vars['touch'] ? '.widget-header' : false,
                            cancel: '.fullscreen',
                            opacity: 0.8,
                            revert: true,
                            forceHelperSize: true,
                            placeholder: 'widget-placeholder',
                            forcePlaceholderSize: true,
                            tolerance: 'pointer',
                            cursor: 'move',
                            start: function (e, ui) {
                                $(ui.item).find('textarea').each(function () {
                                    tinymce.execCommand('mceRemoveEditor', false, $(this).attr('id'));
                                });
                            },
                            stop: function (e, ui) {
                                $(ui.item).find('textarea').each(function () {
                                    tinymce.execCommand('mceAddEditor', true, $(this).attr('id'));
                                });
                            }
                        });
                        $('.widget-container-col input').bind('click.sortable mousedown.sortable', function (ev) {
                            ev.target.focus();
                        });
                    });
                    $('#entrycount').val(data.entryid);
                },
                complete: function () {

                    document.getElementById("loader").style.display = "none";
                    entryRemoveFrm();
                },
            });
        });
        $('.widget-container-col').disableSelection();

        function entryGallery() {
            var tCaption = '\n<div class="file-caption form-control" tabindex="500">\n' +
                '  <input class="file-caption-name"  value="{caption}" name="gallerycaptions[]">\n' +
                '</div>\n\n {indicator}\n{actions}\n';
            $('#kv-explorer').fileinput({
                theme: 'fas',
                uploadUrl: '#',
                uploadAsync: false,
                overwriteInitial: false,
                initialPreviewAsData: true,
                showUpload: false,
                showCancel: false,
                maxFileSize: 1024,
                previewFileType: "image",
                allowedFileExtensions: ["jpg", "jpeg", "gif", "png"],
                layoutTemplates: {footer: tCaption},
                fileActionSettings: {
                    showUpload: false,
                    showZoom: false
                }

            });
            $('.file-caption input').bind('click.fileinput mousedown.fileinput', function (ev) {
                ev.target.focus();
            });
        }

        function entryRemoveFrm() {
            $('.entry-frm-remove').on('click', function () {
                Swal({
                    title: 'Are you sure?',
                    text: "You won't be able to revert this!",
                    type: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes, remove it!'
                }).then((result) => {
                    if (result.value) {

                        $oldvalue = $('#entrycount').val();
                        $recordID = $(this).data('entryid');
                        $istype = $(this).data('type');
                        $.ajax({
                            url: '{{ url(_ADMIN_PREFIX_URL."/deleteform")}}',
                            type: "GET",
                            data: {recordid: $recordID, istype: $istype},
                            dataType: "json",
                            beforeSend: function () {
                                document.getElementById("loader").style.display = "block";
                            },
                            success: function (data) {
                                if (data) {
                                    document.getElementById("loader").style.display = "none";
                                    $('#entrycount').val(parseInt($oldvalue) - 1);
                                    Swal(
                                        'Removed!',
                                        'Your file has been removeed.',
                                        'success'
                                    )
                                }
                            },
                        });
                        $(this).parent('.widget-toolbar').parent('.widget-header').parent('.widget-box').parent('.widget-container-col').fadeOut("slow", function () {
                            $(this).remove();
                        });
                    }
                })
            });
            $('.entry-frm-delete-date').on('click', function () {
                Swal({
                    title: 'Are you sure?',
                    text: "You won't be able to revert this!",
                    type: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes, remove it!'
                }).then((result) => {
                    if (result.value) {
                        id = $(this).data('recordid');
                        $.ajax({
                            url: '{{ url(_ADMIN_PREFIX_URL."/deleteDate")}}',
                            type: "POST",
                            data: {id: id},
                            dataType: "json",
                            beforeSend: function () {
                                document.getElementById("loader").style.display = "block";
                            },
                            success: function (data) {
                                if (data.status) {
                                    Swal(
                                        'Removed!',
                                        'Your file has been removeed.',
                                        'success'
                                    );
                                    document.getElementById("loader").style.display = "none";
                                }
                            },
                        });
                        $(this).parent('.widget-toolbar').parent('.widget-header').parent('.widget-box').parent('.widget-container-col').fadeOut("slow", function () {
                            $(this).remove();
                            $("#entry-event").removeClass("disabled");
                            $("#entry-gallery").removeClass("disabled");
                        });
                        Swal(
                            'Removed!',
                            'Your date has been removeed.',
                            'success'
                        )
                    }
                })
            })

        }

        $('div.alert').not('.alert-important').delay(6000).fadeOut(350);

    </script>

@endpush