A better way of disabling sorting on touch devices

This commit is contained in:
Pavel Djundik 2019-07-12 13:43:47 +03:00
parent 820a67802d
commit b2e5be33d6

View File

@ -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");
}, },