From 7007659e05842dc06eb2c13eddaba6ab657df5ea Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Wed, 28 Oct 2020 08:53:23 +0200
Subject: [PATCH] change input blocking to use css

---
 src/components/timeline/timeline.js  | 10 +++-------
 src/components/timeline/timeline.vue |  9 +++++++--
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index 25fa3e41..ea290fde 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -65,8 +65,10 @@ const Timeline = {
       }
     },
     classes () {
+      let rootClasses = !this.embedded ? ['panel', 'panel-default'] : []
+      if (this.blockingClicks) rootClasses = rootClasses.concat(['-blocked'])
       return {
-        root: ['timeline'].concat(!this.embedded ? ['panel', 'panel-default'] : []),
+        root: rootClasses,
         header: ['timeline-heading'].concat(!this.embedded ? ['panel-heading'] : []),
         body: ['timeline-body'].concat(!this.embedded ? ['panel-body'] : []),
         footer: ['timeline-footer'].concat(!this.embedded ? ['panel-footer'] : [])
@@ -125,17 +127,11 @@ const Timeline = {
     this.$store.commit('setLoading', { timeline: this.timelineName, value: false })
   },
   methods: {
-    blockClickEvent (e) {
-      e.stopPropagation()
-      e.preventDefault()
-    },
     stopBlockingClicks: debounce(function () {
       this.blockingClicks = false
-      this.$el && this.$el.removeEventListener('click', this.blockClickEvent, true)
     }, 1000),
     blockClicksTemporarily () {
       if (!this.blockingClicks) {
-        this.$el.addEventListener('click', this.blockClickEvent, true)
         this.blockingClicks = true
       }
       this.stopBlockingClicks()
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index c1e2f44b..234ca2d2 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :class="[classes.root, 'timeline']">
+  <div :class="[classes.root, 'Timeline']">
     <div :class="classes.header">
       <TimelineMenu v-if="!embedded" />
       <div
@@ -103,10 +103,15 @@
 <style lang="scss">
 @import '../../_variables.scss';
 
-.timeline {
+.Timeline {
   .loadmore-text {
     opacity: 1;
   }
+
+  &.-blocked {
+    pointer-events: none;
+    cursor: wait;
+  }
 }
 
 .timeline-heading {