Как перетащить горизонтальный и вертикальный как в плагине jquery?

Question

Один контейнер в другой контейнер Перетаскивание по горизонтали и вертикали как в jquery Plugin.

Каждый элемент из левого контейнера, я допускаю один уровень вложенности. Тем не менее, в правом контейнере я не хочу, чтобы он был вложен более чем во два уровня. Перетаскивание Горизонтальное и Вертикальное Перетаскивание.

function Menu_init() {

    var oldContainer;

    var group = $("ol.example").sortable({

    group: 'nested',
    exclude: '.unsortable',
    connectWith: ".example2",

    afterMove: function (placeholder, container) {
        if (oldContainer !== container) {
            if (oldContainer)
                oldContainer.el.removeClass("active");
            container.el.addClass("active");
            oldContainer = container;
        }
    },

    isValidTarget: function ($item, container) {
        var depth = 1, // Start with a depth of one (the element itself)
                maxDepth = 10,
                children = $item.find('ol').first().find('li');

        depth += container.el.parents('ol').length;

        while (children.length) {
            depth++;
            children = children.find('ol').first().find('li');
        }

        return depth <= maxDepth;
    },

    onDrop: function ($item, container, _super) {
        container.el.removeClass("active");
        _super($item, container);

        var li = $item;

        li.attr('style', 'float:left;list-style-type: none;padding: 10px;text-align: center;');

        var children = li.children().children();
        var child;
        var numOfChildren = children.length;
        containerID = container.target[0].id;
        if (containerID !== 'myUL') {
            if (numOfChildren === 1) {

                li.children('a').css({
                    'visibility': 'visible'
                });
            } else {
                for (var element in children) {
                    child = children[element].nodeName;
                    if (child === 'LI') {
                        $(children[element]).find('a').css('visibility', 'visible');
                    } else if (child === 'A') {
                        $(children[element]).css('visibility', 'visible');
                    }
                }
            }
        } else {
            li.children('a').css('visibility', 'hidden');
        }
        var data = group.sortable("serialize").get(1);
        var jsonString = JSON.stringify(data, null, ' ');
    },
});

}

Я действительно понятия не имею, как я могу проверить уровень вложенности элемента, когда он перетаскивается из левого контейнера в правый контейнер. Я просто знаю алгоритм, что если элементы уже имеют вложенный уровень 2, то я просто удаляю

внутри ... и добавляю его обратно, если он находится на нулевом уровне или на одном уровне вложенности.