✨: add timer reset on touch

src/components/Battleground/Objective.vue

@@ -1,12 +1,20 @@
 <template>
 
-  <div class="objective" >
+  <div
+    class="objective"
+    @click="clearObjective"
+    v-longclick="forceClearObjective">
     <div>
       {{ objective.name }}
       <span v-if="objective.position"> ({{ objective.position }})</span>
     </div>
 
-    <div><Timer ref="timer" :initialTime="objective.initialSpawnTime" /></div>
+    <div>
+      <Timer
+        ref="timer"
+        :initialTime="objective.initialSpawnTime"
+        />
+    </div>
   </div>
 </template>
 
@@ -28,6 +36,18 @@
       }
     },
     methods: {
+      clearObjective: function () {
+        if (this.$refs.timer.currentTime === 0) {
+          this.resetTimer()
+        }
+      },
+      forceClearObjective: function () {
+        this.resetTimer()
+      },
+      resetTimer: function () {
+        this.$refs.timer.setTime(this.objective.respawnTime)
+        this.$refs.timer.startTimer()
+      }
     },
     components: {
       Timer

src/components/Battleground/Timer.vue

@@ -5,16 +5,19 @@
 </template>
 
 <script>
+  'use strict'
   export default {
     name: 'Timer',
     data () {
       return {
-        currentTime: this.$attrs.initialTime
+        currentTime: this.$attrs.initialTime,
+        timerIntervalId: null
       }
     },
     methods: {
       startTimer: function () {
-        this.timerIntevalId = setInterval(() => {
+        this.stopTimer()
+        this.timerIntervalId = setInterval(() => {
           this.currentTime--
           if (this.currentTime === 0) {
             this.stopTimer()
@@ -22,7 +25,10 @@
         }, 1000)
       },
       stopTimer: function () {
-        clearInterval(this.timerIntevalId)
+        clearInterval(this.timerIntervalId)
+      },
+      setTime: function (time) {
+        this.currentTime = time
       }
     },
     computed: {

src/main.js

@@ -8,7 +8,7 @@ import VueI18n from 'vue-i18n'
 
 Vue.config.productionTip = false
 Vue.use(VueI18n)
-Vue.directive('longclick', longClickDirective({delay: 1000, interval: 0}))
+Vue.directive('longclick', longClickDirective({delay: 750, interval: 0}))
 
 /* eslint-disable no-new */
 new Vue({