From 2572eaf80cbd604414a2b98ef5850938bf6a405e Mon Sep 17 00:00:00 2001
From: Aferdita Muriqi <aferdita.muriqi@gmail.com>
Date: Tue, 28 Apr 2020 23:54:48 -0400
Subject: [PATCH 1/2] added read aloud feature

---
 src/index.ts                             | 30 +++++++++++++++++++
 src/modules/TTSModule.ts                 | 18 ++++++++++++
 src/modules/highlight/TextHighlighter.ts | 37 ++++++++++++++++++++++++
 src/navigator/IFrameNavigator.ts         | 12 ++++++++
 4 files changed, 97 insertions(+)

diff --git a/src/index.ts b/src/index.ts
index 37b8535c..30a7e847 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -34,6 +34,23 @@ export async function unload() {
     AnnotationModuleInstance.stop()
     TTSModuleInstance.stop()
 }
+export function startReadAloud() {
+    if (IS_DEV) { console.log("startReadAloud") }
+    return R2Navigator.startReadAloud()    
+}
+export function stopReadAloud() {
+    if (IS_DEV) { console.log("stopReadAloud") }
+    return R2Navigator.stopReadAloud()    
+}
+export function pauseReadAloud() {
+    if (IS_DEV) { console.log("pauseReadAloud") }
+    return R2Navigator.pauseReadAloud()    
+}
+export function resumeReadAloud() {
+    if (IS_DEV) { console.log("resumeReadAloud") }
+    return R2Navigator.resumeReadAloud()    
+}
+
 
 export async function saveBookmark() {
     if (IS_DEV) { console.log("saveBookmark") }
@@ -217,6 +234,19 @@ exports.publisher = function (on) {
     publisher(on)
 }
 
+exports.startReadAloud = function () {
+    startReadAloud()
+}
+exports.stopReadAloud = function () {
+    stopReadAloud()
+}
+exports.pasueReadAloud = function () {
+    pauseReadAloud()
+}
+exports.resumeReadAloud = function () {
+    resumeReadAloud()
+}
+
 // - add bookmark
 // - delete bookmark
 exports.saveBookmark = function () {
diff --git a/src/modules/TTSModule.ts b/src/modules/TTSModule.ts
index 340ef8d8..e5075450 100644
--- a/src/modules/TTSModule.ts
+++ b/src/modules/TTSModule.ts
@@ -40,6 +40,24 @@ export default class TTSModule implements ReaderModule {
             self.annotationModule.highlighter.doneSpeaking()
         }    
     }
+    speakAll(selectionInfo: string | undefined , callback: () => void): any {        
+        console.log(selectionInfo)
+        var self = this
+        var utterance = new SpeechSynthesisUtterance(selectionInfo);
+        this.synth.cancel()
+        this.synth.speak(utterance);
+        utterance.onend = function () {      
+            console.log("utterance ended");
+            self.annotationModule.highlighter.doneSpeaking()
+        }    
+        callback()
+    }
+    speakPause() {
+        this.synth.pause()
+    }
+    speakResume() {
+        this.synth.resume()
+    }
     
     public static async create(config: TTSModuleConfig) {
         const annotations = new this(
diff --git a/src/modules/highlight/TextHighlighter.ts b/src/modules/highlight/TextHighlighter.ts
index 4a5eb647..24a1ef96 100644
--- a/src/modules/highlight/TextHighlighter.ts
+++ b/src/modules/highlight/TextHighlighter.ts
@@ -757,6 +757,43 @@ export default class TextHighlighter {
             
         }
     };
+    stopReadAloud() {
+        this.doneSpeaking()
+    }
+    speakAll() {
+        var self = this
+        function getCssSelector(element: Element): string {
+            const options = {
+                className: (str: string) => {
+                    return _blacklistIdClassForCssSelectors.indexOf(str) < 0;
+                },
+                idName: (str: string) => {
+                    return _blacklistIdClassForCssSelectors.indexOf(str) < 0;
+                },
+            };
+            return uniqueCssSelector(element, self.dom(self.el).getDocument(), options);
+        }
+    
+        var node = this.dom(this.el).getWindow().document.body;
+        console.log(self.delegate.delegate.iframe.contentDocument)
+        const selection = self.dom(self.el).getSelection();
+        const range = this.dom(this.el).getWindow().document.createRange();
+        range.selectNodeContents(node);
+        selection.removeAllRanges();
+        selection.addRange(range);
+        const selectionInfo = getCurrentSelectionInfo(this.dom(this.el).getWindow(), getCssSelector)
+
+        if (selectionInfo.cleanText) {
+            this.ttsDelegate.speakAll(selectionInfo.cleanText as any, () => {
+                var selection = self.dom(self.el).getSelection();
+                selection.removeAllRanges();
+                var toolbox = document.getElementById("highlight-toolbox");
+                toolbox.style.display = "none";
+                var backdrop = document.getElementById("toolbox-backdrop");
+                backdrop.style.display = "none";
+            })
+        }
+    };
 
     doneSpeaking() {
         var toolbox = document.getElementById("highlight-toolbox");
diff --git a/src/navigator/IFrameNavigator.ts b/src/navigator/IFrameNavigator.ts
index 2df179f3..4339a0b7 100644
--- a/src/navigator/IFrameNavigator.ts
+++ b/src/navigator/IFrameNavigator.ts
@@ -997,6 +997,18 @@ export default class IFrameNavigator implements Navigator {
         event.preventDefault();
         event.stopPropagation();
     }
+    startReadAloud() {
+        this.annotationModule.highlighter.speakAll()
+    }
+    stopReadAloud() {
+        this.annotationModule.highlighter.stopReadAloud()
+    }
+    pauseReadAloud() {
+        this.ttsModule.speakPause()
+    }
+    resumeReadAloud() {
+        this.ttsModule.speakResume()
+    }
     totalResources(): number {
         return this.publication.readingOrder.length
     }

From 572a9aee793995400a0f9743453571ccda9c8784 Mon Sep 17 00:00:00 2001
From: Aferdita Muriqi <aferdita.muriqi@gmail.com>
Date: Tue, 28 Apr 2020 23:55:14 -0400
Subject: [PATCH 2/2] added examples for read aloud api calls

---
 viewer/index_api.html | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/viewer/index_api.html b/viewer/index_api.html
index 3bf2294f..4903b2a0 100644
--- a/viewer/index_api.html
+++ b/viewer/index_api.html
@@ -32,8 +32,12 @@
         <div id="container-annotations"></div>
     </header>
 
-    <div style="position:fixed;top:0;left:0;z-index: 2;">
+    <div style="position:absolute;top:0;left:0;z-index: 2;">
 
+        <button onclick="javascript:D2Reader.startReadAloud()">read aloud from top</button><br>
+        <button onclick="javascript:D2Reader.stopReadAloud()">stop read aloud from top</button><br>
+        <button onclick="javascript:D2Reader.pauseReadAloud()">pause read aloud from top</button><br>
+        <button onclick="javascript:D2Reader.resumeReadAloud()">resume read aloud from top</button><br>
         <button onclick="javascript:alert(D2Reader.totalResources())">totalResources</button><br>
         <button onclick="javascript:alert(D2Reader.currentResource())">currentResource</button><br>
         <button onclick="javascript:alert(D2Reader.mostRecentNavigatedTocItem())">mostRecentNavigatedTocItem</button><br>