@extends('admin.app')
@section('content')
    <div class="app-content content">
        <div class="content-overlay"></div>
        <div class="header-navbar-shadow"></div>
        <div class="content-wrapper">
            <div class="content-header row">
            </div>
            <div class="content-body">
                <div class="card">
                    <div class="card-header">
                        <h2>Özel CSS | JS</h2>
                    </div>
                    <div class="card-body">
                        <form id="colors-form">
                            {{csrf_field()}}
                            <div class="row">
                                <div class="col-6">
                                    <label>CSS</label>
                                    <textarea class="form-control" name="custom-css">{!! config('mio.custom-css') !!}</textarea>
                                </div>
                                <div class="col-6">
                                    <label>Site Head Bölümü JS</label>
                                    <textarea class="form-control" name="custom-js-head">{!! config('mio.custom-js-head') !!}</textarea>
                                </div>
                                <div class="col-6">
                                    <label>Site Footer Bölümü JS</label>
                                    <textarea class="form-control" name="custom-js-footer">{!! config('mio.custom-js-footer') !!}</textarea>
                                </div>
                                <div class="col-12">
                                    <div class="form-group pt-1">
                                        <button type="button" id="save-colors-button" class="btn btn-gradient-light gradient-light-success">Kaydet</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @endsection
@section('css')

    <link rel="stylesheet" type="text/css" href="{{asset('app-assets/css/plugins/extensions/toastr.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('app-assets/vendors/css/vendors.min.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('app-assets/vendors/css/extensions/toastr.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('app-assets/vendors/css/forms/select/select2.min.css')}}">
@endsection
@section('js')

    <!-- BEGIN: Page Vendor JS-->
    <script src="{{asset('app-assets/vendors/js/ui/jquery.sticky.js')}}"></script>
    <script src="{{asset('app-assets/vendors/js/extensions/toastr.min.js')}}"></script>
    <!-- END: Page Vendor JS-->
    <!-- BEGIN: Page JS-->
    <script src="{{asset('app-assets/js/scripts/extensions/toastr.js')}}"></script>
    <!-- END: Page JS-->

    <!-- BEGIN: Page JS-->
    <script src="{{asset('app-assets/vendors/js/forms/select/select2.full.min.js')}}"></script>
    <script src="{{asset('app-assets/js/scripts/forms/select/form-select2.js')}}"></script>
    <!-- END: Page JS-->
    <script>
        $('#color_template').on('change',function () {
           $('.change-primary').val($(this).children('option:selected').attr('data-color'));
           $('.change-font').val($(this).children('option:selected').attr('data-fonts'));
           $('.change-menu').val($(this).children('option:selected').attr('data-menu'));
        });
        $('#save-colors-button').on('click',function () {
           $.post('{{route('design-save-colors')}}',$('#colors-form').serialize(),function (response) {
                if(response.status == 'success'){
                    toastr.success('Güncellendi.', 'Başarılı!', { positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right' });
                }else{
                    toastr.warning('Footer ve Copyright değiştirilemez!', 'Başarısız!', { positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right' });
                }
           }).fail(function () {
               toastr.warning('Güncellenemedi.', 'Başarısız!', { positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right' });
           });
        });
    </script>
    @endsection