使用可排序项实现轮班点击

我正在为我想添加到web应用程序中的东西编写一个小型概念验证应用程序。我在这里找到了一些以前的代码，并进行了修改以满足我的需求。我有一个可排序的元素，它目前使用ctrl点击和常规点击事件来移动项目。经过长时间的谷歌搜索和搜索，我发布了一个问题，希望有人能给我一些好的建议。请注意，我对编码还比较陌生。

我想实现一个移位点击功能，就像windows一样。当用户shift单击可排序文件中的一个项目时，应选择该项目，然后单击第二个项目（如果相关），然后选择其中的所有项目，以便可以移动它们。

http://jsfiddle.net/pYaRv/1/

代码：

clicked_list = []
$("ul").on('click', 'li', function (e) {
if (e.ctrlKey || e.metaKey) {
    $(this).toggleClass("selected");
    temp2 = $(this)
    if (jQuery.inArray(temp2[0]["innerText"], clicked_list) == -1){
        clicked_list.push(temp2[0]["innerText"])
    }else{
        index = jQuery.inArray(temp2[0]["innerText"], clicked_list)
        clicked_list.splice(index, 1)
    }
    $("#information").text("Ctrl-Clicked " + (temp2[0]["innerText"]))
}
else if(e.shiftKey)
{
    temp3 = $(this)
    $("#information").text("Shift-Clicked " + (temp3[0]["innerText"]))        
} 
else 
{
    if ($(this).hasClass('selected'))
    {
        $("#information").text("Un-Clicked " + (temp[0]["innerText"]))
        $(this).removeClass('selected')
    }
    else{
        temp = $(this)
        $("#information").text("Clicked " + (temp[0]["innerText"]))
        $(this).addClass("selected").siblings().removeClass('selected');                    
    }

}
}).sortable({
connectWith: "ul",
delay: 150,
revert: 0,
helper: function (e, item) {
    if (!item.hasClass('selected')) {
        item.addClass('selected').siblings().removeClass('selected');
    }   
    var elements = item.parent().children('.selected').clone();
    $("#information").text("Moved " + elements.length + " item(s)")
    item.data('multidrag', elements).siblings('.selected').remove();

    var helper = $('<li/>');
    return helper.append(elements);
},
stop: function (e, ui) {
    var elements = ui.item.data('multidrag');

    ui.item.after(elements).remove();
}
});