jquery - jQuery UI - ソート可能なリスト - 制限されたアイテム - 特別な動作

Question

jQuery UI を初めて使用しています。私の現在のプロジェクトでは、 sortable-function が非常に便利です。ある種のプレイリストエディタを構築しようとしています。多数のトラック (リスト 1) があり、ユーザーはそれらを最大 3 つのアイテムを持つプレイリスト (リスト 2) にドラッグ アンド ドロップできます。
すでに 3 つのアイテムの最大値を設定できましたが、現在のソリューションでは、単一のリスト内でアイテムを並べ替える方法がありません。プレイリスト内の最大 3 項目に達した場合でも、ユーザーにリスト項目の 1 つを並べ替えまたは削除してもらいたいと考えています。

ヒントをくれませんか？

$(function() {   $( "#playlist, #tracks" ).sortable({
    connectWith: ".mix",
    cursor: "move",
    handle: ".handle",
    revert: 200,
    opacity: 0.8,
    delay: 50,
    placeholder: "sortable-placeholder",
    stop: function(event, ui) {
        var size = $("#playlist li.track").size();
        $("#music").append(size+" ");
        sizeCheck();
        if (playlistFull) {
            $("#music").append("full ");
            } else { 
            $("#music").append("space ");
            };
        playlistWatcher();
        },
    start: function(event, ui) {
        if (playlistFull) {
            // $(ui.item).sortable('cancel');  // What to do here?
            };
        },
    }).disableSelection();
});

JSfiddle: http://jsfiddle.net/9yzea/2/