@extends('layouts.app')

@push('head-script')
    <link rel="stylesheet" href="{{ asset('assets/node_modules/clockpicker/dist/jquery-clockpicker.min.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/node_modules/jquery-asColorPicker-master/css/asColorPicker.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/node_modules/switchery/dist/switchery.min.css') }}">

@endpush

@section('content')

    <div class="row">
        <div class="col-12">
            <!-- Card -->
            <form action="" class="ajax-form" id="createForm" method="POST">
                @csrf
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6 mb-4">
                                <div class="example">
                                    <h5 class="box-title">@lang('modules.themeSettings.themePrimaryColor')</h5>
                                    <input type="text" name="primary_color" class="gradient-colorpicker form-control" autocomplete="off" value="{{ $adminTheme->primary_color }}" />
                                </div>

                            </div>

                            <div class="col-md-12 mb-4">
                                <h5 class="box-title">@lang('modules.themeSettings.adminPanelCustomCss')</h5>
                                <textarea name="admin_custom_css" class="my-code-area" rows="20" style="width: 100%">@if(is_null($adminTheme->admin_custom_css))/*Enter your custom css after this line*/@else {!! $adminTheme->admin_custom_css !!} @endif</textarea>

                            </div>

                            <div class="col-md-12">
                                <h5 class="box-title">@lang('modules.themeSettings.frontSiteCustomCss')</h5>
                                <textarea name="front_custom_css" class="my-code-area" rows="20" style="width: 100%">@if(is_null($adminTheme->front_custom_css))/*Enter your custom css after this line*/@else {!! $adminTheme->front_custom_css !!} @endif</textarea>
                                
                            </div>
                            <div class="col-md-6 mt-2">
                            <div class="form-group">
                                <label
                                    class="control-label">@lang('app.enableRtl')
                                 </label>
                                <div class="switchery-demo">
                                    <input type="checkbox" id="rtl" name="rtl"
                                        @if($adminTheme->rtl == true) checked
                                    @endif class="js-switch rtl" data-color="#00c292"
                                    data-secondary-color="#f96262"/>
                                </div>
                             </div>
                            </div>
                             <div class="col-md-6 mt-2">
                             <div class="form-group">
                                <label
                                    class="control-label">@lang('app.disableFrontend')
                                 </label>
                                <div class="switchery-demo">
                                    <input type="checkbox" name="disable_frontend" id="frontend_disable"
                                     class="js-switch disable" data-color="#00c292"
                                    data-secondary-color="#f96262" value="1" @if($global->disable_frontend == 1) checked
                                    @endif />
                                </div>
                             </div>
                            </div>

                            <div class="col-md-6 mt-2" id="homepage" @if($global->frontend_disable == 1)
                                style="display:none"
                                @endif>
                                <div class="form-group" >
                                   <label
                                       class="control-label">@lang('app.setHomePage')
                                    </label>
                                   <div class="switchery-demo">
                                       <input type="checkbox" name="setup_homepage"
                                        class="js-switch" id="setup_homepage" data-color="#00c292"
                                       data-secondary-color="#f96262" value="1" @if($global->setup_homepage == 1) checked
                                       @endif />
                                   </div>
                                </div>
                                <div id="custom_url">
                                <label for="">@lang('menu.customUrl')</label>
                                                <div class="form-group">
                                                    <input type="text" class="form-control" value="{{ $global->custom_homepage_url }}" name="custom_homepage_url" id="custom_homepage_url" placeholder="@lang('app.customUrlExammple')">
                                                </div>
                                            </div>
                               </div>
                            <div class="col-md-12 mt-4">
                                <button class="btn btn-success" id="save-form" type="button"><i class="fa fa-check"></i> @lang('app.save')</button>
                            </div>
                        </div>
                    </div>
                </div>

            </form>
        </div>
    </div>
@endsection

@push('footer-script')
    <script src="{{ asset('assets/node_modules/jquery-asColorPicker-master/libs/jquery-asColor.js') }}"></script>
    <script src="{{ asset('assets/node_modules/jquery-asColorPicker-master/libs/jquery-asGradient.js') }}"></script>
    <script src="{{ asset('assets/node_modules/jquery-asColorPicker-master/dist/jquery-asColorPicker.min.js') }}"></script>

    <script src="{{ asset('assets/ace/ace.js') }}"></script>
    <script src="{{ asset('assets/ace/theme-twilight.js') }}"></script>
    <script src="{{ asset('assets/ace/mode-css.js') }}"></script>
    <script src="{{ asset('assets/ace/jquery-ace.min.js') }}"></script>
<script src="{{ asset('assets/node_modules/switchery/dist/switchery.min.js') }}"></script>

    <script>
        // Switchery
        var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch'));
    $('.js-switch').each(function () {
        new Switchery($(this)[0], $(this).data());

    });
        $('.my-code-area').ace({ theme: 'twilight', lang: 'css' })

        // Colorpicker
        $(".colorpicker").asColorPicker();
        $(".complex-colorpicker").asColorPicker({
            mode: 'complex'
        });
        $(".gradient-colorpicker").asColorPicker(
            // {
            //     mode: 'gradient'
            // }
        );

    $('#frontend_disable').change(function () {
        $('#homepage').toggle();
    })


        $('#save-form').click(function () {
            $.easyAjax({
                url: '{{route('superadmin.theme-settings.store')}}',
                container: '#createForm',
                data: $('#createForm').serialize(),
                type: "POST",
                redirect: true
            })
        });
        //rtl
        $('.rtl').change(function () {
        var rtl  = $('.rtl').is(':checked');
        $.easyAjax({
            url: '{{route('superadmin.theme-settings.rtlTheme')}}',
            type: "POST",
            data: {'_token': '{{ csrf_token() }}', 'rtl': rtl}
        })
        return false;
    });

    $('.disable').change(function () {
        let disable_frontend = $(this).is(':checked') ? 1 : 0; 

        $.easyAjax({
            url: '{{route('superadmin.theme-settings.disableFrontend')}}',
            type: "POST",
            data: {'_token': '{{ csrf_token() }}', 'disable_frontend': disable_frontend}
        })
    });
$(function(){
  
    $('#setup_homepage').change(function () {
        let custom = $(this).is(':checked') ? 1 : 0; 
        if (custom == 1) {
            $("#custom_url").show()
        } 
        else{
            $("#custom_url").hide()
        }
    })
    @if($global->setup_homepage == 1)
    ("#custom_url").show()
    @else
    $("#custom_url").hide()
    @endif
    });

    </script>
@endpush