From 0f90f85347c393d24ee39947041028f567512af5 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Tue, 25 Feb 2020 16:39:50 +0100
Subject: viewer: removing a tag from the filters opens the keyboard on mobile

GitHub: Resolves #93
---
 viewer/src/components/LdTagInput.vue | 8 ++++++++
 1 file changed, 8 insertions(+)

(limited to 'viewer/src/components')

diff --git a/viewer/src/components/LdTagInput.vue b/viewer/src/components/LdTagInput.vue
index d9d932f..34d96bd 100644
--- a/viewer/src/components/LdTagInput.vue
+++ b/viewer/src/components/LdTagInput.vue
@@ -30,6 +30,7 @@
     size="is-medium"
     class="paneltag-input"
     @typing="searchTags"
+    @click.capture.native="onClick"
   >
     <template slot-scope="props">{{displayOption(props.option)}}</template>
     <template slot="empty">{{$t('tagInput.nomatch')}}</template>
@@ -58,6 +59,13 @@ export default class LdTagInput extends Vue {
       .filter(newSearch => !this.model.find(currentSearch => currentSearch.tag === newSearch.tag))
       .sort((a, b) => b.items.length - a.items.length);
   }
+
+  // Prevents the keyboard from opening on mobile when removing a tag
+  onClick(e: MouseEvent) {
+    const target = e.target;
+    if (target instanceof HTMLAnchorElement)
+      target.addEventListener("click", e => e.stopPropagation());
+  }
 }
 </script>
 
-- 
cgit v1.2.3


From 4565feaf9ccdc9b215e85f22917bbe300f3a57c4 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Thu, 27 Feb 2020 12:58:19 +0100
Subject: viewer: removing a tag from the filters opens the keyboard on mobile

Changed the anchor event to trigger on capture instead of bubbling. This fixes a race-condition on some browsers.
---
 viewer/src/components/LdTagInput.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'viewer/src/components')

diff --git a/viewer/src/components/LdTagInput.vue b/viewer/src/components/LdTagInput.vue
index 34d96bd..ad0845e 100644
--- a/viewer/src/components/LdTagInput.vue
+++ b/viewer/src/components/LdTagInput.vue
@@ -63,8 +63,7 @@ export default class LdTagInput extends Vue {
   // Prevents the keyboard from opening on mobile when removing a tag
   onClick(e: MouseEvent) {
     const target = e.target;
-    if (target instanceof HTMLAnchorElement)
-      target.addEventListener("click", e => e.stopPropagation());
+    if (target instanceof HTMLAnchorElement) target.addEventListener("click", e => e.stopPropagation(), true);
   }
 }
 </script>
-- 
cgit v1.2.3