Commit 41ec076b4b90f1b511d5bdcd38969b191186ffa2
1 parent
59e73138
Exists in
master
and in
1 other branch
- maintopics uses a table instead of list.
Showing
2 changed files
with
150 additions
and
1 deletions
Show diff stats
serve.py
... | ... | @@ -121,7 +121,7 @@ class RootHandler(BaseHandler): |
121 | 121 | @tornado.web.authenticated |
122 | 122 | def get(self): |
123 | 123 | uid = self.current_user |
124 | - self.render('maintopics.html', | |
124 | + self.render('maintopics-table.html', | |
125 | 125 | uid=uid, |
126 | 126 | name=self.learn.get_student_name(uid), |
127 | 127 | state=self.learn.get_student_state(uid), | ... | ... |
... | ... | @@ -0,0 +1,149 @@ |
1 | +{% autoescape %} | |
2 | + | |
3 | +<!doctype html> | |
4 | +<html lang="pt-PT"> | |
5 | +<head> | |
6 | + <title>iLearn</title> | |
7 | + <link rel="icon" href="/static/favicon.ico"> | |
8 | + | |
9 | + <meta charset="utf-8"> | |
10 | + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
11 | + <meta name="author" content="Miguel Barão"> | |
12 | + | |
13 | +<!-- Bootstrap, Fontawesome --> | |
14 | + <link rel="stylesheet" href="/static/bootstrap/css/bootstrap-material.min.css"> | |
15 | + | |
16 | +<!-- Other --> | |
17 | + <link rel="stylesheet" href="/static/css/maintopics.css"> | |
18 | + | |
19 | + <script defer src="/static/fontawesome/fontawesome-all.min.js"></script> | |
20 | + | |
21 | +<!-- <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script> --> | |
22 | + <script defer src="/static/js/jquery.min.js"></script> | |
23 | + <script defer src="/static/popper/umd/popper.min.js"></script> | |
24 | + <script defer src="/static/bootstrap/js/bootstrap.min.js"></script> | |
25 | + <script defer src="/static/js/maintopics.js"></script> | |
26 | + | |
27 | +</head> | |
28 | +<!-- ===================================================================== --> | |
29 | +<body> | |
30 | +<nav class="navbar navbar-expand-sm fixed-top navbar-dark bg-primary"> | |
31 | + <!-- <a class="navbar-brand" href="#"> --> | |
32 | + <img src="/static/logo_horizontal.png" height="48" width="120" class="navbar-brand" alt="UEvora"> | |
33 | + <!-- </a> --> | |
34 | + <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation"> | |
35 | + <span class="navbar-toggler-icon"></span> | |
36 | + </button> | |
37 | + | |
38 | + <div class="collapse navbar-collapse" id="navbarText"> | |
39 | + <ul class="navbar-nav mr-auto"></ul> | |
40 | + | |
41 | + <ul class="navbar-nav"> | |
42 | + <li class="nav-item dropdown"> | |
43 | + <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | |
44 | + <i class="fas fa-user" aria-hidden="true"></i> | |
45 | + <span id="name">{{ escape(name) }}</span> | |
46 | + <span class="caret"></span> | |
47 | + </a> | |
48 | + <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown"> | |
49 | + <button class="dropdown-item" data-toggle="modal" data-target="#password_modal">Mudar Password</button> | |
50 | + <div class="dropdown-divider"></div> | |
51 | + <a class="dropdown-item" href="/logout">Sair</a> | |
52 | + </div> | |
53 | + </li> | |
54 | + </ul> | |
55 | + </div> | |
56 | +</nav> | |
57 | +<!-- ===================================================================== --> | |
58 | +<div class="container"> | |
59 | + | |
60 | + <div id="notifications"></div> | |
61 | + | |
62 | + <h4>{{ title }}</h4> | |
63 | + | |
64 | + <table class="table table-hover"> | |
65 | + <thead> | |
66 | + <tr> | |
67 | + <th>Tópico</th> | |
68 | + <th class="text-center">Nível</th> | |
69 | + </tr> | |
70 | + </thead> | |
71 | + <tbody> | |
72 | + {% for t in state %} | |
73 | + {% if t['level'] is None %} | |
74 | + <tr class="table-primary"> | |
75 | + <td> | |
76 | + <div class="text-muted"> | |
77 | + {{ t['name'] }} | |
78 | + </div> | |
79 | + </td> | |
80 | + <td class="text-center"> | |
81 | + <i class="fas fa-lock text-muted"></i> | |
82 | + </td> | |
83 | + </tr> | |
84 | + | |
85 | + {% else %} | |
86 | + <tr> | |
87 | + <td> | |
88 | + <a href="/topic/{{t['ref']}}"> | |
89 | + {{ t['name'] }} | |
90 | + </a> | |
91 | + </td> | |
92 | + <td class="text-center"> | |
93 | + <a href="/topic/{{t['ref']}}"> | |
94 | + {% if t['level'] < 0.01 %} | |
95 | + <!-- <div class="ml-auto p-2"> --> | |
96 | + <i class="fas fa-lock-open text-success"></i> | |
97 | + <!-- </div> --> | |
98 | + {% elif t['type']=='chapter' %} | |
99 | + <div class="text-xs-right"> | |
100 | + <!-- <div class="ml-auto p-2"> --> | |
101 | + <i class="fas fa-trophy fa-lg text-warning"></i> | |
102 | + <!-- </div> --> | |
103 | + </div> | |
104 | + {% else %} | |
105 | + <div class="text-xs-right"> | |
106 | + <span class="text-nowrap"> | |
107 | + {{ round(t['level']*5)*'<i class="fas fa-star text-warning"></i>' + (5-round(t['level']*5))*'<i class="far fa-star text-warning"></i>' }} | |
108 | + </span> | |
109 | + </div> | |
110 | + {% end %} | |
111 | + </a> | |
112 | + </td> | |
113 | + </tr> | |
114 | + {% end %} | |
115 | + {% end %} | |
116 | + </tbody> | |
117 | + </table> | |
118 | +</div> | |
119 | + | |
120 | + | |
121 | +<!-- === Change Password Modal =========================================== --> | |
122 | +<div id="password_modal" class="modal fade" tabindex="-1" role="dialog"> | |
123 | + <div class="modal-dialog modal-sm" role="document"> | |
124 | + <div class="modal-content"> | |
125 | +<!-- header --> | |
126 | + <div class="modal-header"> | |
127 | + <h5 class="modal-title">Alterar Password</h5> | |
128 | + </div> | |
129 | +<!-- body --> | |
130 | + <div class="modal-body"> | |
131 | + <div class="control-group"> | |
132 | + <label for="new_password" class="control-label">Introduza a nova password:</label> | |
133 | + <div class="controls"> | |
134 | + <input type="password" id="new_password" name="new_password" autocomplete="new-password"> | |
135 | + </div> | |
136 | + </div> | |
137 | + </div> | |
138 | +<!-- footer --> | |
139 | + <div class="modal-footer"> | |
140 | + <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button> | |
141 | + <button id="change_password" type="button" class="btn btn-danger" data-dismiss="modal">Alterar</button> | |
142 | + </div> | |
143 | + | |
144 | + </div><!-- /.modal-content --> | |
145 | + </div><!-- /.modal-dialog --> | |
146 | +</div><!-- /.modal --> | |
147 | + | |
148 | +</body> | |
149 | +</html> | ... | ... |