results.html 5.79 KB
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title> ${t['title']} </title>
    <link rel="icon" href="favicon.ico">

    <!-- Bootstrap -->
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-theme.min.css"> <!-- optional -->

    <script src="/js/jquery.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>

    <style>
        /* Fixes navigation panel overlaying content */
        body {
            padding-top: 80px;
            background: #aaa;
        }
        .drop-shadow {
            -webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
            box-shadow: 0px 2px 10px 3px rgba(0, 0, 0, .2);
            border-radius:5px;
        }
        .progress {
            margin-bottom: 0px;
            border-radius: 25px;
        }
    </style>
 </head>
 <!-- ===================================================================== -->
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container-fluid drop-shadow">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">
          <!-- <img class="brand" alt="UEvora" src="/pomba-ue.svg"/> -->
          UEvora
      </a>
    </div>

    <!-- <p class="navbar-text"> ${t['title']} </p> -->

    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav">
        <li><a href="/test">Teste</a></li>
        <li class="active"><a href="/resultados">Resultados</a></li>
      </ul>

    </div>
  </div>
</nav>


<div class="container">
    <div class="panel panel-default drop-shadow">
        <div class="panel-heading">
            ${t['title']}
        </div>
        <!-- <div class="panel-body"> -->
        % if not results:
            <h4 class="text-center">Ainda não há resultados</h4>

        % else:
            <table class="table table-hover">
                <thead>
                <tr>
                    <th class="col-md-1 text-center">#</th>
                    <th class="col-md-7 text-left">Nome</th>
                    <th class="col-md-4 text-center">Nota</th>
                    <th class="col-md-0"></th>
                </tr>
                </thead>
                <tbody>
                    <%!
                        from datetime import datetime
                    %>
                    % for r in results:
                    <tr>
                        <td class="text-center">
                            % if loop.index == 0:
                                <h4>
                                <!-- <span class="label label-primary"> -->
                                1º
                                <!-- </span> -->
                                </h4>
                            % else:
                                <!-- <span class="label label-primary"> -->
                                ${loop.index+1}
                                <!-- </span> -->
                            % endif
                        </td>
                        <!-- <td>${r[0]}</td> -->  <!-- numero -->
                        <td>
                            % if loop.index == 0:
                                <h4 class="text-uppercase"><img src="\crown.jpg" /> ${r[1]}</h4>
                            % else:
                                ${r[1]}
                            % endif
                        </td>  <!-- nome -->
                        <td>              <!-- nota -->
                            <div class="progress">
                                % if r[2] < 10:
                                    <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="${'{0}'.format(round(r[2]))}" aria-valuemin="0" aria-valuemax="20" style="min-width: 2em; width: ${'{0}'.format(round(5 * r[2]))}%;">
                                % elif r[2] < 15:
                                    <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="${'{0}'.format(round(r[2]))}" aria-valuemin="0" aria-valuemax="20" style="min-width: 2em; width: ${'{0}'.format(round(5 * r[2]))}%;">
                                % else:
                                    <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="${'{0}'.format(round(r[2]))}" aria-valuemin="0" aria-valuemax="20" style="min-width: 2em; width: ${'{0}'.format(round(5 * r[2]))}%;">
                                % endif
                                    ${'{:.1f}'.format(r[2])}
                                </div>
                            </div>
                        </td>
                        <td class="text-right">
                            <%
                                dt = datetime.now() - datetime.strptime(r[3], '%Y-%m-%d %H:%M:%S.%f')
                            %>
                            <small>
                            % if dt.days > 0:
                                ${dt.days}d
                            % elif dt.seconds >= 3600:
                                (${dt.seconds // 3600} horas
                            % elif dt.seconds >= 60:
                                (${dt.seconds // 60} minutos
                            % else:
                                (${dt.seconds} segundos
                            % endif

                            </small>
                        </td>
                    </tr>
                    % endfor
                </tbody>
            </table>
        % endif
    </div> <!-- panel -->
</div> <!-- container -->
</body>
</html>