luisgulo/photoprism
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

iOS: Prefer "touchstart" over "mousedown" event if available #2074

Browse source
This commit is contained in:
Michael Mayer 2022-02-28 10:05:23 +01:00
parent c256664a1b
commit ceae91bf28
11 changed files with 55 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontend/src/common/input.js
View file

@ -23,6 +23,7 @@ Additional information can be found in our Developer Guide:
*/
// import log from "common/log";
export const InputInvalid = 0;
export const ClickShort = 1;
export const ClickLong = 2;
@ -30,9 +31,11 @@ export const ClickLong = 2;
export class Input {
constructor() {
this.reset();
this.preferTouch = false;
}
reset() {
// log.debug("input.reset");
this.index = -1;
this.scrollY = window.scrollY;
this.touches = [];
@ -40,6 +43,8 @@ export class Input {
}
touchStart(ev, index) {
// log.debug("input.touchStart", [ev, ev.type, ev.touches, index]);
this.preferTouch = true;
this.index = index;
this.scrollY = window.scrollY;
if (ev.touches) {
@ -49,6 +54,10 @@ export class Input {
}
mouseDown(ev, index) {
if (this.preferTouch) {
return; // Ignore "mousedown" event on touch devices.
}
// log.debug("input.mouseDown", [ev, ev.type, ev.touches, index]);
this.index = index;
this.scrollY = window.scrollY;
this.touches = [];
@ -56,6 +65,7 @@ export class Input {
}
clickType(ev, index) {
// log.debug("input.clickType", [ev, ev.type, index]);
if (this.timeStamp < 0) {
return InputInvalid;
}
@ -89,6 +99,7 @@ export class Input {
}
eval(ev, index) {
// log.debug("input.eval", [ev, ev.type, index]);
const result = this.clickType(ev, index);
this.reset();
return result;

26
frontend/src/common/log.js
View file

@ -24,6 +24,7 @@ Additional information can be found in our Developer Guide:
*/
import Event from "pubsub-js";
import { config } from "app/session";
class Log {
constructor() {
@ -44,6 +45,31 @@ class Log {
Event.subscribe("log", this.onLog.bind(this));
}
debug(msg, data) {
if (config.debug && msg) {
if (data) {
if (Array.isArray(data)) {
data.forEach((val) => {
msg += ", " + JSON.stringify(val);
});
} else {
msg += ", " + JSON.stringify(data);
}
}
this.onLog(
{},
{
message: msg,
level: "debug",
time: new Date().toISOString(),
}
);
}
return this;
}
onLog(ev, data) {
data.id = this.logId++;

4
frontend/src/component/photo/cards.vue
View file

@ -40,8 +40,8 @@
aspect-ratio="1"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
@mouseover="playLive(photo)"
@mouseleave="pauseLive(photo)"

4
frontend/src/component/photo/mosaic.vue
View file

@ -39,8 +39,8 @@
aspect-ratio="1"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
@mouseover="playLive(photo)"
@mouseleave="pauseLive(photo)"

4
frontend/src/pages/albums.vue
View file

@ -97,8 +97,8 @@
style="user-select: none"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
>
<v-btn v-if="featureShare && album.LinkCount > 0" :ripple="false"

4
frontend/src/pages/labels.vue
View file

@ -75,8 +75,8 @@
style="user-select: none"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
>
<v-btn :ripple="false"

4
frontend/src/pages/library/files.vue
View file

@ -64,8 +64,8 @@
aspect-ratio="1"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
>
<v-btn :ripple="false"

4
frontend/src/pages/people/subjects.vue
View file

@ -80,8 +80,8 @@
style="user-select: none"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
>
<v-btn :ripple="false" :depressed="false" class="input-hidden"

4
frontend/src/share/albums.vue
View file

@ -51,8 +51,8 @@
style="user-select: none"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
>
<v-btn :ripple="false"

4
frontend/src/share/photo/cards.vue
View file

@ -36,8 +36,8 @@
aspect-ratio="1"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
@mouseover="playLive(photo)"
@mouseleave="pauseLive(photo)"

4
frontend/src/share/photo/mosaic.vue
View file

@ -35,8 +35,8 @@
aspect-ratio="1"
class="accent lighten-2 clickable"
@touchstart.passive="input.touchStart($event, index)"
@touchend.prevent="onClick($event, index)"
@mousedown="input.mouseDown($event, index)"
@touchend.stop.prevent="onClick($event, index)"
@mousedown.stop.prevent="input.mouseDown($event, index)"
@click.stop.prevent="onClick($event, index)"
@mouseover="playLive(photo)"
@mouseleave="pauseLive(photo)"