forked from mrlan/EnglishPal
				
			AJAX载入文章数据
							parent
							
								
									5039f5710e
								
							
						
					
					
						commit
						d9f6df7fbe
					
				| 
						 | 
				
			
			@ -49,16 +49,12 @@
 | 
			
		|||
{#        <div class="alert alert-warning" role="alert">Congratulations! {{ message }}</div>#}
 | 
			
		||||
{#    {% 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>
 | 
			
		||||
    {% endif %}
 | 
			
		||||
    {% 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 %}
 | 
			
		||||
        <button class="btn btn-success" id="load_pre_article" onclick="load_pre_article()" > 上一篇 Previous Article </button>
 | 
			
		||||
 | 
			
		||||
    <p><b>阅读文章并回答问题</b></p>
 | 
			
		||||
    <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>
 | 
			
		||||
                <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/>
 | 
			
		||||
| 
						 | 
				
			
			@ -78,15 +74,13 @@
 | 
			
		|||
                <button onclick="toggle_visibility('answer');">ANSWER</button>
 | 
			
		||||
                <div id="answer" style="display:none;">{{ today_article['answer'] }}</div><br/>
 | 
			
		||||
            </div>
 | 
			
		||||
        {% elif result_of_generate_article == "not found" %}
 | 
			
		||||
            <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>
 | 
			
		||||
        {% elif result_of_generate_article == "had read all articles" %}
 | 
			
		||||
            <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>
 | 
			
		||||
            </div>
 | 
			
		||||
        {% endif %}
 | 
			
		||||
        </div>
 | 
			
		||||
        <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>
 | 
			
		||||
        </div>
 | 
			
		||||
        <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>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <input type="checkbox" onclick="toggleHighlighting()" checked/>生词高亮
 | 
			
		||||
| 
						 | 
				
			
			@ -151,28 +145,20 @@
 | 
			
		|||
        <script src="{{ js }}"></script>
 | 
			
		||||
    {% endfor %}
 | 
			
		||||
{% endif %}
 | 
			
		||||
<script>
 | 
			
		||||
<script type="text/javascript">
 | 
			
		||||
    function load_next_article(){
 | 
			
		||||
        $.ajax({
 | 
			
		||||
            url: '/get_next_article/{{username}}',
 | 
			
		||||
            dataType: 'json',
 | 
			
		||||
            success: function(data) {
 | 
			
		||||
 | 
			
		||||
                // 更新页面内容
 | 
			
		||||
                    if(data){
 | 
			
		||||
                        $('#user_level').html(data['user_level']);
 | 
			
		||||
                        $('#text_level').html(data["text_level"]);
 | 
			
		||||
                        $('#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"]);
 | 
			
		||||
                    }
 | 
			
		||||
 | 
			
		||||
                if(data['today_article']){
 | 
			
		||||
                    update(data['today_article']);
 | 
			
		||||
                    check_pre(data['visited_articles']);
 | 
			
		||||
                    check_next(data['result_of_generate_article']);
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
 | 
			
		||||
    }
 | 
			
		||||
    function load_pre_article(){
 | 
			
		||||
        $.ajax({
 | 
			
		||||
| 
						 | 
				
			
			@ -180,19 +166,44 @@
 | 
			
		|||
            dataType: 'json',
 | 
			
		||||
            success: function(data) {
 | 
			
		||||
                // 更新页面内容
 | 
			
		||||
                if(data){
 | 
			
		||||
                    $('#user_level').html(data['user_level']);
 | 
			
		||||
                    $('#text_level').html(data["text_level"]);
 | 
			
		||||
                    $('#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"]);
 | 
			
		||||
                if(data['today_article']){
 | 
			
		||||
                    update(data['today_article']);
 | 
			
		||||
                    check_pre(data['visited_articles']);
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
        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>
 | 
			
		||||
</body>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -32,7 +32,12 @@ def get_next_article(username):
 | 
			
		|||
        else:  # 当前不为“null”,直接 index+=1
 | 
			
		||||
            visited_articles["index"] += 1
 | 
			
		||||
        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:
 | 
			
		||||
        return 'Under construction'
 | 
			
		||||
    return json.dumps(data)
 | 
			
		||||
| 
						 | 
				
			
			@ -42,11 +47,19 @@ def get_pre_article(username):
 | 
			
		|||
    user_freq_record = path_prefix + 'static/frequency/' + 'frequency_%s.pickle' % (username)
 | 
			
		||||
    if request.method == 'GET':
 | 
			
		||||
        visited_articles = session.get("visited_articles")
 | 
			
		||||
        visited_articles["index"] -= 1  # 上一篇,index-=1
 | 
			
		||||
        if visited_articles['article_ids'][-1] == "null":  # 如果当前还是“null”,则将“null”pop出来
 | 
			
		||||
            visited_articles['article_ids'].pop()
 | 
			
		||||
        session["visited_articles"] = visited_articles
 | 
			
		||||
        visited_articles, data, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles'))
 | 
			
		||||
        if(visited_articles["index"]==0):
 | 
			
		||||
            data=''
 | 
			
		||||
        else:
 | 
			
		||||
            visited_articles["index"] -= 1  # 上一篇,index-=1
 | 
			
		||||
            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)
 | 
			
		||||
 | 
			
		||||
@userService.route("/<username>/<word>/unfamiliar", methods=['GET', 'POST'])
 | 
			
		||||
| 
						 | 
				
			
			@ -146,10 +159,6 @@ def userpage(username):
 | 
			
		|||
                               yml=Yaml.yml,
 | 
			
		||||
                               words=words)
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@userService.route("/<username>/mark", methods=['GET', 'POST'])
 | 
			
		||||
def user_mark_word(username):
 | 
			
		||||
    '''
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue