Merge pull request #126 from hyperaudio/124-play-on-click-option

124 play on click option
hyperaudio · Oct 11, 2022 · db5d815 · db5d815
2 parents 7c8bd51 + b985b95
commit db5d815
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 10 deletions.
diff --git a/index.html b/index.html
@@ -1,5 +1,5 @@
 <!-- Example index.html Copyright (C) BBC Research & Development - content used with kind permission of Ian Forrester https://twitter.com/cubicgarden/ -->
-<!-- Version 2.0.3 -->
+<!-- Version 2.0.19 -->
 <!DOCTYPE html>
 <html>
 <head>
@@ -1000,8 +1000,9 @@ <h5 data-m="214800">What kind of help is available for people to manage their ow
   let autoScroll = true;
   let doubleClick = false;
   let webMonetization = true;
+  let playOnClick = false;
 
-  new HyperaudioLite("hypertranscript", "hyperplayer", minimizedMode, autoScroll, doubleClick, webMonetization);
+  new HyperaudioLite("hypertranscript", "hyperplayer", minimizedMode, autoScroll, doubleClick, webMonetization, playOnClick);
 
   // Override scroll parameters
   //ht1.setScrollParameters(<duration>, <delay>, <offset>, <container>);

diff --git a/js/hyperaudio-lite.js b/js/hyperaudio-lite.js
@@ -1,5 +1,5 @@
 /*! (C) The Hyperaudio Project. MIT @license: en.wikipedia.org/wiki/MIT_License. */
-/*! Version 2.0.18 */
+/*! Version 2.0.19 */
 
 'use strict';
 
@@ -143,12 +143,12 @@ function hyperaudioPlayer(playerType, instance) {
 }
 
 class HyperaudioLite {
-  constructor(transcriptId, mediaElementId, minimizedMode, autoscroll, doubleClick, webMonetization) {
+  constructor(transcriptId, mediaElementId, minimizedMode, autoscroll, doubleClick, webMonetization, playOnClick) {
     this.transcript = document.getElementById(transcriptId);
-    this.init(mediaElementId, minimizedMode, autoscroll, doubleClick, webMonetization);
+    this.init(mediaElementId, minimizedMode, autoscroll, doubleClick, webMonetization, playOnClick);
   }
 
-  init = (mediaElementId, m, a, d, w) => {
+  init = (mediaElementId, minimizedMode, autoscroll, doubleClick, webMonetization, playOnClick) => {
     const windowHash = window.location.hash;
     const hashVar = windowHash.substring(1, windowHash.indexOf('='));
 
@@ -170,18 +170,19 @@ class HyperaudioLite {
       false,
     );
 
-    this.minimizedMode = m;
+    this.minimizedMode = minimizedMode;
     this.textShot = '';
     this.wordIndex = 0;
 
-    this.autoscroll = a;
+    this.autoscroll = autoscroll;
     this.scrollerContainer = this.transcript;
     this.scrollerOffset = 0;
     this.scrollerDuration = 800;
     this.scrollerDelay = 0;
 
-    this.doubleClick = d;
-    this.webMonetization = w;
+    this.doubleClick = doubleClick;
+    this.webMonetization = webMonetization;
+    this.playOnClick = playOnClick;
     this.highlightedText = false;
     this.start = null;
 
@@ -365,6 +366,9 @@ class HyperaudioLite {
     if (!isNaN(parseFloat(timeSecs))) {
       this.end = null;
       this.myPlayer.setTime(timeSecs);
+      if (this.playOnClick === true) {
+        this.myPlayer.play();
+      }
     }
   };
 
@@ -373,6 +377,7 @@ class HyperaudioLite {
   };
 
   checkPlayHead = () => {
+
     this.clearTimer();
 
     (async (instance) => {
@@ -383,6 +388,7 @@ class HyperaudioLite {
         instance.myPlayer.setTime(instance.currentTime);
         instance.highlightedText = false;
       }
+
       instance.checkStatus();
     })(this);
   }