Browse Source

Optimize judge state ajax

pull/6/head
Menci 8 years ago
parent
commit
085ffa014b
  1. 42
      views/judge_detail_item.ejs

42
views/judge_detail_item.ejs

@ -1,5 +1,5 @@
<div class="padding"> <div class="padding">
<table class="ui very basic center aligned table"> <table class="ui very basic center aligned table" id="status_table">
<thead> <thead>
<tr> <tr>
<th>编号</th> <th>编号</th>
@ -45,7 +45,7 @@
<h3 class="ui header">编译信息</h3> <h3 class="ui header">编译信息</h3>
<div class="ui existing segment"><pre style="margin-top: 0; margin-bottom: 0; "><code><%- judge.result.compiler_output %></code></pre></div> <div class="ui existing segment"><pre style="margin-top: 0; margin-bottom: 0; "><code><%- judge.result.compiler_output %></code></pre></div>
<% } else if (judge.allowedSeeResult) { %> <% } else if (judge.allowedSeeResult) { %>
<div class="ui styled fluid accordion"> <div class="ui styled fluid accordion" id="testcases_list">
<% for (let i = 0; i < judge.result.case_num; i++) { %> <% for (let i = 0; i < judge.result.case_num; i++) { %>
<% <%
let testcase = judge.result[i], pending = false; let testcase = judge.result[i], pending = false;
@ -74,8 +74,8 @@
<% } %> <% } %>
</div> </div>
</div> </div>
<% if (!pending) { %>
<div class="content"> <div class="content">
<% if (!pending) { %>
<p> <p>
<strong>输入文件</strong> <strong>输入文件</strong>
<div class="ui existing segment"><pre style="margin-top: 0; margin-bottom: 0; "><code><%= testcase.input %></code></pre></div> <div class="ui existing segment"><pre style="margin-top: 0; margin-bottom: 0; "><code><%= testcase.input %></code></pre></div>
@ -84,8 +84,8 @@
<strong>你的输出</strong> <strong>你的输出</strong>
<div class="ui existing segment"><pre style="margin-top: 0; margin-bottom: 0; "><code><%= testcase.user_out %></code></pre></div> <div class="ui existing segment"><pre style="margin-top: 0; margin-bottom: 0; "><code><%= testcase.user_out %></code></pre></div>
</p> </p>
</div>
<% } %> <% } %>
</div>
<% } %> <% } %>
</div> </div>
<% } %> <% } %>
@ -101,22 +101,36 @@ $(function() {
}); });
</script> </script>
<% if (isPending(judge.status)) { %> <% if (!isPending(judge.status)) { %><div><div id="stop_ajax"></div></div><% } %>
<script> <script>
function get_status_from_html(html) { <% if (isPending(judge.status)) { %>
var x = $.parseHTML(html);
return $(x).find('td.status').text().trim();
}
function update_judge_detail() { function update_judge_detail() {
setTimeout(function () { setTimeout(function () {
$.get('/judge_detail/<%= judge.id %>/ajax', function (data) { $.get('/judge_detail/<%= judge.id %>/ajax', function (data) {
var e = $('#judge_detail_item'); var e = $('#judge_detail_item'), x = $($.parseHTML(data));
if (e.find('td.status').text().trim() != get_status_from_html(data)) e.html(data); if (e.find('td.status').text().trim() != x.find('td.status').text().trim()) {
else update_judge_detail(); var a = e.find('#testcases_list > div');
if (!a.length) {
e.html(data);
} else {
e.find('#status_table').html(x.find('#status_table'));
var b = x.find('#testcases_list > div');
console.log(a);
console.log(b);
console.log(233);
for (var i = 0; i < a.length; i++) {
a[i].innerHTML = b[i].innerHTML;
if (!$(b[i]).hasClass('pending')) $(a[i]).removeClass('pending');
if (!$(b[i]).attr('style')) $(a[i]).attr('style', '');
}
if (!x.find('#stop_ajax').length) update_judge_detail();
}
}
else if (!x.find('#stop_ajax').length) update_judge_detail();
}); });
}, 500); }, 500);
} }
update_judge_detail(); update_judge_detail();
</script>
<% } %> <% } %>
</script>

Loading…
Cancel
Save