jQuery.Shapeshiftを長押しでドラッグできるようにしたい

Pinterest風のグリッドレイアウト画面を実装したいと思い、jQuery.Shapeshift（デモページはこちら）を用いて画面実装をしております。

ほぼ満足のいく仕上がりになっているのですが、一点だけスマホで閲覧したときにスクロール時の誤操作問題が発生します。

上記デモページを操作頂けると分かりやすいですが、グリッド上に並んだアイテムをドラッグして動かすことができます。スマホでも同様ですが、画面いっぱいにグリッドを配した際、ページスクロールをしようとしてもアイテムを掴んだことと誤認識されてしまい、予期せぬアイテム移動が発生してしまいます。

そこでアイテムを長押ししたときのみ、移動できるように改良を入れたいのですが、マニュアルにはそのような設定項目は無さそうです。

次にスクリプトを覗いてみましたが、どこの部分がアイテムのクリックを司っているのか分かりません。

・長押し（仮に1秒）されたらアイテムが移動されるようにしたい
・長押ししている間にカーソル or 指を動かした場合は画面スクロールとみなし、アイテム移動させない

上記のように書き換えられそうか否か分かる方がいらっしゃいましたらご教授頂けますと幸いです。
一応実装していたHTMLを下記に掲載しておきます（上記デモページとあまり差はありません）。
よろしくお願いいたします。

HTML
1<head>
2
3<style>
4
5    .container2 {
6        border: 1px dashed #CCC;
7        position: relative;
8        list-style-type: none;
9    }
10
11    .container2 > li {
12        background: #AAA;
13        position: absolute;
14        height: 100px;
15        width: calc(100% / 3);
16    }
17
18    .container2 > .ss-placeholder-child {
19        background-color: blue;
20    }
21
22    .trash {
23        height: 80px;
24        background-color: antiquewhite;
25    }
26    
27</style>
28
29</head>
30
31<body>
32    <div class="content">
33
34        <ul class="container">
35            <li class="item" style="height: 440px;">1</li>
36            <li class="item" style="height: 1220px;">2</li>
37            <li class="item" style="height: 500px;">3</li>
38            <li class="item" style="height: 40px;">4</li>
39            <li class="item" style="height: 100px;">5</li>
40            <li class="item" style="height: 900px;">6</li>
41            <li class="item" style="height: 220px;">7</li>
42            <li class="item" style="height: 80px;">8</li>
43            <li class="item" style="height: 40px;">9</li>
44            <li class="item" style="height: 100px;">10</li>
45        </ul>
46
47        <div class="trash">
48            ここにドラッグしてアイテムを削除
49        </div>
50            
51    </div>
52
53    <script src="js/jquery-2.2.2.min.js"></script>
54    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <!--shapeshiftで使用-->
55    <script src="js/jquery.touch-punch.min.js"></script>
56    <script src="js/jquery.shapeshift.js"></script>
57    <script src="js/app.js"></script>
58
59
60</body>
61</html>

JavaScript
1    $('.container').shapeshift({
2        columns: 3,
3        minColumns: 3,
4        dragWhitelist: '.item',
5    });
6
7    $('.trash').shapeshift({
8        autoHeight: false,
9        colWidth: 80,
10        enableTrash: true
11    });
12

追記

スクリプトの418〜443行目に、それらしいコードがありました(下記)。
jQuery UIのstart、drag、stopを用いているようです。
startの部分が、長押しで実行されるようになれば良さそうです。

JavaScript
1start: function(e, ui) {
2    console.log('ドラッグ開始');
3    var selected_tag;
4    _this.globals.dragging = true;
5    $selected = $(e.target);
6    if (drag_clone) {
7    $clone = $selected.clone(false, false).insertBefore($selected).addClass(clone_class);
8    }
9    $selected.addClass(dragged_class);
10    selected_tag = $selected.prop("tagName");
11    $placeholder = $("<" + selected_tag + " class='" + placeholder_class + "' style='height: " + ($selected.height()) + "px; width: " + ($selected.width()) + "px'></" + selected_tag + ">");
12    $selected.parent().addClass(original_container_class).addClass(current_container_class);
13    selected_offset_y = $selected.outerHeight() / 2;
14    return selected_offset_x = $selected.outerWidth() / 2;
15},
16drag: function(e, ui) {
17    console.log('ドラッグ中');
18    if (!drag_timeout && !(drag_clone && delete_clone && $("." + current_container_class)[0] === $("." + original_container_class)[0])) {
19    $placeholder.remove().appendTo("." + current_container_class);
20    $("." + current_container_class).trigger("ss-setTargetPosition");
21    drag_timeout = true;
22    window.setTimeout((function() {
23        return drag_timeout = false;
24    }), drag_rate);
25    }
26    ui.position.left = e.pageX - $selected.parent().offset().left - selected_offset_x;
27    return ui.position.top = e.pageY - $selected.parent().offset().top - selected_offset_y;
28},
29