Fix quiz time implementation

Author: EkaterinaVu

examples/quiz/Example.vue

@@ -19,6 +19,7 @@
       ref="flowform"
       v-on:complete="onComplete"
       v-on:submit="onQuizSubmit"
+      v-on:timer="onTimer"
       v-bind:questions="questions"
       v-bind:language="language"
       v-bind:standalone="true"
@@ -55,7 +56,7 @@
             v-html="language.formatString(language.pressEnter)">
           </a>
         </div>
-        <p class="text-success" v-if="submitted && timerOn()">Your time: {{ formatTime(getTime()) }}</p>
+        <p class="text-success" v-if="submitted && time">Your time: {{ formattedTime }}</p>
         <p class="text-success" v-if="submitted && score < 4">"You scored {{ score }} out of {{ total }}. There's a lot of room for improvement."</p>
         <p class="text-success" v-else-if="submitted && score < 7">"You scored {{ score }} out of {{ total }}. Not bad at all!"</p>
         <p class="text-success" v-else-if="submitted && score <= total">"You scored {{ score }} out of {{ total }}. Wow, that's impressive!"</p>
@@ -88,6 +89,8 @@
         completed: false,
         score: 0, 
         total: 8, 
+        time: 0,
+        formattedTime: 0,
         answers: {
           html_1: ['2', '3'], 
           html_2: 'false', 
@@ -340,17 +343,10 @@
         this.calculateScore()
       },
 
-      getTime() {
-        return this.$refs.flowform.time
-      },
-
-      timerOn() {
-        return this.$refs.flowform.timer
-      },
-
-      formatTime(seconds) {
-        return this.$refs.flowform.formatTime(seconds)
-      }
+     onTimer(time, formattedTime) {
+       this.time = formattedTime
+       this.formattedTime = formattedTime
+    }
     },
   }
 </script>

src/components/FlowForm.vue

@@ -566,6 +566,7 @@
 
       incrementTime() {
         ++this.time
+        this.$emit('timer', this.time, this.formatTime(this.time))
       },
 
       formatTime(seconds) {