j1-template 2023.9.1 → 2023.9.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e259c6199a506b671c11fbfe02afafd99a39ad8a3bcdbf75eafcd8e3c5432686
-  data.tar.gz: e38cdff95f88d0ffbddbccc0be4cd620e53aecf687863efe47591f1dc2095941
+  metadata.gz: e9b6f995afde1773f30da8ca14b395b5671e3cf0587bfd455b7a1d2df3fab4d2
+  data.tar.gz: 69c717035879827a595e080097b88cde053923fbd66348f800e94385ad3d9a31
 SHA512:
-  metadata.gz: e1d9124cc29cb5378cb5497914eeb8a29c61d7ef23d136f4e8dbd7ce1d85f715b60bbbdab5fc5b640f6428417ad71f73df0e04e8cdbae2868258c71456fde7c1
-  data.tar.gz: a732f6ec822d08fa55ce7145e1de3f10f60960b4dd9e93289e928fd9e97aa9a54bf18d8c8af3b19ca2c3795bb53af17a76c9259221f61662af8920788d3df248
+  metadata.gz: 5df11565f6d500fa76cf27e1bd64129cd4356ee0c0f37badd5238938bd3ed960a1cc15d948d0d06ab616e8442638b4897b0935b915cded2f06e43ebc10efd7b4
+  data.tar.gz: fb4582b5cda150586a0970000b7e8c27d1c82a06a1c5fd6716f76d4f6c2f17a0859feb0883d8ce7e212e7fb8b8875f38a0b8f05bb48c6167145fbc23523c31d8

data/assets/data/speak2me.html

@@ -146,7 +146,7 @@ exclude_from_search:                    true
             <button type="button"
               id="speak_button"
               class="btn btn-{{speak2me_options.modal.settings.speak_button_style}} btn-sm"
-              style="min-width: 180px"
+              style="min-width: 180px;"
               onclick="j1.adapter.speak2me.speak('{{speak2me_options.speechSelector}}')"
               data-bs-dismiss="modal">
               <i class="mdib mdib-speaker mdib-sm mr-2"></i>
@@ -157,7 +157,7 @@ exclude_from_search:                    true
             <button type="button"
               id="stop_button"
               class="btn btn-{{speak2me_options.modal.settings.stop_button_style}} btn-sm"
-              style="min-width: 180px"
+              style="min-width: 180px; display: none;"
               onclick="j1.adapter.speak2me.stop()"
               data-bs-dismiss="modal">
               <i class="mdib mdib-speaker-off mdib-sm mr-2"></i>
@@ -168,8 +168,9 @@ exclude_from_search:                    true
             <button type="button"
               id="pause_button"
               class="btn btn-{{speak2me_options.modal.settings.pause_button_style}} btn-sm"
-              style="min-width: 180px"
-              onclick="j1.adapter.speak2me.pause()">
+              style="min-width: 180px; display: none;"
+              onclick="j1.adapter.speak2me.pause()"
+              data-bs-dismiss="modal">
               <i class="mdib mdib-pause mdib-sm mr-2"></i>
               {{speak2me_options.modal.settings.pause_button_text}}
             </button>
@@ -178,8 +179,9 @@ exclude_from_search:                    true
             <button type="button"
               id="resume_button"
               class="btn btn-{{speak2me_options.modal.settings.resume_button_style}} btn-sm"
-              style="min-width: 180px"
-              onclick="j1.adapter.speak2me.resume()">
+              style="min-width: 180px; display: none;"
+              onclick="j1.adapter.speak2me.resume()"
+              data-bs-dismiss="modal">
               <i class="mdib mdib-play-pause mdib-sm mr-2"></i>
               {{speak2me_options.modal.settings.resume_button_text}}
             </button>
@@ -188,7 +190,7 @@ exclude_from_search:                    true
             <button type="button"
               id="exit_button"
               class="btn btn-{{speak2me_options.modal.settings.exit_button_style}}  btn-sm"
-              style="min-width: 180px"
+              style="min-width: 180px;"
               data-bs-dismiss="modal">
               <i class="mdib mdib-close mdib-sm mr-2"></i>
               {{speak2me_options.modal.settings.exit_button_text}}

data/assets/themes/j1/adapter/js/navigator.js

