fair-web/views/contest.ejs

<% this.title = contest.title + ' - 比赛' %>
<style>
.ui.label.pointing.below.left::before { left: 12%; }
.ui.label.pointing.below.right::before { left: 88%; }
.ui.label.pointing.below.left { margin-bottom: 0; }
.ui.label.pointing.below.right { margin-bottom: 0; float: right; }
</style>
<% include header %>
<div class="padding">
  <h1 style="margin-bottom: 30px; "><%= contest.title %></h1>
  <% let start = syzoj.utils.formatDate(contest.start_time), end = syzoj.utils.formatDate(contest.end_time); %>
  <% if (syzoj.utils.getCurrentDate() >= contest.start_time && syzoj.utils.getCurrentDate() < contest.end_time && start.split(' ')[0] === end.split(' ')[0]) {
    start = start.split(' ')[1]; end = end.split(' ')[1];
  } %>
  <div class="ui pointing below left label">
    <%= start %>
  </div>
  <div class="ui pointing below right label">
    <%= end %>
  </div>
  <% let timePercentage = Math.floor(Math.min(1, (syzoj.utils.getCurrentDate() - contest.start_time) / (contest.end_time - contest.start_time)) * 100); %>
  <div id="timer-progress" class="ui indicating progress<% if (timePercentage == 100) { %> success<% } %>" data-percent="<%= timePercentage %>">
    <div class="bar" style="width: <%= timePercentage %>%;"></div>
  </div>
  <div class="ui grid">
  <% if (contest.allowedEdit || !contest.running) { %>
    <div class="row">
      <div class="column">
        <div class="ui buttons">
          <a class="ui small positive button" href="<%= syzoj.utils.makeUrl(['contest', contest.id, 'ranklist']) %>">排行榜</a>
    <% if (contest.allowedEdit) { %>
          <a class="ui small button" href="<%= syzoj.utils.makeUrl(['contest', contest.id, 'edit']) %>">编辑比赛</a>
    <% } %>
        </div>
      </div>
    </div>
  <% } %>
    <div class="row">
      <div class="column">
        <h4 class="ui top attached block header">描述</h4>
        <div class="ui bottom attached segment">
          <%- contest.information %>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="column">
         <table class="ui selectable celled table">
            <thead>
              <tr>
                <th class="one wide" style="text-align: center">状态</th>
                <th class="fourteen wide">题目</th>
                <th class="one wide" style="text-align: center">代码</th>
              </tr>
            </thead>
            <tbody>
              <%
              let i = 0;
              for (let problem of problems) {
                i++;
              %>
              <tr>
                <td class="center aligned" style="white-space: nowrap; ">
                <% if (problem.judge_id) { %>
                  <a href="<%= syzoj.utils.makeUrl(['submission', problem.judge_id]) %>">
                  <% if (problem.status === true) { %>
                  <i class="black checkmark icon"></i>
                  <% } else if (problem.status !== false) { %>
                    <span class="status <%= problem.status.toLowerCase().split(' ').join('_') %>">
                      <%= problem.status %>
                    </span>
                  <% } %>
                <% } %>
                </td>
                <td><a href="<%= syzoj.utils.makeUrl(['contest', contest.id, i]) %>"><%= syzoj.utils.removeTitleTag(problem.problem.title) %></a></td>
                <td class="center aligned">
                <% if (problem.judge_id) { %>
                <a href="<%= syzoj.utils.makeUrl(['submission', problem.judge_id]) %>"><i style="color: #000;" class="code icon"></i></a>
                <% } %>
                </td>
              </tr>
            <% } %>
            </tbody>
        </table>
      </div>
    </div>
  </div>
</div>

<script>
$(function () {
  setInterval(function () {
    $('#timer-progress').progress({
      value: Date.now() / 1000 - <%= contest.start_time %>,
      total: <%= contest.end_time - contest.start_time %>
    });
  }, 5000);
});
</script>
<% include footer %>