zhangenhuai
/
EnglishPal
forked from mrlan/EnglishPal
1
0
Fork 0
Code Pull Requests 1 Activity

AJAX载入文章数据

Bug532-HuangDan
huangdan 2023-05-11 15:51:10 +08:00
parent 5039f5710e
commit d9f6df7fbe
2 changed files with 69 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
app/templates/userpage_get.html
View File

@ -49,16 +49,12 @@
{# <div class="alert alert-warning" role="alert">Congratulations! {{ message }}</div>#} {# <div class="alert alert-warning" role="alert">Congratulations! {{ message }}</div>#}
{# {% endfor %}#} {# {% endfor %}#}
{% if result_of_generate_article != "had read all articles" %}
<button class="btn btn-success" id="load_next_article" onclick="load_next_article()"> 下一篇 Next Article </button> <button class="btn btn-success" id="load_next_article" onclick="load_next_article()"> 下一篇 Next Article </button>
{% endif %} <button class="btn btn-success" id="load_pre_article" onclick="load_pre_article()" > 上一篇 Previous Article </button>
{% if session.get('visited_articles') and session.get('visited_articles')['index']>0 %}
<button class="btn btn-success" id="load_pre_article" onclick="load_pre_article()"> 上一篇 Previous Article </button>
{% endif %}
<p><b>阅读文章并回答问题</b></p> <p><b>阅读文章并回答问题</b></p>
<div id="text-content"> <div id="text-content">
{% if result_of_generate_article == 'found' %} <div id="found">
<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> <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>
<p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/> <p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/>
<div class="p-3 mb-2 bg-light text-dark"><br/> <div class="p-3 mb-2 bg-light text-dark"><br/>
@ -78,15 +74,13 @@
<button onclick="toggle_visibility('answer');">ANSWER</button> <button onclick="toggle_visibility('answer');">ANSWER</button>
<div id="answer" style="display:none;">{{ today_article['answer'] }}</div><br/> <div id="answer" style="display:none;">{{ today_article['answer'] }}</div><br/>
</div> </div>
{% elif result_of_generate_article == "not found" %} </div>
<div class="alert alert-success" role="alert"> <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 you. You can try again a few times or mark new words in the passage to improve your level.</p> <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> </div>
{% elif result_of_generate_article == "had read all articles" %} <div class="alert alert-success" role="alert" id="read_all" style="display:none;">
<div class="alert alert-success" role="alert"> <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>
{% endif %}
</div> </div>
<input type="checkbox" onclick="toggleHighlighting()" checked/>生词高亮 <input type="checkbox" onclick="toggleHighlighting()" checked/>生词高亮
@ -151,28 +145,20 @@
<script src="{{ js }}"></script> <script src="{{ js }}"></script>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
<script> <script type="text/javascript">
function load_next_article(){ function load_next_article(){
$.ajax({ $.ajax({
url: '/get_next_article/{{username}}', url: '/get_next_article/{{username}}',
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
// 更新页面内容 // 更新页面内容
if(data){ if(data['today_article']){
$('#user_level').html(data['user_level']); update(data['today_article']);
$('#text_level').html(data["text_level"]); check_pre(data['visited_articles']);
$('#date').html('Article added on: '+data["date"]); check_next(data['result_of_generate_article']);
$('#article_title').html(data["article_title"]); }
$('#article').html(data["article_body"]);
$('#source').html(data['source']);
$('#question').html(data["question"]);
$('#answer').html(data["answer"]);
}
} }
}); });
} }
function load_pre_article(){ function load_pre_article(){
$.ajax({ $.ajax({
@ -180,19 +166,44 @@
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
// 更新页面内容 // 更新页面内容
if(data){ if(data['today_article']){
$('#user_level').html(data['user_level']); update(data['today_article']);
$('#text_level').html(data["text_level"]); check_pre(data['visited_articles']);
$('#date').html('Article added on: '+data["date"]);
$('#article_title').html(data["article_title"]);
$('#article').html(data["article_body"]);
$('#source').html(data['source']);
$('#question').html(data["question"]);
$('#answer').html(data["answer"]);
} }
} }
}); });
console.info({{visited_articles}}) }
function update(today_article){
$('#user-level').html(today_article['user_level']);
$('#text_level').html(today_article["text_level"]);
$('#date').html('Article added on: '+today_article["date"]);
$('#article_title').html(today_article["article_title"]);
$('#article').html(today_article["article_body"]);
$('#source').html(today_article['source']);
$('#question').html(today_article["question"]);
$('#answer').html(today_article["answer"]);
}
<!-- 检查是否存在上一篇或下一篇，不存在则对应按钮隐藏-->
function check_pre(visited_articles){
if((visited_articles=='')||(visited_articles['index']<=0)){
$('#load_pre_article').hide();
}else{
$('#load_pre_article').show();
}
}
function check_next(result_of_generate_article){
if(result_of_generate_article == "found"){
$('#found').show();$('#not_found').hide();
$('#read_all').hide();
}else if(result_of_generate_article == "not found"){
$('#found').hide();
$('#not_found').show();
$('#read_all').hide();
}else{
$('#found').hide();
$('#not_found').hide();
$('#read_all').show();
}
} }
</script> </script>
</body> </body>

29
app/user_service.py
View File

@ -32,7 +32,12 @@ def get_next_article(username):
else: # 当前不为“null”，直接 index+=1 else: # 当前不为“null”，直接 index+=1
visited_articles["index"] += 1 visited_articles["index"] += 1
session["visited_articles"] = visited_articles session["visited_articles"] = visited_articles
visited_articles, data, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles')) visited_articles, today_article, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles'))
data = {
'visited_articles': visited_articles,
'today_article': today_article,
'result_of_generate_article': result_of_generate_article
}
else: else:
return 'Under construction' return 'Under construction'
return json.dumps(data) return json.dumps(data)
@ -42,11 +47,19 @@ def get_pre_article(username):
user_freq_record = path_prefix + 'static/frequency/' + 'frequency_%s.pickle' % (username) user_freq_record = path_prefix + 'static/frequency/' + 'frequency_%s.pickle' % (username)
if request.method == 'GET': if request.method == 'GET':
visited_articles = session.get("visited_articles") visited_articles = session.get("visited_articles")
visited_articles["index"] -= 1 # 上一篇，index-=1 if(visited_articles["index"]==0):
if visited_articles['article_ids'][-1] == "null": # 如果当前还是“null”，则将“null”pop出来 data=''
visited_articles['article_ids'].pop() else:
session["visited_articles"] = visited_articles visited_articles["index"] -= 1 # 上一篇，index-=1
visited_articles, data, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles')) if visited_articles['article_ids'][-1] == "null": # 如果当前还是“null”，则将“null”pop出来
visited_articles['article_ids'].pop()
session["visited_articles"] = visited_articles
visited_articles, today_article, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles'))
data = {
'visited_articles': visited_articles,
'today_article': today_article,
'result_of_generate_article':result_of_generate_article
}
return json.dumps(data) return json.dumps(data)
@userService.route("/<username>/<word>/unfamiliar", methods=['GET', 'POST']) @userService.route("/<username>/<word>/unfamiliar", methods=['GET', 'POST'])
@ -146,10 +159,6 @@ def userpage(username):
yml=Yaml.yml, yml=Yaml.yml,
words=words) words=words)
@userService.route("/<username>/mark", methods=['GET', 'POST']) @userService.route("/<username>/mark", methods=['GET', 'POST'])
def user_mark_word(username): def user_mark_word(username):
''' '''