From b56fd91c3ecc61ccbe692a21e8eb0f378b4a90ca Mon Sep 17 00:00:00 2001 From: Zero~Informatique Date: Mon, 10 Feb 2020 05:41:16 +0100 Subject: viewer: ldbreadcrumbs: implement horizontal scrolling This comes with a fix for the DragScroll component for mobile devices. GitHub: closes #101, closes #102 --- viewer/src/dragscrollclickfix.ts | 51 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 51 insertions(+) create mode 100644 viewer/src/dragscrollclickfix.ts (limited to 'viewer/src/dragscrollclickfix.ts') diff --git a/viewer/src/dragscrollclickfix.ts b/viewer/src/dragscrollclickfix.ts new file mode 100644 index 0000000..3db0b20 --- /dev/null +++ b/viewer/src/dragscrollclickfix.ts @@ -0,0 +1,51 @@ +/* ldgallery - A static generator which turns a collection of tagged +-- pictures into a searchable web gallery. +-- +-- Copyright (C) 2019-2020 Guillaume FOUET +-- +-- This program is free software: you can redistribute it and/or modify +-- it under the terms of the GNU Affero General Public License as +-- published by the Free Software Foundation, either version 3 of the +-- License, or (at your option) any later version. +-- +-- This program is distributed in the hope that it will be useful, +-- but WITHOUT ANY WARRANTY; without even the implied warranty of +-- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +-- GNU Affero General Public License for more details. +-- +-- You should have received a copy of the GNU Affero General Public License +-- along with this program. If not, see . +*/ + +// https://github.com/donmbelembe/vue-dragscroll/issues/61 +export default class DragScrollClickFix { + + readonly DRAG_DELAY = 100; // This is the minimal delay to consider a click to be a drag, mostly usefull for touch devices + + timer: NodeJS.Timeout | null = null; + dragging: boolean = false; + + onDragScrollStart() { + this.timer = setTimeout(() => this.onTimer(), this.DRAG_DELAY); + } + + onTimer() { + this.timer = null; + this.dragging = true; + } + + onDragScrollEnd() { + if (this.timer) { + clearTimeout(this.timer); + this.timer = null; + } + } + + onClickCapture(e: MouseEvent) { + if (this.dragging) { + this.dragging = false; + e.preventDefault(); + e.stopPropagation(); + } + } +} \ No newline at end of file -- cgit v1.2.3