Merge pull request #102 from d-i-t-a/develop

V1.5.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@d-i-t-a/reader",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "A viewer application for EPUB files.",
   "repository": "https://github.com/d-i-t-a/R2D2BC",
   "license": "Apache-2.0",

src/index.ts

@@ -269,6 +269,10 @@ export async function goToPosition(value) {
     if (IS_DEV) { console.log("goToPosition") }
     return R2Navigator.goToPosition(value)
 }
+export async function applyAtributes(value) {
+    if (IS_DEV) { console.log("applyAtributes") }
+    R2Navigator.applyAtributes(value)
+}
 
 export async function load(config: ReaderConfig): Promise<any> {
     var mainElement = document.getElementById("D2Reader-Container");
@@ -367,6 +371,7 @@ export async function load(config: ReaderConfig): Promise<any> {
         attributes: config.attributes
     })
 
+    // Highlighter
     D2Highlighter = await TextHighlighter.create({ 
         delegate: R2Navigator,
         config: config.highlighter
@@ -582,4 +587,7 @@ exports.positions = function () {
 }
 exports.goToPosition = function (value) {
     goToPosition(value)
+}
+exports.applyAtributes = function (value) {
+    applyAtributes(value)
 }

src/modules/TTS/TTSModule.ts

@@ -77,7 +77,7 @@ export default class TTSModule implements ReaderModule {
             whitespace.forEach(splittingWord => {
                 splittingWord.dataset.ttsColor = this.tts.color
             });
-
+            window.speechSynthesis.getVoices()
             this.initVoices(true);
 
             if (!this.hasEventListener) {
@@ -259,13 +259,20 @@ export default class TTSModule implements ReaderModule {
         if (IS_DEV) console.log("defaultVoiceHasHyphen", defaultVoiceHasHyphen)
         var defaultVoice = undefined
         if (defaultVoiceHasHyphen == true) {
-            defaultVoice = this.voices.filter((v: any) => {
-                var lang = v.lang.replace("_", "-")
-                return lang == navigator.language && v.localService == true
+            defaultVoice = this.voices.filter((voice: SpeechSynthesisVoice) => {
+                var lang = voice.lang.replace("_", "-")
+                return lang == navigator.language && voice.localService == true
             })[0]
         } else {
-            defaultVoice = this.voices.filter((v: any) => {
-                return v.lang == navigator.language && v.localService == true
+            defaultVoice = this.voices.filter((voice: SpeechSynthesisVoice) => {
+                var lang = voice.lang
+                return lang == navigator.language && voice.localService == true
+            })[0]
+        }
+        if (defaultVoice == undefined) {
+            defaultVoice = this.voices.filter((voice: SpeechSynthesisVoice) => {
+                var lang = voice.lang
+                return lang.includes(navigator.language) && voice.localService == true
             })[0]
         }
         if (IS_DEV) console.log("defaultVoice", defaultVoice)
@@ -280,9 +287,11 @@ export default class TTSModule implements ReaderModule {
             if (IS_DEV) console.log("defaultVoice")
             utterance.voice = defaultVoice
         }
-        utterance.lang = utterance.voice.lang
-        if (IS_DEV) console.log("utterance.voice.lang", utterance.voice.lang)
-        if (IS_DEV) console.log("utterance.lang", utterance.lang)
+        if (utterance.voice != undefined) {
+            utterance.lang = utterance.voice.lang
+            if (IS_DEV) console.log("utterance.voice.lang", utterance.voice.lang)
+            if (IS_DEV) console.log("utterance.lang", utterance.lang)
+        }
         if (IS_DEV) console.log("navigator.language", navigator.language)
 
         window.speechSynthesis.speak(utterance);
@@ -374,7 +383,7 @@ export default class TTSModule implements ReaderModule {
 
                             }
                             splittingWord.dataset.ttsCurrentWord = "true"
-                            if (self.delegate.reflowable.isScrollmode() && self.tts.autoScroll && !self.userScrolled) {
+                            if (self.delegate.reflowable.isScrollMode() && self.tts.autoScroll && !self.userScrolled) {
                                 splittingWord.scrollIntoView({
                                     block: "center",
                                     behavior: "smooth",

src/modules/highlight/TextHighlighter.ts

@@ -102,7 +102,7 @@ export default class TextHighlighter {
     private options: any;
     private delegate: IFrameNavigator;
     private lastSelectedHighlight: number = undefined;
-    private config: { selectionMenuItems: Array<SelectionMenuItem>; };
+    private config: { selectionMenuItems: Array<SelectionMenuItem>; api: any; };
     private hasEventListener: boolean
 
 
@@ -681,6 +681,7 @@ export default class TextHighlighter {
     toolboxHide() {
         var toolbox = document.getElementById("highlight-toolbox");
         toolbox.style.display = "none";
+        this.selectionMenuClosed()
     }
 
     // Use short timeout to let the selection updated to 'finish', otherwise some
@@ -762,6 +763,24 @@ export default class TextHighlighter {
         this.toolboxHandler();
     }
 
+    isSelectionMenuOpen = false
+    selectionMenuOpened = debounce(() => {
+        if (!this.isSelectionMenuOpen) {
+            this.isSelectionMenuOpen = true
+            if (oc(this.config).api(false) && oc(this.config).api.selectionMenuOpen(false)) {
+                this.config.api.selectionMenuOpen()
+            }
+        }
+    }, 100);
+    selectionMenuClosed = debounce(() => {
+        if (this.isSelectionMenuOpen) {
+            this.isSelectionMenuOpen = false
+            if (oc(this.config).api(false) && oc(this.config).api.selectionMenuClose(false)) {
+                this.config.api.selectionMenuClose()
+            }
+        }
+    }, 100);
+
     toolboxPlacement() {
         var range = this.dom(this.delegate.iframe.contentDocument.body).getRange();
         if (!range || range.collapsed) {
@@ -781,6 +800,7 @@ export default class TextHighlighter {
 
         if (getComputedStyle(toolbox).display === "none") {
             toolbox.style.display = "block";
+            this.selectionMenuOpened()
 
             var self = this;
 
@@ -955,6 +975,7 @@ export default class TextHighlighter {
                 selection.removeAllRanges();
                 var toolbox = document.getElementById("highlight-toolbox");
                 toolbox.style.display = "none";
+                this.selectionMenuClosed()
             }
         }
     };
@@ -1633,6 +1654,7 @@ export default class TextHighlighter {
                         self.delegate.annotationModule.deleteSelectedHighlight(anno).then(async () => {
                             if (IS_DEV) { console.log("delete highlight " + anno.id) }
                             toolbox.style.display = "none";
+                            self.selectionMenuClosed()
                         })
                         deleteIcon.removeEventListener("click", deleteH);
                     };
@@ -1646,6 +1668,7 @@ export default class TextHighlighter {
 
                 } else {
                     toolbox.style.display = "none";
+                    this.selectionMenuClosed()
                     void toolbox.offsetWidth;
                     toolbox.style.display = "block";
                 }

src/modules/positions/TimelineModule.ts

@@ -80,7 +80,7 @@ export default class TimelineModule implements ReaderModule {
             this.timelineContainer.innerHTML = ""
             this.publication.readingOrder.forEach(link => {
 
-                console.log(link.contentWeight)
+                if (IS_DEV) console.log(link.contentWeight)
                 const linkHref = this.publication.getAbsoluteHref(link.href);
                 const tocItemAbs = this.publication.getTOCItemAbsolute(linkHref);
                 const tocHref = (tocItemAbs.href.indexOf("#") !== -1) ? tocItemAbs.href.slice(0, tocItemAbs.href.indexOf("#")) : tocItemAbs.href
@@ -116,7 +116,7 @@ export default class TimelineModule implements ReaderModule {
 
                     const position1 = this.publication.positions.filter((el: Locator) => el.href === link.href)[0]
                     position1.href = this.publication.getAbsoluteHref(position1.href)
-                    console.log(position1)
+                    if (IS_DEV) console.log(position1)
                     this.delegate.navigate(position1)
                 });