Merge pull request #54 from stroeer/fix/BB-2137-fix-inactive-tabs-err…

…or-endcard

only have one interval and clear it when ticker is 0

package.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.0.1",
+  "version": "2.0.2",
   "name": "@stroeer/stroeer-videoplayer-plugin-endcard",
   "description": "Ströer Videoplayer Endcard Plugin",
   "main": "dist/stroeerVideoplayer-endcard-plugin.umd.js",

src/plugin.ts

@@ -105,22 +105,28 @@ class EndcardPlugin {
       '[data-role="plugin-endcard-progress-value"]'
     )! as HTMLElement
     let remainingTime = this.revolverplayTime
+
     const revolverplayTicker = (): void => {
-      ticker(this.revolverplayTime, remainingTime, progressSvgCircle, () => {
+      ticker(this.revolverplayTime, remainingTime, progressSvgCircle)
+      remainingTime--
+      if (remainingTime < 0) {
+        this.clearRevolverplayTimer()
         this.play(0, true)
         this.dispatchEvent('plugin-endcard:revolverplay')
         this.onRevolverplayCallback()
-      })
-      remainingTime--
+      }
     }
 
     revolverplayTicker()
-    this.intervalTicker = setInterval(revolverplayTicker, 1000)
+    if (this.intervalTicker === null) {
+      this.intervalTicker = setInterval(revolverplayTicker, 1000)
+    }
   }
 
   clearRevolverplayTimer = (): void => {
     if (this.intervalTicker !== null) {
       clearInterval(this.intervalTicker)
+      this.intervalTicker = null
     }
   }
 

src/revolverplay.ts

@@ -10,13 +10,9 @@ const updateCircleStyle = (el: HTMLElement, value: number): void => {
   el.style.strokeDashoffset = String(value)
 }
 
-const ticker = (time: number, remainingTime: number, el: HTMLElement, cb: Function): void => {
+const ticker = (time: number, remainingTime: number, el: HTMLElement): void => {
   const value = ((time - remainingTime) / time) * 100
-
   updateCircleStyle(el, getCircleProgress(value))
-  if (remainingTime < 0) {
-    cb()
-  }
 }
 
 export {

tests/revolverplay.test.ts

@@ -2,13 +2,10 @@ import { ticker } from '../src/revolverplay'
 
 test('ticker should work correctly', () => {
   const line = document.createElement('line')
-  const func1 = jest.fn()
 
-  ticker(7, 2, line, func1)
+  ticker(7, 2, line)
   expect(line.style.strokeDashoffset).toEqual('55.053269661507535')
-  expect(func1).not.toHaveBeenCalled()
 
-  ticker(5, -1, line, func1)
+  ticker(5, -1, line)
   expect(line.style.strokeDashoffset).toEqual('-38.53728876305527')
-  expect(func1).toHaveBeenCalled()
-})
+})