Merge branch 'Alpha-snapshot20230519' of http://121.4.94.30:3000/mrlan/EnglishPal into Bug522-HuangZirui

app/static/config.yml

@@ -7,7 +7,6 @@ css:
 js:
   head: # 在页面加载之前加载
     - ../static/js/jquery.js
-    - ../static/js/read.js
     - ../static/js/word_operation.js
   bottom: # 在页面加载完之后加载
     - ../static/js/fillword.js

app/static/js/fillword.js

@@ -1,5 +1,9 @@
 let isRead = true;
 let isChoose = true;
+let reader = window.speechSynthesis; // 全局定义朗读者，以便朗读和暂停
+let current_position = 0; // 朗读文本的当前位置
+let original_position = 0; // 朗读文本的初始位置
+let to_speak = ""; // 朗读的初始内容
 
 function getWord() {
     return window.getSelection ? window.getSelection() : document.selection.createRange().text;
@@ -7,7 +11,7 @@ function getWord() {
 
 function fillInWord() {
     let word = getWord();
-    if (isRead) Reader.read(word, inputSlider.value);
+    if (isRead) read(word);
     if (!isChoose) return;
     const element = document.getElementById("selected-words");
     element.value = element.value + " " + word;
@@ -15,17 +19,50 @@ function fillInWord() {
 
 document.getElementById("text-content").addEventListener("click", fillInWord, false);
 
-const sliderValue = document.getElementById("rangeValue");
-const inputSlider = document.getElementById("rangeComponent");
+function makeUtterance(str, rate) {
+    let msg = new SpeechSynthesisUtterance(str);
+    msg.rate = rate;
+    msg.lang = "en-US"; // TODO: add language options menu
+    msg.onboundary = ev => {
+        if (ev.name == "word") {
+            current_position = ev.charIndex;
+        }
+    }
+    return msg;
+}
+
+const sliderValue = document.getElementById("rangeValue"); // 显示值
+const inputSlider = document.getElementById("rangeComponent"); // 滑块元素
 inputSlider.oninput = () => {
-    let value = inputSlider.value;
+    let value = inputSlider.value; // 获取滑块的值
     sliderValue.textContent = value + '×';
+    if (!reader.speaking) return;
+    reader.cancel();
+    let msg = makeUtterance(to_speak.substring(original_position + current_position), value);
+    original_position = original_position + current_position;
+    current_position = 0;
+    reader.speak(msg);
 };
 
+function read(s) {
+    to_speak = s.toString();
+    original_position = 0;
+    current_position = 0;
+    let msg = makeUtterance(to_speak, inputSlider.value);
+    reader.speak(msg);
+}
+
 function onReadClick() {
     isRead = !isRead;
+    if (!isRead) {
+        reader.cancel();
+    }
 }
 
 function onChooseClick() {
     isChoose = !isChoose;
 }
+
+function stopRead() {
+    reader.cancel();
+}

app/static/js/read.js

@@ -1,35 +0,0 @@
-var Reader = (function() {
-    let reader = window.speechSynthesis;
-    let current_position = 0;
-    let original_position = 0;
-    let to_speak = "";
-
-    function makeUtterance(str, rate) {
-        let msg = new SpeechSynthesisUtterance(str);
-        msg.rate = rate;
-        msg.lang = "en-US";
-        msg.onboundary = ev => {
-            if (ev.name == "word") {
-                current_position = ev.charIndex;
-            }
-        }
-        return msg;
-    }
-
-    function read(s, rate) {
-        to_speak = s.toString();
-        original_position = 0;
-        current_position = 0;
-        let msg = makeUtterance(to_speak, rate);
-        reader.speak(msg);
-    }
-
-    function stopRead() {
-        reader.cancel();
-    }
-
-    return {
-        read: read,
-        stopRead: stopRead
-    };
-})();

app/static/js/word_operation.js

@@ -62,13 +62,6 @@ function delete_word(theWord) {
     });
 }
 
-function read_word(theWord) {
-    let to_speak = $("#word_" + theWord).text();
-    original_position = 0;
-    current_position = 0;
-    Reader.read(to_speak, inputSlider.value);
-}
-
 /* 
  * interface Word {
  *   word: string,
@@ -102,7 +95,6 @@ function wordTemplate(word) {
         <a class="btn btn-success" onclick="familiar('${word.word}')" role="button">熟悉</a>
         <a class="btn btn-warning" onclick="unfamiliar('${word.word}')" role="button">不熟悉</a>
         <a class="btn btn-danger" onclick="delete_word('${word.word}')" role="button">删除</a>
-        <a class="btn btn-info" onclick="read_word('${word.word}')" role="button">朗读</a>
     </p>`;
 }
 

app/templates/userpage_get.html

@@ -133,7 +133,6 @@
                     <a class="btn btn-success" onclick="familiar('{{ word }}')" role="button">熟悉</a>
                     <a class="btn btn-warning" onclick="unfamiliar('{{ word }}')" role="button">不熟悉</a>
                     <a class="btn btn-danger" onclick="delete_word('{{ word }}')" role="button">删除</a>
-                    <a class="btn btn-info" onclick="read_word('{{ word }}')" role="button">朗读</a>
                 </p>
             {% endfor %}
         </div>

app/wordfreqCMD.py

@@ -39,7 +39,7 @@ def file2str(fname):#文件转字符
 
 
 def remove_punctuation(s): # 这里是s是形参 (parameter)。函数被调用时才给s赋值。
-    special_characters = '\_©~<=>+/[]*&$%^@.,?!:;#()"“”—‘’{}|' # 把里面的字符都去掉
+    special_characters = '\_©~<=>+-/[]*&$%^@.,?!:;#()"“”—‘’{}|' # 把里面的字符都去掉
     for c in special_characters:
         s = s.replace(c, ' ') # 防止出现把 apple,apple 移掉逗号后变成 appleapple 情况
     s = s.replace('--', ' ')