A better way of disabling sorting on touch devices
This commit is contained in:
parent
820a67802d
commit
b2e5be33d6
@ -8,7 +8,7 @@
|
|||||||
<Draggable
|
<Draggable
|
||||||
v-else
|
v-else
|
||||||
:list="networks"
|
:list="networks"
|
||||||
:disabled="isSortingEnabled"
|
:filter="isCurrentlyInTouch"
|
||||||
handle=".lobby"
|
handle=".lobby"
|
||||||
draggable=".network"
|
draggable=".network"
|
||||||
ghost-class="ui-sortable-ghost"
|
ghost-class="ui-sortable-ghost"
|
||||||
@ -51,7 +51,7 @@
|
|||||||
ghost-class="ui-sortable-ghost"
|
ghost-class="ui-sortable-ghost"
|
||||||
drag-class="ui-sortable-dragged"
|
drag-class="ui-sortable-dragged"
|
||||||
:group="network.uuid"
|
:group="network.uuid"
|
||||||
:disabled="isSortingEnabled"
|
:filter="isCurrentlyInTouch"
|
||||||
:list="network.channels"
|
:list="network.channels"
|
||||||
class="channels"
|
class="channels"
|
||||||
@change="onChannelSort"
|
@change="onChannelSort"
|
||||||
@ -91,15 +91,11 @@ export default {
|
|||||||
activeChannel: Object,
|
activeChannel: Object,
|
||||||
networks: Array,
|
networks: Array,
|
||||||
},
|
},
|
||||||
computed: {
|
|
||||||
isSortingEnabled() {
|
|
||||||
const isTouch = !!("ontouchstart" in window || (window.DocumentTouch && document instanceof window.DocumentTouch));
|
|
||||||
|
|
||||||
// TODO: Implement a way to sort on touch devices
|
|
||||||
return isTouch;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
|
isCurrentlyInTouch(e) {
|
||||||
|
// TODO: Implement a way to sort on touch devices
|
||||||
|
return e.pointerType !== "mouse";
|
||||||
|
},
|
||||||
onDragStart(e) {
|
onDragStart(e) {
|
||||||
e.target.classList.add("ui-sortable-active");
|
e.target.classList.add("ui-sortable-active");
|
||||||
},
|
},
|
||||||
|
Loading…
Reference in New Issue
Block a user