Compare commits
	
		
			16 Commits 
		
	
	
		
			master
			...
			Alpha-snap
		
	
	| Author | SHA1 | Date | 
|---|---|---|
|  | 4d2535a6e8 | |
|  | bb2d0363e4 | |
|  | 9816596cf8 | |
|  | 682247bff1 | |
|  | b22c654f0f | |
|  | d402bb45cb | |
|  | cdf6180901 | |
|  | 38837c9c2f | |
|  | a0ddf4bdad | |
|  | df64065dcc | |
|  | ce28b91bd5 | |
|  | d6bd24ee1c | |
|  | e9e2bd3d23 | |
|  | 320a99d479 | |
|  | 3eca9234a9 | |
|  | 8924166975 | 
|  | @ -29,3 +29,8 @@ function onReadClick() { | ||||||
| function onChooseClick() { | function onChooseClick() { | ||||||
|     isChoose = !isChoose; |     isChoose = !isChoose; | ||||||
| } | } | ||||||
|  | 
 | ||||||
|  | // 如果网页刷新,停止播放声音
 | ||||||
|  | if (performance.getEntriesByType("navigation")[0].type == "reload") { | ||||||
|  |     Reader.stopRead(); | ||||||
|  | } | ||||||
|  | @ -22,62 +22,38 @@ function getWord() { | ||||||
| 
 | 
 | ||||||
| function highLight() { | function highLight() { | ||||||
|     if (!isHighlight) return; |     if (!isHighlight) return; | ||||||
|     let articleContent = document.getElementById("article").innerText; //将原来的.innerText改为.innerHtml,使用innerText会把原文章中所包含的<br>标签去除,导致处理后的文章内容失去了原来的格式
 |     let articleContent = document.getElementById("article").innerHTML; // innerHTML保留HTML标签来保持部分格式,且适配不同的浏览器
 | ||||||
|     let pickedWords = document.getElementById("selected-words");  // words picked to the text area
 |     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
 |     let dictionaryWords = document.getElementById("selected-words2"); // words appearing in the user's new words list
 | ||||||
|     let allWords = "";  //初始化allWords的值,避免进入判断后编译器认为allWords未初始化的问题
 |     let allWords = dictionaryWords === null ? pickedWords.value + " " : pickedWords.value + " " + dictionaryWords.value; | ||||||
|     if(dictionaryWords != null){//增加一个判断,检查生词本里面是否为空,如果为空,allWords只添加选中的单词
 |     const list = allWords.split(" "); // 将所有的生词放入一个list中
 | ||||||
|         allWords = pickedWords.value + " " + dictionaryWords.value; |     let totalSet = new Set(); | ||||||
|     } |  | ||||||
|     else{ |  | ||||||
|         allWords = pickedWords.value + " "; |  | ||||||
|     } |  | ||||||
|     const list = allWords.split(" ");//将所有的生词放入一个list中,用于后续处理
 |  | ||||||
|     for (let i = 0; i < list.length; ++i) { |     for (let i = 0; i < list.length; ++i) { | ||||||
|         list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除单词两边的空字符
 |         list[i] = list[i].replace(/(^\W*)|(\W*$)/g, ""); // 消除单词两边的非单词字符
 | ||||||
|         list[i] = list[i].replace('|', ""); |         if (list[i] != "" && !totalSet.has(list[i])) { | ||||||
|         list[i] = list[i].replace('?', ""); |             // 返回所有匹配单词的集合, 正则表达式RegExp()中, "\b"匹配一个单词的边界, g 表示全局匹配, i 表示对大小写不敏感。
 | ||||||
|         if (list[i] !== "" && "<mark>".indexOf(list[i]) === -1 && "</mark>".indexOf(list[i]) === -1) { |             let matches = new Set(articleContent.match(new RegExp("\\b" + list[i] + "\\b", "gi"))); | ||||||
|            //将文章中所有出现该单词word的地方改为:"<mark>" + word + "<mark>"。 正则表达式RegExp()中,"\\b"代表单词边界匹配。
 |             if (matches.has("mark")) { | ||||||
| 
 |                 // 优先处理单词为 "mark" 的情况
 | ||||||
|             //修改代码
 |                 totalSet = new Set(["mark", ...totalSet]); | ||||||
|             let articleContent_fb = articleContent;  //文章副本
 |  | ||||||
|             while(articleContent_fb.toLowerCase().indexOf(list[i].toLowerCase()) !== -1 && list[i]!=""){ |  | ||||||
|                 //找到副本中和list[i]匹配的第一个单词(第一种匹配情况),并赋值给list[i]。
 |  | ||||||
|                 const index = articleContent_fb.toLowerCase().indexOf(list[i].toLowerCase()); |  | ||||||
|                 list[i] = articleContent_fb.substring(index, index + list[i].length); |  | ||||||
| 
 |  | ||||||
|                 articleContent_fb = articleContent_fb.substring(index + list[i].length);    // 使用副本中list[i]之后的子串替换掉副本
 |  | ||||||
|                 articleContent = articleContent.replace(new RegExp("\\b"+list[i]+"\\b","g"),"<mark>" + list[i] + "</mark>"); |  | ||||||
|             } |             } | ||||||
|  |             totalSet = new Set([...totalSet, ...matches]); | ||||||
|         } |         } | ||||||
|     }  |     }  | ||||||
|  |     // 删除所有的mark标签,防止标签发生嵌套
 | ||||||
|  |     articleContent = articleContent.replace(/<(mark)[^>]*>/gi, ""); | ||||||
|  |     articleContent = articleContent.replace(/<(\/mark)[^>]*>/gi, ""); | ||||||
|  |     // 将文章中所有出现该单词word的地方改为:"<mark>" + word + "<mark>"。
 | ||||||
|  |     for (let word of totalSet) { | ||||||
|  |         articleContent = articleContent.replace(new RegExp("\\b" + word + "\\b", "g"), "<mark>" + word + "</mark>"); | ||||||
|  |     } | ||||||
|     document.getElementById("article").innerHTML = articleContent; |     document.getElementById("article").innerHTML = articleContent; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| function cancelHighlighting() { | function cancelHighlighting() { | ||||||
|     let articleContent = document.getElementById("article").innerText;//将原来的.innerText改为.innerHtml,原因同上
 |     let articleContent = document.getElementById("article").innerHTML; | ||||||
|     let pickedWords = document.getElementById("selected-words"); |     articleContent = articleContent.replace(/<(mark)[^>]*>/gi, ""); | ||||||
|     const dictionaryWords = document.getElementById("selected-words2");     |     articleContent = articleContent.replace(/<(\/mark)[^>]*>/gi, ""); | ||||||
|     const list = pickedWords.value.split(" ");     |  | ||||||
|     if (pickedWords != null) { |  | ||||||
|         for (let i = 0; i < list.length; ++i) { |  | ||||||
|             list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); |  | ||||||
|             if (list[i] !== "") { //原来判断的代码中,替换的内容为“list[i]”这个字符串,这明显是错误的,我们需要替换的是list[i]里的内容
 |  | ||||||
|                 articleContent = articleContent.replace(new RegExp("<mark>"+list[i]+"</mark>", "g"), list[i]); |  | ||||||
|             } |  | ||||||
|         } |  | ||||||
|     } |  | ||||||
|     if (dictionaryWords != null) { |  | ||||||
|         let list2 = pickedWords.value.split(" "); |  | ||||||
|         for (let i = 0; i < list2.length; ++i) { |  | ||||||
|             list2 = dictionaryWords.value.split(" "); |  | ||||||
|             list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, ""); |  | ||||||
|             if (list2[i] !== "") { //原来代码中,替换的内容为“list[i]”这个字符串,这明显是错误的,我们需要替换的是list[i]里的内容
 |  | ||||||
|                 articleContent = articleContent.replace(new RegExp("<mark>"+list2[i]+"</mark>", "g"), list2[i]); |  | ||||||
|             } |  | ||||||
|         } |  | ||||||
|     } |  | ||||||
|     document.getElementById("article").innerHTML = articleContent; |     document.getElementById("article").innerHTML = articleContent; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -9,7 +9,7 @@ var Reader = (function() { | ||||||
|         msg.rate = rate; |         msg.rate = rate; | ||||||
|         msg.lang = "en-US"; |         msg.lang = "en-US"; | ||||||
|         msg.onboundary = ev => { |         msg.onboundary = ev => { | ||||||
|             if (ev.name == "word") { |             if (ev.name === "word") { | ||||||
|                 current_position = ev.charIndex; |                 current_position = ev.charIndex; | ||||||
|             } |             } | ||||||
|         } |         } | ||||||
|  | @ -32,4 +32,4 @@ var Reader = (function() { | ||||||
|         read: read, |         read: read, | ||||||
|         stopRead: stopRead |         stopRead: stopRead | ||||||
|     }; |     }; | ||||||
| })(); | }) (); | ||||||
|  |  | ||||||
|  | @ -5,15 +5,14 @@ function familiar(theWord) { | ||||||
|     $.ajax({ |     $.ajax({ | ||||||
|         type:"GET", |         type:"GET", | ||||||
|         url:"/" + username + "/" + word + "/familiar", |         url:"/" + username + "/" + word + "/familiar", | ||||||
|         success:function(response){ |         success:function(response) { | ||||||
|             let new_freq = freq - 1; |             let new_freq = freq - 1; | ||||||
|             const allow_move = document.getElementById("move_dynamiclly").checked; |             const allow_move = document.getElementById("move_dynamiclly").checked; | ||||||
|             if (allow_move) { |             if (allow_move) { | ||||||
| 
 |  | ||||||
|                 if (new_freq <= 0) { |                 if (new_freq <= 0) { | ||||||
|                     removeWord(theWord); |                     removeWord(theWord); | ||||||
|                 } else { |                 } else { | ||||||
|                     renderWord({ word: theWord, freq: new_freq }); |                     renderWord({word: theWord, freq: new_freq}); | ||||||
|                 } |                 } | ||||||
|             } else { |             } else { | ||||||
|                 if(new_freq <1) { |                 if(new_freq <1) { | ||||||
|  | @ -33,11 +32,11 @@ function unfamiliar(theWord) { | ||||||
|     $.ajax({ |     $.ajax({ | ||||||
|         type:"GET", |         type:"GET", | ||||||
|         url:"/" + username + "/" + word + "/unfamiliar", |         url:"/" + username + "/" + word + "/unfamiliar", | ||||||
|         success:function(response){ |         success:function(response) { | ||||||
|             let new_freq = parseInt(freq) + 1; |             let new_freq = parseInt(freq) + 1; | ||||||
|             const allow_move = document.getElementById("move_dynamiclly").checked; |             const allow_move = document.getElementById("move_dynamiclly").checked; | ||||||
|             if (allow_move) { |             if (allow_move) { | ||||||
|                 renderWord({ word: theWord, freq: new_freq }); |                 renderWord({word: theWord, freq: new_freq}); | ||||||
|             } else { |             } else { | ||||||
|                 $("#freq_" + theWord).text(new_freq); |                 $("#freq_" + theWord).text(new_freq); | ||||||
|             } |             } | ||||||
|  | @ -51,7 +50,7 @@ function delete_word(theWord) { | ||||||
|     $.ajax({ |     $.ajax({ | ||||||
|         type:"GET", |         type:"GET", | ||||||
|         url:"/" + username + "/" + word + "/del", |         url:"/" + username + "/" + word + "/del", | ||||||
|         success:function(response){ |         success:function(response) { | ||||||
|             const allow_move = document.getElementById("move_dynamiclly").checked; |             const allow_move = document.getElementById("move_dynamiclly").checked; | ||||||
|             if (allow_move) { |             if (allow_move) { | ||||||
|                 removeWord(theWord); |                 removeWord(theWord); | ||||||
|  | @ -114,7 +113,7 @@ function removeWord(word) { | ||||||
|     // 根据词频信息删除元素
 |     // 根据词频信息删除元素
 | ||||||
|     word = word.replace('&', '&'); |     word = word.replace('&', '&'); | ||||||
|     const element_to_remove = document.getElementById(`p_${word}`); |     const element_to_remove = document.getElementById(`p_${word}`); | ||||||
|     if (element_to_remove != null) { |     if (element_to_remove !== null) { | ||||||
|         element_to_remove.remove(); |         element_to_remove.remove(); | ||||||
|     } |     } | ||||||
| } | } | ||||||
|  | @ -129,7 +128,7 @@ function renderWord(word) { | ||||||
|     for (const current of container.children) { |     for (const current of container.children) { | ||||||
|         const cur_word = parseWord(current); |         const cur_word = parseWord(current); | ||||||
|         // 找到第一个词频比它小的元素,插入到这个元素前面
 |         // 找到第一个词频比它小的元素,插入到这个元素前面
 | ||||||
|         if (compareWord(cur_word, word) == -1) { |         if (compareWord(cur_word, word) === -1) { | ||||||
|             container.insertBefore(new_element, current); |             container.insertBefore(new_element, current); | ||||||
|             inserted = true; |             inserted = true; | ||||||
|             break; |             break; | ||||||
|  | @ -165,17 +164,11 @@ function elementFromString(string) { | ||||||
|  *  当first大于second时返回1 |  *  当first大于second时返回1 | ||||||
|  */ |  */ | ||||||
| function compareWord(first, second) { | function compareWord(first, second) { | ||||||
|     if (first.freq < second.freq) { |     if (first.freq !== second.freq) { | ||||||
|         return -1; |         return first.freq < second.freq ? -1 : 1; | ||||||
|     } |     } | ||||||
|     if (first.freq > second.freq) { |     if (first.word !== second.word) { | ||||||
|         return 1; |         return first.word < second.word ? -1 : 1; | ||||||
|     } |  | ||||||
|     if (first.word < second.word) { |  | ||||||
|         return -1; |  | ||||||
|     } |  | ||||||
|     if (first.word > second.word) { |  | ||||||
|         return 1; |  | ||||||
|     } |     } | ||||||
|     return 0; |     return 0; | ||||||
| } | } | ||||||
|  | @ -5,8 +5,6 @@ | ||||||
|     <meta name="viewport" |     <meta name="viewport" | ||||||
|           content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes"/> |           content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes"/> | ||||||
|     <meta name="format-detection" content="telephone=no"/> |     <meta name="format-detection" content="telephone=no"/> | ||||||
|     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet"> |  | ||||||
|     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"></script> |  | ||||||
| 
 | 
 | ||||||
|     {{ yml['header'] | safe }} |     {{ yml['header'] | safe }} | ||||||
|     {% if yml['css']['item'] %} |     {% if yml['css']['item'] %} | ||||||
|  | @ -28,39 +26,22 @@ | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         @keyframes shakes { |         @keyframes shakes { | ||||||
|             10%, 90% { |             10%, 90% { transform: translate3d(-1px, 0, 0); } | ||||||
|                 transform: translate3d(-1px, 0, 0); |             20%, 50% { transform: translate3d(+2px, 0, 0); } | ||||||
|             } |             30%, 70% { transform: translate3d(-4px, 0, 0); } | ||||||
|             20%, 50% { |             40%, 60% { transform: translate3d(+4px, 0, 0); } | ||||||
|                 transform: translate3d(+2px, 0, 0); |             50% { transform: translate3d(-4px, 0, 0); } | ||||||
|             } |  | ||||||
|             30%, 70% { |  | ||||||
|                 transform: translate3d(-4px, 0, 0); |  | ||||||
|             } |  | ||||||
|             40%, 60% { |  | ||||||
|                 transform: translate3d(+4px, 0, 0); |  | ||||||
|             } |  | ||||||
|             50% { |  | ||||||
|                 transform: translate3d(-4px, 0, 0); |  | ||||||
|             } |  | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         .lead { |         .lead{ | ||||||
|             font-size: 22px; |             font-size: 17px; | ||||||
|             font-family: Helvetica, sans-serif; |             font-family: Arial, Helvetica, sans-serif; | ||||||
|             white-space: pre-wrap; |  | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         .arrow { |         .display-5{ | ||||||
|             padding: 0; |             font-size: 30px; | ||||||
|             font-size: 20px; |  | ||||||
|             line-height: 21px; |  | ||||||
|             display: inline-block; |  | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         .arrow:hover { |  | ||||||
|             cursor: pointer; |  | ||||||
|         } |  | ||||||
| 
 | 
 | ||||||
|     </style> |     </style> | ||||||
| </head> | </head> | ||||||
|  | @ -69,70 +50,57 @@ | ||||||
|     <p><b>English Pal for <font id="username" color="red">{{ username }}</font></b> |     <p><b>English Pal for <font id="username" color="red">{{ username }}</font></b> | ||||||
| 
 | 
 | ||||||
|         {% if username ==  admin_name %} |         {% if username ==  admin_name %} | ||||||
|             <a class="btn btn-secondary" href="/admin" role="button" onclick="stopRead()">管理</a> |         <a class="btn btn-secondary" href="/admin" role="button" onclick="stopRead()">管理</a> | ||||||
|         {% endif %} |         {% endif %} | ||||||
|         <a id="quit" class="btn btn-secondary" href="/logout" role="button" onclick="stopRead()">退出</a> |         <a id="quit" class="btn btn-secondary" href="/logout" role="button" onclick="stopRead()">退出</a> | ||||||
|         <a class="btn btn-secondary" href="/reset" role="button" onclick="stopRead()">重设密码</a> |         <a class="btn btn-secondary" href="/reset" role="button" onclick="stopRead()">重设密码</a> | ||||||
| 
 | 
 | ||||||
|     </p> |     </p> | ||||||
|     {% for message in get_flashed_messages() %} | {#    {% for message in flashed_messages %}#} {# 根据user_service.userpage,取消了参数flashed_messages,因此注释了这段代码 #} | ||||||
|         <div class="alert alert-warning alert-dismissible fade show" role="alert"> | {#        <div class="alert alert-warning" role="alert">Congratulations! {{ message }}</div>#} | ||||||
|             {{ message }} | {#    {% endfor %}#} | ||||||
|             <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> |  | ||||||
|         </div> |  | ||||||
|     {% endfor %} |  | ||||||
| 
 | 
 | ||||||
|     <button class="arrow" id="load_next_article" onclick="load_next_article();Reader.stopRead()" |         <button class="btn btn-success" id="load_next_article" onclick="load_next_article();Reader.stopRead()"> 下一篇 Next Article </button> | ||||||
|             title="下一篇 Next Article">⇨ |         <button class="btn btn-success" id="load_pre_article" onclick="load_pre_article();Reader.stopRead()" > 上一篇 Previous Article </button> | ||||||
|     </button> |  | ||||||
|     <button class="arrow" id="load_pre_article" onclick="load_pre_article();Reader.stopRead()" style="display: none" |  | ||||||
|             title="上一篇 Previous Article">⇦ |  | ||||||
|     </button> |  | ||||||
| 
 | 
 | ||||||
|     <p><b>阅读文章并回答问题</b></p> |     <p><b>阅读文章并回答问题</b></p> | ||||||
|     <div id="text-content"> |     <div id="text-content"> | ||||||
|         <div id="found"> |         <div id="found"> | ||||||
|             <div class="alert alert-success" role="alert">According to your word list, your level is <span |             <div class="alert alert-success" role="alert">According to your word list, your level is <span class="badge bg-success" id="user-level">{{ today_article["user_level"] }}</span>  and we have chosen an article with a difficulty level of <span class="badge bg-success" id="text_level">{{ today_article["text_level"] }}</span> for you.</div> | ||||||
|                     class="text-decoration-underline" id="user_level">{{ today_article["user_level"] }}</span> and we |                 <p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/> | ||||||
|                 have chosen an article with a difficulty level of <span class="text-decoration-underline" |  | ||||||
|                                                                         id="text_level">{{ today_article["text_level"] }}</span> |  | ||||||
|                 for you. |  | ||||||
|             </div> |  | ||||||
|             <p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/> |  | ||||||
|             <div class="p-3 mb-2 bg-light text-dark" style="margin: 0 0.5%;"><br/> |             <div class="p-3 mb-2 bg-light text-dark" style="margin: 0 0.5%;"><br/> | ||||||
|                 <p class="display-6" id="article_title">{{ today_article["article_title"] }}</p><br/> |             <p class="display-5" id="article_title">{{ today_article["article_title"] }}</p><br/> | ||||||
|                 <p class="lead"><font id="article">{{ today_article["article_body"] }}</font></p><br/> |             <p class="lead"><font id="article">{{ today_article["article_body"] }}</font></p><br/> | ||||||
|                 <div> |             <div> | ||||||
|                     <p><small class="text-muted" id="source">{{ today_article['source'] }}</small></p><br/> |                 <h6>source: </h6> | ||||||
|                 </div> |                 <p><small class="text-muted" id="source">{{ today_article['source'] }}</small></p><br/> | ||||||
|  |             </div> | ||||||
|              |              | ||||||
|                 <p><b id="question">{{ today_article['question'] }}</b></p><br/> |             <p><b id="question">{{ today_article['question'] }}</b></p><br/> | ||||||
|                 <script type="text/javascript"> |                 <script type="text/javascript"> | ||||||
|                     function toggle_visibility(id) { {# https://css-tricks.com/snippets/javascript/showhide-element/#} |                     function toggle_visibility(id) { {# https://css-tricks.com/snippets/javascript/showhide-element/#} | ||||||
|                         const e = document.getElementById(id); |                         const e = document.getElementById(id); | ||||||
|                         if (e.style.display === 'block') |                         if(e.style.display === 'block') | ||||||
|                             e.style.display = 'none'; |                             e.style.display = 'none'; | ||||||
|                         else |                         else | ||||||
|                             e.style.display = 'block'; |                             e.style.display = 'block'; | ||||||
|                     } |                     } | ||||||
|                 </script> |                 </script> | ||||||
|                 <button onclick="toggle_visibility('answer');">ANSWER</button> |                 <button onclick="toggle_visibility('answer');">ANSWER</button> | ||||||
|                 <div id="answer" style="display:none;">{{ today_article['answer'] }}</div> |                 <div id="answer" style="display:none;">{{ today_article['answer'] }}</div><br/> | ||||||
|                 <br/> |  | ||||||
|             </div> |             </div> | ||||||
|         </div> |         </div> | ||||||
|         <div class="alert alert-success" role="alert" id="not_found" style="display:none;"> |         <div class="alert alert-success" role="alert" id="not_found" style="display:none;"> | ||||||
|             <p class="text-muted"><span class="badge bg-success">Notes:</span><br>No article is currently available for |             <p class="text-muted"><span class="badge bg-success">Notes:</span><br>No article is currently available for you. You can try again a few times or mark new words in the passage to improve your level.</p> | ||||||
|                 you. You can try again a few times or mark new words in the passage to improve your level.</p> |  | ||||||
|         </div> |         </div> | ||||||
|         <div class="alert alert-success" role="alert" id="read_all" style="display:none;"> |         <div class="alert alert-success" role="alert" id="read_all" style="display:none;"> | ||||||
|             <p class="text-muted"><span class="badge bg-success">Notes:</span><br>You've read all the articles.</p> |             <p class="text-muted"><span class="badge bg-success">Notes:</span><br>You've read all the articles.</p> | ||||||
|         </div> |         </div> | ||||||
|     </div> |     </div> | ||||||
| 
 | 
 | ||||||
|     <input type="checkbox" id="highlightCheckbox" onclick="toggleHighlighting()"/>生词高亮 |     <input type="checkbox" onclick="toggleHighlighting()" checked/>生词高亮 | ||||||
|     <input type="checkbox" id="readCheckbox" onclick="onReadClick()"/>大声朗读 |     <input type="checkbox" onclick="onReadClick()" checked/>大声朗读 | ||||||
|     <input type="checkbox" id="chooseCheckbox" onclick="onChooseClick()"/>划词入库 |     <input type="checkbox" onclick="onChooseClick()" checked/>划词入库 | ||||||
|     <div class="range"> |     <div class="range"> | ||||||
|         <div class="field"> |         <div class="field"> | ||||||
|             <div class="sliderValue"> |             <div class="sliderValue"> | ||||||
|  | @ -144,8 +112,8 @@ | ||||||
|     <p><b>收集生词吧</b> (可以在正文中划词,也可以复制黏贴)</p> |     <p><b>收集生词吧</b> (可以在正文中划词,也可以复制黏贴)</p> | ||||||
|     <form method="post" action="/{{ username }}/userpage"> |     <form method="post" action="/{{ username }}/userpage"> | ||||||
|         <textarea name="content" id="selected-words" rows="10" cols="120"></textarea><br/> |         <textarea name="content" id="selected-words" rows="10" cols="120"></textarea><br/> | ||||||
|         <button class="btn btn-primary btn-lg" type="submit" onclick="Reader.stopRead()">把生词加入我的生词库</button> |         <input type="submit" value="把生词加入我的生词库" onclick="Reader.stopRead()"/> | ||||||
|         <button class="btn btn-primary btn-lg" type="reset" onclick="clearSelectedWords()">清除</button> |         <input type="reset" value="清除"/> | ||||||
|     </form> |     </form> | ||||||
|     {% if session.get['thisWord'] %} |     {% if session.get['thisWord'] %} | ||||||
|         <script type="text/javascript"> |         <script type="text/javascript"> | ||||||
|  | @ -173,10 +141,9 @@ | ||||||
|                 {% set freq = x[1] %} |                 {% set freq = x[1] %} | ||||||
|                 {% if session.get('thisWord') == x[0] and session.get('time') == 1 %} |                 {% if session.get('thisWord') == x[0] and session.get('time') == 1 %} | ||||||
|                 {% endif %} |                 {% endif %} | ||||||
|                 <p id='p_{{ word }}' class="new-word"> |                 <p id='p_{{ word }}' class="new-word" > | ||||||
|                     <a id="word_{{ word }}" class="btn btn-light" |                     <a id="word_{{ word }}"  class="btn btn-light" href='http://youdao.com/w/eng/{{ word }}/#keyfrom=dict2.index' | ||||||
|                        href='http://youdao.com/w/eng/{{ word }}/#keyfrom=dict2.index' |                     role="button">{{ word }}</a> | ||||||
|                        role="button">{{ word }}</a> |  | ||||||
|                     ( <a id="freq_{{ word }}" title="{{ word }}">{{ freq }}</a> ) |                     ( <a id="freq_{{ word }}" title="{{ word }}">{{ freq }}</a> ) | ||||||
|                     <a class="btn btn-success" onclick="familiar('{{ word }}')" role="button">熟悉</a> |                     <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-warning" onclick="unfamiliar('{{ word }}')" role="button">不熟悉</a> | ||||||
|  | @ -195,127 +162,60 @@ | ||||||
|     {% endfor %} |     {% endfor %} | ||||||
| {% endif %} | {% endif %} | ||||||
| <script type="text/javascript"> | <script type="text/javascript"> | ||||||
|     window.onload = function () { // 页面加载时执行 |     function load_next_article(){ | ||||||
|         const settings = { |  | ||||||
|             // initialize settings from localStorage |  | ||||||
|             highlightChecked: localStorage.getItem('highlightChecked') !== 'false', // localStorage stores strings, default to true. same below |  | ||||||
|             readChecked: localStorage.getItem('readChecked') !== 'false', |  | ||||||
|             chooseChecked: localStorage.getItem('chooseChecked') !== 'false', |  | ||||||
|             rangeValue: localStorage.getItem('rangeValue') || '1', |  | ||||||
|             selectedWords: localStorage.getItem('selectedWords') || '' |  | ||||||
|         }; |  | ||||||
| 
 |  | ||||||
|         const elements = { |  | ||||||
|             highlightCheckbox: document.querySelector('#highlightCheckbox'), |  | ||||||
|             readCheckbox: document.querySelector('#readCheckbox'), |  | ||||||
|             chooseCheckbox: document.querySelector('#chooseCheckbox'), |  | ||||||
|             rangeComponent: document.querySelector('#rangeComponent'), |  | ||||||
|             rangeValueDisplay: document.querySelector('#rangeValue'), |  | ||||||
|             selectedWordsInput: document.querySelector('#selected-words') |  | ||||||
|         }; |  | ||||||
|         // 应用设置到页面元素 |  | ||||||
|         elements.highlightCheckbox.checked = settings.highlightChecked; |  | ||||||
|         elements.readCheckbox.checked = settings.readChecked; |  | ||||||
|         elements.chooseCheckbox.checked = settings.chooseChecked; |  | ||||||
|         elements.rangeComponent.value = settings.rangeValue; |  | ||||||
|         elements.rangeValueDisplay.textContent = `${settings.rangeValue}x`; |  | ||||||
|         elements.selectedWordsInput.value = settings.selectedWords; |  | ||||||
| 
 |  | ||||||
|         // 刷新页面或进入页面时判断,若不是首篇文章,则上一篇按钮可见 |  | ||||||
|         if (sessionStorage.getItem('pre_page_button') !== 'display' && sessionStorage.getItem('pre_page_button')) { |  | ||||||
|             $('#load_pre_article').show(); |  | ||||||
|         } |  | ||||||
| 
 |  | ||||||
|         // 事件监听器 |  | ||||||
|         elements.selectedWordsInput.addEventListener('input', () => { |  | ||||||
|             localStorage.setItem('selectedWords', elements.selectedWordsInput.value); |  | ||||||
|         }); |  | ||||||
| 
 |  | ||||||
|         elements.rangeComponent.addEventListener('input', () => { |  | ||||||
|             const rangeValue = elements.rangeComponent.value; |  | ||||||
|             elements.rangeValueDisplay.textContent = `${rangeValue}x`; |  | ||||||
|             localStorage.setItem('rangeValue', rangeValue); |  | ||||||
|         }); |  | ||||||
|     }; |  | ||||||
| 
 |  | ||||||
|     function clearSelectedWords() { |  | ||||||
|         localStorage.removeItem('selectedWords'); |  | ||||||
|         document.querySelector('#selected-words').value = ''; |  | ||||||
|     } |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
|     function load_next_article() { |  | ||||||
|         $("#load_next_article").prop("disabled", true) |  | ||||||
|         $.ajax({ |         $.ajax({ | ||||||
|             url: '/get_next_article/{{username}}', |             url: '/get_next_article/{{username}}', | ||||||
|             dataType: 'json', |             dataType: 'json', | ||||||
|             success: function (data) { |             success: function(data) { | ||||||
|                 // 更新页面内容 |                 // 更新页面内容 | ||||||
|                 if (data['today_article']) { |                 if(data['today_article']){ | ||||||
|                     update(data['today_article']); |                     update(data['today_article']); | ||||||
|                     check_pre(data['visited_articles']); |                     check_pre(data['visited_articles']); | ||||||
|                     check_next(data['result_of_generate_article']); |                     check_next(data['result_of_generate_article']); | ||||||
|                 } |                 } | ||||||
|             }, complete: function (xhr, status) { |  | ||||||
|                 $("#load_next_article").prop("disabled", false) |  | ||||||
|             } |             } | ||||||
|         }); |         }); | ||||||
|     } |     } | ||||||
| 
 |     function load_pre_article(){ | ||||||
|     function load_pre_article() { |  | ||||||
|         $.ajax({ |         $.ajax({ | ||||||
|             url: '/get_pre_article/{{username}}', |             url: '/get_pre_article/{{username}}', | ||||||
|             dataType: 'json', |             dataType: 'json', | ||||||
|             success: function (data) { |             success: function(data) { | ||||||
|                 // 更新页面内容 |                 // 更新页面内容 | ||||||
|                 if (data['today_article']) { |                 if(data['today_article']){ | ||||||
|                     update(data['today_article']); |                     update(data['today_article']); | ||||||
|                     check_pre(data['visited_articles']); |                     check_pre(data['visited_articles']); | ||||||
|                 } |                 } | ||||||
|             } |             } | ||||||
|         }); |         }); | ||||||
|     } |     } | ||||||
| 
 |     function update(today_article){ | ||||||
|     function update(today_article) { |         $('#user-level').html(today_article['user_level']); | ||||||
|         $('#user_level').html(today_article['user_level']); |  | ||||||
|         $('#text_level').html(today_article["text_level"]); |         $('#text_level').html(today_article["text_level"]); | ||||||
|         $('#date').html('Article added on: ' + today_article["date"]); |         $('#date').html('Article added on: '+today_article["date"]); | ||||||
|         $('#article_title').html(today_article["article_title"]); |         $('#article_title').html(today_article["article_title"]); | ||||||
|         $('#article').html(today_article["article_body"]); |         $('#article').html(today_article["article_body"]); | ||||||
|         $('#source').html(today_article['source']); |         $('#source').html(today_article['source']); | ||||||
|         $('#question').html(today_article["question"]); |         $('#question').html(today_article["question"]); | ||||||
|         $('#answer').html(today_article["answer"]); |         $('#answer').html(today_article["answer"]); | ||||||
|         document.querySelector('#text_level').classList.add('mark'); // highlight text difficult level for 2 seconds |  | ||||||
|         setTimeout(() => { |  | ||||||
|             document.querySelector('#text_level').classList.remove('mark'); |  | ||||||
|         }, 2000); |  | ||||||
|         document.querySelector('#user_level').classList.add('mark'); // do the same thing for user difficulty level |  | ||||||
|         setTimeout(() => { |  | ||||||
|             document.querySelector('#user_level').classList.remove('mark'); |  | ||||||
|         }, 2000); |  | ||||||
|     } |     } | ||||||
| 
 | <!-- 检查是否存在上一篇或下一篇,不存在则对应按钮隐藏--> | ||||||
|     <!-- 检查是否存在上一篇或下一篇,不存在则对应按钮隐藏--> |     function check_pre(visited_articles){ | ||||||
|     function check_pre(visited_articles) { |         if((visited_articles=='')||(visited_articles['index']<=0)){ | ||||||
|         if ((visited_articles == '') || (visited_articles['index'] <= 0)) { |  | ||||||
|             $('#load_pre_article').hide(); |             $('#load_pre_article').hide(); | ||||||
|             sessionStorage.setItem('pre_page_button', 'display') |         }else{ | ||||||
|         } else { |  | ||||||
|             $('#load_pre_article').show(); |             $('#load_pre_article').show(); | ||||||
|             sessionStorage.setItem('pre_page_button', 'show') |  | ||||||
|         } |         } | ||||||
|     } |     } | ||||||
| 
 |     function check_next(result_of_generate_article){ | ||||||
|     function check_next(result_of_generate_article) { |         if(result_of_generate_article == "found"){ | ||||||
|         if (result_of_generate_article == "found") { |             $('#found').show();$('#not_found').hide(); | ||||||
|             $('#found').show(); |  | ||||||
|             $('#not_found').hide(); |  | ||||||
|             $('#read_all').hide(); |             $('#read_all').hide(); | ||||||
|         } else if (result_of_generate_article == "not found") { |         }else if(result_of_generate_article == "not found"){ | ||||||
|             $('#found').hide(); |             $('#found').hide(); | ||||||
|             $('#not_found').show(); |             $('#not_found').show(); | ||||||
|             $('#read_all').hide(); |             $('#read_all').hide(); | ||||||
|         } else { |         }else{ | ||||||
|             $('#found').hide(); |             $('#found').hide(); | ||||||
|             $('#not_found').hide(); |             $('#not_found').hide(); | ||||||
|             $('#read_all').show(); |             $('#read_all').show(); | ||||||
|  |  | ||||||
|  | @ -1,85 +0,0 @@ | ||||||
| ''' Contributed by Lin Junhong et al. 2023-06.''' |  | ||||||
| 
 |  | ||||||
| from selenium import webdriver |  | ||||||
| from selenium.webdriver.common.desired_capabilities import DesiredCapabilities |  | ||||||
| 
 |  | ||||||
| from selenium.webdriver.support.ui import WebDriverWait |  | ||||||
| from selenium.webdriver.support import expected_conditions as EC |  | ||||||
| from selenium.common.exceptions import UnexpectedAlertPresentException, NoAlertPresentException |  | ||||||
| import random, time |  | ||||||
| import string |  | ||||||
| 
 |  | ||||||
| # 初始化webdriver |  | ||||||
| # driver = webdriver.Remote('http://localhost:4444/wd/hub', DesiredCapabilities.CHROME) |  | ||||||
| # driver.implicitly_wait(10) |  | ||||||
| driver = webdriver.Chrome("C:\\Users\\12993\AppData\Local\Programs\Python\Python38\\chromedriver.exe") |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| def test_next_article(): |  | ||||||
|     try: |  | ||||||
|         driver.get("http://118.25.96.118:90") |  | ||||||
|         assert 'English Pal -' in driver.page_source |  | ||||||
|         # login |  | ||||||
|         elem = driver.find_element_by_link_text('登录') |  | ||||||
|         elem.click() |  | ||||||
| 
 |  | ||||||
|         uname = 'abcdefg' |  | ||||||
|         password = 'abcdefg' |  | ||||||
|         elem = driver.find_element_by_id('username') |  | ||||||
|         elem.send_keys(uname) |  | ||||||
| 
 |  | ||||||
|         elem = driver.find_element_by_id('password') |  | ||||||
|         elem.send_keys(password) |  | ||||||
|         elem = driver.find_element_by_xpath('/html/body/div/button')  # 找到登录按钮 |  | ||||||
|         elem.click() |  | ||||||
| 
 |  | ||||||
|         time.sleep(0.5) |  | ||||||
|         assert 'EnglishPal Study Room for ' + uname in driver.title |  | ||||||
|         for i in range(50): |  | ||||||
|             time.sleep(0.1) |  | ||||||
|             # 找到固定按钮 |  | ||||||
|             elem = driver.find_element_by_xpath('//*[@id="load_next_article"]') |  | ||||||
|             elem.click() |  | ||||||
|     except Exception as e: |  | ||||||
|         print(e) |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| def test_local_next_article(): |  | ||||||
|     try: |  | ||||||
|         driver.get("http://127.0.0.1:5000") |  | ||||||
|         assert 'English Pal -' in driver.page_source |  | ||||||
|         # login |  | ||||||
|         elem = driver.find_element_by_link_text('注册') |  | ||||||
|         elem.click() |  | ||||||
| 
 |  | ||||||
|         uname = 'abcdefg' |  | ||||||
|         password = 'abcdefg' |  | ||||||
|         elem = driver.find_element_by_id('username') |  | ||||||
|         elem.send_keys(uname) |  | ||||||
| 
 |  | ||||||
|         elem = driver.find_element_by_id('password') |  | ||||||
|         elem.send_keys(password) |  | ||||||
| 
 |  | ||||||
|         elem = driver.find_element_by_id('password2') |  | ||||||
|         elem.send_keys(password) |  | ||||||
| 
 |  | ||||||
|         time.sleep(0.5) |  | ||||||
| 
 |  | ||||||
|         elem = driver.find_element_by_class_name('btn')  # 找到提交按钮 |  | ||||||
|         elem.click() |  | ||||||
|         time.sleep(0.5) |  | ||||||
|         try: |  | ||||||
|             WebDriverWait(driver, 1).until(EC.alert_is_present()) |  | ||||||
|             driver.switch_to.alert.accept() |  | ||||||
|         except (UnexpectedAlertPresentException, NoAlertPresentException): |  | ||||||
|             pass |  | ||||||
| 
 |  | ||||||
|         time.sleep(0.5) |  | ||||||
|         assert 'EnglishPal Study Room for ' + uname in driver.title |  | ||||||
|         for i in range(50): |  | ||||||
|             time.sleep(0.1) |  | ||||||
|             # 找到固定按钮 |  | ||||||
|             elem = driver.find_element_by_xpath('//*[@id="load_next_article"]') |  | ||||||
|             elem.click() |  | ||||||
|     except Exception as e: |  | ||||||
|         print(e) |  | ||||||
|  | @ -1,8 +1,5 @@ | ||||||
| Flask==2.0.3 | Flask==1.1.2 | ||||||
| selenium==3.141.0 | selenium==3.141.0 | ||||||
| PyYAML~=6.0 | PyYAML~=6.0 | ||||||
| pony==0.7.16 | pony==0.7.16 | ||||||
| snowballstemmer==2.2.0 | snowballstemmer==2.2.0 | ||||||
| Werkzeug==2.2.2 |  | ||||||
| 
 |  | ||||||
| pytest~=8.1.1 |  | ||||||
		Loading…
	
		Reference in New Issue