wangweitao
/
EnglishPal
forked from mrlan/EnglishPal
0
0
Fork 0
Code Pull Requests Activity

Merge branch 'Alpha' into Bug522-HuangZirui

Alpha-snapshot20230426
zzhaofisher 2023-04-18 21:52:01 +08:00
parent 3bce450620 f3d609c92b
commit 11ae093fd7
28 changed files with 978 additions and 222 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -10,3 +10,4 @@ app/static/frequency/frequency.p
app/static/wordfreqapp.db
app/static/donate-the-author.jpg
app/static/donate-the-author-hidden.jpg
app/model/__pycache__/

72
README.md
View File

@ -11,15 +11,14 @@ Hui Lan <hui.lan@cantab.net>
EnglishPal allows the user to build his list of new English words
picked from articles selected for him according his vocabulary level.
picked from articles selected for him to read according his vocabulary level. EnglishPal will determine a user's vocabulary level based on his picked words. After that, it will recommend articles for him to read, in order to booster his English vocabulary furthermore.
## Run it on a local machine
## Run on your own laptop
`python3 main.py`
Make sure you have the SQLite database file in `app/static` (see below).
Make sure you have put the SQLite database file in the path `app/static` (see below).
## Run it as a Docker container
@ -29,32 +28,32 @@ Assuming that docker has been installed and that you are a sudo user (i.e., sudo
`sudo ./build.sh`
Open your favourite Internet browser and enter this URL address: `http://ip-address:90`.
Open your favourite Internet browser and enter this URL address: `http://ip-address:90`. Note: you must update the variable `DEPLOYMENT_DIR` in `build.sh`.
### Explanation on the commands in build.sh
My steps for deploying English on the server.
My steps for deploying English on a Ubuntu server.
- ssh to ubuntu@118.*.*.118
- cd to /home/lanhui/englishpal2/EnglishPal
- cd to `/home/lanhui/englishpal2/EnglishPal`
- Stop all docker service: `sudo service docker restart`. If you know the docker container ID, then the above command is an overkill. Use the following command instead: `sudo docker stop ContainerID`. You could get all container IDs with the following command: `sudo docker ps`
- Rebuild container. Run the following command to rebuild a docker image after the code gets updated: `sudo docker build -t englishpal .`
- Rebuild container. Run the following command to rebuild a docker image each time after the source code gets updated: `sudo docker build -t englishpal .`
- Run the application: `sudo docker run -d -p 90:80 -v /home/lanhui/englishpal2/EnglishPal/app/static/frequency:/app/static/frequency -t englishpal`. If you use `sudo docker run -d -p 90:80 -t englishpal`, data will be lost after terminating the program.
- Run the application: `sudo docker run -d -p 90:80 -v /home/lanhui/englishpal2/EnglishPal/app/static/frequency:/app/static/frequency -t englishpal`. If you use `sudo docker run -d -p 90:80 -t englishpal`, data will be lost after terminating the program. If you want to automatically restart the docker image after each system reboot, add the option `--restart=always` after `docker run`.
- Save space: `sudo docker system prune -a -f`
- Save disk space: `sudo docker system prune -a -f`
`build.sh` contains all the above commands. Run "sudo ./build.sh" to rebuild and start the web application.
### Other useful docker commands
#### Other useful docker commands
- `sudo docker ps -a`
- `sudo docker logs image_name`, where image_name could be obtained from `sudo docker ps`.
`build.sh` contains all the above commands. Run "sudo ./build.sh" to rebuild and run the web application.
- `sudo docker logs image_name`, where `image_name` could be obtained from `sudo docker ps`.
@ -68,6 +67,10 @@ All articles are stored in the `article` table in a SQLite file called
To add articles, open and edit `app/static/wordfreqapp.db` using DB Browser for SQLite (https://sqlitebrowser.org).
### Extending an account's expiry date
By default, an account's expiry is 30 days after first sign-up. To extend account's expiry date, open and edit `user` table in `app/static/wordfreqapp.db`. Simply update field `expiry_date`.
### Exporting the database
Export wordfreqapp.db to wordfreqapp.sql using the following commands:
@ -92,33 +95,31 @@ sqlite3 wordfreqapp.db`. Delete wordfreqapp.db first if it exists.
### Uploading wordfreqapp.db to the server
`pscp wordfreqapp.db lanhui@118.*.*.118:/home/lanhui/englishpal/app/static`
`pscp wordfreqapp.db lanhui@118.*.*.118:/home/lanhui/englishpal2/EnglishPal/app/static`
## Feedback
We welcome feedback on EnglishPal.
We welcome feedback on EnglishPal. Feedback examples:
### Respondent 1
### Feedback 1
- "Need a phone app. I use phone a lot. You cannot ask students to use computers."
"Need a phone app. I use phone a lot. You cannot ask students to use computers."
Can take a picture for text. Automatic translation.
### Respondent 2
### Feedback 2
“成为会员”改成“注册”
- “成为会员”改成“注册”
“登出”改成“退出”
- “登出”改成“退出”
“收集生词吧”改成“生词收集栏”
- “收集生词吧”改成“生词收集栏”
“不要自动显示下一篇”
- 不要自动显示下一篇
需要有“上一篇”、“下一篇”
- 需要有“上一篇”、“下一篇”按钮。
@ -137,7 +138,7 @@ EnglishPal's bugs and improvement suggestions are recorded in [Bugzilla](http://
- Usability testing
## Improvements made by contributors
## Improvements made by contributors (incomplete list)
### 朱文绮
@ -159,7 +160,6 @@ too many words that they already know, on the other hand, it can
reduce unnecessary memory occupied by the database, in addition, it
can also improve the simplicity of the page.
More information at: http://118.25.96.118/kanboard/?controller=TaskViewController&action=readonly&task_id=736&token=81a561da57ff7a172da17a480f0d421ff3bc69efbd29437daef90b1b8959
### 占健豪
@ -181,4 +181,16 @@ Demo video link: https://b23.tv/QuB77m
Bug report: http://118.25.96.118/bugzilla/show_bug.cgi?id=215
*Last modified on 2021-10-17*
### 丁锐
修复了以下漏洞
漏洞：新用户在创建账号时，不需要输入确定密码也可以注册成功，并且新账户可以正常使用。
Bug report: http://118.25.96.118/bugzilla/show_bug.cgi?id=489
*Last modified on 2023-01-30*

77
app/Article.py
View File

@ -32,12 +32,17 @@ def get_article_body(s):
return '\n'.join(lst)
def get_today_article(user_word_list, articleID):
def get_today_article(user_word_list, existing_articles):
rq = RecordQuery(path_prefix + 'static/wordfreqapp.db')
if articleID == None:
if existing_articles is None:
existing_articles = {
"index" : 0, # 为 article_ids 的索引
"article_ids": [] # 之前显示文章的id列表，越后越新
}
if existing_articles["index"] > len(existing_articles["article_ids"])-1:
rq.instructions("SELECT * FROM article")
else:
rq.instructions('SELECT * FROM article WHERE article_id=%d' % (articleID))
rq.instructions('SELECT * FROM article WHERE article_id=%d' % (existing_articles["article_ids"][existing_articles["index"]]))
rq.do()
result = rq.get_results()
random.shuffle(result)
@ -47,36 +52,41 @@ def get_today_article(user_word_list, articleID):
d2 = load_freq_history(path_prefix + 'static/words_and_tests.p')
d3 = get_difficulty_level(d1, d2)
d = {}
d = None
d_user = load_freq_history(user_word_list)
user_level = user_difficulty_level(d_user, d3) # more consideration as user's behaviour is dynamic. Time factor should be considered.
random.shuffle(result) # shuffle list
d = random.choice(result)
text_level = text_difficulty_level(d['text'], d3)
if articleID == None:
text_level = 0
if existing_articles["index"] > len(existing_articles["article_ids"])-1: # 下一篇
flag_get_article = False
for reading in result:
text_level = text_difficulty_level(reading['text'], d3)
factor = random.gauss(0.8,
0.1) # a number drawn from Gaussian distribution with a mean of 0.8 and a stand deviation of 1
if within_range(text_level, user_level, (8.0 - user_level) * factor):
if reading['article_id'] not in existing_articles["article_ids"] and within_range(text_level, user_level, (8.0 - user_level) * factor): # 新的文章之前没有出现过且符合一定范围的水平
d = reading
existing_articles["article_ids"].append(d['article_id']) # 列表添加新的文章id；下面进行
flag_get_article = True
break
if not flag_get_article:
existing_articles["index"] -= 1
else: # 上一篇
d = random.choice(result)
text_level = text_difficulty_level(d['text'], d3)
s = '<div class="alert alert-success" role="alert">According to your word list, your level is <span class="badge bg-success">%4.2f</span> and we have chosen an article with a difficulty level of <span class="badge bg-success">%4.2f</span> for you.</div>' % (
user_level, text_level)
s += '<p class="text-muted">Article added on: %s</p>' % (d['date'])
s += '<div class="p-3 mb-2 bg-light text-dark">'
article_title = get_article_title(d['text'])
article_body = get_article_body(d['text'])
s += '<p class="display-5">%s</p>' % (article_title)
s += '<p class="lead"><font id="article" size=2>%s</font></p>' % (article_body)
s += '<p><small class="text-muted">%s</small></p>' % (d['source'])
s += '<p><b>%s</b></p>' % (get_question_part(d['question']))
s = s.replace('\n', '<br/>')
s += '%s' % (get_answer_part(d['question']))
s += '</div>'
session['articleID'] = d['article_id']
return s
today_article = None
if d:
today_article = {
"user_level": '%4.2f' % user_level,
"text_level": '%4.2f' % text_level,
"date": d['date'],
"article_title": get_article_title(d['text']),
"article_body": get_article_body(d['text']),
"source": d["source"],
"question": get_question_part(d['question']),
"answer": get_answer_part(d['question'])
}
return existing_articles, today_article
def load_freq_history(path):
@ -116,21 +126,4 @@ def get_answer_part(s):
flag = 1
elif flag == 1:
result.append(line)
# https://css-tricks.com/snippets/javascript/showhide-element/
js = '''
<script type="text/javascript">
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>
'''
html_code = js
html_code += '\n'
html_code += '<button onclick="toggle_visibility(\'answer\');">ANSWER</button>\n'
html_code += '<div id="answer" style="display:none;">%s</div>\n' % ('\n'.join(result))
return html_code
return '\n'.join(result)

8
app/Login.py
View File

@ -1,6 +1,6 @@
import hashlib
import string
from datetime import datetime
from datetime import datetime, timedelta
from UseSqlite import InsertQuery, RecordQuery
path_prefix = '/var/www/wordfreq/wordfreq/'
@ -23,7 +23,7 @@ def verify_user(username, password):
def add_user(username, password):
start_date = datetime.now().strftime('%Y%m%d')
expiry_date = '20221230'
expiry_date = (datetime.now() + timedelta(days=30)).strftime('%Y%m%d') # will expire after 30 days
# 将用户名和密码一起加密，以免暴露不同用户的相同密码
password = md5(username + password)
rq = InsertQuery(path_prefix + 'static/wordfreqapp.db')
@ -96,9 +96,9 @@ class UserName:
if ' ' in self.username: # a user name must not include a whitespace
return 'Whitespace is not allowed in the user name.'
for c in self.username: # a user name must not include special characters, except non-leading periods or underscores
if c in string.punctuation and c is not '.' and c is not '_':
if c in string.punctuation and c != '.' and c != '_':
return f'{c} is not allowed in the user name.'
if self.username in ['signup', 'login', 'logout', 'reset', 'mark', 'back', 'unfamiliar', 'familiar', 'del']:
if self.username in ['signup', 'login', 'logout', 'reset', 'mark', 'back', 'unfamiliar', 'familiar', 'del', 'admin']:
return 'You used a restricted word as your user name. Please come up with a better one.'
return 'OK'

56
app/account_service.py
View File

@ -5,7 +5,6 @@ from Login import check_username_availability, verify_user, add_user, get_expiry
# 初始化蓝图
accountService = Blueprint("accountService", __name__)
### Sign-up, login, logout ###
@accountService.route("/signup", methods=['GET', 'POST'])
def signup():
@ -24,14 +23,11 @@ def signup():
#! 添加如下代码为了过滤注册时的非法字符
warn = WarningMessage(username)
if str(warn) != 'OK':
return str(warn)
return jsonify({'status': '3', 'warn': str(warn)})
available = check_username_availability(username)
if not available: # 用户名不可用
flash('用户名 %s 已经被注册。' % (username))
return render_template('signup.html')
elif len(password.strip()) < 4: # 密码过短
return '密码过于简单。'
return jsonify({'status': '0'})
else: # 添加账户信息
add_user(username, password)
verified = verify_user(username, password)
@ -41,11 +37,11 @@ def signup():
session[username] = username
session['username'] = username
session['expiry_date'] = get_expiry_date(username)
session['articleID'] = None
return '<p>恭喜，你已成功注册， 你的用户名是 <a href="%s">%s</a>。</p>\
<p><a href="/%s">开始使用</a> <a href="/">返回首页</a><p/>' % (username, username, username)
session['existing_articles'] = None
return jsonify({'status': '2'})
else:
return '用户名密码验证失败。'
return jsonify({'status': '1'})
@accountService.route("/login", methods=['GET', 'POST'])
@ -56,13 +52,7 @@ def login():
'''
if request.method == 'GET':
# GET请求
if not session.get('logged_in'):
# 未登录，返回登录页面
return render_template('login.html')
else:
# 已登录，提示信息并显示登出按钮
return '你已登录 <a href="/%s">%s</a>。 登出点击<a href="/logout">这里</a>。' % (
session['username'], session['username'])
return render_template('login.html')
elif request.method == 'POST':
# POST方法用于判断登录是否成功
# check database and verify user
@ -76,10 +66,10 @@ def login():
session['username'] = username
user_expiry_date = get_expiry_date(username)
session['expiry_date'] = user_expiry_date
session['articleID'] = None
return redirect(url_for('user_bp.userpage', username=username))
session['existing_articles'] = None
return jsonify({'status': '1'})
else:
return '无法通过验证。'
return jsonify({'status': '0'})
@accountService.route("/logout", methods=['GET', 'POST'])
@ -112,31 +102,9 @@ def reset():
# POST请求用于提交修改后信息
old_password = escape(request.form['old-password'])
new_password = escape(request.form['new-password'])
re_new_password = escape(request.form['re-new-password']) # 确认新密码
if re_new_password != new_password: #验证新密码两次输入是否相同
return '新密码不匹配，请重新输入'
if len(new_password) < 4: #验证新密码长度，原则参照注册模块
return '密码过于简单。(密码长度至少4位)'
flag = change_password(username, old_password, new_password) # flag表示是否修改成功
if flag:
session['logged_in'] = False
return \
'''
<script>
alert('密码修改成功，请重新登录。');
window.location.href="/login";
</script>
'''
return jsonify({'status':'1'}) # 修改成功
else:
return \
'''
<script>
alert('密码修改失败');
window.location.href="/reset";
</script>
'''
return jsonify({'status':'2'}) # 修改失败

145
app/admin_service.py Normal file
View File

@ -0,0 +1,145 @@
# System Library
from flask import *
# Personal library
from Yaml import yml
from model.user import *
from model.article import *
ADMIN_NAME = "lanhui" # unique admin name
_cur_page = 1 # current article page
_page_size = 5 # article sizes per page
adminService = Blueprint("admin_service", __name__)
def check_is_admin():
# 未登录，跳转到未登录界面
if not session.get("logged_in"):
return render_template("not_login.html")
# 用户名不是admin_name
if session.get("username") != ADMIN_NAME:
return "You are not admin!"
return "pass"
@adminService.route("/admin", methods=["GET"])
def admin():
is_admin = check_is_admin()
if is_admin != "pass":
return is_admin
return render_template(
"admin_index.html", yml=yml, username=session.get("username")
)
@adminService.route("/admin/article", methods=["GET", "POST"])
def article():
global _cur_page, _page_size
is_admin = check_is_admin()
if is_admin != "pass":
return is_admin
_article_number = get_number_of_articles()
try:
_page_size = min(
max(1, int(request.args.get("size", 5))), _article_number
) # 最小的size是1
_cur_page = min(
max(1, int(request.args.get("page", 1))), _article_number // _page_size + (_article_number % _page_size > 0)
) # 最小的page是1
except ValueError:
return "page parmas must be int!"
_articles = get_page_articles(_cur_page, _page_size)
for article in _articles: # 获取每篇文章的title
article.title = article.text.split("\n")[0]
article.content = '<br/>'.join(article.text.split("\n")[1:])
context = {
"article_number": _article_number,
"text_list": _articles,
"page_size": _page_size,
"cur_page": _cur_page,
"username": session.get("username"),
}
def _update_context():
article_len = get_number_of_articles()
context["article_number"] = article_len
context["text_list"] = get_page_articles(_cur_page, _page_size)
_articles = get_page_articles(_cur_page, _page_size)
for article in _articles: # 获取每篇文章的title
article.title = article.text.split("\n")[0]
context["text_list"] = _articles
if request.method == "GET":
try:
delete_id = int(request.args.get("delete_id", 0))
except:
return "Delete article ID must be int!"
if delete_id: # delete article
delete_article_by_id(delete_id)
_update_context()
elif request.method == "POST":
data = request.form
content = data.get("content", "")
source = data.get("source", "")
question = data.get("question", "")
level = data.get("level", "4")
if content:
try: # check level
if level not in ['1', '2', '3', '4']:
raise ValueError
except ValueError:
return "Level must be between 1 and 4."
add_article(content, source, level, question)
_update_context()
title = content.split('\n')[0]
flash(f'Article added. Title: {title}')
return render_template("admin_manage_article.html", **context)
@adminService.route("/admin/user", methods=["GET", "POST"])
def user():
is_admin = check_is_admin()
if is_admin != "pass":
return is_admin
context = {
"user_list": get_users(),
"username": session.get("username"),
}
if request.method == "POST":
data = request.form
username = data.get("username","")
new_password = data.get("new_password", "")
expiry_time = data.get("expiry_time", "")
if username:
if new_password:
update_password_by_username(username, new_password)
flash(f'Password updated to {new_password}')
if expiry_time:
update_expiry_time_by_username(username, "".join(expiry_time.split("-")))
flash(f'Expiry date updated to {expiry_time}.')
return render_template("admin_manage_user.html", **context)
@adminService.route("/admin/expiry", methods=["GET"])
def user_expiry_time():
is_admin = check_is_admin()
if is_admin != "pass":
return is_admin
username = request.args.get("username", "")
if not username:
return "Username can't be empty."
user = get_user_by_username(username)
if not user:
return "User does not exist."
return user.expiry_date

17
app/main.py
View File

@ -5,24 +5,24 @@
# Copyright 2019 (C) Hui Lan <hui.lan@cantab.net>
# Written permission must be obtained from the author for commercial uses.
###########################################################################
from flask import escape
from Login import *
from Article import *
import Yaml
from user_service import userService
from account_service import accountService
from admin_service import adminService, ADMIN_NAME
app = Flask(__name__)
app.secret_key = 'lunch.time!'
# 将蓝图注册到Lab app
app.register_blueprint(userService)
app.register_blueprint(accountService)
app.register_blueprint(adminService)
path_prefix = '/var/www/wordfreq/wordfreq/'
path_prefix = './' # comment this line in deployment
def get_random_image(path):
'''
返回随机图
@ -39,8 +39,7 @@ def get_random_ads():
返回随机广告
:return: 一个广告(包含HTML标签)
'''
ads = random.choice(['个性化分析精准提升', '你的专有单词本', '智能捕捉阅读弱点，针对性提高你的阅读水平'])
return ads + '。 <a href="/signup">试试</a>吧！'
return random.choice(['个性化分析精准提升', '你的专有单词本', '智能捕捉阅读弱点，针对性提高你的阅读水平'])
def appears_in_test(word, d):
@ -98,9 +97,13 @@ def mainpage():
d = load_freq_history(path_prefix + 'static/frequency/frequency.p')
d_len = len(d)
lst = sort_in_descending_order(pickle_idea.dict2lst(d))
return render_template('mainpage_get.html', random_ads=random_ads, number_of_essays=number_of_essays,
d_len=d_len, lst=lst, yml=Yaml.yml)
return render_template('mainpage_get.html',
admin_name=ADMIN_NAME,
random_ads=random_ads,
d_len=d_len,
lst=lst,
yml=Yaml.yml,
number_of_essays=number_of_essays)
if __name__ == '__main__':

30
app/model/__init__.py Normal file
View File

@ -0,0 +1,30 @@
from pony.orm import *
db = Database()
db.bind("sqlite", "../static/wordfreqapp.db", create_db=True) # bind sqlite file
class User(db.Entity):
_table_ = "user" # table name
name = PrimaryKey(str)
password = Optional(str)
start_date = Optional(str)
expiry_date = Optional(str)
class Article(db.Entity):
_table_ = "article" # table name
article_id = PrimaryKey(int, auto=True)
text = Optional(str)
source = Optional(str)
date = Optional(str)
level = Optional(str)
question = Optional(str)
db.generate_mapping(create_tables=True) # must mapping after class declaration
if __name__ == "__main__":
with db_session:
print(Article[2].text) # test get article which id=2 text content

34
app/model/article.py Normal file
View File

@ -0,0 +1,34 @@
from model import *
from datetime import datetime
def add_article(content, source="manual_input", level="5", question="No question"):
with db_session:
# add one article to sqlite
Article(
text=content,
source=source,
date=datetime.now().strftime("%-d %b %Y"), # format style of `5 Oct 2022`
level=level,
question=question,
)
def delete_article_by_id(article_id):
article_id &= 0xFFFFFFFF # max 32 bits
with db_session:
article = Article.select(article_id=article_id)
if article:
article.first().delete()
def get_number_of_articles():
with db_session:
return len(Article.select()[:])
def get_page_articles(num, size):
with db_session:
return [
x
for x in Article.select().order_by(desc(Article.article_id)).page(num, size)
]

24
app/model/user.py Normal file
View File

@ -0,0 +1,24 @@
from model import *
from Login import md5
def get_users():
with db_session:
return User.select().order_by(User.name)[:]
def get_user_by_username(username):
with db_session:
user = User.select(name=username)
if user:
return user.first()
def update_password_by_username(username, password="123456"):
with db_session:
user = User.select(name=username)
if user:
user.first().password = md5(username + password)
def update_expiry_time_by_username(username, expiry_time="20230323"):
with db_session:
user = User.select(name=username)
if user:
user.first().expiry_date = expiry_time

5
app/static/frequency/README.txt Normal file
View File

@ -0,0 +1,5 @@
This folder holds users' vocabulary files.
Each file ends with .pickle.
For example, mrlan.pickle is the vocabulary file for user mrlan.

4
app/static/js/fillword.js
View File

@ -62,3 +62,7 @@ function onReadClick() {
function onChooseClick() {
isChoose = !isChoose;
}
function stopRead() {
reader.cancel();
}

24
app/static/js/highlight.js
View File

@ -22,13 +22,21 @@ function getWord() {
function highLight() {
if (!isHighlight) return;
let articleContent = document.getElementById("article").innerText;
let articleContent = document.getElementById("article").innerText; //将原来的.innerText改为.innerHtml，使用innerText会把原文章中所包含的<br>标签去除，导致处理后的文章内容失去了原来的格式
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 allWords = pickedWords.value + " " + dictionaryWords.value;
const list = allWords.split(" ");
let allWords = ""; //初始化allWords的值，避免进入判断后编译器认为allWords未初始化的问题
if(dictionaryWords != null){//增加一个判断，检查生词本里面是否为空，如果为空，allWords只添加选中的单词
allWords = pickedWords.value + " " + dictionaryWords.value;
}
else{
allWords = pickedWords.value + " ";
}
const list = allWords.split(" ");//将所有的生词放入一个list中，用于后续处理
for (let i = 0; i < list.length; ++i) {
list[i] = list[i].replace(/(^\s*)|(\s*$)/g, ""); //消除单词两边的空字符
list[i] = list[i].replace('|', "");
list[i] = list[i].replace('?', "");
if (list[i] !== "" && "<mark>".indexOf(list[i]) === -1 && "</mark>".indexOf(list[i]) === -1) {
//将文章中所有出现该单词word的地方改为："<mark>" + word + "<mark>"。 正则表达式RegExp()中，"\\b"代表单词边界匹配。
@ -53,15 +61,15 @@ function highLight() {
}
function cancelHighlighting() {
let articleContent = document.getElementById("article").innerText;
let articleContent = document.getElementById("article").innerText;//将原来的.innerText改为.innerHtml，原因同上
let pickedWords = document.getElementById("selected-words");
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, "");
if (list[i] !== "") {
articleContent = articleContent.replace("<mark>" + list[i] + "</mark>", "list[i]");
if (list[i] !== "") { //原来判断的代码中，替换的内容为“list[i]”这个字符串，这明显是错误的，我们需要替换的是list[i]里的内容
articleContent = articleContent.replace(new RegExp("<mark>"+list[i]+"</mark>", "g"), list[i]);
}
}
}
@ -70,8 +78,8 @@ function cancelHighlighting() {
for (let i = 0; i < list2.length; ++i) {
list2 = dictionaryWords.value.split(" ");
list2[i] = list2[i].replace(/(^\s*)|(\s*$)/g, "");
if (list2[i] !== "") {
articleContent = articleContent.replace("<mark>" + list[i] + "</mark>", "list[i]");
if (list2[i] !== "") { //原来代码中，替换的内容为“list[i]”这个字符串，这明显是错误的，我们需要替换的是list[i]里的内容
articleContent = articleContent.replace(new RegExp("<mark>"+list2[i]+"</mark>", "g"), list2[i]);
}
}
}

142
app/static/js/word_operation.js
View File

@ -7,10 +7,20 @@ function familiar(theWord) {
url:"/" + username + "/" + word + "/familiar",
success:function(response){
let new_freq = freq - 1;
if(new_freq <1) {
$("#p_" + theWord).remove();
const allow_move = document.getElementById("move_dynamiclly").checked;
if (allow_move) {
if (new_freq <= 0) {
removeWord(theWord);
} else {
renderWord({ word: theWord, freq: new_freq });
}
} else {
$("#freq_" + theWord).text(new_freq);
if(new_freq <1) {
$("#p_" + theWord).remove();
} else {
$("#freq_" + theWord).text(new_freq);
}
}
}
});
@ -25,19 +35,139 @@ function unfamiliar(theWord) {
url:"/" + username + "/" + word + "/unfamiliar",
success:function(response){
let new_freq = parseInt(freq) + 1;
$("#freq_" + theWord).text(new_freq);
const allow_move = document.getElementById("move_dynamiclly").checked;
if (allow_move) {
renderWord({ word: theWord, freq: new_freq });
} else {
$("#freq_" + theWord).text(new_freq);
}
}
});
}
function delete_word(theWord) {
let username = $("#username").text();
let word = $("#word_" + theWord).text();
let word = theWord.replace('&amp;', '&');
$.ajax({
type:"GET",
url:"/" + username + "/" + word + "/del",
success:function(response){
$("#p_" + theWord).remove();
const allow_move = document.getElementById("move_dynamiclly").checked;
if (allow_move) {
removeWord(theWord);
} else {
$("#p_" + theWord).remove();
}
}
});
}
/*
* interface Word {
* word: string,
* freq: number
* }
* */
/**
* 传入一个词频HTML元素，将其解析为Word类型的对象
*/
function parseWord(element) {
const word = element
.querySelector("a.btn.btn-light[role=button]") // 获取当前词频元素的词汇元素
.innerText // 获取词汇值;
const freq = Number.parseInt(element.querySelector(`#freq_${word}`).innerText); // 获取词汇的数量
return {
word,
freq
};
}
/**
* 使用模板将传入的单词转换为相应的HTML字符串
*/
function wordTemplate(word) {
// 这个模板应当与 templates/userpage_get.html 中的 <p id='p_${word.word}' class="new-word" > ... </p> 保持一致
return `<p id='p_${word.word}' class="new-word" >
<a id="word_${word.word}" class="btn btn-light" href='http://youdao.com/w/eng/${word.word}/#keyfrom=dict2.index'
role="button">${word.word}</a>
( <a id="freq_${word.word}" title="${word.word}">${word.freq}</a> )
<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>
</p>`;
}
/**
* 删除某一词频元素
* 此处word为词频元素对应的单词
*/
function removeWord(word) {
// 根据词频信息删除元素
word = word.replace('&amp;', '&');
const element_to_remove = document.getElementById(`p_${word}`);
if (element_to_remove != null) {
element_to_remove.remove();
}
}
function renderWord(word) {
const container = document.querySelector(".word-container");
// 删除原有元素
removeWord(word.word);
// 插入新元素
let inserted = false;
const new_element = elementFromString(wordTemplate(word));
for (const current of container.children) {
const cur_word = parseWord(current);
// 找到第一个词频比它小的元素，插入到这个元素前面
if (compareWord(cur_word, word) == -1) {
container.insertBefore(new_element, current);
inserted = true;
break;
}
}
// 当word就是词频最小的词时，把他补回去
if (!inserted) {
container.appendChild(new_element);
}
// 让发生变化的元素抖动
new_element.classList.add("shaking");
// 移动到该元素
new_element.scrollIntoView({behavior: "smooth", block: "center", inline: "nearest"});
// 抖动完毕后删除抖动类
setTimeout(() => {
new_element.classList.remove("shaking");
}, 1600);
}
/**
* 从string中创建一个HTML元素并返回
*/
function elementFromString(string) {
const d = document.createElement('div');
d.innerHTML = string;
return d.children.item(0);
}
/**
* 对比两个单词：
* 当first小于second时返回-1
* 当first等于second时返回0
* 当first大于second时返回1
*/
function compareWord(first, second) {
if (first.freq < second.freq) {
return -1;
}
if (first.freq > second.freq) {
return 1;
}
if (first.word < second.word) {
return -1;
}
if (first.word > second.word) {
return 1;
}
return 0;
}

55
app/templates/admin_index.html Normal file
View File

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
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" />
{{ yml['header'] | safe }}
{% if yml['css']['item'] %}
{% for css in yml['css']['item'] %}
<link href="{{ css }}" rel="stylesheet">
{% endfor %}
{% endif %}
{% if yml['js']['head'] %}
{% for js in yml['js']['head'] %}
<script src="{{ js }}"></script>
{% endfor %}
{% endif %}
</head>
<body class="container" style="width: 800px; margin: auto; margin-top:24px;">
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="/{{ username }}">返回 {{ username }}</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="card" style="margin-top:24px;">
<div class="card-header">
请选择您需要的操作
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">
<div class="d-grid gap-2">
<a href="/admin/article" class="btn btn-outline-primary" type="button">管理文章</a>
<a href="/admin/user" class="btn btn-outline-primary" type="button">管理用户</a>
</div>
</li>
</ul>
</div>
</body>
</html>

103
app/templates/admin_manage_article.html Normal file
View File

@ -0,0 +1,103 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
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" />
<link href="../static/css/bootstrap.css" rel="stylesheet">
</head>
<body class="container" style="width: 800px; margin: auto; margin-top:24px;">
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="/admin">前一页</a>
</li>
</ul>
</div>
</div>
</nav>
{% for message in get_flashed_messages() %}
<div class="alert alert-success" role="alert">
{{ message }}
</div>
{% endfor %}
<div class="card" style="margin-top:24px;">
{% if tips %}
<div class="alert alert-success" role="alert">
{{ tips }}
</div>
{% endif %}
<div class="card-content">
<h5 style="margin-top: 10px;padding-left: 10px;">录入文章</h5>
<form action="" method="post" class="container mb-3">
<div class="mb-3">
<label class="form-label">文章内容</label>
<textarea id="content" name="content" class="form-control" rows="8" placeholder="首行是标题，后面是正文。"></textarea>
<label class="form-label">文章来源</label>
<textarea id="source" name="source" class="form-control" placeholder="推荐格式：Source: HTTP 链接。"></textarea>
<label class="form-label">文章等级</label>
<select id="level" class="form-select" name="level">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option selected value="4">4</option>
</select>
<label class="form-label">文章问题</label>
<textarea id="question" name="question" class="form-control" rows="6" placeholder="格式：&#x0a; QUESTION&#x0a; What?&#x0a;&#x0a; ANSWER&#x0a; Apple. "></textarea>
</div>
<input type="submit" value="保存" class="btn btn-outline-primary">
</form>
</div>
</div>
<div class="card" style="margin-top:24px;">
<h5 style="margin-top: 10px;padding-left: 10px;">文章列表</h5>
<div class="list-group">
{% for text in text_list %}
<div class="list-group-item list-group-item-action" aria-current="true">
<div>
<a type="button" href="/admin/article?delete_id={{text.article_id}}" class="btn btn-outline-danger btn-sm">删除</a>
</div>
<div class="d-flex w-100 justify-content-between">
<h5 class="mb-1">{{ text.title }}</h5>
</div>
<div><small>{{ text.source }}</small></div>
<div class="d-flex w-100 justify-content-between">
<small>Level: {{text.level }}</small>
<small>Date: {{ text.date }}</small>
</div>
{{ text.content | safe }}
</div>
{% endfor %}
</div>
</div>
<div style="margin:20px 0;">
<ul class="pagination pagination-sm justify-content-center">
<li class="page-item"><a class="page-link" href="/admin/article?page={{ cur_page - 1 }}&size={{ page_size }}">Previous</a>
</li>
{% for i in range(1, article_number // page_size + (article_number % page_size > 0) + 1) %}
{% if cur_page == i %}
<li class="page-item active"><a class="page-link" href="/admin/article?page={{ i }}&size={{ page_size }}">{{ i }}</a>
</li>
{% else %}
<li class="page-item"><a class="page-link" href="/admin/article?page={{ i }}&size={{ page_size }}">{{ i }}</a></li>
{% endif %}
{% endfor %}
<li class="page-item"><a class="page-link" href="/admin/article?page={{ cur_page + 1 }}&size={{ page_size }}">Next</a>
</li>
</ul>
</div>
</body>
</html>

99
app/templates/admin_manage_user.html Normal file
View File

@ -0,0 +1,99 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
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" />
<link href="../static/css/bootstrap.css" rel="stylesheet">
<script src="../static/js/jquery.js"></script>
</head>
<body class="container" style="width: 800px; margin: auto; margin-top:24px;">
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="/admin">前一页</a>
</li>
</ul>
</div>
</div>
</nav>
{% for message in get_flashed_messages() %}
<div class="alert alert-success" role="alert">
{{ message }}
</div>
{% endfor %}
<div class="card" style="margin-top:24px;">
<h5 style="margin-top: 10px;padding-left: 10px;">重置选中用户的信息</h5>
<form id="user_form" action="" method="post" class="container mb-3">
<div>
<label class="form-label" style="padding-top: 10px;">用户</label>
<select onchange="loadUserExpiryDate()" id="username" name="username" class="form-select" aria-label="Default select example">
<option selected>选择用户</option>
{% for user in user_list %}
<option value="{{ user.name }}">{{ user.name }}</option>
{% endfor %}
</select>
<label class="form-label" style="padding-top: 10px;">修改密码</label>
<div>
<button type="button" id="reset_pwd_btn" class="btn btn-outline-success">获取12位随机密码</button>
<input style="margin-left: 20px;border: 0; font-size: 20px;" name="new_password"
id="new_password"></input>
</div>
<label class="form-label" style="padding-top: 10px;">过期时间</label>
<div>
<input type="date" id="expiry_date" name="expiry_time" placeholder="YYYY-MM-DD" pattern="yyyyMMdd">
</div>
</div>
<button style="margin-top: 50px;" type="submit" class="btn btn-primary">更新用户信息</button>
</form>
</div>
</body>
<script>
// 密码生成器
function generatePassword(length) {
var charset = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()_+~`|}{[]\:;?><,./-=";
var password = "";
for (var i = 0; i < length; i++) {
password += charset.charAt(Math.floor(Math.random() * charset.length));
}
return password;
}
document.getElementById("reset_pwd_btn").addEventListener("click", () => {
// 生成12位随机密码
let pwd = generatePassword(12)
document.getElementById("new_password").value = pwd
})
// 选择用户后更新其过期时间
function loadUserExpiryDate() {
const cur_user = $('#username').val();
$.ajax({
type: "GET",
url: `/admin/expiry?username=${cur_user}`,
success: function(resp) {
const year = resp.substr(0,4);
const month = resp.substr(4,2);
const day = resp.substr(6,2);
document.getElementById("expiry_date").value = year + '-' + month + '-' + day
}
})
}
</script>
</html>

2
app/templates/expiry.html
View File

@ -5,7 +5,7 @@
<title>账号过期</title>
</head>
<body>
<p>您的账号{{ username }}过期。</p>
<p>您的账号过期（过期日 {{expiry_date}}）。</p>
<p>为了提高服务质量，English Pal 收取会员费用， 每天1元。</p>
<p>请决定你要试用的时间长度，扫描下面支付宝二维码支付。 支付时请注明<i>English Pal Membership Fee</i>。 我们会于12小时内激活账号。</p>
<p><img src="static/donate-the-author-hidden.jpg" width="120px" alt="支付宝二维码" /></p>

37
app/templates/login.html
View File

@ -1,28 +1,47 @@
{% block body %}
{% if session['logged_in'] %}
You're logged in already!
你已登录 <a href="/{{ session['username'] }}">{{ session['username'] }}</a>。 登出点击<a href="/logout">这里</a>。
{% else %}
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes" />
<link rel="stylesheet" href="static/css/login_service.css">
<script src="static/js/jquery.js"></script>
<script>
function login(){
let username = $("#username").val();
let password = $("#password").val();
if (username === "" || password === ""){
alert('输入不能为空!');
return false;
}
$.post(
"/login", {'username': username, 'password': password},
function (response) {
if (response.status === '0') {
alert('无法通过验证。');
window.location.href = "/login";
} else if (response.status === '1') {
window.location.href = "/"+username;
}
}
)
return false;
}
</script>
<div class="container">
<section class="signin-heading">
<h1>Sign In</h1>
</section>
<form action="/login" method="POST">
<input type="text" placeholder="用户名" class="username" name="username" required>
<input type="password" placeholder="密码" class="password" name="password" required>
<button type="submit" class="btn">登录</button>
</form>
<input type="text" placeholder="用户名" class="username" id="username">
<input type="password" placeholder="密码" class="password" id="password">
<button type="button" class="btn" onclick="login()">登录</button>
<a class="signup" href="/signup">注册</a>
</div>
<a href="/signup" class="signup">注册</a>
{% endif %}
{% endblock %}

9
app/templates/mainpage_get.html
View File

@ -23,12 +23,15 @@
<div class="container-fluid">
<p><b><font size="+3" color="red">English Pal - Learn English smartly!</font></b></p>
{% if session['logged_in'] %}
<a href="/{{session['username']}}">{{session['username']}}</a></p>
<a href="/{{ session['username'] }}">{{ session['username'] }}</a>
{% if session['username'] == admin_name %}
<a href="/admin">管理</a></p>
{% endif %}
{% else %}
<p><a href="/login">登录</a> <a href="/signup">注册</a> <a href="/static/usr/instructions.html">使用说明</a></p >
<p><b>{{random_ads|safe}}</b></p>
<p><b> {{ random_ads }}。 <a href="/signup">试试</a>吧！</b></p>
{% endif %}
<div class="alert alert-success" role="alert">共有文章 <span class="badge bg-success"> {{number_of_essays}} </span> 篇</div>
<div class="alert alert-success" role="alert">共有文章 <span class="badge bg-success"> {{ number_of_essays }} </span> 篇</div>
<p>粘贴1篇文章 (English only)</p>
<form method="post" action="/">
<textarea name="content" rows="10" cols="120"></textarea><br/>

45
app/templates/reset.html
View File

@ -2,6 +2,38 @@
<meta charset="utf-8" name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes"/>
<link rel="stylesheet" href="static/css/login_service.css">
<script src="static/js/jquery.js"></script>
<script>
function reset() {
let old_password = $("#old-password").val();
let new_password = $("#new-password").val();
let re_new_password = $("#re-new-password").val();
if (old_password === "" || new_password === "" || re_new_password === ""){
alert('输入不能为空!');
return false;
}
if (new_password !== re_new_password) {
alert('新密码不匹配，请重新输入');
return false;
}
if (new_password.length < 4) {
alert('密码过于简单。(密码长度至少4位)');
return false;
}
$.post("/reset", {'old-password': old_password, 'new-password': new_password},
function (response) {
if (response.status === '1') {
alert('密码修改成功，请重新登录。');
window.location.href = "/login";
} else if (response.status === '2') {
alert('密码修改失败');
window.location.href = "/reset";
}
}
)
return false;
}
</script>
<div class="container">
@ -9,14 +41,11 @@
<h1>Reset Password</h1>
</section>
<form action="/reset" method="POST">
<input type="password" placeholder="原密码" class="old-password" name="old-password" required>
<input type="password" placeholder="新密码" class="new-password" name="new-password" required>
<input type="password" placeholder="确认新密码" class="re-new-password" name="re-new-password" required>
<input type="submit" name="submit" class="btn" value="提交"/>
<input type="button" name="submit" class="btn" value="放弃修改"
onclick="window.location.href='/{{ username }}'"/>
</form>
<input type="password" placeholder="原密码" class="old-password" name="old-password" id="old-password"/>
<input type="password" placeholder="新密码" class="new-password" name="new-password" id="new-password"/>
<input type="password" placeholder="确认新密码" class="re-new-password" name="re-new-password" id="re-new-password"/>
<button id="submit" class="btn" onclick="reset()">提交</button>
<button class="btn" onclick="window.location.href='/{{ username }}'">放弃修改</button>
</div>
{% endblock %}

51
app/templates/signup.html
View File

@ -6,6 +6,47 @@ You're logged in already! <a href="/logout">Logout</a>.
{% else %}
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes" />
<link rel="stylesheet" href="static/css/login_service.css">
<script src="static/js/jquery.js"></script>
<script>
function signup() {
let username = $("#username").val();
let password = $("#password").val();
let password2 = $("#password2").val();
if (username === "" || password === "" || password2 === ""){
alert('输入不能为空!');
return false;
}
if (password !== password2) {
alert('确认密码与输入密码不一致！');
return false;
}
if (password.length < 4) {
alert('密码过于简单。(密码长度至少4位)');
return false;
}
$.post("/signup", {'username': username, 'password': password},
function (response) {
if (response.status === '0') {
alert('用户名'+username+'已经被注册。');
window.location.href = "/signup";
} else if (response.status === '1') {
alert('用户名密码验证失败。');
window.location.href = "/signup";
} else if (response.status === '2') {
let f = confirm("恭喜，你已成功注册，你的用户名是"+username+'.\n点击“确认”开始使用，或点击“取消”返回首页');
if (f) {
window.location.href = '/'+username;
} else {
window.location.href = '/';
}
} else if (response.status === '3') {
alert(response.warn);
}
}
)
return false;
}
</script>
<p>{{ get_flashed_messages()[0] | safe }}</p>
@ -15,12 +56,10 @@ You're logged in already! <a href="/logout">Logout</a>.
<h1>Sign Up</h1>
</section>
<form action="/signup" method="POST">
<p><input type="username" name="username" placeholder="输入用户名" required="required" class="username"></p>
<p><input type="password" name="password" placeholder="输入密码" class="password"></p>
<p><input type="password" name="password2" placeholder="确认密码" class="password"></p>
<button type="submit" class="btn">注册</button>
</form>
<p><input type="username" id="username" placeholder="输入用户名" class="username"></p>
<p><input type="password" id="password" placeholder="输入密码" class="password"></p>
<p><input type="password" id="password2" placeholder="确认密码" class="password" ></p>
<button type="button" class="btn" onclick="signup()">注册</button>
</div>

111
app/templates/userpage_get.html
View File

@ -19,24 +19,67 @@
{% endif %}
<title>EnglishPal Study Room for {{ username }}</title>
<style>
.shaking {
animation: shakes 1600ms ease-in-out;
}
@keyframes shakes {
10%, 90% { transform: translate3d(-1px, 0, 0); }
20%, 50% { transform: translate3d(+2px, 0, 0); }
30%, 70% { transform: translate3d(-4px, 0, 0); }
40%, 60% { transform: translate3d(+4px, 0, 0); }
50% { transform: translate3d(-4px, 0, 0); }
}
</style>
</head>
<body>
<div class="container-fluid">
<p><b>English Pal for <font id="username" color="red">{{ username }}</font></b>
<a class="btn btn-secondary" href="/logout" role="button">退出</a>
<a class="btn btn-secondary" href="/reset" role="button">重设密码</a>
{% if username == admin_name %}
<a class="btn btn-secondary" href="/admin" role="button" onclick="stopRead()">管理</a>
{% endif %}
<a class="btn btn-secondary" href="/logout" role="button" onclick="stopRead()">退出</a>
<a class="btn btn-secondary" href="/reset" role="button" onclick="stopRead()">重设密码</a>
</p>
{{ flashed_messages|safe }}
{# {% for message in flashed_messages %}#} {# 根据user_service.userpage,取消了参数flashed_messages，因此注释了这段代码 #}
{# <div class="alert alert-warning" role="alert">Congratulations! {{ message }}</div>#}
{# {% endfor %}#}
<a class="btn btn-success" href="/{{ username }}/reset" role="button"> 下一篇 Next Article </a>
{% if session.get('articleID') != session.get('old_articleID') %}
{% if session.get('old_articleID') != None %}
<a class="btn btn-success" href="/{{ username }}/back" role="button"> 上一篇 Previous Article </a>
{% endif%}
<a class="btn btn-success" href="/{{ username }}/reset" role="button"> 下一篇 Next Article </a>
{% if session.get('existing_articles') != None and session.get('existing_articles')["index"] !=0 %}
<a class="btn btn-success" href="/{{ username }}/back" role="button"> 上一篇 Previous Article </a>
{% endif %}
<p><b>阅读文章并回答问题</b></p>
<div id="text-content">{{ today_article|safe }}</div>
<div id="text-content">
{% if today_article %}
<div class="alert alert-success" role="alert">According to your word list, your level is <span class="badge bg-success">{{ today_article["user_level"] }}</span> and we have chosen an article with a difficulty level of <span class="badge bg-success">{{ today_article["text_level"] }}</span> for you.</div>
<p class="text-muted">Article added on: {{ today_article["date"] }}</p><br/>
<div class="p-3 mb-2 bg-light text-dark"><br/>
<p class="display-5">{{ today_article["article_title"] }}</p><br/>
<p class="lead"><font id="article" size=2>{{ today_article["article_body"] }}</font></p><br/>
<p><small class="text-muted">{{ today_article['source'] }}</small></p><br/>
<p><b>{{ today_article['question'] }}</b></p><br/>
<script type="text/javascript">
function toggle_visibility(id) { {# https://css-tricks.com/snippets/javascript/showhide-element/#}
const e = document.getElementById(id);
if(e.style.display === 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>
<button onclick="toggle_visibility('answer');">ANSWER</button>
<div id="answer" style="display:none;">{{ today_article['answer'] }}</div><br/>
</div>
{% else %}
<div class="alert alert-success" role="alert">
<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>
</div>
{% endif %}
</div>
<input type="checkbox" onclick="toggleHighlighting()" checked/>生词高亮
<input type="checkbox" onclick="onReadClick()" checked/>大声朗读
@ -46,9 +89,9 @@
<div class="sliderValue">
<span id="rangeValue">1×</span>
</div>
<input type="range" id="rangeComponent" min="0.5" max="2" value="1" step="0.25" "/>
<input type="range" id="rangeComponent" min="0.5" max="2" value="1" step="0.25"/>
</div>
</div>
</div>
<p><b>收集生词吧</b> （可以在正文中划词，也可以复制黏贴）</p>
<form method="post" action="/{{ username }}">
<textarea name="content" id="selected-words" rows="10" cols="120"></textarea><br/>
@ -67,22 +110,30 @@
{% endif %}
{% if d_len > 0 %}
<p><b>我的生词簿</b></p>
{% for x in lst3 %}
{% set word = x[0] %}
{% set freq = x[1] %}
{% if session.get('thisWord') == x[0] and session.get('time') == 1 %}
<a name="aaa"></a>
{% endif %}
<p id='p_{{ word }}' class="new-word" >
<a id="word_{{ word }}" class="btn btn-light" href='http://youdao.com/w/eng/{{ word }}/#keyfrom=dict2.index'
role="button">{{ word }}</a>
( <a id="freq_{{ word }}" title="{{ word }}">{{ freq }}</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-danger" onclick="delete_word('{{ word }}')" role="button">删除</a>
</p>
{% endfor %}
<p>
<b>我的生词簿</b>
<label for="move_dynamiclly">
<input type="checkbox" name="move_dynamiclly" id="move_dynamiclly" checked>
允许动态调整顺序
</label>
</p>
<a name="aaa"></a>
<div class="word-container">
{% for x in lst3 %}
{% set word = x[0] %}
{% set freq = x[1] %}
{% if session.get('thisWord') == x[0] and session.get('time') == 1 %}
{% endif %}
<p id='p_{{ word }}' class="new-word" >
<a id="word_{{ word }}" class="btn btn-light" href='http://youdao.com/w/eng/{{ word }}/#keyfrom=dict2.index'
role="button">{{ word }}</a>
( <a id="freq_{{ word }}" title="{{ word }}">{{ freq }}</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-danger" onclick="delete_word('{{ word }}')" role="button">删除</a>
</p>
{% endfor %}
</div>
<input id="selected-words2" type="hidden" value="{{ words }}">
{% endif %}
</div>
@ -95,9 +146,9 @@
</body>
<style>
mark {
color: #{{ yml['highlight']['color'] }};
background-color: rgba(0,0,0,0);
}
color: #{{ yml['highlight']['color'] }};
background-color: rgba(0, 0, 0, 0);
}
</style>
</html>

4
app/templates/userpage_post.html
View File

@ -20,7 +20,7 @@
<title>EnglishPal Study Room for {{username}}</title>
</head>
<body>
<p>勾选不认识的单词</p>
<p>取消勾选认识的单词</p>
<form method="post" action="/{{username}}/mark">
<input type="submit" name="add-btn" value="加入我的生词簿"/>
{% for x in lst %}
@ -30,7 +30,7 @@
:
<a href='http://youdao.com/w/eng/{{word}}/#keyfrom=dict2.index' title={{word}}>{{word}}</a>
({{x[1]}})
<input type="checkbox" name="marked" value="{{word}}">
<input type="checkbox" name="marked" value="{{word}}" checked>
</p>
{% endfor %}

36
app/user_service.py
View File

@ -1,5 +1,5 @@
from datetime import datetime
from admin_service import ADMIN_NAME
from flask import *
# from app import Yaml
@ -29,9 +29,10 @@ def user_reset(username):
:param username: 用户名
:return: 返回页面内容
'''
session['old_articleID'] = session.get('articleID')
if request.method == 'GET':
session['articleID'] = None
existing_articles = session.get("existing_articles")
existing_articles["index"] += 1
session["existing_articles"] = existing_articles
return redirect(url_for('user_bp.userpage', username=username))
else:
return 'Under construction'
@ -44,7 +45,9 @@ def user_back(username):
:return: 返回页面内容
'''
if request.method == 'GET':
session['articleID'] = session.get('old_articleID')
existing_articles = session.get("existing_articles")
existing_articles["index"] -= 1
session["existing_articles"] = existing_articles
return redirect(url_for('user_bp.userpage', username=username))
@ -89,7 +92,8 @@ def deleteword(username, word):
'''
user_freq_record = path_prefix + 'static/frequency/' + 'frequency_%s.pickle' % (username)
pickle_idea2.deleteRecord(user_freq_record, word)
flash(f'<strong>{word}</strong> is no longer in your word list.')
# 模板userpage_get.html中删除单词是异步执行，而flash的信息后续是同步执行的，所以注释这段代码；同时如果这里使用flash但不提取信息，则会影响 signup.html的显示。bug复现：删除单词后，点击退出，点击注册，注册页面就会出现提示信息
# flash(f'{word} is no longer in your word list.')
return "success"
@ -107,7 +111,7 @@ def userpage(username):
# 用户过期
user_expiry_date = session.get('expiry_date')
if datetime.now().strftime('%Y%m%d') > user_expiry_date:
return render_template('expiry.html')
return render_template('expiry.html', expiry_date=user_expiry_date)
# 获取session里的用户名
username = session.get('username')
@ -130,11 +134,15 @@ def userpage(username):
words = ''
for x in lst3:
words += x[0] + ' '
existing_articles, today_article = get_today_article(user_freq_record, session.get('existing_articles'))
session['existing_articles'] = existing_articles
# 通过 today_article，加载前端的显示页面
return render_template('userpage_get.html',
admin_name=ADMIN_NAME,
username=username,
session=session,
flashed_messages=get_flashed_messages_if_any(),
today_article=get_today_article(user_freq_record, session['articleID']),
# flashed_messages=get_flashed_messages(), 仅有删除单词的时候使用到flash，而删除单词是异步执行，这里的信息提示是同步执行，所以就没有存在的必要了
today_article=today_article,
d_len=len(d),
lst3=lst3,
yml=Yaml.yml,
@ -173,15 +181,3 @@ def get_time():
'''
return datetime.now().strftime('%Y%m%d%H%M') # upper to minutes
def get_flashed_messages_if_any():
'''
在用户界面显示黄色提示信息
:return: 包含HTML标签的提示信息
'''
messages = get_flashed_messages()
s = ''
for message in messages:
s += '<div class="alert alert-warning" role="alert">'
s += f'Congratulations! {message}'
s += '</div>'
return s

4
app/wordfreqCMD.py
View File

@ -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('--', ' ')
@ -70,7 +70,7 @@ def sort_in_ascending_order(lst):# 单词按频率降序排列
return lst2
def make_html_page(lst, fname):
def make_html_page(lst, fname): # 只是在wordfreqCMD.py中的main函数中调用，所以不做修改
'''
功能：把lst的信息存到fname中，以html格式。
'''

4
build.sh
View File

@ -3,6 +3,10 @@
DEPLOYMENT_DIR=/home/lanhui/englishpal2/EnglishPal
cd $DEPLOYMENT_DIR
# Install dependencies
pip3 install -r requirements.txt
# Stop service
sudo docker stop EnglishPal
sudo docker rm EnglishPal

1
requirements.txt
View File

@ -1,3 +1,4 @@
Flask==1.1.2
selenium==3.141.0
PyYAML~=6.0
pony==0.7.16