<?php
$translation = \DynCom\mysyde\common\classes\Registry::get("translation");
$formname    = "form_learning_list";
?>

<ul class="toolbar_menu">
    <?= button("new", $translation->get("new"), $formname, "loadCard('new_learning', true)"); ?>
</ul>

<div id="mainContent">
    <?php echo current_website_language($site, $language); ?>
    <h1><?php echo get_translation('learning_category'); ?></h1>

    <form id="<?php echo $formname; ?>" name="<?php echo $formname; ?>" method="post">
        <div class="requestLoader"></div>
        <input type="hidden" class="selected_linklist_row" name="input_learning_id" value="" />
        <div class="requestLoader"></div>
        <div id="page_linklist" class="learning_list_view">
            <?
            show_learning($site, $language);
            ?>
        </div>

    </form>

</div>
<script type="text/javascript">
    var reorderCall = null;
    var dragEnabled = false;

    function toggleDragDrop( _aTag ) {
        if (dragEnabled === false) {
            dragEnabled = true;
            $('ol.sortable').addClass("enabled");
            $('ol.sortable').nestedSortable("option", "disabled", false);
            $(_aTag).html("<?php echo $translation->get('disable_drag_drop'); ?>");
        } else {
            dragEnabled = false;
            $('ol.sortable').removeClass("enabled");
            $('ol.sortable').nestedSortable("option", "disabled", true);
            $(_aTag).html("<?php echo $translation->get('enable_drag_drop'); ?>");
        }
    }

    $('ol.sortable').nestedSortable({
        forcePlaceholderSize: true,
        handle              : '.dd-icon',
        helper              : 'clone',
        items               : 'li',
        opacity             : .6,
        placeholder         : 'placeholder',
        revert              : 250,
        tabSize             : 25,
        tolerance           : 'pointer',
        toleranceElement    : '> div',
        maxLevels           : 5,
        isTree              : true,
        expandOnHover       : 1000,
        cookieIndex         : 'nestedSortable_expanded2',
        startCollapsed      : true,
        stop                : function ( event, ui ) {
            reorder_learning();
            store_expanded();
        },
        disabled            : false
    });

    $('.disclose').click(function () {
        $(this).closest('li').toggleClass('mjs-nestedSortable-collapsed').toggleClass('mjs-nestedSortable-expanded');
        store_expanded();
    });

    function store_expanded() {
        var list = [];
        $('ol.sortable').find('li.mjs-nestedSortable-expanded').each(function () {
            list.push($(this).attr("id"));
        });
        $.cookie('nestedSortable_expanded2', list.join(','));
    }

    function reorder_learning() {
        if (reorderCall !== null) {
            reorderCall.abort();
        }

        serialized = $('ol.sortable').nestedSortable('serialize');
        arraied = $('ol.sortable').nestedSortable('toHierarchy', {startDepthCount: 0});
        var parameter = {
            list: arraied
        };
        reorderCall = jQuery.post("?action=reorder_learning", parameter, function ( output, status, xhr ) {
            if (xhr.getResponseHeader('REQUIRES_AUTH') == 1) {
                window.location.replace("/mysyde/");
            } else {
                console.log(output);
            }
        });
    }

</script>