From 1dfe370983a7a8112b278f5bfce5fd5587104c49 Mon Sep 17 00:00:00 2001
From: Lan Hui <1348141770@qq.com>
Date: Tue, 2 Aug 2022 11:39:35 +0800
Subject: [PATCH 1/6] Use better variable names
---
app/static/js/highlight.js | 26 +++++++++++++-------------
1 file changed, 13 insertions(+), 13 deletions(-)
diff --git a/app/static/js/highlight.js b/app/static/js/highlight.js
index 008f71e..b026e06 100644
--- a/app/static/js/highlight.js
+++ b/app/static/js/highlight.js
@@ -23,10 +23,10 @@ function getWord() {
function highLight() {
if (!isHighlight) return;
let txt = document.getElementById("article").innerText;
- let sel_word1 = document.getElementById("selected-words");
- let sel_word2 = document.getElementById("selected-words2");
- if (sel_word1 != null) {
- const list = sel_word1.value.split(" ");
+ let picked_words = document.getElementById("selected-words");
+ let dictionary_words = document.getElementById("selected-words2");
+ if (picked_words != null) {
+ const list = picked_words.value.split(" ");
for (let i = 0; i < list.length; ++i) {
list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除字符串两边空字符
if (list[i] !== "" && "".indexOf(list[i]) === -1 && "".indexOf(list[i]) === -1) {
@@ -35,8 +35,8 @@ function highLight() {
}
}
}
- if (sel_word2 != null) {
- const list2 = sel_word2.value.split(" ");
+ if (dictionary_words != null) {
+ const list2 = dictionary_words.value.split(" ");
for (let i = 0; i < list2.length; ++i) {
list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
if (list2[i] !== "" && "".indexOf(list2[i]) === -1 && "".indexOf(list2[i]) === -1) {
@@ -49,11 +49,11 @@ function highLight() {
}
function cancel_highLight() {
- const list = sel_word1.value.split(" ");
+ const list = picked_words.value.split(" ");
let txt = document.getElementById("article").innerText;
- let sel_word1 = document.getElementById("selected-words");
- const sel_word2 = document.getElementById("selected-words2");
- if (sel_word1 != null) {
+ let picked_words = document.getElementById("selected-words");
+ const dictionary_words = document.getElementById("selected-words2");
+ if (picked_words != null) {
for (let i = 0; i < list.length; ++i) {
list[i] = list[i].replace(/(^\s*)|(\s*$)/g, "");
if (list[i] !== "") {
@@ -61,10 +61,10 @@ function cancel_highLight() {
}
}
}
- if (sel_word2 != null) {
- let list2 = sel_word1.value.split(" ");
+ if (dictionary_words != null) {
+ let list2 = picked_words.value.split(" ");
for (let i = 0; i < list2.length; ++i) {
- list2 = sel_word2.value.split(" ");
+ list2 = dictionary_words.value.split(" ");
list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
if (list2[i] !== "") {
txt = txt.replace("" + list[i] + "", "list[i]");
From 47e745e7742658c10c4b201b92719e690fd35b27 Mon Sep 17 00:00:00 2001
From: Lan Hui <1348141770@qq.com>
Date: Tue, 2 Aug 2022 11:45:21 +0800
Subject: [PATCH 2/6] Use better variable name (use articleContent instead of
txt, and use camelCase)
---
app/static/js/highlight.js | 42 +++++++++++++++++++-------------------
1 file changed, 21 insertions(+), 21 deletions(-)
diff --git a/app/static/js/highlight.js b/app/static/js/highlight.js
index b026e06..9febbc7 100644
--- a/app/static/js/highlight.js
+++ b/app/static/js/highlight.js
@@ -22,56 +22,56 @@ function getWord() {
function highLight() {
if (!isHighlight) return;
- let txt = document.getElementById("article").innerText;
- let picked_words = document.getElementById("selected-words");
- let dictionary_words = document.getElementById("selected-words2");
- if (picked_words != null) {
- const list = picked_words.value.split(" ");
+ let articleContent = document.getElementById("article").innerText;
+ let pickedWords = document.getElementById("selected-words"); // words picked to the text area
+ let dictionaryWords = document.getElementById("selected-words2"); // words appearing in the user's new words list
+ if (pickedWords != null) {
+ const list = pickedWords.value.split(" ");
for (let i = 0; i < list.length; ++i) {
list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除字符串两边空字符
if (list[i] !== "" && "".indexOf(list[i]) === -1 && "".indexOf(list[i]) === -1) {
//将正则表达式进行修改 表示搜索的是两端带有空格的list[i] 那么搜索的便为一个完整单词 然后在mark标签的前后各加了一个空格对其进行替换
- txt = txt.replace(new RegExp("\\s"+list[i]+"\\s", "g"), " " + list[i] + " ");
+ articleContent = articleContent.replace(new RegExp("\\s"+list[i]+"\\s", "g"), " " + list[i] + " ");
}
}
}
- if (dictionary_words != null) {
- const list2 = dictionary_words.value.split(" ");
+ if (dictionaryWords != null) {
+ const list2 = dictionaryWords.value.split(" ");
for (let i = 0; i < list2.length; ++i) {
list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
if (list2[i] !== "" && "".indexOf(list2[i]) === -1 && "".indexOf(list2[i]) === -1) {
//将正则表达式进行修改 表示搜索的是两端带有空格的list2[i] 那么搜索的便为一个完整单词 然后在mark标签的前后各加了一个空格对其进行替换
- txt = txt.replace(new RegExp("\\s"+list2[i]+"\\s", "g"), " " + list2[i] + " ");
+ articleContent = articleContent.replace(new RegExp("\\s"+list2[i]+"\\s", "g"), " " + list2[i] + " ");
}
}
}
- document.getElementById("article").innerHTML = txt;
+ document.getElementById("article").innerHTML = articleContent;
}
function cancel_highLight() {
- const list = picked_words.value.split(" ");
- let txt = document.getElementById("article").innerText;
- let picked_words = document.getElementById("selected-words");
- const dictionary_words = document.getElementById("selected-words2");
- if (picked_words != null) {
+ const list = pickedWords.value.split(" ");
+ let articleContent = document.getElementById("article").innerText;
+ let pickedWords = document.getElementById("selected-words");
+ const dictionaryWords = document.getElementById("selected-words2");
+ if (pickedWords != null) {
for (let i = 0; i < list.length; ++i) {
list[i] = list[i].replace(/(^\s*)|(\s*$)/g, "");
if (list[i] !== "") {
- txt = txt.replace("" + list[i] + "", "list[i]");
+ articleContent = articleContent.replace("" + list[i] + "", "list[i]");
}
}
}
- if (dictionary_words != null) {
- let list2 = picked_words.value.split(" ");
+ if (dictionaryWords != null) {
+ let list2 = pickedWords.value.split(" ");
for (let i = 0; i < list2.length; ++i) {
- list2 = dictionary_words.value.split(" ");
+ list2 = dictionaryWords.value.split(" ");
list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
if (list2[i] !== "") {
- txt = txt.replace("" + list[i] + "", "list[i]");
+ articleContent = articleContent.replace("" + list[i] + "", "list[i]");
}
}
}
- document.getElementById("article").innerHTML = txt;
+ document.getElementById("article").innerHTML = articleContent;
}
function fillInWord() {
From b5dacb9ad21a932c80d891d208184606dcc8ec7b Mon Sep 17 00:00:00 2001
From: Lan Hui <1348141770@qq.com>
Date: Tue, 2 Aug 2022 11:52:40 +0800
Subject: [PATCH 3/6] Improve comments
---
app/static/js/highlight.js | 5 ++---
1 file changed, 2 insertions(+), 3 deletions(-)
diff --git a/app/static/js/highlight.js b/app/static/js/highlight.js
index 9febbc7..1c7d4fb 100644
--- a/app/static/js/highlight.js
+++ b/app/static/js/highlight.js
@@ -28,9 +28,9 @@ function highLight() {
if (pickedWords != null) {
const list = pickedWords.value.split(" ");
for (let i = 0; i < list.length; ++i) {
- list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除字符串两边空字符
+ list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除单词两边的空字符
if (list[i] !== "" && "".indexOf(list[i]) === -1 && "".indexOf(list[i]) === -1) {
- //将正则表达式进行修改 表示搜索的是两端带有空格的list[i] 那么搜索的便为一个完整单词 然后在mark标签的前后各加了一个空格对其进行替换
+ //将文章中所有出现该单词word的地方改为：" " + word + " "。 正则表达式RegExp()中，"\\s"代表单词前后必须要有空格，以防止只对单词中的部分字符高亮的情况出现。
articleContent = articleContent.replace(new RegExp("\\s"+list[i]+"\\s", "g"), " " + list[i] + " ");
}
}
@@ -40,7 +40,6 @@ function highLight() {
for (let i = 0; i < list2.length; ++i) {
list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
if (list2[i] !== "" && "".indexOf(list2[i]) === -1 && "".indexOf(list2[i]) === -1) {
- //将正则表达式进行修改 表示搜索的是两端带有空格的list2[i] 那么搜索的便为一个完整单词 然后在mark标签的前后各加了一个空格对其进行替换
articleContent = articleContent.replace(new RegExp("\\s"+list2[i]+"\\s", "g"), " " + list2[i] + " ");
}
}
From 8cb34e56ba752bab2a18d1f33a3beb2ee5e74363 Mon Sep 17 00:00:00 2001
From: Lan Hui <1348141770@qq.com>
Date: Tue, 2 Aug 2022 12:26:18 +0800
Subject: [PATCH 4/6] Refactor: remove duplicate code block
---
app/static/js/highlight.js | 24 +++++++-----------------
1 file changed, 7 insertions(+), 17 deletions(-)
diff --git a/app/static/js/highlight.js b/app/static/js/highlight.js
index 1c7d4fb..8a48cd9 100644
--- a/app/static/js/highlight.js
+++ b/app/static/js/highlight.js
@@ -25,23 +25,13 @@ function highLight() {
let articleContent = document.getElementById("article").innerText;
let pickedWords = document.getElementById("selected-words"); // words picked to the text area
let dictionaryWords = document.getElementById("selected-words2"); // words appearing in the user's new words list
- if (pickedWords != null) {
- const list = pickedWords.value.split(" ");
- for (let i = 0; i < list.length; ++i) {
- list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除单词两边的空字符
- if (list[i] !== "" && "".indexOf(list[i]) === -1 && "".indexOf(list[i]) === -1) {
- //将文章中所有出现该单词word的地方改为：" " + word + " "。 正则表达式RegExp()中，"\\s"代表单词前后必须要有空格，以防止只对单词中的部分字符高亮的情况出现。
- articleContent = articleContent.replace(new RegExp("\\s"+list[i]+"\\s", "g"), " " + list[i] + " ");
- }
- }
- }
- if (dictionaryWords != null) {
- const list2 = dictionaryWords.value.split(" ");
- for (let i = 0; i < list2.length; ++i) {
- list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
- if (list2[i] !== "" && "".indexOf(list2[i]) === -1 && "".indexOf(list2[i]) === -1) {
- articleContent = articleContent.replace(new RegExp("\\s"+list2[i]+"\\s", "g"), " " + list2[i] + " ");
- }
+ let allWords = pickedWords.value + " " + dictionaryWords.value;
+ const list = allWords.split(" ");
+ for (let i = 0; i < list.length; ++i) {
+ list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除单词两边的空字符
+ if (list[i] !== "" && "".indexOf(list[i]) === -1 && "".indexOf(list[i]) === -1) {
+ //将文章中所有出现该单词word的地方改为：" " + word + " "。 正则表达式RegExp()中，"\\s"代表单词前后必须要有空格，以防止只对单词中的部分字符高亮的情况出现。
+ articleContent = articleContent.replace(new RegExp("\\s"+list[i]+"\\s", "g"), " " + list[i] + " ");
}
}
document.getElementById("article").innerHTML = articleContent;
From 1d8671c5c78768c29dab349670cbcbbb88f5fda5 Mon Sep 17 00:00:00 2001
From: Lan Hui <1348141770@qq.com>
Date: Tue, 2 Aug 2022 12:30:27 +0800
Subject: [PATCH 5/6] Refactor: use better function name
---
app/static/js/highlight.js | 12 ++++++------
1 file changed, 6 insertions(+), 6 deletions(-)
diff --git a/app/static/js/highlight.js b/app/static/js/highlight.js
index 8a48cd9..625fdc0 100644
--- a/app/static/js/highlight.js
+++ b/app/static/js/highlight.js
@@ -1,7 +1,7 @@
let isHighlight = true;
function cancelBtnHandler() {
- cancel_highLight();
+ cancelHighlighting();
document.getElementById("text-content").removeEventListener("click", fillInWord, false);
document.getElementById("text-content").removeEventListener("touchstart", fillInWord, false);
document.getElementById("text-content").addEventListener("click", fillInWord2, false);
@@ -37,11 +37,11 @@ function highLight() {
document.getElementById("article").innerHTML = articleContent;
}
-function cancel_highLight() {
- const list = pickedWords.value.split(" ");
+function cancelHighlighting() {
let articleContent = document.getElementById("article").innerText;
let pickedWords = document.getElementById("selected-words");
- const dictionaryWords = document.getElementById("selected-words2");
+ const dictionaryWords = document.getElementById("selected-words2");
+ const list = pickedWords.value.split(" ");
if (pickedWords != null) {
for (let i = 0; i < list.length; ++i) {
list[i] = list[i].replace(/(^\s*)|(\s*$)/g, "");
@@ -68,13 +68,13 @@ function fillInWord() {
}
function fillInWord2() {
- cancel_highLight();
+ cancelHighlighting();
}
function ChangeHighlight() {
if (isHighlight) {
isHighlight = false;
- cancel_highLight();
+ cancelHighlighting();
} else {
isHighlight = true;
highLight();
From ecc354bc0dc4e0b1fb0fc3845da8f54c34bd7ed7 Mon Sep 17 00:00:00 2001
From: Lan Hui <1348141770@qq.com>
Date: Tue, 2 Aug 2022 12:33:41 +0800
Subject: [PATCH 6/6] Refactor: use better function
---
app/static/js/highlight.js | 3 +--
app/templates/userpage_get.html | 2 +-
2 files changed, 2 insertions(+), 3 deletions(-)
diff --git a/app/static/js/highlight.js b/app/static/js/highlight.js
index 625fdc0..1003918 100644
--- a/app/static/js/highlight.js
+++ b/app/static/js/highlight.js
@@ -71,14 +71,13 @@ function fillInWord2() {
cancelHighlighting();
}
-function ChangeHighlight() {
+function toggleHighlighting() {
if (isHighlight) {
isHighlight = false;
cancelHighlighting();
} else {
isHighlight = true;
highLight();
-
}
}
diff --git a/app/templates/userpage_get.html b/app/templates/userpage_get.html
index be503e6..9e3891b 100644
--- a/app/templates/userpage_get.html
+++ b/app/templates/userpage_get.html
@@ -38,7 +38,7 @@
阅读文章并回答问题
{{ today_article|safe }}
- 生词高亮
+ 生词高亮
大声朗读
划词入库