@@ -877,7 +877,9 @@ j1.adapter.navigator = (function (j1, window) {
       // jadams, 2023-02-26: navicon settings
       style  = '<style>';
       style += '  .nav-icon {';
-      style += '    color: ' + navQuicklinksOptions.icon_color + ' !important;';
+//    style += '    color: ' + navQuicklinksOptions.icon_color + ' !important;';
+      style += '    color: ' + navQuicklinksOptions.icon_color + ';';
+      quicklinks
       style += '  }';
       style += '</style>';
       $('head').append(style);
@@ -885,7 +887,8 @@ j1.adapter.navigator = (function (j1, window) {
       // jadams, 2023-02-26: navicon settings
       style  = '<style>';
       style += '  .nav-icon:hover {';
-      style += '    color: ' + navQuicklinksOptions.icon_color_hover + ' !important;';
+//    style += '    color: ' + navQuicklinksOptions.icon_color_hover + ' !important;';
+      style += '    color: ' + navQuicklinksOptions.icon_color_hover + ';';
       style += '  }';
       style += '</style>';
       $('head').append(style);

data/assets/themes/j1/adapter/js/speak2me.js

@@ -78,6 +78,11 @@ regenerate:                             true
  # -----------------------------------------------------------------------------
 */
 
+/* Further reading
+  https://dev.to/jankapunkt/cross-browser-speech-synthesis-the-hard-way-and-the-easy-way-353
+  https://github.com/jankapunkt/easy-speech
+*/
+
 // -----------------------------------------------------------------------------
 // ESLint shimming
 // -----------------------------------------------------------------------------
@@ -99,9 +104,16 @@ var isOpera           = /OPR/i.test(navigator.userAgent);
 var isAvast           = /Avast/i.test(navigator.userAgent);
 var isChrome          = ((chrome) && (!isEdge));
 var ttsDisabled       = false;
+var mobilesDisabled   = false;
+var browsersDisabled  = [];
 var isMobile          = (window.orientation !== undefined) ? true :false;       // NOTE: window.orientation is DEPRECATED
 // var isMobile       = (screen.orientation.type == 'portrait-secondary') ? true : false;
 
+// synthetic puase
+var isPaused            = false;
+var lastSpokenChunk     = false;
+var lastScrollPosition  = false;
+
 var frontmatterOptions;
 var speak2meDefaults;
 var speak2meSettings;
@@ -110,10 +122,21 @@ var speak2meModal;
 var _this;
 var logger;
 var logText;
+var chromeWorkaround;
+var chromeWorkaroundPause
+var chromeWorkaroundResume;
+var $buttonPause;
+var $buttonResume;
+
+let isRunning = true;
+let intervalId;
 
-// -------------------------------------------------------------------------
+const scrollBehavior      = 'smooth';
+
+
+// -----------------------------------------------------------------------------
 // global event handler
-// -------------------------------------------------------------------------
+// -----------------------------------------------------------------------------
 var Events = {
   documentReady: function (onDocumentReady) {
     if (document.readyState !== 'loading') {
@@ -149,7 +172,7 @@ var Events = {
 
       // create settings object from frontmatter
       //
-      frontmatterOptions  = options != null ? $.extend({}, options) : {};
+      frontmatterOptions = options != null ? $.extend({}, options) : {};
 
       // create settings object from module options
       //
@@ -158,6 +181,8 @@ var Events = {
       speak2meOptions  = $.extend(true, {}, speak2meDefaults, speak2meSettings, frontmatterOptions);
 
       ttsDisabled      = (speak2meOptions.tts == "false") ? true : false;
+      mobilesDisabled  = (speak2meOptions.mobilesDisabled == "false") ? true : false;
+      browsersDisabled = speak2meOptions.browsersDisabled;
 
       _this  = j1.adapter.speak2me;
       logger = log4javascript.getLogger('j1.adapter.speak2me');
@@ -176,43 +201,38 @@ var Events = {
 
         if (j1.getState() === 'finished' && pageVisible && atticFinished) {
 
-          if (isMobile) {
-            console.log('module speak2me is currently not supported for the Opera browser');
+          if (mobilesDisabled && isMobile) {
+            console.log('speak: module speak2me is disabled for mobile browsers');
             $('#quickLinksSpeakButton').hide();
             clearInterval(dependencies_met_page_ready);
             return;
           }
 
-          if (isOpera) {
-            console.log('module speak2me is currently not supported for the Firefox browser');
+          var operaDisabled = (browsersDisabled.includes('Opera')) ? true : false;
+          if (operaDisabled && isOpera) {
+            console.log('speak: module speak2me is disabled for the Opera browser');
             $('#quickLinksSpeakButton').hide();
             clearInterval(dependencies_met_page_ready);
             return;
           }
 
-          if (isAvast) {
-            console.log('module speak2me is currently not supported for the Avast Secure browser');
+          var firefoxDisabled = (browsersDisabled.includes('Firefox')) ? true : false;
+          if (firefoxDisabled && isFirefox) {
+            console.log('speak: module speak2me is disabled for the Firefox browser');
             $('#quickLinksSpeakButton').hide();
             clearInterval(dependencies_met_page_ready);
             return;
           }
 
-          if (isFirefox) {
-            console.log('module speak2me is currently not supported on mobile devices');
+          // Avast Secure Browser always disabled
+          //
+          if (isAvast) {
+            console.log('module speak2me is not supported for the Avast Secure browser');
             $('#quickLinksSpeakButton').hide();
             clearInterval(dependencies_met_page_ready);
             return;
           }
 
-          if (isChrome) {
-            var chromeWorkaround = setInterval(function () {
-              if ($().speak2me('isSpeaking')) {
-                $().speak2me('pause').speak2me('resume');
-                logger.debug('\n' + 'speak: send pause-resumed');
-              }
-            }, speak2meOptions.chrome_pause_resume_cycle);
-          }
-
           if (ttsDisabled) {
             logger.warn('\n' + 'tts detected: disabled');
             $('#quickLinksSpeakButton').hide();
@@ -245,21 +265,66 @@ var Events = {
           // on 'show'
           // -------------------------------------------------------------------
           $('#speak2me_container').on('show.bs.modal', function () {
-            if (isChrome || isEdge) {
-              logger.warn('\n' + 'chromium browser detected: pause|resume buttons disabled');
-              $('#pause_button').hide();
-              $('#resume_button').hide();
-            }
             _this.create('#voiceSelector');
           }); // END modal on 'show'
 
           // -------------------------------------------------------------------
           // on 'shown'
           // -------------------------------------------------------------------
-          // $('#speak2me_container').on('shown.bs.modal', function () {
-          //     // do something here
-          //     return;
-          // }); // END modal on 'shown'
+          $('#speak2me_container').on('shown.bs.modal', function () {
+            this.$buttonSpeak = $('#speak_button');
+            this.$buttonStop  = $('#stop_button');
+
+            // setup workaround for chromium based browsers
+            // to enable infinite speech output
+            //
+            this.$buttonSpeak.click(function () {
+              if (isChrome) {
+                logger.info('\n' + 'speak: setup pause workaround for chromium based browsers');
+                chromeWorkaround = setInterval(function () {
+                  var isSpeaking  = $().speak2me('isSpeaking');
+
+                  logger.info('\n' + 'speak: isSpeaking|isPaused: ' + isSpeaking + '|' + isPaused);
+                  if (isSpeaking) {
+                    $().speak2me('pause').speak2me('resume');
+                    logger.info('\n' + 'speak: send pause-resumed');
+                  } else {
+                    $().speak2me('resume');
+                    logger.info('\n' + 'speak: send resumed');
+                  }
+
+                }, speak2meOptions.chrome_pause_resume_cycle);
+              }
+            });
+
+            // stop workaround for chromium based browsers
+            //
+            this.$buttonStop.click(function () {
+              logger.info('\n' + 'speak: remove pause workaround for chromium based browsers');
+              // wait 3 sec to make sure speech output is stopped
+              setTimeout (function() {
+                var isSpeaking  = $().speak2me('isSpeaking');
+                var isPaused    = $().speak2me('isPaused');
+
+                // remove pause indication
+                $('.mdib-speaker').removeClass('md-orange');
+
+                if (!isSpeaking && !isPaused) {
+                  clearInterval(chromeWorkaround);
+                }
+              }, 3000);
+            });
+
+          }); // END modal on 'shown'
+
+          // -------------------------------------------------------------------
+          // on 'hidden' (close)
+          // -------------------------------------------------------------------
+          $('#speak2me_container').on('hidden.bs.modal', function () {
+            //
+            // do something here
+            //
+          }); // END modal on 'hidden'
 
           _this.setState('finished');
           logger.debug('\n' + 'state: ' + _this.getState());
@@ -316,7 +381,7 @@ var Events = {
 
     // -------------------------------------------------------------------------
     // speak()
-    // calls the 'speak' functiion of the screen reader
+    // calls the 'speak' functiion of the converter
     // -------------------------------------------------------------------------
     speak: function (obj) {
       // Get the parameter values from the input sliders
@@ -329,45 +394,115 @@ var Events = {
       // chained together as demonstrated below
       //
       $(obj).speak2me('rate', rate).speak2me('pitch', pitch).speak2me('volume', volume);
+
       // $(obj).speak2me('ignore', 'h2','h3');
-      var speaker = $(obj).speak2me('speak');
-      $(".mdib-speaker").addClass("mdib-spin");
 
-      // just for debugging completeness, no errors seem to be thrown though
-      speaker.addEventListener('error', (event) => {
-        console.log('speak2me error:', event);
+      var paused;
+      if (!lastSpokenChunk) {
+        paused = false;
+      } else {
+        paused = true;
+      }
+
+      var speaker = $(obj).speak2me('speak', {
+        isPaused: paused,
+        lastChunk: lastSpokenChunk,
+        lastScrollPosition: lastScrollPosition,
       });
 
+      // set speak indication;
+      $('.mdib-speaker').addClass('mdib-spin');
+
+      $('#stop_button').show();
+      $('#pause_button').show();
+
+      // hide buttons NOT needed
+      //
+      $('#speak_button').hide();
+      $('#resume_button').hide();
+
+      // just for debugging completeness, no errors seem to be thrown though
+      // speaker.addEventListener('error', (event) => {
+      //   console.log('speak2me error:', event);
+      // });
+
     }, // END speak
 
     // -------------------------------------------------------------------------
     // pause()
-    // Calls the 'pause' function of rge screen reader
+    // Calls the 'pause' function of the converter
     // -------------------------------------------------------------------------
     pause: function () {
-      $().speak2me('pause');
-      $(".mdib-speaker").removeClass("mdib-spin");
+      // remove speak indication;
+      $('.mdib-speaker').removeClass('mdib-spin');
+
+      // set pause indication
+      $('.mdib-speaker').addClass('md-orange');
+
+      if (!isChrome) {
+        $().speak2me('pause');
+      } else {
+        // synthetic pause-resume for chromium-based browsers
+        //
+        lastSpokenChunk     = $().speak2me('isSpoken');
+        lastScrollPosition  = $().speak2me('isScrolled');
+        $().speak2me('stop');
+      }
+
+      $('#resume_button').show();
+
+      // hide buttons NOT needed
+      //
+      $('#pause_button').hide();
+
     }, // END pause
 
     // -------------------------------------------------------------------------
     // resume()
-    // Calls the 'resume' function of rge screen reader
+    // Calls the 'resume' function of the converter
     // -------------------------------------------------------------------------
     resume: function () {
-      $().speak2me('resume');
-      $(".mdib-speaker").addClass("mdib-spin");
+      $('.mdib-speaker').addClass('mdib-spin');
+      if (!isChrome) {
+        $().speak2me('resume');
+      } else {
+        // synthetic pause-resume for chromium-based browsers
+        //
+        _this.speak('{{speak2me_options.speechSelector}}');
+      }
+
+      $('#pause_button').show();
+
+      // hide buttons NOT needed
+      //
+      $('#resume_button').hide();
+
+      // remove pause indication
+      $('.mdib-speaker').removeClass('md-orange');
+
     }, // END resume
 
     // -------------------------------------------------------------------------
     // stop()
-    // Calls the 'stop' function of rge screen reader
+    // Calls the 'stop' function of the converter
     // -------------------------------------------------------------------------
     stop: function () {
-      $().speak2me('stop');
-      $(".mdib-speaker").removeClass("mdib-spin");
-      // potential workaround, when selected language in voice
+      $().speak2me('stop')
+      // remove speak indication;
+      $('.mdib-speaker').removeClass('mdib-spin');
+      // remove pause indication
+      $('.mdib-speaker').removeClass('md-orange');
+
+      $('#speak_button').show();
+
+      // jadams, 2023-09-28;
+      // workaroud: reload page to reset TTS dialog (buttons)
+      location.reload();
+
+      // jadams, 2023-09-28;
+      // solution required, when selected language in voice
       // selector (dialog) has NOT changed if translation was changed
-      // location.reload();
+
     }, // END stop
 
     // -------------------------------------------------------------------------