Skip to content

Commit 097bd95

Browse files
committed
fix: optimize animation effects on drop
1 parent d4c7bc3 commit 097bd95

File tree

5 files changed

+46
-46
lines changed

5 files changed

+46
-46
lines changed

.github/workflows/deploy.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ jobs:
3333

3434
- name: Build with VitePress
3535
run: |
36-
npm run core:update
36+
git submodule update --init --recursive
3737
npm run docs:build
3838
ls
3939

dist/virtual-drag-list.js

Lines changed: 39 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* vue-virtual-draglist v3.3.4
2+
* vue-virtual-draglist v3.3.5
33
* open source under the MIT license
44
* https://github.com/mfuu/vue3-virtual-drag-list#readme
55
*/
@@ -104,7 +104,7 @@
104104
var sortableDnd_min = {exports: {}};
105105

106106
/*!
107-
* sortable-dnd v0.6.19
107+
* sortable-dnd v0.6.20
108108
* open source under the MIT license
109109
* https://github.com/mfuu/sortable-dnd#readme
110110
*/
@@ -291,7 +291,7 @@
291291
function N(t) {
292292
this.options = t, this.stack = [];
293293
}
294-
function P(t) {
294+
function O(t) {
295295
this.options = t || {}, this.selects = [];
296296
}
297297
window.requestAnimationFrame || (window.requestAnimationFrame = function (t) {
@@ -377,7 +377,7 @@
377377
}, s);
378378
}
379379
}
380-
}, P.prototype = {
380+
}, O.prototype = {
381381
active: function () {
382382
return !!D;
383383
},
@@ -474,9 +474,9 @@
474474
}
475475
}
476476
};
477-
var A,
477+
var P,
478+
A,
478479
H,
479-
O,
480480
k,
481481
L,
482482
X,
@@ -543,13 +543,14 @@
543543
selectedClass: "",
544544
placeholderClass: "",
545545
swapOnDrop: !0,
546+
removeCloneOnDrop: !0,
546547
fallbackOnBody: !1,
547548
supportTouch: "ontouchstart" in window,
548549
emptyInsertThreshold: -1
549550
};
550551
for (var i in o) !(i in this.options) && (this.options[i] = o[i]);
551552
for (var r in et(n), this) "_" === r.charAt(0) && "function" == typeof this[r] && (this[r] = this[r].bind(this));
552-
c(t, this.options.supportTouch ? "touchstart" : "mousedown", this._onDrag), this.autoScroller = new M(this.options), this.multiplayer = new P(this.options), this.animator = new N(this.options), tt.push(t);
553+
c(t, this.options.supportTouch ? "touchstart" : "mousedown", this._onDrag), this.autoScroller = new M(this.options), this.multiplayer = new O(this.options), this.animator = new N(this.options), tt.push(t);
553554
}
554555
return ot.prototype = {
555556
constructor: ot,
@@ -588,12 +589,12 @@
588589
_onStart: function (t, e) {
589590
x(e);
590591
var n = g(k);
591-
A = this.el, H = this.el, F = k, z = n, G = n, V = n, J = {
592+
P = this.el, A = this.el, F = k, z = n, G = n, V = n, J = {
592593
to: this.el,
593594
target: k,
594595
newIndex: n,
595596
relative: 0
596-
}, K = k, O = this.el, Y = k.cloneNode(!0), R = k.parentNode, W = this.options.group.pull, ot.clone = Y, ot.active = this, ot.dragged = k, this.multiplayer.onChoose(), w(k, this.options.chosenClass, !0), C({
597+
}, K = k, H = this.el, Y = k.cloneNode(!0), R = k.parentNode, W = this.options.group.pull, ot.clone = Y, ot.active = this, ot.dragged = k, this.multiplayer.onChoose(), w(k, this.options.chosenClass, !0), C({
597598
sortable: this,
598599
name: "onChoose",
599600
params: this._getParams(e)
@@ -696,12 +697,12 @@
696697
}
697698
},
698699
_allowPut: function () {
699-
if (O === this.el) return !0;
700+
if (H === this.el) return !0;
700701
if (!this.options.group.put) return !1;
701702
var t = this.options.group,
702703
e = t.name,
703704
n = t.put,
704-
o = O[T].options.group;
705+
o = H[T].options.group;
705706
return n.join && n.indexOf(o.name) > -1 || o.name && e && o.name === e;
706707
},
707708
_getDirection: function () {
@@ -734,23 +735,23 @@
734735
params: this._getParams(t, {
735736
target: L
736737
})
737-
}), this.options.sortable || this.el !== O) return this.el === H || e !== this.el && f(this.el) ? void (L && !L.animated && !m(L, Y) && this._allowSwap() && (L !== Y && X !== Y ? (this.el !== H ? this._onInsert(t) : L !== k && this._onChange(t), U = L) : U = L)) : (L = U = null, void this._onInsert(t));
738-
H !== O && (L = U = k, Z = 0, this._onInsert(t));
738+
}), this.options.sortable || this.el !== H) return this.el === A || e !== this.el && f(this.el) ? void (L && !L.animated && !m(L, Y) && this._allowSwap() && (L !== Y && X !== Y ? (this.el !== A ? this._onInsert(t) : L !== k && this._onChange(t), U = L) : U = L)) : (L = U = null, void this._onInsert(t));
739+
A !== H && (L = U = k, Z = 0, this._onInsert(t));
739740
}
740741
},
741742
_onInsert: function (t) {
742743
var e = L || Y,
743-
n = "clone" === W && this.el !== O && H === O,
744-
o = "clone" === W && this.el === O && H !== O,
744+
n = "clone" === W && this.el !== H && A === H,
745+
o = "clone" === W && this.el === H && A !== H,
745746
i = m(L, document),
746747
r = L === k && !i,
747-
s = H[T],
748-
a = O[T];
749-
A = this.el, z = g(Y), F = e, R = i ? L.parentNode : this.el, s.animator.collect(Y.parentNode), this.animator.collect(R), n && (J.target = K, J.newIndex = z, J.relative = K === k ? 0 : _(Y, K), S(k, "display", ""), a.multiplayer.toggleVisible(!0), a.options.group.revertDrag || Y.parentNode.insertBefore(k, Y)), o && (z = g(k), S(k, "display", "none"), this.multiplayer.toggleVisible(!1)), S(Y, "display", r ? "none" : ""), L && i ? R.insertBefore(Y, Z < 0 ? L : L.nextSibling) : R.appendChild(Y), G = r ? V : g(Y), n && a.options.group.revertDrag && (J.target = k, J.newIndex = V, J.relative = 0, C({
748+
s = A[T],
749+
a = H[T];
750+
P = this.el, z = g(Y), F = e, R = i ? L.parentNode : this.el, s.animator.collect(Y.parentNode), this.animator.collect(R), n && (J.target = K, J.newIndex = z, J.relative = K === k ? 0 : _(Y, K), S(k, "display", ""), a.multiplayer.toggleVisible(!0), a.options.group.revertDrag || Y.parentNode.insertBefore(k, Y)), o && (z = g(k), S(k, "display", "none"), this.multiplayer.toggleVisible(!1)), S(Y, "display", r ? "none" : ""), L && i ? R.insertBefore(Y, Z < 0 ? L : L.nextSibling) : R.appendChild(Y), G = r ? V : g(Y), n && a.options.group.revertDrag && (J.target = k, J.newIndex = V, J.relative = 0, C({
750751
sortable: a,
751752
name: "onChange",
752753
params: this._getParams(t, {
753-
to: O,
754+
to: H,
754755
target: k,
755756
newIndex: V,
756757
revertDrag: !0
@@ -765,7 +766,7 @@
765766
sortable: this,
766767
name: "onChange",
767768
params: this._getParams(t, {
768-
from: O,
769+
from: H,
769770
backToOrigin: !0
770771
})
771772
})), o || C({
@@ -774,49 +775,51 @@
774775
params: this._getParams(t, {
775776
oldIndex: -1
776777
})
777-
}), s.animator.animate(), this.animator.animate(), H = this.el;
778+
}), s.animator.animate(), this.animator.animate(), A = this.el;
778779
},
779780
_onChange: function (t) {
780-
this.animator.collect(R), z = g(Y), R = L.parentNode, F = L, this.el === O && (K = L), R.insertBefore(Y, X), G = g(Y), C({
781+
this.animator.collect(R), z = g(Y), R = L.parentNode, F = L, this.el === H && (K = L), R.insertBefore(Y, X), G = g(Y), C({
781782
sortable: this,
782783
name: "onChange",
783784
params: this._getParams(t)
784-
}), this.animator.animate(), H = this.el;
785+
}), this.animator.animate(), A = this.el;
785786
},
786787
_onDrop: function (t) {
787-
this._cancelStart(), h(Q, "touchmove", this._nearestSortable), h(Q, "mousemove", this._nearestSortable), h(Q, "mouseup", this._onDrop), h(Q, "touchend", this._onDrop), h(Q, "touchcancel", this._onDrop), O && (H = O, z = V, F === Y && (F = k), this.animator.collect(R), this.multiplayer.toggleChosenClass(!1), w(k, this.options.chosenClass, !1), C({
788+
this._cancelStart(), h(Q, "touchmove", this._nearestSortable), h(Q, "mousemove", this._nearestSortable), h(Q, "mouseup", this._onDrop), h(Q, "touchend", this._onDrop), h(Q, "touchcancel", this._onDrop), H && (A = H, z = V, F === Y && (F = k), this.animator.collect(R), this.multiplayer.toggleChosenClass(!1), w(k, this.options.chosenClass, !1), C({
788789
sortable: this,
789790
name: "onUnchoose",
790791
params: this._getParams(t)
791-
}), q && this._onEnd(t), !q && this.animator.animate()), !nt(t.changedTouches ? t.changedTouches[0] : t) && this.multiplayer.onSelect(t, k, O, this), B && B.parentNode && B.parentNode.removeChild(B), this.autoScroller.stop(), this.multiplayer.nulling(), this._nulling();
792+
}), q && this._onEnd(t), !q && this.animator.animate()), !nt(t.changedTouches ? t.changedTouches[0] : t) && this.multiplayer.onSelect(t, k, H, this), B && B.parentNode && B.parentNode.removeChild(B), this.autoScroller.stop(), this.multiplayer.nulling(), this._nulling();
792793
},
793794
_onEnd: function (t) {
794795
w(Y, this.options.chosenClass, !1), w(Y, this.options.placeholderClass, !1);
795796
var n = "clone" === W;
796-
this.multiplayer.onDrop(H, A, n);
797+
this.multiplayer.onDrop(A, P, n);
797798
var o = this._getParams(t),
798-
i = this.options.swapOnDrop;
799-
n && H !== A || !("function" == typeof i ? i(o) : i) || R.insertBefore(k, Y), n && H !== A && !this.multiplayer.active() || Y && Y.parentNode && Y.parentNode.removeChild(Y), S(k, "display", ""), this.animator.animate(), H !== A && C({
800-
sortable: H[T],
799+
i = this.options,
800+
r = i.swapOnDrop,
801+
s = i.removeCloneOnDrop;
802+
n && A !== P || !("function" == typeof r ? r(o) : r) || R.insertBefore(k, Y), n && A !== P && !this.multiplayer.active() || !("function" == typeof s ? s(o) : s) || Y && Y.parentNode && Y.parentNode.removeChild(Y), S(k, "display", ""), this.animator.animate(), A !== P && C({
803+
sortable: A[T],
801804
name: "onDrop",
802805
params: e({}, o, n ? J : {
803806
newIndex: -1
804807
})
805808
}), C({
806-
sortable: A[T],
809+
sortable: P[T],
807810
name: "onDrop",
808-
params: e({}, o, H === A ? {} : {
811+
params: e({}, o, A === P ? {} : {
809812
oldIndex: -1
810813
})
811814
});
812815
},
813816
_getParams: function (t) {
814817
var n = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {},
815818
o = {};
816-
return o.event = t, o.to = A, o.from = H, o.node = k, o.clone = Y, o.target = F, o.oldIndex = z, o.newIndex = G, o.pullMode = W, e(o, this.multiplayer.params(), n), o.relative = F === k ? 0 : _(Y, F), o;
819+
return o.event = t, o.to = P, o.from = A, o.node = k, o.clone = Y, o.target = F, o.oldIndex = z, o.newIndex = G, o.pullMode = W, e(o, this.multiplayer.params(), n), o.relative = F === k ? 0 : _(Y, F), o;
817820
},
818821
_nulling: function () {
819-
A = H = O = k = L = X = Y = B = F = R = W = z = G = V = j = q = U = J = K = Q = Z = $ = ot.clone = ot.ghost = ot.active = ot.dragged = null;
822+
P = A = H = k = L = X = Y = B = F = R = W = z = G = V = j = q = U = J = K = Q = Z = $ = ot.clone = ot.ghost = ot.active = ot.dragged = null;
820823
},
821824
destroy: function () {
822825
this._cancelStart(), this._nulling(), this.multiplayer.nulling(), this.autoScroller.stop(), h(this.el, "touchstart", this._onDrag), h(this.el, "mousedown", this._onDrag);
@@ -887,9 +890,8 @@
887890
}, {});
888891
this.sortable = new Dnd(this.el, Object.assign(Object.assign({}, props), {
889892
emptyInsertThreshold: 0,
890-
swapOnDrop: function swapOnDrop(event) {
891-
return event.from === event.to;
892-
},
893+
swapOnDrop: false,
894+
removeCloneOnDrop: false,
893895
onDrag: function onDrag(event) {
894896
return _this.onDrag(event);
895897
},
@@ -959,9 +961,7 @@
959961
if (event.from === this.el && this.reRendered) {
960962
(_b = Dnd.dragged) === null || _b === void 0 ? void 0 : _b.remove();
961963
}
962-
if (event.from !== event.to && event.pullMode === 'clone') {
963-
(_c = Dnd.clone) === null || _c === void 0 ? void 0 : _c.remove();
964-
}
964+
(_c = Dnd.clone) === null || _c === void 0 ? void 0 : _c.remove();
965965
this.reRendered = false;
966966
}
967967
}, {

dist/virtual-drag-list.min.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vue-virtual-draglist",
3-
"version": "3.3.4",
3+
"version": "3.3.5",
44
"description": "A virtual scrolling list component that can be sorted by dragging, support vue3",
55
"main": "dist/virtual-drag-list.min.js",
66
"types": "types/index.d.ts",
@@ -42,7 +42,7 @@
4242
},
4343
"homepage": "https://github.com/mfuu/vue3-virtual-drag-list#readme",
4444
"dependencies": {
45-
"sortable-dnd": "^0.6.19"
45+
"sortable-dnd": "^0.6.20"
4646
},
4747
"devDependencies": {
4848
"@babel/core": "^7.15.0",

src/core

Submodule core updated 1 file

0 commit comments

Comments
 (0)