@extends('backends.master')

@section('content')

<div class="container-fluid main-content">
    <div class="panel panel-default">
        <div class="panel-heading font-weight-bold text-uppercase"><h4><strong>Config</strong></h4></div>
        <div class="panel-body">
            <div class="col-md-6" style="margin: 0px auto;">
                <div class="form-group clearfix">
                    <div class="col-md-12"><label class="font-weight-bold">Email</label></div>
                    <div class="col-md-12">
                        {!! Form::text('email_about_us', old('email_about_us', isset($email_about_us) ? $email_about_us : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="email_about_us-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group col-md-12">
                    <label class="font-weight-bold">Email Comment ( Thêm nhiều email cách nhau bởi dấu phẩy )</label>
                    <input name="email_comment" type="text" class="form-control" value="{{ isset($email_comment) ? $email_comment : '' }}"> 
                    <p class="alert-email alert-errors"></p>
                </div>
                <div class="form-group col-md-12">
                    <label class="font-weight-bold">Từ Tục tĩu ( Thêm nhiều Từ Tục tĩu cách nhau bởi dấu phẩy )</label>
                    <textarea name="keywords_not_good" class="form-control" rows="3" cols="40" placeholder="Từ Tục tĩu">{{ isset($keywords_not_good) ? $keywords_not_good : '' }}</textarea>
                    <p class="alert-keywords_not_good alert-errors"></p>
                </div>
                <div class="form-group clearfix hidden">
                    <div class="col-md-12"><label class="font-weight-bold">Link app</label></div>
                    <div class="col-md-12">
                        {!! Form::text('link_app', old('link_app', isset($link_app) ? $link_app : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="link_app-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group clearfix">
                    <div class="col-md-12"><label class="font-weight-bold">Link app android</label></div>
                    <div class="col-md-12">
                        {!! Form::text('link_app_android', old('link_app_android', isset($link_app_android) ? $link_app_android : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="link_app_android-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group clearfix">
                    <div class="col-md-12"><label class="font-weight-bold">Link app ios</label></div>
                    <div class="col-md-12">
                        {!! Form::text('link_app_ios', old('link_app_ios', isset($link_app_ios) ? $link_app_ios : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="link_app_ios-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group clearfix" style="display: none">
                    <div class="col-md-12"><label class="font-weight-bold">City Number</label></div>
                    <div class="col-md-12">
                        {!! Form::number('city_number', old('city_number', isset($city_number) ? $city_number : ''), ['class' => 'form-control', 'min' => 0]) !!}
                        <p class="alert-errors" id="city_number-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group clearfix">
                    <div class="col-md-12"><label class="font-weight-bold">Copyright</label></div>
                    <div class="col-md-12">
                        {!! Form::text('copyright', old('copyright', isset($copyright) ? $copyright : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="copyright-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
            </div>
            <div class="col-md-6" style="margin: 0px auto;">
                <div class="form-group clearfix news">
                    <div class="col-md-12">
                        <label class="font-weight-bold">News</label> 
                        <input type="hidden" name="switch-news-status" value="{{ $news_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($news_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($news_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix faqs"  style="display: none">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Faqs</label> 
                        <input type="hidden" name="switch-faqs-status" value="{{ $faqs_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($faqs_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($faqs_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix about">
                    <div class="col-md-12">
                        <label class="font-weight-bold">About</label> 
                        <input type="hidden" name="switch-about-status" value="{{ $about_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($about_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($about_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix ads_show" style="display: none">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Show Ads</label> 
                        <input type="hidden" name="switch-ads_show-status" value="{{ $ads_show_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($ads_show_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($ads_show_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix banner_app">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Banner app</label> 
                        <input type="hidden" name="switch-banner_app-status" value="{{ $banner_app_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($banner_app_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($banner_app_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix facebook" style="display: none">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Facebook</label> 
                        <input type="hidden" name="switch-facebook-status" value="{{ $facebook_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($facebook_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($facebook_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                    <div class="col-md-12">
                        {!! Form::text('facebook', old('facebook', isset($facebook) ? $facebook : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="facebook-error" role="alert" style="display: none;"></p>
                    </div>
                </div>

                <div class="form-group clearfix google"  style="display: none">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Google Plus</label> 
                        <input type="hidden" name="switch-google-status" value="{{ $google_plus_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($google_plus_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($google_plus_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                    <div class="col-md-12">
                        {!! Form::text('google_plus', old('google_plus', isset($google_plus) ? $google_plus : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="google_plus-error" role="alert" style="display: none;"></p>
                    </div>
                </div>

                <div class="form-group clearfix twitter"  style="display: none">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Twitter</label> 
                        <input type="hidden" name="switch-twitter-status" value="{{ $twitter_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($twitter_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($twitter_status == 0) active @endif">OFF</span>
                        </div>  
                    </div>
                    <div class="col-md-12">
                        {!! Form::text('twitter', old('twitter', isset($twitter) ? $twitter : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="twitter-error" role="alert" style="display: none;"></p>
                    </div>
                </div>

                <div class="form-group clearfix youtube"  style="display: none">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Youtube</label> 
                        <input type="hidden" name="switch-youtube-status" value="{{ $youtube_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($youtube_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($youtube_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                    <div class="col-md-12">
                        {!! Form::text('youtube', old('youtube', isset($youtube) ? $youtube : ''), ['class' => 'form-control']) !!}
                        <p class="alert-errors" id="youtube-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group clearfix static_background">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Static Background</label> 
                        <input type="hidden" name="switch-static_background-status" value="{{ $static_background_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($static_background_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($static_background_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                    <div class="col-md-12">
                        {!! Form::color('static_background', old('static_background', isset($static_background) ? $static_background : ''), ['class' => 'form-control', 'style' => 'width:10%; padding: 0;cursor: pointer;']) !!}
                        <p class="alert-errors" id="static_background-error" role="alert" style="display: none;"></p>
                    </div>
                </div>
                <div class="form-group clearfix banner_top">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Ads top</label> 
                        <input type="hidden" name="switch-banner_top-status" value="{{ $banner_top_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($banner_top_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($banner_top_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix banner_mid">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Ads mid</label> 
                        <input type="hidden" name="switch-banner_mid-status" value="{{ $banner_mid_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($banner_mid_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($banner_mid_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix banner_bottom">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Ads bottom</label> 
                        <input type="hidden" name="switch-banner_bottom-status" value="{{ $banner_bottom_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($banner_bottom_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($banner_bottom_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
                <div class="form-group clearfix banner_fixed_right">
                    <div class="col-md-12">
                        <label class="font-weight-bold">Ads fixed right</label> 
                        <input type="hidden" name="switch-banner_fixed_right-status" value="{{ $banner_fixed_right_status }}">
                        <div class="toggle-switch time">
                            <span data-id="1" class="@if($banner_fixed_right_status == 1) active @endif">ON</span>
                            <span data-id="0" class="@if($banner_fixed_right_status == 0) active @endif">OFF</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-12">
                <div class="form-group">
                    <div class="text-center">
                        <button class="btn btn-primary" id="save-change">Save</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="ajax_waiting"></div>
<script>
    var errorConnect = 'Errors network';

    $(".facebook" ).on( "click",".toggle-switch.time span", function() {
        $('.facebook .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-facebook-status]').val($(this).attr('data-id'));
    });

    $(".google" ).on( "click",".toggle-switch.time span", function() {
        $('.google .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-google-status]').val($(this).attr('data-id'));
    });

    $(".youtube" ).on( "click",".toggle-switch.time span", function() {
        $('.youtube .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-youtube-status]').val($(this).attr('data-id'));
    });

    $(".static_background" ).on( "click",".toggle-switch.time span", function() {
        $('.static_background .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-static_background-status]').val($(this).attr('data-id'));
    });

    $(".twitter" ).on( "click",".toggle-switch.time span", function() {
        $('.twitter .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-twitter-status]').val($(this).attr('data-id'));
    });

    $(".news" ).on( "click",".toggle-switch.time span", function() {
        $('.news .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-news-status]').val($(this).attr('data-id'));
    });

    $(".faqs" ).on( "click",".toggle-switch.time span", function() {
        $('.faqs .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-faqs-status]').val($(this).attr('data-id'));
    });

    $(".about" ).on( "click",".toggle-switch.time span", function() {
        $('.about .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-about-status]').val($(this).attr('data-id'));
    });

    $(".ads_show" ).on( "click",".toggle-switch.time span", function() {
        $('.ads_show .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-ads_show-status]').val($(this).attr('data-id'));
    });

    $(".banner_top" ).on( "click",".toggle-switch.time span", function() {
        $('.banner_top .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-banner_top-status]').val($(this).attr('data-id'));
    });

    $(".banner_mid" ).on( "click",".toggle-switch.time span", function() {
        $('.banner_mid .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-banner_mid-status]').val($(this).attr('data-id'));
    });

    $(".banner_bottom" ).on( "click",".toggle-switch.time span", function() {
        $('.banner_bottom .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-banner_bottom-status]').val($(this).attr('data-id'));
    });

    $(".banner_fixed_right" ).on( "click",".toggle-switch.time span", function() {
        $('.banner_fixed_right .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-banner_fixed_right-status]').val($(this).attr('data-id'));
    });

    $(".banner_app" ).on( "click",".toggle-switch.time span", function() {
        $('.banner_app .toggle-switch.time span').removeClass('active');
        $(this).addClass('active');
        $('input[name=switch-banner_app-status]').val($(this).attr('data-id'));
    });
    $(document).ready(function(){
        $('#save-change').click(function(){
            url = baseURL + '/admincp/config';
            var data    = {
                _method           : "POST",
                email_about_us : $('input[name=email_about_us]').val(),
                link_app : $('input[name=link_app]').val(),
                link_app_android : $('input[name=link_app_android]').val(),
                link_app_ios : $('input[name=link_app_ios]').val(),
                city_number : $('input[name=city_number]').val(),
                copyright : $('input[name=copyright]').val(),
                facebook : $('input[name=facebook]').val(),
                google_plus : $('input[name=google_plus]').val(),
                twitter : $('input[name=twitter]').val(),
                youtube : $('input[name=youtube]').val(),
                static_background : $('input[name=static_background]').val(),
                facebook_status:$('input[name=switch-facebook-status]').val(),
                google_plus_status:$('input[name=switch-google-status]').val(),
                twitter_status:$('input[name=switch-twitter-status]').val(),
                youtube_status:$('input[name=switch-youtube-status]').val(),  
                static_background_status:$('input[name=switch-static_background-status]').val(),      
                news_status:$('input[name=switch-news-status]').val(),
                faqs_status:$('input[name=switch-faqs-status]').val(),
                about_status:$('input[name=switch-about-status]').val(),
                ads_show_status:$('input[name=switch-ads_show-status]').val(),
                banner_top_status:$('input[name=switch-banner_top-status]').val(),
                banner_mid_status:$('input[name=switch-banner_mid-status]').val(),
                banner_bottom_status:$('input[name=switch-banner_bottom-status]').val(),
                banner_fixed_right_status:$('input[name=switch-banner_fixed_right-status]').val(),
                banner_app_status:$('input[name=switch-banner_app-status]').val(),
                email_comment           : $('input[name=email_comment]').val().trim(),
                keywords_not_good           : $('textarea[name=keywords_not_good]').val().trim(),
            };
 
            $.ajaxSetup({
                headers: {
                  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $.ajax({
                type: "POST",
                url: url,
                data: data,
                dataType: 'json',
                beforeSend: function(r, a){
                    $('.alert-errors').hide();
                    $(".ajax_waiting").addClass("loading");
                },
                complete: function(r, a){
                    $(".ajax_waiting").removeClass("loading");
                },
                success: function(data) {
                    if(data.status == 200){
                        $().toastmessage('showSuccessToast', data.Message);
                    }else{
                        if(data.status == 422){
                            $.each(data.responseJSON.errors, function( index, value ) {
                       
                                $('#' + index + '-error').show();
                                $('#' + index + '-error').html(value);
                            });
                            $().toastmessage('showErrorToast', 'Errors');
                        }else{
                            if(data.status == 401){
                              window.location.replace(baseURL);
                            }else{
                             $().toastmessage('showErrorToast', errorConnect);
                            }
                        }
                    }
                },
                error: function (data) {
                    $.each(data.responseJSON.errors, function( index, value ) {
                        $('#' + index + '-error').show();
                        $('#' + index + '-error').html(value);
                    });
                    $().toastmessage('showErrorToast', 'Errors');
                }
            });
        });

    });
</script>
@endsection