@extends('layouts.master')
@section('page_title', 'Menu')
@section('content')

    <div class="container" id="menu_container">
        {{ Form::page_header("Menus", "menu") }}
        <div>
            {{ Form::hidden('update_parent_sort_url', action('MenuController@update_sort'), ['id' => 'update_parent_sort_url'] ) }}
            {{ Form::hidden('update_child_sort_url', action('MenuSectionController@update_sort'), ['id' => 'update_child_sort_url'] ) }}
            {{ Form::hidden('update_grandchild_sort_url', action('MenuItemController@update_sort'), ['id' => 'update_grandchild_sort_url'] ) }}
        </div>

        <div class="row grid-header">
            {{ Form::button_ex("Add a Menu",
                "show_hide_add_btn();
                parent_list_manager.add_one(
                    '". \App\Models\Menu::add_url($business)."',
                    parent_selector.calc_new_handle_id() );", 'add_parent_btn') }}
        </div>

        <div class="row" >
            <div class="col-md-12 grey-bg curve_container" id="menu_details">
                <ul id="parent-items" class="drag-drop-ul parent-ul">
                    @foreach($menus as $menu)
                        @include('business.menu._menu', ['menu' => $menu, 'menu_sections' => $menu->_menu_section])
                    @endforeach
                    <li class="parent-li new-parent-div" id="parent_handle_"></li>
                </ul>
            </div>
        </div>
    </div>
@endsection

@section('page_script')
    @include('shared_script._list_manager')
    {!! Html::script('/js/moment.min.js') !!}
    {!! Html::script('/js/daterangepicker.js') !!}
    @include('shared_script._sortable_manager')


    <script id="document_script">

        var parent_list_manager = null;
        var child_list_manager = null;
        var grandchild_list_manager = null;
        var parent_selector = null;
        var child_selector = null;
        var grandchild_selector = null;

        $(document).ready(function () {
            parent_list_manager = new list_manager('parent', 'Menu');
            parent_list_manager.set_track_num_items({{ $menus->count() }});
            parent_list_manager.set_do_delete_function('do_delete_parent');
            parent_list_manager.set_after_load_function('do_after_load_parent');
            parent_list_manager.set_after_cancel_function('show_hide_display');
            parent_list_manager.set_after_create_function('do_after_create_parent');
            parent_list_manager.set_after_delete_function('show_hide_display');

            parent_selector = new top_level_selector();
            init_sortable ('.parent-ul', document.getElementById(parent_selector.get_sort_url()).value);

            child_list_manager = new list_manager('child', 'Menu Section');
            child_list_manager.set_do_delete_function('do_delete_child');
            child_list_manager.set_after_load_function('do_after_load_child');
            child_selector = new secondary_level_selector('child', 'parent');
            init_sortable('.child-ul', document.getElementById(child_selector.get_sort_url()).value);

            grandchild_list_manager = new list_manager('grandchild', 'Menu Item');
            grandchild_list_manager.set_do_delete_function('do_delete_grandchild');
            grandchild_list_manager.set_after_load_function('do_after_load_grandchild');
            grandchild_selector = new secondary_level_selector('grandchild', 'child');

            var menu_count = '{{$menus->count()}}';
            if (menu_count == 0) {
                document.getElementById("add_parent_btn").click();
            }
        });

    </script>
    <script id="menu_script">
        function do_after_create_parent(handle_id) {
            init_sortable ('parent-ul', document.getElementById(parent_selector.get_sort_url()).value);
            show_hide_display();
        }
        function show_hide_add_btn()
        {
            $('#menu_details').show();
            if (parent_list_manager.num_items() == 0) {
                $("#add_parent_btn").hide();
            } else {
                $("#add_parent_btn").show();
            }
        }
        function show_hide_display()
        {
            $("#add_parent_btn").show();
            if (parent_list_manager.num_items() == 0) {
                $('#menu_details').hide();
            } else {
                $('#menu_details').show();
            }
        }
        function do_after_load_parent(handle_id) {
            var checkbox = document.getElementById('prix_fixe');
            check_prix_fixe(checkbox);
            // new items...
            if (handle_id.endsWith('_'))
                scroll_to_div_top(handle_id);
        }
        function check_prix_fixe(checkbox) {
            if (checkbox.checked) {
                $('.prix-fixe-control').show();
            }else {
                $('.prix-fixe-control').hide();
            }
        }
    </script>
    <script id="menu_section_script">
        function do_after_load_child(handle_id) {
            scroll_to_div_top(handle_id);
        }

    </script>
    <script id="menu_item_script">
        function do_after_load_grandchildren(handle_id) {
            init_sortable('.grandchild-ul', document.getElementById(grandchild_selector.get_sort_url()).value);
        }

        function do_after_load_grandchild(handle_id) {
            var pk = $('#'+handle_id).attr('data-pk');
            if (pk == undefined) pk = '';
            init_daterangepicker_with_null_support("menu_item_start_date_"+pk);
            init_daterangepicker_with_null_support("menu_item_end_date_"+pk);
            var price_type_select = $('#'+handle_id).find("#price_type");
            if (price_type_select != null)
                price_type_select.change();
        }
        function on_change_price_type(selectedIndex, pk) {
            if (selectedIndex == '{{\App\Models\Menu_Item::price_type_per_item}}') { // price per item
                $('#div_price_'+pk).show();
                $('#div_price_portion_'+pk).hide();
            } else if (selectedIndex ==  '{{ \App\Models\Menu_Item::price_type_portion }}' ) { // portion pricing
                $('#div_price_'+pk).hide();
                $('#div_price_portion_'+pk).show();
            } else { // portion price
                $('#div_price_'+pk).hide();
                $('#div_price_portion_'+pk).hide();
            }
        }
    </script>
@endsection

@section('page_style')
    {!! Html::style('/css/daterangepicker.css') !!}
    {!! Html::style('/css/daterangepicker_custom.css') !!}

    <style>
        .grandchild-wrapper {
            margin-left: 30px;
        }
        .per-col {
            width: 35px;
            padding-top: 10px;
            padding-left: 5px;
        }
        .list-row {
            padding-left: 15px;
        }
    </style>
@endsection