@extends('layouts.app')
@section('title', 'TeqTank Settings | Shopping Cart')
@section('extrastyles')
    <link rel="stylesheet" href="{{ asset('/plugins/jquery-ui/jquery-ui.min.css') }}">
@endsection

@section('content')
    <div class="studio98_websters">
        <div class="ibox-title2">
            <h5>TeqTank {{ ucwords(str_replace('-',' ',$page)) }} Settings</h5>
        </div>
        <div class="ibox-content p-md">
            @include('flash::message')
            <div class="col-lg-12" id="update_shopping_cart_sidebar">
                {!! Form::open(['novalidate' => 'novalidate' , 'url' => shopping_cart_url('teq-tank/setting')]) !!}
                    <input type="hidden" name="page" value="{{ $page }}">
                    <div class="form-group">
                        {!! Form::label('menu_label','Menu Label') !!}
                        {!! Form::text('setting[menu_label]' , optional($settings)['menu_label'], ['class' => 'form-control','placeholder' => 'Menu Label','required'=>'true']) !!}
                    </div>
                    @include('Product::shopping-cart.teqtank._'.$page)
                <div class="form-group row">
                    <div class="col-lg-12">
                        <button type="submit" class="btn btn-primary ">Update</button>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>

    @include('Product::shopping-cart.teqtank._home_popup')
@endsection

@section('footer')
    <script>
        $(document).ready(function () {
            $( "#accordion" )
                .accordion({
                    header: "> div > h3"
                });

            $('#direct_placement_link').change(function () {
                $('.role_direct_link').hide();
                if($(this).val() == 'signup'){
                    $('.role_direct_link').show();
                }
            });
            @if($page == 'organization-tree')
                $('#cardViewRow button').click(function () {
                    const labelObj  = $('.card_view_label');
                    const volumeObj = $('.card_view_volume');
                    const typeObj   = $('.card_view_type');
                    var label  = labelObj.val();
                    var volume = volumeObj.val();
                    var type   = typeObj.val();

                    if(label == '') {
                        labelObj.focus();
                        return false;
                    }
                    if(volume == '') {
                        volumeObj.focus();
                        return false;
                    }

                    let html = '<tr>';

                    html += '<td>'+label+'</td>';
                    html += '<td>'+volume+'</td>';
                    html += '<td>'+type+'</td>';
                    html += '<td><a href="javascript:void(0)" class="btn btn-xs btn-danger"><i style="color: white;" class="fa fa-trash-o"></i></a></td>';

                    html += '<input type="hidden" name="card_view[label][]" value="'+label+'">';
                    html += '<input type="hidden" name="card_view[volume_id][]" value="'+volume+'">';
                    html += '<input type="hidden" name="card_view[type][]" value="'+type+'">';
                    html += '</tr>';

                    $('.cardViewTable').append(html);

                    $('.cardViewTable .btn-danger').unbind('click');
                    $('.cardViewTable .btn-danger').click(function () {
                        $(this).closest('tr').remove();
                        saveOrgPage();
                    });
                    toastrShow('Successfully saved','Success!');
                    labelObj.val('');
                    volumeObj.val('');
                    typeObj.val('boolean');
                    saveOrgPage();
                });
            $('#treeViewRow button').click(function () {
                const labelObj  = $('.tree_view_label');
                const volumeObj = $('.tree_view_volume');
                const typeObj   = $('.tree_view_type');
                var label  = labelObj.val();
                var volume = volumeObj.val();
                var type   = typeObj.val();

                if(label == '') {
                    labelObj.focus();
                    return false;
                }
                if(volume == '') {
                    volumeObj.focus();
                    return false;
                }

                let html = '<tr>';

                html += '<td>'+label+'</td>';
                html += '<td>'+volume+'</td>';
                html += '<td>'+type+'</td>';
                html += '<td><a href="javascript:void(0)" class="btn btn-xs btn-danger"><i style="color: white;" class="fa fa-trash-o"></i></a></td>';

                html += '<input type="hidden" name="tree_view[label][]" value="'+label+'">';
                html += '<input type="hidden" name="tree_view[volume_id][]" value="'+volume+'">';
                html += '<input type="hidden" name="tree_view[type][]" value="'+type+'">';
                html += '</tr>';

                $('.treeViewTable').append(html);

                $('.treeViewTable .btn-danger').unbind('click');
                $('.treeViewTable .btn-danger').click(function () {
                    $(this).closest('tr').remove();
                    saveOrgPage();
                });
                labelObj.val('');
                volumeObj.val('');
                typeObj.val('boolean');
                toastrShow('Successfully saved','Success!');
                saveOrgPage();
            });
            $('.treeViewTable .btn-danger').click(function () {
                $(this).closest('tr').remove();
                saveOrgPage();
            });
            $('.cardViewTable .btn-danger').click(function () {
                $(this).closest('tr').remove();
                saveOrgPage();
            });
           @endif
        });
        @if($page == 'home')
            function saveSection()
            {
                return reloadAjaxSubmit('create_section',"{{ shopping_cart_url('teq-tank/save-section') }}",'title','Submit');
            }
            function getSection(id) {
                $.ajax({
                    method: 'GET',
                    url: '{{ shopping_cart_url('teq-tank/section')}}/'+id
                }).done(function(data) {
                    $('#update_section .modal-body').html(data);
                    $('#update_section').modal('show');
                });
            }
            function updateSection() {
                return reloadAjaxSubmit('update_section',"{{ shopping_cart_url('teq-tank/update-section')}}",'title','Update');
            }
            function deleteSection(section_id) {
                if(confirm('Are you sure you want to delete this item and all information about it?'))
                {
                    $.ajax({
                        method: 'POST',
                        url: '{{ shopping_cart_url('teq-tank/delete-section')}}',
                        data: 'section_id='+section_id+'&_token='+csrf_token,
                    }).done(function() {
                        location.reload();
                    });
                }
            }
            function addSectionWidget(section_id)
            {
                $('#create_widget').modal('show');
                $('#create_widget input[name=section_id]').val(section_id);
            }
            function saveWidget()
            {
                return reloadAjaxSubmit('create_widget',"{{ shopping_cart_url('teq-tank/save-widget') }}",'title','Submit');
            }
            function getWidget(id) {
                $.ajax({
                    method: 'GET',
                    url: '{{ shopping_cart_url('teq-tank/widget')}}/'+id
                }).done(function(data) {
                    $('#update_widget .modal-body').html(data);
                    $('#update_widget').modal('show');
                });
            }

            function updateWidget() {
                return reloadAjaxSubmit('update_widget',"{{ shopping_cart_url('teq-tank/update-widget')}}",'title','Update');
            }
            function deleteWidget(widget_id)
            {
                if(confirm('Are you sure you want to delete this item and all information about it?'))
                {
                    $.ajax({
                        method: 'POST',
                        url: '{{ shopping_cart_url('teq-tank/delete-widget')}}',
                        data: 'widget_id='+widget_id+'&_token='+csrf_token,
                    }).done(function() {
                        location.reload();
                    });
                }
            }
        @elseif($page == 'organization-tree')
            function saveOrgPage() {
                var data = $("#update_shopping_cart_sidebar form").serialize();
                $.ajax({
                    method: 'POST',
                    url: '{{ shopping_cart_url('teq-tank/setting')}}',
                    data: data,
                }).done(function() {});
            }
        @endif
    </script>
@endsection