Commit 16d954bb624b55cb5b1b9a853deb7283bf12f721
1 parent
977fb6e3
Exists in
master
Remoção da pasta assets da estrutura do projeto.
Showing
90 changed files
with
1143 additions
and
1141 deletions
Show diff stats
main.py
... | ... | @@ -49,7 +49,7 @@ def read_settings(app): |
49 | 49 | def setup_controller(): |
50 | 50 | global controller |
51 | 51 | read_settings(app) |
52 | - env = Environment(loader=PackageLoader('main', 'view')) | |
52 | + env = Environment(loader=PackageLoader('main', 'view/templates')) | |
53 | 53 | controller = Validador(app.config, env) |
54 | 54 | |
55 | 55 | def setup_static_files_service(app): | ... | ... |
validador.py
... | ... | @@ -33,9 +33,9 @@ class Validador: |
33 | 33 | pbclient.create_task(project.id, task) |
34 | 34 | |
35 | 35 | def __update_project_info(self, project): |
36 | - template = self.env.get_template('template.html') | |
36 | + template = self.env.get_template('index.html') | |
37 | 37 | project.info['task_presenter'] = template.render(server=self.config['HOST_STATIC_FILES_ENDPOINT'], server_backend=self.config['HOST_ENDPOINT'], app_shortname=self.config['PYBOSSA_APP_SHORT_NAME']) |
38 | - project.info['thumbnail'] = self.config['HOST_STATIC_FILES_ENDPOINT'] + "/assets/img/thumbnail.png" | |
38 | + project.info['thumbnail'] = self.config['HOST_STATIC_FILES_ENDPOINT'] + "/img/thumbnail.png" | |
39 | 39 | project.info['sched'] = "incremental" |
40 | 40 | project.info['published'] = True |
41 | 41 | project.allow_anonymous_contributors = False | ... | ... |
view/assets/css/main.css
... | ... | @@ -1,175 +0,0 @@ |
1 | -@import url("ranking.css"); | |
2 | - | |
3 | -@font-face { | |
4 | - font-family: 'Titillium Web'; | |
5 | - src: url('../fonts/titilliumweb/TitilliumWeb-SemiBold.ttf') | |
6 | - format('truetype'); | |
7 | -} | |
8 | - | |
9 | -#alert-container { | |
10 | - padding: 0px; | |
11 | -} | |
12 | - | |
13 | -#alert-container .alert-actions a { | |
14 | - padding: 10px 15px 10px 0px; | |
15 | -} | |
16 | - | |
17 | -#main-container { | |
18 | - font-family: 'Titillium Web', sans-serif; | |
19 | -} | |
20 | - | |
21 | -/* Navbar */ | |
22 | -#validador-navbar { | |
23 | - padding-top: 10px; | |
24 | -} | |
25 | - | |
26 | -#validador-navbar .ranking-button { | |
27 | - font-size: 20px; | |
28 | - font-weight: bold; | |
29 | -} | |
30 | - | |
31 | -/* Validador */ | |
32 | -.video-body { | |
33 | - height: 338px; | |
34 | - width: 85%; | |
35 | - background-color: #000000; | |
36 | -} | |
37 | - | |
38 | -.video-container { | |
39 | - padding-left: 40px; | |
40 | - padding-right: 0px; | |
41 | -} | |
42 | - | |
43 | -.row { | |
44 | - margin-left: 0%; | |
45 | - margin-right: 0%; | |
46 | -} | |
47 | - | |
48 | -.line-separator, .btn-default { | |
49 | - box-shadow: 2px 2px 2px rgba(215, 217, 221, 1.0); | |
50 | - -webkit-box-shadow: 2px 2px 2px rgba(215, 217, 221, 1.0); | |
51 | - -moz-box-shadow: 2px 2px 2px rgba(215, 217, 221, 1.0); | |
52 | -} | |
53 | - | |
54 | -#validador-header { | |
55 | - padding-left: 15px; | |
56 | -} | |
57 | - | |
58 | -#validador-header .validador-question { | |
59 | - margin-top: 0px; | |
60 | -} | |
61 | - | |
62 | -.body-container { | |
63 | - background: rgba(236, 238, 242, 1.0); | |
64 | - padding: 0px 0px 10px 0px; | |
65 | -} | |
66 | - | |
67 | -.line-separator { | |
68 | - height: 2px; | |
69 | - width: 100%; | |
70 | - background-color: rgba(145, 200, 206, 1.0); | |
71 | -} | |
72 | - | |
73 | -h1, h2, h3, h4, h5, h6 { | |
74 | - color: rgba(144, 164, 174, 1.0); | |
75 | -} | |
76 | - | |
77 | -h6 { | |
78 | - font-size: 20px; | |
79 | -} | |
80 | - | |
81 | -.btn-default { | |
82 | - background-color: rgba(94, 199, 189, 1.0); | |
83 | -} | |
84 | - | |
85 | -.btn-default { | |
86 | - color: rgba(255, 255, 255, 1.0); | |
87 | -} | |
88 | - | |
89 | -.icon { | |
90 | - width: 50px; | |
91 | - height: 50px; | |
92 | -} | |
93 | - | |
94 | -#finish-task-container { | |
95 | - padding-right: 15px; | |
96 | -} | |
97 | - | |
98 | -.finish-padding-top { | |
99 | - padding-top: 10px; | |
100 | -} | |
101 | - | |
102 | -.finish-padding-top-adjust { | |
103 | - padding-top: 70px; | |
104 | -} | |
105 | - | |
106 | -.finish-task-button { | |
107 | - float: right; | |
108 | - padding-bottom: 0px; | |
109 | - padding-left: 25px; | |
110 | - color: rgba(94, 199, 189, 1.0); | |
111 | -} | |
112 | - | |
113 | -.enabled-button:hover { | |
114 | - cursor: pointer; | |
115 | - filter: alpha(opacity = 50); | |
116 | - opacity: 0.5; | |
117 | -} | |
118 | - | |
119 | -.disabled-button { | |
120 | - filter: alpha(opacity = 50); | |
121 | - opacity: 0.5; | |
122 | -} | |
123 | - | |
124 | -.radio-options span { | |
125 | - padding-right: 5px; | |
126 | -} | |
127 | - | |
128 | -.radio-options input[type=radio] { | |
129 | - width: 18px; | |
130 | - height: 18px; | |
131 | -} | |
132 | - | |
133 | -.correct-answer-container { | |
134 | - padding-right: 10px; | |
135 | - float: left; | |
136 | -} | |
137 | - | |
138 | -.correct-answer-label { | |
139 | - color: #5fc64e; | |
140 | -} | |
141 | - | |
142 | -.incorrect-answer-label { | |
143 | - color: #ec2327; | |
144 | -} | |
145 | - | |
146 | -#comment-ref { | |
147 | - display: none; | |
148 | - padding-right: 40px; | |
149 | -} | |
150 | - | |
151 | -#comment-avatar { | |
152 | - display: none; | |
153 | -} | |
154 | - | |
155 | -.mask { | |
156 | - filter: alpha(opacity = 50); | |
157 | - opacity: 0.5; | |
158 | -} | |
159 | - | |
160 | -#loading-container { | |
161 | - display: none; | |
162 | - position: fixed; | |
163 | - top: 0; | |
164 | - right: 0; | |
165 | - bottom: 0; | |
166 | - left: 0; | |
167 | - z-index: 1040; | |
168 | -} | |
169 | - | |
170 | -#loading-container img { | |
171 | - position: absolute; | |
172 | - width: 80px; | |
173 | - top: 37%; | |
174 | - left: 47%; | |
175 | -} | |
176 | 0 | \ No newline at end of file |
view/assets/css/ranking.css
... | ... | @@ -1,124 +0,0 @@ |
1 | -@font-face { | |
2 | - font-family: 'Roboto'; | |
3 | - src: url('../fonts/roboto/Roboto-Light.ttf') format('truetype'); | |
4 | -} | |
5 | - | |
6 | -#ranking-container { | |
7 | - display: none; | |
8 | - background-color: #ffffff; | |
9 | - border-radius: 5px; | |
10 | - -moz-border-radius: 5px; | |
11 | - -webkit-border-radius: 5px; | |
12 | - padding-right: 0px; | |
13 | - overflow: hidden; | |
14 | - font-family: 'Roboto'; | |
15 | - padding-left: 15px; | |
16 | - margin: 10px 15px 5px 15px; | |
17 | -} | |
18 | - | |
19 | -#ranking-info-container { | |
20 | - padding-left: 0px; | |
21 | -} | |
22 | - | |
23 | -#ranking-info-container .title { | |
24 | - color: #000000; | |
25 | - font-size: 50px; | |
26 | -} | |
27 | - | |
28 | -#ranking-info-container .avatar-info { | |
29 | - text-align: center; | |
30 | - padding-top: 30px; | |
31 | -} | |
32 | - | |
33 | -#ranking-info-container .avatar-container { | |
34 | - display: none; | |
35 | -} | |
36 | - | |
37 | -#ranking-info-container .avatar-info img { | |
38 | - width: 100%; | |
39 | -} | |
40 | - | |
41 | -#ranking-info-container .achievement-info { | |
42 | - color: #028c12; | |
43 | -} | |
44 | - | |
45 | -#ranking-info-container .progress-container { | |
46 | - padding-left: 100px; | |
47 | - margin-top: 10px; | |
48 | -} | |
49 | - | |
50 | -#ranking-info-container .achievements-container { | |
51 | - position: relative; | |
52 | - padding: 10px 0px 0px 0px; | |
53 | - word-wrap: break-word; | |
54 | -} | |
55 | - | |
56 | -#ranking-info-container .progress-label { | |
57 | - position: absolute; | |
58 | - left: 0px; | |
59 | -} | |
60 | - | |
61 | -#ranking-info-container .done-tasks { | |
62 | - color: #84DC76; | |
63 | -} | |
64 | - | |
65 | -#ranking-info-container .total-tasks { | |
66 | - color: #f0ad4e; | |
67 | -} | |
68 | - | |
69 | -#ranking-info-container .tooltip-inner { | |
70 | - font-size: 16px; | |
71 | - max-width: 220px; | |
72 | -} | |
73 | - | |
74 | -#leaderboard-container { | |
75 | - background-color: #fefcfc; | |
76 | - padding: 0px; | |
77 | - min-height: 560px; | |
78 | -} | |
79 | - | |
80 | -#leaderboard-container table { | |
81 | - margin-bottom: 0px; | |
82 | -} | |
83 | - | |
84 | -#leaderboard-container .table-striped>tbody>tr:nth-of-type(odd) { | |
85 | - background-color: #f1f2f2; | |
86 | -} | |
87 | - | |
88 | -#leaderboard-container .table-striped>tbody>tr:hover { | |
89 | - background-color: #e0e0e0; | |
90 | -} | |
91 | - | |
92 | -#leaderboard-container .table-striped>tbody>tr.highlight { | |
93 | - background-color: #fbefa3; | |
94 | -} | |
95 | - | |
96 | -#leaderboard-container .table-striped>tbody>tr.highlight:hover { | |
97 | - background-color: #f7e783; | |
98 | -} | |
99 | - | |
100 | -#leaderboard-container th { | |
101 | - text-align: center; | |
102 | - border: 0px; | |
103 | - padding-bottom: 15px; | |
104 | -} | |
105 | - | |
106 | -#leaderboard-container td { | |
107 | - text-align: center; | |
108 | - border: 0px; | |
109 | -} | |
110 | - | |
111 | -#leaderboard-container td:nth-of-type(1), #leaderboard-container td:nth-of-type(2) | |
112 | - { | |
113 | - width: 75px; | |
114 | -} | |
115 | - | |
116 | -#leaderboard-container td:nth-of-type(2), #leaderboard-container th:nth-of-type(2), | |
117 | - #leaderboard-container td:nth-of-type(3), #leaderboard-container th:nth-of-type(3) | |
118 | - { | |
119 | - text-align: left; | |
120 | -} | |
121 | - | |
122 | -#leaderboard-container th:nth-of-type(3) img { | |
123 | - padding-left: 20px; | |
124 | -} | |
125 | 0 | \ No newline at end of file |
view/assets/fonts/roboto/Roboto-Black.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-BlackItalic.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-Bold.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-BoldItalic.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-Italic.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-Light.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-LightItalic.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-Medium.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-MediumItalic.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-Regular.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-Thin.ttf
No preview for this file type
view/assets/fonts/roboto/Roboto-ThinItalic.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-Black.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-Bold.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-BoldItalic.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-ExtraLight.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-ExtraLightItalic.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-Italic.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-Light.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-LightItalic.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-Regular.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-SemiBold.ttf
No preview for this file type
view/assets/fonts/titilliumweb/TitilliumWeb-SemiBoldItalic.ttf
No preview for this file type
view/assets/img/correct.png
4.98 KB
view/assets/img/finish.svg
... | ... | @@ -1,17 +0,0 @@ |
1 | -<?xml version="1.0" encoding="UTF-8"?> | |
2 | -<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> | |
3 | -<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100px" height="100px" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" | |
4 | -viewBox="0 0 100 100" | |
5 | - xmlns:xlink="http://www.w3.org/1999/xlink"> | |
6 | - <defs> | |
7 | - <style type="text/css"> | |
8 | - <![CDATA[ | |
9 | - .fil0 {fill:#5EC7BD;fill-rule:nonzero} | |
10 | - ]]> | |
11 | - </style> | |
12 | - </defs> | |
13 | - <g id="finish"> | |
14 | - <metadata id="finish"/> | |
15 | - <path class="fil0" d="M44 79c-4,4 -10,4 -13,0l-20 -20c-2,-2 -3,-4 -3,-6 0,-3 1,-5 3,-7 3,-3 9,-3 13,0l12 12c0,1 2,1 3,0l37 -37c2,-2 5,-3 7,-3l0 0c2,0 5,1 6,3 2,1 3,4 3,6 0,3 -1,5 -3,7l-45 45z"/> | |
16 | - </g> | |
17 | -</svg> |
view/assets/img/incorrect.png
4.88 KB
view/assets/img/loading.gif
78 KB
view/assets/img/ranking/bronze-star-icon.png
343 Bytes
view/assets/img/ranking/gold-star-icon.png
338 Bytes
view/assets/img/ranking/signs-icon.png
2.07 KB
view/assets/img/ranking/silver-star-icon.png
337 Bytes
view/assets/img/ranking/trophy-icon.png
1.36 KB
view/assets/img/ranking/user-shape.png
4.08 KB
view/assets/img/skip.svg
... | ... | @@ -1,17 +0,0 @@ |
1 | -<?xml version="1.0" encoding="UTF-8"?> | |
2 | -<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> | |
3 | -<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100px" height="100px" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" | |
4 | -viewBox="0 0 100 100" | |
5 | - xmlns:xlink="http://www.w3.org/1999/xlink"> | |
6 | - <defs> | |
7 | - <style type="text/css"> | |
8 | - <![CDATA[ | |
9 | - .fil0 {fill:#5EC7BD;fill-rule:nonzero} | |
10 | - ]]> | |
11 | - </style> | |
12 | - </defs> | |
13 | - <g id="skip"> | |
14 | - <metadata id="skip"/> | |
15 | - <path class="fil0" d="M10 24c1,-1 23,-17 45,0 8,6 12,15 13,26l22 0 -34 34 -34 -34 22 0c0,-1 1,-3 1,-4 -2,-29 -19,-26 -35,-22z"/> | |
16 | - </g> | |
17 | -</svg> |
view/assets/img/thumbnail.png
34.6 KB
view/assets/js/external-libs/js.cookie.js
... | ... | @@ -1,145 +0,0 @@ |
1 | -/*! | |
2 | - * JavaScript Cookie v2.0.4 | |
3 | - * https://github.com/js-cookie/js-cookie | |
4 | - * | |
5 | - * Copyright 2006, 2015 Klaus Hartl & Fagner Brack | |
6 | - * Released under the MIT license | |
7 | - */ | |
8 | -(function (factory) { | |
9 | - if (typeof define === 'function' && define.amd) { | |
10 | - define(factory); | |
11 | - } else if (typeof exports === 'object') { | |
12 | - module.exports = factory(); | |
13 | - } else { | |
14 | - var _OldCookies = window.Cookies; | |
15 | - var api = window.Cookies = factory(); | |
16 | - api.noConflict = function () { | |
17 | - window.Cookies = _OldCookies; | |
18 | - return api; | |
19 | - }; | |
20 | - } | |
21 | -}(function () { | |
22 | - function extend () { | |
23 | - var i = 0; | |
24 | - var result = {}; | |
25 | - for (; i < arguments.length; i++) { | |
26 | - var attributes = arguments[ i ]; | |
27 | - for (var key in attributes) { | |
28 | - result[key] = attributes[key]; | |
29 | - } | |
30 | - } | |
31 | - return result; | |
32 | - } | |
33 | - | |
34 | - function init (converter) { | |
35 | - function api (key, value, attributes) { | |
36 | - var result; | |
37 | - | |
38 | - // Write | |
39 | - | |
40 | - if (arguments.length > 1) { | |
41 | - attributes = extend({ | |
42 | - path: '/' | |
43 | - }, api.defaults, attributes); | |
44 | - | |
45 | - if (typeof attributes.expires === 'number') { | |
46 | - var expires = new Date(); | |
47 | - expires.setMilliseconds(expires.getMilliseconds() + attributes.expires * 864e+5); | |
48 | - attributes.expires = expires; | |
49 | - } | |
50 | - | |
51 | - try { | |
52 | - result = JSON.stringify(value); | |
53 | - if (/^[\{\[]/.test(result)) { | |
54 | - value = result; | |
55 | - } | |
56 | - } catch (e) {} | |
57 | - | |
58 | - if (!converter.write) { | |
59 | - value = encodeURIComponent(String(value)) | |
60 | - .replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g, decodeURIComponent); | |
61 | - } else { | |
62 | - value = converter.write(value, key); | |
63 | - } | |
64 | - | |
65 | - key = encodeURIComponent(String(key)); | |
66 | - key = key.replace(/%(23|24|26|2B|5E|60|7C)/g, decodeURIComponent); | |
67 | - key = key.replace(/[\(\)]/g, escape); | |
68 | - | |
69 | - return (document.cookie = [ | |
70 | - key, '=', value, | |
71 | - attributes.expires && '; expires=' + attributes.expires.toUTCString(), // use expires attribute, max-age is not supported by IE | |
72 | - attributes.path && '; path=' + attributes.path, | |
73 | - attributes.domain && '; domain=' + attributes.domain, | |
74 | - attributes.secure ? '; secure' : '' | |
75 | - ].join('')); | |
76 | - } | |
77 | - | |
78 | - // Read | |
79 | - | |
80 | - if (!key) { | |
81 | - result = {}; | |
82 | - } | |
83 | - | |
84 | - // To prevent the for loop in the first place assign an empty array | |
85 | - // in case there are no cookies at all. Also prevents odd result when | |
86 | - // calling "get()" | |
87 | - var cookies = document.cookie ? document.cookie.split('; ') : []; | |
88 | - var rdecode = /(%[0-9A-Z]{2})+/g; | |
89 | - var i = 0; | |
90 | - | |
91 | - for (; i < cookies.length; i++) { | |
92 | - var parts = cookies[i].split('='); | |
93 | - var name = parts[0].replace(rdecode, decodeURIComponent); | |
94 | - var cookie = parts.slice(1).join('='); | |
95 | - | |
96 | - if (cookie.charAt(0) === '"') { | |
97 | - cookie = cookie.slice(1, -1); | |
98 | - } | |
99 | - | |
100 | - try { | |
101 | - cookie = converter.read ? | |
102 | - converter.read(cookie, name) : converter(cookie, name) || | |
103 | - cookie.replace(rdecode, decodeURIComponent); | |
104 | - | |
105 | - if (this.json) { | |
106 | - try { | |
107 | - cookie = JSON.parse(cookie); | |
108 | - } catch (e) {} | |
109 | - } | |
110 | - | |
111 | - if (key === name) { | |
112 | - result = cookie; | |
113 | - break; | |
114 | - } | |
115 | - | |
116 | - if (!key) { | |
117 | - result[name] = cookie; | |
118 | - } | |
119 | - } catch (e) {} | |
120 | - } | |
121 | - | |
122 | - return result; | |
123 | - } | |
124 | - | |
125 | - api.get = api.set = api; | |
126 | - api.getJSON = function () { | |
127 | - return api.apply({ | |
128 | - json: true | |
129 | - }, [].slice.call(arguments)); | |
130 | - }; | |
131 | - api.defaults = {}; | |
132 | - | |
133 | - api.remove = function (key, attributes) { | |
134 | - api(key, '', extend(attributes, { | |
135 | - expires: -1 | |
136 | - })); | |
137 | - }; | |
138 | - | |
139 | - api.withConverter = init; | |
140 | - | |
141 | - return api; | |
142 | - } | |
143 | - | |
144 | - return init(function () {}); | |
145 | -})); |
view/assets/js/helpers/load-html-helper.js
... | ... | @@ -1,21 +0,0 @@ |
1 | -(function(loadHtmlHelper, $, undefined) { | |
2 | - | |
3 | - var baseUrl = ''; | |
4 | - | |
5 | - function _preprocessHtml(data) { | |
6 | - return data.replace(/{{ server }}/g, baseUrl); | |
7 | - } | |
8 | - | |
9 | - loadHtmlHelper.load = function(target, url, callback) { | |
10 | - var completeUrl = baseUrl + url; | |
11 | - $.get(completeUrl, function(data) { | |
12 | - $(target).html(_preprocessHtml(data)); | |
13 | - callback && callback(); | |
14 | - }); | |
15 | - } | |
16 | - | |
17 | - loadHtmlHelper.setup = function(url) { | |
18 | - baseUrl = url; | |
19 | - }; | |
20 | - | |
21 | -}(window.loadHtmlHelper = window.loadHtmlHelper || {}, jQuery)); |
view/assets/js/helpers/pybossa-api-helper.js
... | ... | @@ -1,44 +0,0 @@ |
1 | -(function(pybossaApiHelper, $, undefined) { | |
2 | - | |
3 | - var pybossaEndpoint = ''; | |
4 | - var projectName = ''; | |
5 | - | |
6 | - function _getProjectId() { | |
7 | - return $.ajax({ | |
8 | - url : pybossaEndpoint + '/api/project?short_name=' + projectName | |
9 | - }); | |
10 | - } | |
11 | - | |
12 | - function _getUserProgress() { | |
13 | - return $.ajax({ | |
14 | - url : pybossaEndpoint + '/api/project/' + projectName + '/userprogress', | |
15 | - cache : false, | |
16 | - dataType : 'json' | |
17 | - }); | |
18 | - } | |
19 | - | |
20 | - function _getAnswers(projectId, userId) { | |
21 | - return $.ajax({ | |
22 | - url : pybossaEndpoint + '/api/taskrun?project_id=' + projectId | |
23 | - + '&user_id=' + userId | |
24 | - }); | |
25 | - } | |
26 | - | |
27 | - pybossaApiHelper.setup = function(endpoint, name) { | |
28 | - pybossaEndpoint = endpoint; | |
29 | - projectName = name; | |
30 | - } | |
31 | - | |
32 | - pybossaApiHelper.getProjectId = function() { | |
33 | - return _getProjectId(); | |
34 | - } | |
35 | - | |
36 | - pybossaApiHelper.getUserProgress = function() { | |
37 | - return _getUserProgress(); | |
38 | - } | |
39 | - | |
40 | - pybossaApiHelper.getAnswers = function(projectId, userId) { | |
41 | - return _getAnswers(projectId, userId); | |
42 | - } | |
43 | - | |
44 | -}(window.pybossaApiHelper = window.pybossaApiHelper || {}, jQuery)); |
view/assets/js/ranking.js
... | ... | @@ -1,163 +0,0 @@ |
1 | -(function(ranking, $, undefined) { | |
2 | - | |
3 | - var NUMBER_OF_TOP_USERS = 10; | |
4 | - var STARS_MAP = ['', 'gold', 'silver', 'bronze']; | |
5 | - var baseUrl = ''; | |
6 | - var pybossaEndpoint = ''; | |
7 | - var projectName = ''; | |
8 | - var loggedUser = {}; | |
9 | - var totalTasks = 0; | |
10 | - var doneTasks = 0; | |
11 | - var showingRanking = false; | |
12 | - var tasksEnded = false; | |
13 | - | |
14 | - function _getRankingData(callback) { | |
15 | - $.ajax({ | |
16 | - url : pybossaEndpoint + '/api/leaderboard?limit=' | |
17 | - + NUMBER_OF_TOP_USERS, | |
18 | - success : function(response) { | |
19 | - callback(typeof response == 'object' ? response[projectName] | |
20 | - : ''); | |
21 | - }, | |
22 | - error : function(xhr, textStatus, error) { | |
23 | - alert(xhr.responseText); | |
24 | - } | |
25 | - }); | |
26 | - } | |
27 | - | |
28 | - function _processRankingRow(rowData) { | |
29 | - var rank = rowData.rank; | |
30 | - if (rank < 0) { | |
31 | - return ''; | |
32 | - } | |
33 | - var starHTML = ''; | |
34 | - if (rank > 0 && rank < 4) { | |
35 | - starHTML = '<img src="' + baseUrl + '/assets/img/ranking/' | |
36 | - + STARS_MAP[rank] + '-star-icon.png">'; | |
37 | - } | |
38 | - var trHTML = '<tr>'; | |
39 | - if (rowData.name === loggedUser.name) { | |
40 | - trHTML = '<tr class="warning">'; | |
41 | - loggedUser.rank = rowData.rank; | |
42 | - } | |
43 | - rank = rank == 0 ? '-' : rank + '.'; | |
44 | - return trHTML + '<td>' + starHTML + '</td><td>' + rank | |
45 | - + '</td><td><a href="/pybossa/account/' + rowData.name | |
46 | - + '/" target="_blank">' + rowData.fullname + '</a></td><td>' | |
47 | - + rowData.score + '</td></tr>'; | |
48 | - } | |
49 | - | |
50 | - function _updateRanking() { | |
51 | - _getRankingData(function(data) { | |
52 | - if (data === '') | |
53 | - return; | |
54 | - | |
55 | - var rowsHTML = ''; | |
56 | - for (var i = 0; i < data.length; i++) { | |
57 | - rowsHTML += _processRankingRow(data[i]); | |
58 | - } | |
59 | - $('#leaderboard-container tbody').html(rowsHTML); | |
60 | - $('#ranking-info-container .rank-position').html(loggedUser.rank); | |
61 | - $('#ranking-info-container .username').html(loggedUser.fullName); | |
62 | - if (loggedUser.avatarUrl != '') { | |
63 | - $('#ranking-info-container .avatar-container img').attr('src', | |
64 | - loggedUser.avatarUrl); | |
65 | - $('#ranking-info-container .avatar-placeholder').hide(); | |
66 | - $('#ranking-info-container .avatar-container').show(); | |
67 | - } | |
68 | - if (loggedUser.rank === 0) { | |
69 | - $('#ranking-info-container .rank-position-container').hide(); | |
70 | - } | |
71 | - _updateProgress(); | |
72 | - }); | |
73 | - } | |
74 | - | |
75 | - function _getUserData() { | |
76 | - return $.ajax({ | |
77 | - url : pybossaEndpoint + '/api/user?name=' + loggedUser.name | |
78 | - }); | |
79 | - } | |
80 | - | |
81 | - function _getAvatarUrl(data) { | |
82 | - return !data || typeof data.avatar === 'undefined' || typeof data.container === 'undefined' ? | |
83 | - '' : pybossaEndpoint + '/uploads/' + data.container + '/' + data.avatar; | |
84 | - } | |
85 | - | |
86 | - function _updateProgress() { | |
87 | - pybossaApiHelper | |
88 | - .getUserProgress() | |
89 | - .done( | |
90 | - function(response) { | |
91 | - totalTasks = response.total; | |
92 | - doneTasks = response.done; | |
93 | - var percentage = (doneTasks / totalTasks) * 100; | |
94 | - $('#ranking-info-container .progress-bar').attr( | |
95 | - 'aria-valuenow', percentage).css('width', | |
96 | - percentage + '%'); | |
97 | - $('#ranking-container [data-toggle="tooltip"]') | |
98 | - .tooltip( | |
99 | - { | |
100 | - title : '<strong><span class="done-tasks">' | |
101 | - + doneTasks | |
102 | - + '</span> / <span class="total-tasks">' | |
103 | - + totalTasks | |
104 | - + '</span> sinais ensinados.</strong>', | |
105 | - placement : 'bottom', | |
106 | - trigger : 'manual' | |
107 | - }); | |
108 | - }); | |
109 | - } | |
110 | - | |
111 | - function _loadRankingData() { | |
112 | - _getUserData().done(function(response) { | |
113 | - if (typeof response == 'undefined' || response.length < 1) { | |
114 | - return; | |
115 | - } | |
116 | - loggedUser.fullName = response[0].fullname; | |
117 | - loggedUser.avatarUrl = _getAvatarUrl(response[0].info); | |
118 | - _updateRanking(); | |
119 | - }); | |
120 | - } | |
121 | - | |
122 | - function _showRanking() { | |
123 | - $('#validador-container').hide(); | |
124 | - $('#ranking-container').show(); | |
125 | - $('#validador-navbar .ranking-button').html("Voltar"); | |
126 | - if (doneTasks > 0) { | |
127 | - $('#ranking-container [data-toggle="tooltip"]').tooltip('show'); | |
128 | - } | |
129 | - showingRanking = true; | |
130 | - } | |
131 | - | |
132 | - function _hideRanking() { | |
133 | - $('#ranking-container').hide(); | |
134 | - $('#validador-navbar .ranking-button').html("Ver Ranking"); | |
135 | - showingRanking = false; | |
136 | - | |
137 | - if (!tasksEnded) { | |
138 | - $('#validador-container').show(); | |
139 | - } | |
140 | - } | |
141 | - | |
142 | - ranking.toggle = function() { | |
143 | - if (showingRanking) { | |
144 | - _hideRanking(); | |
145 | - } else { | |
146 | - _showRanking(); | |
147 | - } | |
148 | - }; | |
149 | - | |
150 | - ranking.tasksEnded = function() { | |
151 | - tasksEnded = true; | |
152 | - }; | |
153 | - | |
154 | - ranking.setup = function(serverUrl, endpoint, name, user) { | |
155 | - baseUrl = serverUrl; | |
156 | - pybossaEndpoint = endpoint; | |
157 | - projectName = name; | |
158 | - loggedUser.name = user; | |
159 | - loadHtmlHelper.load('#ranking-container', '/assets/templates/ranking/ranking.html', | |
160 | - _loadRankingData); | |
161 | - }; | |
162 | - | |
163 | -}(window.ranking = window.ranking || {}, jQuery)); |
view/assets/js/validador.js
... | ... | @@ -1,265 +0,0 @@ |
1 | -(function(validador, $, undefined) { | |
2 | - | |
3 | - var baseUrl = ''; | |
4 | - var serverBackendUrl = ''; | |
5 | - var videosUrl = ''; | |
6 | - var pybossaEndpoint = ''; | |
7 | - var projectName = ''; | |
8 | - var currentTaskId = -1; | |
9 | - | |
10 | - function _getLoggedUser() { | |
11 | - var pybossaRememberToken = Cookies.get('remember_token'); | |
12 | - var splittedTokenId = pybossaRememberToken.split('|'); | |
13 | - return splittedTokenId.length > 0 ? splittedTokenId[0] : 'anonymous'; | |
14 | - } | |
15 | - | |
16 | - function _disableFinishButton() { | |
17 | - $('#finish-button').off('click'); | |
18 | - $('#finish-button').removeClass('enabled-button'); | |
19 | - $('#finish-button').addClass('disabled-button'); | |
20 | - } | |
21 | - | |
22 | - function _enableFinishButton(task, deferred) { | |
23 | - $('#finish-button').removeClass('disabled-button'); | |
24 | - $('#finish-button').addClass('enabled-button'); | |
25 | - $('#finish-button').off('click').on('click', function() { | |
26 | - _readAnswer(task, deferred, false); | |
27 | - }); | |
28 | - } | |
29 | - | |
30 | - function _hideCommentAvatar() { | |
31 | - $('#comment-avatar').hide(); | |
32 | - $('#finish-task-container').removeClass('finish-padding-top-adjust'); | |
33 | - } | |
34 | - | |
35 | - function _hideCommentRef() { | |
36 | - $('#comment-ref').hide(); | |
37 | - } | |
38 | - | |
39 | - function resetComments() { | |
40 | - $('#comment-avatar textarea').val('') | |
41 | - $('#comment-ref textarea').val(''); | |
42 | - _hideCommentAvatar(); | |
43 | - _hideCommentRef(); | |
44 | - } | |
45 | - | |
46 | - function _enableLoading() { | |
47 | - $('#loading-container').show(); | |
48 | - $('#main-container').addClass('mask'); | |
49 | - } | |
50 | - | |
51 | - function _disableLoading() { | |
52 | - $('#loading-container').hide(); | |
53 | - $('#main-container').removeClass('mask'); | |
54 | - } | |
55 | - | |
56 | - function _handleAvatarRadioClick(el, task, deferred) { | |
57 | - var isIncorrectButton = $(el).val() == 'INCORRECT'; | |
58 | - if (isIncorrectButton) { | |
59 | - _hideCommentRef(); | |
60 | - $('#comment-avatar').show(); | |
61 | - $('#finish-task-container').addClass('finish-padding-top-adjust'); | |
62 | - } else { | |
63 | - _hideCommentAvatar(); | |
64 | - } | |
65 | - var isRefChecked = $('#ref-radio-answers input[type=radio]').is( | |
66 | - ':checked'); | |
67 | - if (isRefChecked) { | |
68 | - _enableFinishButton(task, deferred); | |
69 | - } else { | |
70 | - _disableFinishButton(); | |
71 | - } | |
72 | - } | |
73 | - | |
74 | - function _handleRefRadioClick(el, task, deferred) { | |
75 | - var isIncorrectButton = $(el).val() == 'INCORRECT'; | |
76 | - if (isIncorrectButton) { | |
77 | - $('#incorrect-avatar-button').prop('checked', true); | |
78 | - $('#comment-ref').show(); | |
79 | - _hideCommentAvatar(); | |
80 | - } else { | |
81 | - var isAvatarDisabled = $('#avatar-radio-answers input[type=radio]') | |
82 | - .is(':disabled'); | |
83 | - if (isAvatarDisabled) { | |
84 | - $('#incorrect-avatar-button').prop('checked', false); | |
85 | - } | |
86 | - _hideCommentRef(); | |
87 | - } | |
88 | - $('#avatar-radio-answers input[type=radio]').prop('disabled', | |
89 | - isIncorrectButton); | |
90 | - var isAvatarChecked = $('#avatar-radio-answers input[type=radio]').is( | |
91 | - ':checked'); | |
92 | - if (isAvatarChecked) { | |
93 | - _enableFinishButton(task, deferred); | |
94 | - } else { | |
95 | - _disableFinishButton(); | |
96 | - } | |
97 | - } | |
98 | - | |
99 | - function _setupGUI(task, deferred) { | |
100 | - resetComments(); | |
101 | - _disableFinishButton(); | |
102 | - $('#avatar-radio-answers input[type=radio]').prop('disabled', false); | |
103 | - $('#avatar-radio-answers input[type=radio]').prop('checked', false); | |
104 | - $('#ref-radio-answers input[type=radio]').prop('checked', false); | |
105 | - $('#avatar-radio-answers input[type=radio]').off('click').on('click', | |
106 | - function() { | |
107 | - _handleAvatarRadioClick(this, task, deferred); | |
108 | - }); | |
109 | - $('#ref-radio-answers input[type=radio]').off('click').on('click', | |
110 | - function() { | |
111 | - _handleRefRadioClick(this, task, deferred); | |
112 | - }); | |
113 | - $('#skip-button').off('click').on('click', function() { | |
114 | - _readAnswer(task, deferred, true); | |
115 | - }); | |
116 | - } | |
117 | - | |
118 | - function _readAnswer(task, deferred, hasSkipped) { | |
119 | - var status = ''; | |
120 | - var avatarAnswer = $('#avatar-radio-answers input[type=radio]:checked') | |
121 | - .val(); | |
122 | - var refAnswer = $('#ref-radio-answers input[type=radio]:checked').val(); | |
123 | - if (hasSkipped) { | |
124 | - status = 'SKIPPED'; | |
125 | - } else if (refAnswer == 'INCORRECT') { | |
126 | - status = 'REF_DISAPPROVED'; | |
127 | - } else if (avatarAnswer == 'INCORRECT') { | |
128 | - status = 'AVATAR_DISAPPROVED'; | |
129 | - } else { | |
130 | - status = 'AVATAR_APPROVED'; | |
131 | - } | |
132 | - _submitAnswer(task, deferred, status, hasSkipped); | |
133 | - } | |
134 | - | |
135 | - function _createAnswer(task, status) { | |
136 | - var answer = {}; | |
137 | - var lastAnswer = task.info.last_answer; | |
138 | - var hasLastAnswer = typeof lastAnswer != 'undefined'; | |
139 | - if (hasLastAnswer) { | |
140 | - answer = lastAnswer; | |
141 | - } else { | |
142 | - answer = { | |
143 | - 'number_of_approval' : 0, | |
144 | - 'number_of_avatar_disapproval' : 0, | |
145 | - 'number_of_ref_disapproval' : 0 | |
146 | - }; | |
147 | - } | |
148 | - answer['status'] = status; | |
149 | - answer['comment_avatar'] = ''; | |
150 | - answer['comment_ref'] = ''; | |
151 | - if (status == 'AVATAR_APPROVED') { | |
152 | - answer['number_of_approval'] = answer.number_of_approval + 1; | |
153 | - } else if (status == 'AVATAR_DISAPPROVED') { | |
154 | - answer['number_of_avatar_disapproval'] = answer.number_of_avatar_disapproval + 1; | |
155 | - var commentAvatar = $('#comment-avatar textarea').val(); | |
156 | - if (commentAvatar.trim() != '') { | |
157 | - answer['comment_avatar'] = commentAvatar; | |
158 | - } | |
159 | - } else if (status == 'REF_DISAPPROVED') { | |
160 | - answer['number_of_ref_disapproval'] = answer.number_of_ref_disapproval + 1; | |
161 | - var comment_ref = $('#comment-ref textarea').val(); | |
162 | - if (comment_ref.trim() != '') { | |
163 | - answer['comment_ref'] = comment_ref; | |
164 | - } | |
165 | - } | |
166 | - return answer; | |
167 | - } | |
168 | - | |
169 | - function _finishTask(task, deferred, answer) { | |
170 | - _enableLoading(); | |
171 | - $ | |
172 | - .ajax({ | |
173 | - type : 'POST', | |
174 | - url : serverBackendUrl + '/finish_task', | |
175 | - data : { | |
176 | - 'task_id' : task.id, | |
177 | - 'project_id' : task.project_id, | |
178 | - 'sign_name' : task.info.sign_name, | |
179 | - 'number_of_approval' : answer.number_of_approval, | |
180 | - 'number_of_avatar_disapproval' : answer.number_of_avatar_disapproval, | |
181 | - 'number_of_ref_disapproval' : answer.number_of_ref_disapproval | |
182 | - }, | |
183 | - success : function(response) { | |
184 | - pybossa.saveTask(task.id, answer).done(function() { | |
185 | - _disableLoading(); | |
186 | - $('#success').fadeIn(500); | |
187 | - $('#validador-container').hide(); | |
188 | - setTimeout(function() { | |
189 | - deferred.resolve(); | |
190 | - }, 2000); | |
191 | - }); | |
192 | - }, | |
193 | - error : function(xhr, textStatus, error) { | |
194 | - _disableLoading(); | |
195 | - alert(xhr.responseText); | |
196 | - } | |
197 | - }); | |
198 | - } | |
199 | - | |
200 | - function _submitAnswer(task, deferred, status, hasSkipped) { | |
201 | - var answer = _createAnswer(task, status); | |
202 | - if (hasSkipped) { | |
203 | - _saveAnswer(task, deferred, answer); | |
204 | - } else { | |
205 | - _finishTask(task, deferred, answer); | |
206 | - } | |
207 | - } | |
208 | - | |
209 | - function _saveAnswer(task, deferred, answer) { | |
210 | - pybossa.saveTask(task.id, answer).done(function() { | |
211 | - $('#success').fadeIn(500); | |
212 | - $('#validador-container').hide(); | |
213 | - setTimeout(function() { | |
214 | - deferred.resolve(); | |
215 | - }, 2000); | |
216 | - }); | |
217 | - } | |
218 | - | |
219 | - function _loadTaskInfo(task) { | |
220 | - currentTaskId = task.id; | |
221 | - var signName = task.info.sign_name; | |
222 | - var avatarVidLink = videosUrl + signName + '_AVATAR.webm'; | |
223 | - var refVidLink = videosUrl + signName + '_REF.webm'; | |
224 | - $('.sign-label').text(signName); | |
225 | - $('#avatar-video').attr('src', avatarVidLink); | |
226 | - $('#ref-video').attr('src', refVidLink); | |
227 | - } | |
228 | - | |
229 | - function _loadMainComponents() { | |
230 | - pybossaApiHelper.setup(pybossaEndpoint, projectName); | |
231 | - loadHtmlHelper.setup(baseUrl); | |
232 | - ranking.setup(baseUrl, pybossaEndpoint, projectName, _getLoggedUser()); | |
233 | - } | |
234 | - | |
235 | - pybossa.presentTask(function(task, deferred) { | |
236 | - _loadMainComponents(); | |
237 | - if (!$.isEmptyObject(task) && currentTaskId != task.id) { | |
238 | - _loadTaskInfo(task); | |
239 | - _setupGUI(task, deferred); | |
240 | - $('#success').hide(); | |
241 | - $('#validador-container').fadeIn(500); | |
242 | - } else { | |
243 | - $('#validador-container').hide(); | |
244 | - $('#finish').fadeIn(500); | |
245 | - ranking.tasksEnded(); | |
246 | - } | |
247 | - }); | |
248 | - | |
249 | - // Private methods | |
250 | - function _run(projectname) { | |
251 | - pybossa.setEndpoint(pybossaEndpoint); | |
252 | - pybossa.run(projectname); | |
253 | - } | |
254 | - | |
255 | - // Public methods | |
256 | - validador.run = function(serverhost, serverbackend, projname) { | |
257 | - baseUrl = serverhost; | |
258 | - serverBackendUrl = serverbackend; | |
259 | - videosUrl = baseUrl + '/videos/'; | |
260 | - pybossaEndpoint = '/pybossa'; | |
261 | - projectName = projname; | |
262 | - _run(projectName); | |
263 | - }; | |
264 | - | |
265 | -}(window.validador = window.validador || {}, jQuery)); | |
266 | 0 | \ No newline at end of file |
view/assets/templates/ranking/ranking.html
... | ... | @@ -1,47 +0,0 @@ |
1 | -<div id="ranking-info-container" class="col-sm-4"> | |
2 | - <div class="title">WikiRanking</div> | |
3 | - <div>Lorem Ipsum é apenas uma simulação de texto da indústria | |
4 | - tipográfica e de impressos, e vem sendo utilizado desde o século XVI.</div> | |
5 | - <div class="avatar-info col-sm-12"> | |
6 | - <div class="avatar-placeholder col-sm-6 col-sm-offset-3"> | |
7 | - <img src="{{ server }}/assets/img/ranking/user-shape.png"> | |
8 | - </div> | |
9 | - <div class="avatar-container col-sm-8 col-sm-offset-2"> | |
10 | - <img src=""> | |
11 | - </div> | |
12 | - <div class="col-sm-12"> | |
13 | - <div class="username"></div> | |
14 | - <div class="rank-position-container"> | |
15 | - <strong><span class="rank-position"></span>º Posição</strong> | |
16 | - </div> | |
17 | - </div> | |
18 | - </div> | |
19 | - <div class="achievements-container col-sm-12"> | |
20 | - <div class="progress-container col-sm-12"> | |
21 | - <div class="progress"> | |
22 | - <div class="progress-bar" role="progressbar" aria-valuenow="0" | |
23 | - aria-valuemin="0" aria-valuemax="100" data-toggle="tooltip" | |
24 | - data-html="true"></div> | |
25 | - </div> | |
26 | - </div> | |
27 | - <div class="progress-label"> | |
28 | - <span><strong>Progresso:</strong></span> | |
29 | - </div> | |
30 | - </div> | |
31 | -</div> | |
32 | -<div id="leaderboard-container" class="col-sm-8"> | |
33 | - <table class="table table-striped table-hover"> | |
34 | - <thead> | |
35 | - <tr> | |
36 | - <th></th> | |
37 | - <th>#</th> | |
38 | - <th><img src="{{ server }}/assets/img/ranking/trophy-icon.png"> | |
39 | - <div>Membro</div></th> | |
40 | - <th><img src="{{ server }}/assets/img/ranking/signs-icon.png"> | |
41 | - <div>Sinais</div></th> | |
42 | - </tr> | |
43 | - </thead> | |
44 | - <tbody> | |
45 | - </tbody> | |
46 | - </table> | |
47 | -</div> | |
48 | 0 | \ No newline at end of file |
... | ... | @@ -0,0 +1,175 @@ |
1 | +@import url("ranking.css"); | |
2 | + | |
3 | +@font-face { | |
4 | + font-family: 'Titillium Web'; | |
5 | + src: url('../fonts/titilliumweb/TitilliumWeb-SemiBold.ttf') | |
6 | + format('truetype'); | |
7 | +} | |
8 | + | |
9 | +#alert-container { | |
10 | + padding: 0px; | |
11 | +} | |
12 | + | |
13 | +#alert-container .alert-actions a { | |
14 | + padding: 10px 15px 10px 0px; | |
15 | +} | |
16 | + | |
17 | +#main-container { | |
18 | + font-family: 'Titillium Web', sans-serif; | |
19 | +} | |
20 | + | |
21 | +/* Navbar */ | |
22 | +#validador-navbar { | |
23 | + padding-top: 10px; | |
24 | +} | |
25 | + | |
26 | +#validador-navbar .ranking-button { | |
27 | + font-size: 20px; | |
28 | + font-weight: bold; | |
29 | +} | |
30 | + | |
31 | +/* Validador */ | |
32 | +.video-body { | |
33 | + height: 338px; | |
34 | + width: 85%; | |
35 | + background-color: #000000; | |
36 | +} | |
37 | + | |
38 | +.video-container { | |
39 | + padding-left: 40px; | |
40 | + padding-right: 0px; | |
41 | +} | |
42 | + | |
43 | +.row { | |
44 | + margin-left: 0%; | |
45 | + margin-right: 0%; | |
46 | +} | |
47 | + | |
48 | +.line-separator, .btn-default { | |
49 | + box-shadow: 2px 2px 2px rgba(215, 217, 221, 1.0); | |
50 | + -webkit-box-shadow: 2px 2px 2px rgba(215, 217, 221, 1.0); | |
51 | + -moz-box-shadow: 2px 2px 2px rgba(215, 217, 221, 1.0); | |
52 | +} | |
53 | + | |
54 | +#validador-header { | |
55 | + padding-left: 15px; | |
56 | +} | |
57 | + | |
58 | +#validador-header .validador-question { | |
59 | + margin-top: 0px; | |
60 | +} | |
61 | + | |
62 | +.body-container { | |
63 | + background: rgba(236, 238, 242, 1.0); | |
64 | + padding: 0px 0px 10px 0px; | |
65 | +} | |
66 | + | |
67 | +.line-separator { | |
68 | + height: 2px; | |
69 | + width: 100%; | |
70 | + background-color: rgba(145, 200, 206, 1.0); | |
71 | +} | |
72 | + | |
73 | +h1, h2, h3, h4, h5, h6 { | |
74 | + color: rgba(144, 164, 174, 1.0); | |
75 | +} | |
76 | + | |
77 | +h6 { | |
78 | + font-size: 20px; | |
79 | +} | |
80 | + | |
81 | +.btn-default { | |
82 | + background-color: rgba(94, 199, 189, 1.0); | |
83 | +} | |
84 | + | |
85 | +.btn-default { | |
86 | + color: rgba(255, 255, 255, 1.0); | |
87 | +} | |
88 | + | |
89 | +.icon { | |
90 | + width: 50px; | |
91 | + height: 50px; | |
92 | +} | |
93 | + | |
94 | +#finish-task-container { | |
95 | + padding-right: 15px; | |
96 | +} | |
97 | + | |
98 | +.finish-padding-top { | |
99 | + padding-top: 10px; | |
100 | +} | |
101 | + | |
102 | +.finish-padding-top-adjust { | |
103 | + padding-top: 70px; | |
104 | +} | |
105 | + | |
106 | +.finish-task-button { | |
107 | + float: right; | |
108 | + padding-bottom: 0px; | |
109 | + padding-left: 25px; | |
110 | + color: rgba(94, 199, 189, 1.0); | |
111 | +} | |
112 | + | |
113 | +.enabled-button:hover { | |
114 | + cursor: pointer; | |
115 | + filter: alpha(opacity = 50); | |
116 | + opacity: 0.5; | |
117 | +} | |
118 | + | |
119 | +.disabled-button { | |
120 | + filter: alpha(opacity = 50); | |
121 | + opacity: 0.5; | |
122 | +} | |
123 | + | |
124 | +.radio-options span { | |
125 | + padding-right: 5px; | |
126 | +} | |
127 | + | |
128 | +.radio-options input[type=radio] { | |
129 | + width: 18px; | |
130 | + height: 18px; | |
131 | +} | |
132 | + | |
133 | +.correct-answer-container { | |
134 | + padding-right: 10px; | |
135 | + float: left; | |
136 | +} | |
137 | + | |
138 | +.correct-answer-label { | |
139 | + color: #5fc64e; | |
140 | +} | |
141 | + | |
142 | +.incorrect-answer-label { | |
143 | + color: #ec2327; | |
144 | +} | |
145 | + | |
146 | +#comment-ref { | |
147 | + display: none; | |
148 | + padding-right: 40px; | |
149 | +} | |
150 | + | |
151 | +#comment-avatar { | |
152 | + display: none; | |
153 | +} | |
154 | + | |
155 | +.mask { | |
156 | + filter: alpha(opacity = 50); | |
157 | + opacity: 0.5; | |
158 | +} | |
159 | + | |
160 | +#loading-container { | |
161 | + display: none; | |
162 | + position: fixed; | |
163 | + top: 0; | |
164 | + right: 0; | |
165 | + bottom: 0; | |
166 | + left: 0; | |
167 | + z-index: 1040; | |
168 | +} | |
169 | + | |
170 | +#loading-container img { | |
171 | + position: absolute; | |
172 | + width: 80px; | |
173 | + top: 37%; | |
174 | + left: 47%; | |
175 | +} | |
0 | 176 | \ No newline at end of file | ... | ... |
... | ... | @@ -0,0 +1,124 @@ |
1 | +@font-face { | |
2 | + font-family: 'Roboto'; | |
3 | + src: url('../fonts/roboto/Roboto-Light.ttf') format('truetype'); | |
4 | +} | |
5 | + | |
6 | +#ranking-container { | |
7 | + display: none; | |
8 | + background-color: #ffffff; | |
9 | + border-radius: 5px; | |
10 | + -moz-border-radius: 5px; | |
11 | + -webkit-border-radius: 5px; | |
12 | + padding-right: 0px; | |
13 | + overflow: hidden; | |
14 | + font-family: 'Roboto'; | |
15 | + padding-left: 15px; | |
16 | + margin: 10px 15px 5px 15px; | |
17 | +} | |
18 | + | |
19 | +#ranking-info-container { | |
20 | + padding-left: 0px; | |
21 | +} | |
22 | + | |
23 | +#ranking-info-container .title { | |
24 | + color: #000000; | |
25 | + font-size: 50px; | |
26 | +} | |
27 | + | |
28 | +#ranking-info-container .avatar-info { | |
29 | + text-align: center; | |
30 | + padding-top: 30px; | |
31 | +} | |
32 | + | |
33 | +#ranking-info-container .avatar-container { | |
34 | + display: none; | |
35 | +} | |
36 | + | |
37 | +#ranking-info-container .avatar-info img { | |
38 | + width: 100%; | |
39 | +} | |
40 | + | |
41 | +#ranking-info-container .achievement-info { | |
42 | + color: #028c12; | |
43 | +} | |
44 | + | |
45 | +#ranking-info-container .progress-container { | |
46 | + padding-left: 100px; | |
47 | + margin-top: 10px; | |
48 | +} | |
49 | + | |
50 | +#ranking-info-container .achievements-container { | |
51 | + position: relative; | |
52 | + padding: 10px 0px 0px 0px; | |
53 | + word-wrap: break-word; | |
54 | +} | |
55 | + | |
56 | +#ranking-info-container .progress-label { | |
57 | + position: absolute; | |
58 | + left: 0px; | |
59 | +} | |
60 | + | |
61 | +#ranking-info-container .done-tasks { | |
62 | + color: #84DC76; | |
63 | +} | |
64 | + | |
65 | +#ranking-info-container .total-tasks { | |
66 | + color: #f0ad4e; | |
67 | +} | |
68 | + | |
69 | +#ranking-info-container .tooltip-inner { | |
70 | + font-size: 16px; | |
71 | + max-width: 220px; | |
72 | +} | |
73 | + | |
74 | +#leaderboard-container { | |
75 | + background-color: #fefcfc; | |
76 | + padding: 0px; | |
77 | + min-height: 560px; | |
78 | +} | |
79 | + | |
80 | +#leaderboard-container table { | |
81 | + margin-bottom: 0px; | |
82 | +} | |
83 | + | |
84 | +#leaderboard-container .table-striped>tbody>tr:nth-of-type(odd) { | |
85 | + background-color: #f1f2f2; | |
86 | +} | |
87 | + | |
88 | +#leaderboard-container .table-striped>tbody>tr:hover { | |
89 | + background-color: #e0e0e0; | |
90 | +} | |
91 | + | |
92 | +#leaderboard-container .table-striped>tbody>tr.highlight { | |
93 | + background-color: #fbefa3; | |
94 | +} | |
95 | + | |
96 | +#leaderboard-container .table-striped>tbody>tr.highlight:hover { | |
97 | + background-color: #f7e783; | |
98 | +} | |
99 | + | |
100 | +#leaderboard-container th { | |
101 | + text-align: center; | |
102 | + border: 0px; | |
103 | + padding-bottom: 15px; | |
104 | +} | |
105 | + | |
106 | +#leaderboard-container td { | |
107 | + text-align: center; | |
108 | + border: 0px; | |
109 | +} | |
110 | + | |
111 | +#leaderboard-container td:nth-of-type(1), #leaderboard-container td:nth-of-type(2) | |
112 | + { | |
113 | + width: 75px; | |
114 | +} | |
115 | + | |
116 | +#leaderboard-container td:nth-of-type(2), #leaderboard-container th:nth-of-type(2), | |
117 | + #leaderboard-container td:nth-of-type(3), #leaderboard-container th:nth-of-type(3) | |
118 | + { | |
119 | + text-align: left; | |
120 | +} | |
121 | + | |
122 | +#leaderboard-container th:nth-of-type(3) img { | |
123 | + padding-left: 20px; | |
124 | +} | |
0 | 125 | \ No newline at end of file | ... | ... |
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
4.98 KB
... | ... | @@ -0,0 +1,17 @@ |
1 | +<?xml version="1.0" encoding="UTF-8"?> | |
2 | +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> | |
3 | +<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100px" height="100px" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" | |
4 | +viewBox="0 0 100 100" | |
5 | + xmlns:xlink="http://www.w3.org/1999/xlink"> | |
6 | + <defs> | |
7 | + <style type="text/css"> | |
8 | + <![CDATA[ | |
9 | + .fil0 {fill:#5EC7BD;fill-rule:nonzero} | |
10 | + ]]> | |
11 | + </style> | |
12 | + </defs> | |
13 | + <g id="finish"> | |
14 | + <metadata id="finish"/> | |
15 | + <path class="fil0" d="M44 79c-4,4 -10,4 -13,0l-20 -20c-2,-2 -3,-4 -3,-6 0,-3 1,-5 3,-7 3,-3 9,-3 13,0l12 12c0,1 2,1 3,0l37 -37c2,-2 5,-3 7,-3l0 0c2,0 5,1 6,3 2,1 3,4 3,6 0,3 -1,5 -3,7l-45 45z"/> | |
16 | + </g> | |
17 | +</svg> | ... | ... |
4.88 KB
78 KB
343 Bytes
338 Bytes
2.07 KB
337 Bytes
1.36 KB
4.08 KB
... | ... | @@ -0,0 +1,17 @@ |
1 | +<?xml version="1.0" encoding="UTF-8"?> | |
2 | +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> | |
3 | +<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100px" height="100px" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" | |
4 | +viewBox="0 0 100 100" | |
5 | + xmlns:xlink="http://www.w3.org/1999/xlink"> | |
6 | + <defs> | |
7 | + <style type="text/css"> | |
8 | + <![CDATA[ | |
9 | + .fil0 {fill:#5EC7BD;fill-rule:nonzero} | |
10 | + ]]> | |
11 | + </style> | |
12 | + </defs> | |
13 | + <g id="skip"> | |
14 | + <metadata id="skip"/> | |
15 | + <path class="fil0" d="M10 24c1,-1 23,-17 45,0 8,6 12,15 13,26l22 0 -34 34 -34 -34 22 0c0,-1 1,-3 1,-4 -2,-29 -19,-26 -35,-22z"/> | |
16 | + </g> | |
17 | +</svg> | ... | ... |
34.6 KB
... | ... | @@ -0,0 +1,145 @@ |
1 | +/*! | |
2 | + * JavaScript Cookie v2.0.4 | |
3 | + * https://github.com/js-cookie/js-cookie | |
4 | + * | |
5 | + * Copyright 2006, 2015 Klaus Hartl & Fagner Brack | |
6 | + * Released under the MIT license | |
7 | + */ | |
8 | +(function (factory) { | |
9 | + if (typeof define === 'function' && define.amd) { | |
10 | + define(factory); | |
11 | + } else if (typeof exports === 'object') { | |
12 | + module.exports = factory(); | |
13 | + } else { | |
14 | + var _OldCookies = window.Cookies; | |
15 | + var api = window.Cookies = factory(); | |
16 | + api.noConflict = function () { | |
17 | + window.Cookies = _OldCookies; | |
18 | + return api; | |
19 | + }; | |
20 | + } | |
21 | +}(function () { | |
22 | + function extend () { | |
23 | + var i = 0; | |
24 | + var result = {}; | |
25 | + for (; i < arguments.length; i++) { | |
26 | + var attributes = arguments[ i ]; | |
27 | + for (var key in attributes) { | |
28 | + result[key] = attributes[key]; | |
29 | + } | |
30 | + } | |
31 | + return result; | |
32 | + } | |
33 | + | |
34 | + function init (converter) { | |
35 | + function api (key, value, attributes) { | |
36 | + var result; | |
37 | + | |
38 | + // Write | |
39 | + | |
40 | + if (arguments.length > 1) { | |
41 | + attributes = extend({ | |
42 | + path: '/' | |
43 | + }, api.defaults, attributes); | |
44 | + | |
45 | + if (typeof attributes.expires === 'number') { | |
46 | + var expires = new Date(); | |
47 | + expires.setMilliseconds(expires.getMilliseconds() + attributes.expires * 864e+5); | |
48 | + attributes.expires = expires; | |
49 | + } | |
50 | + | |
51 | + try { | |
52 | + result = JSON.stringify(value); | |
53 | + if (/^[\{\[]/.test(result)) { | |
54 | + value = result; | |
55 | + } | |
56 | + } catch (e) {} | |
57 | + | |
58 | + if (!converter.write) { | |
59 | + value = encodeURIComponent(String(value)) | |
60 | + .replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g, decodeURIComponent); | |
61 | + } else { | |
62 | + value = converter.write(value, key); | |
63 | + } | |
64 | + | |
65 | + key = encodeURIComponent(String(key)); | |
66 | + key = key.replace(/%(23|24|26|2B|5E|60|7C)/g, decodeURIComponent); | |
67 | + key = key.replace(/[\(\)]/g, escape); | |
68 | + | |
69 | + return (document.cookie = [ | |
70 | + key, '=', value, | |
71 | + attributes.expires && '; expires=' + attributes.expires.toUTCString(), // use expires attribute, max-age is not supported by IE | |
72 | + attributes.path && '; path=' + attributes.path, | |
73 | + attributes.domain && '; domain=' + attributes.domain, | |
74 | + attributes.secure ? '; secure' : '' | |
75 | + ].join('')); | |
76 | + } | |
77 | + | |
78 | + // Read | |
79 | + | |
80 | + if (!key) { | |
81 | + result = {}; | |
82 | + } | |
83 | + | |
84 | + // To prevent the for loop in the first place assign an empty array | |
85 | + // in case there are no cookies at all. Also prevents odd result when | |
86 | + // calling "get()" | |
87 | + var cookies = document.cookie ? document.cookie.split('; ') : []; | |
88 | + var rdecode = /(%[0-9A-Z]{2})+/g; | |
89 | + var i = 0; | |
90 | + | |
91 | + for (; i < cookies.length; i++) { | |
92 | + var parts = cookies[i].split('='); | |
93 | + var name = parts[0].replace(rdecode, decodeURIComponent); | |
94 | + var cookie = parts.slice(1).join('='); | |
95 | + | |
96 | + if (cookie.charAt(0) === '"') { | |
97 | + cookie = cookie.slice(1, -1); | |
98 | + } | |
99 | + | |
100 | + try { | |
101 | + cookie = converter.read ? | |
102 | + converter.read(cookie, name) : converter(cookie, name) || | |
103 | + cookie.replace(rdecode, decodeURIComponent); | |
104 | + | |
105 | + if (this.json) { | |
106 | + try { | |
107 | + cookie = JSON.parse(cookie); | |
108 | + } catch (e) {} | |
109 | + } | |
110 | + | |
111 | + if (key === name) { | |
112 | + result = cookie; | |
113 | + break; | |
114 | + } | |
115 | + | |
116 | + if (!key) { | |
117 | + result[name] = cookie; | |
118 | + } | |
119 | + } catch (e) {} | |
120 | + } | |
121 | + | |
122 | + return result; | |
123 | + } | |
124 | + | |
125 | + api.get = api.set = api; | |
126 | + api.getJSON = function () { | |
127 | + return api.apply({ | |
128 | + json: true | |
129 | + }, [].slice.call(arguments)); | |
130 | + }; | |
131 | + api.defaults = {}; | |
132 | + | |
133 | + api.remove = function (key, attributes) { | |
134 | + api(key, '', extend(attributes, { | |
135 | + expires: -1 | |
136 | + })); | |
137 | + }; | |
138 | + | |
139 | + api.withConverter = init; | |
140 | + | |
141 | + return api; | |
142 | + } | |
143 | + | |
144 | + return init(function () {}); | |
145 | +})); | ... | ... |
... | ... | @@ -0,0 +1,23 @@ |
1 | +(function(loadHtmlHelper, $, undefined) { | |
2 | + | |
3 | + var baseUrl = ''; | |
4 | + var templatesUrl = ''; | |
5 | + | |
6 | + function _preprocessHtml(data) { | |
7 | + return data.replace(/{{ server }}/g, baseUrl); | |
8 | + } | |
9 | + | |
10 | + loadHtmlHelper.load = function(target, url, callback) { | |
11 | + var completeUrl = templatesUrl + url; | |
12 | + $.get(completeUrl, function(data) { | |
13 | + $(target).html(_preprocessHtml(data)); | |
14 | + callback && callback(); | |
15 | + }); | |
16 | + } | |
17 | + | |
18 | + loadHtmlHelper.setup = function(url) { | |
19 | + baseUrl = url; | |
20 | + templatesUrl = baseUrl + "/templates"; | |
21 | + }; | |
22 | + | |
23 | +}(window.loadHtmlHelper = window.loadHtmlHelper || {}, jQuery)); | ... | ... |
... | ... | @@ -0,0 +1,44 @@ |
1 | +(function(pybossaApiHelper, $, undefined) { | |
2 | + | |
3 | + var pybossaEndpoint = ''; | |
4 | + var projectName = ''; | |
5 | + | |
6 | + function _getProjectId() { | |
7 | + return $.ajax({ | |
8 | + url : pybossaEndpoint + '/api/project?short_name=' + projectName | |
9 | + }); | |
10 | + } | |
11 | + | |
12 | + function _getUserProgress() { | |
13 | + return $.ajax({ | |
14 | + url : pybossaEndpoint + '/api/project/' + projectName + '/userprogress', | |
15 | + cache : false, | |
16 | + dataType : 'json' | |
17 | + }); | |
18 | + } | |
19 | + | |
20 | + function _getAnswers(projectId, userId) { | |
21 | + return $.ajax({ | |
22 | + url : pybossaEndpoint + '/api/taskrun?project_id=' + projectId | |
23 | + + '&user_id=' + userId | |
24 | + }); | |
25 | + } | |
26 | + | |
27 | + pybossaApiHelper.setup = function(endpoint, name) { | |
28 | + pybossaEndpoint = endpoint; | |
29 | + projectName = name; | |
30 | + } | |
31 | + | |
32 | + pybossaApiHelper.getProjectId = function() { | |
33 | + return _getProjectId(); | |
34 | + } | |
35 | + | |
36 | + pybossaApiHelper.getUserProgress = function() { | |
37 | + return _getUserProgress(); | |
38 | + } | |
39 | + | |
40 | + pybossaApiHelper.getAnswers = function(projectId, userId) { | |
41 | + return _getAnswers(projectId, userId); | |
42 | + } | |
43 | + | |
44 | +}(window.pybossaApiHelper = window.pybossaApiHelper || {}, jQuery)); | ... | ... |
... | ... | @@ -0,0 +1,163 @@ |
1 | +(function(ranking, $, undefined) { | |
2 | + | |
3 | + var NUMBER_OF_TOP_USERS = 10; | |
4 | + var STARS_MAP = ['', 'gold', 'silver', 'bronze']; | |
5 | + var baseUrl = ''; | |
6 | + var pybossaEndpoint = ''; | |
7 | + var projectName = ''; | |
8 | + var loggedUser = {}; | |
9 | + var totalTasks = 0; | |
10 | + var doneTasks = 0; | |
11 | + var showingRanking = false; | |
12 | + var tasksEnded = false; | |
13 | + | |
14 | + function _getRankingData(callback) { | |
15 | + $.ajax({ | |
16 | + url : pybossaEndpoint + '/api/leaderboard?limit=' | |
17 | + + NUMBER_OF_TOP_USERS, | |
18 | + success : function(response) { | |
19 | + callback(typeof response == 'object' ? response[projectName] | |
20 | + : ''); | |
21 | + }, | |
22 | + error : function(xhr, textStatus, error) { | |
23 | + alert(xhr.responseText); | |
24 | + } | |
25 | + }); | |
26 | + } | |
27 | + | |
28 | + function _processRankingRow(rowData) { | |
29 | + var rank = rowData.rank; | |
30 | + if (rank < 0) { | |
31 | + return ''; | |
32 | + } | |
33 | + var starHTML = ''; | |
34 | + if (rank > 0 && rank < 4) { | |
35 | + starHTML = '<img src="' + baseUrl + '/img/ranking/' | |
36 | + + STARS_MAP[rank] + '-star-icon.png">'; | |
37 | + } | |
38 | + var trHTML = '<tr>'; | |
39 | + if (rowData.name === loggedUser.name) { | |
40 | + trHTML = '<tr class="warning">'; | |
41 | + loggedUser.rank = rowData.rank; | |
42 | + } | |
43 | + rank = rank == 0 ? '-' : rank + '.'; | |
44 | + return trHTML + '<td>' + starHTML + '</td><td>' + rank | |
45 | + + '</td><td><a href="/pybossa/account/' + rowData.name | |
46 | + + '/" target="_blank">' + rowData.fullname + '</a></td><td>' | |
47 | + + rowData.score + '</td></tr>'; | |
48 | + } | |
49 | + | |
50 | + function _updateRanking() { | |
51 | + _getRankingData(function(data) { | |
52 | + if (data === '') | |
53 | + return; | |
54 | + | |
55 | + var rowsHTML = ''; | |
56 | + for (var i = 0; i < data.length; i++) { | |
57 | + rowsHTML += _processRankingRow(data[i]); | |
58 | + } | |
59 | + $('#leaderboard-container tbody').html(rowsHTML); | |
60 | + $('#ranking-info-container .rank-position').html(loggedUser.rank); | |
61 | + $('#ranking-info-container .username').html(loggedUser.fullName); | |
62 | + if (loggedUser.avatarUrl != '') { | |
63 | + $('#ranking-info-container .avatar-container img').attr('src', | |
64 | + loggedUser.avatarUrl); | |
65 | + $('#ranking-info-container .avatar-placeholder').hide(); | |
66 | + $('#ranking-info-container .avatar-container').show(); | |
67 | + } | |
68 | + if (loggedUser.rank === 0) { | |
69 | + $('#ranking-info-container .rank-position-container').hide(); | |
70 | + } | |
71 | + _updateProgress(); | |
72 | + }); | |
73 | + } | |
74 | + | |
75 | + function _getUserData() { | |
76 | + return $.ajax({ | |
77 | + url : pybossaEndpoint + '/api/user?name=' + loggedUser.name | |
78 | + }); | |
79 | + } | |
80 | + | |
81 | + function _getAvatarUrl(data) { | |
82 | + return !data || typeof data.avatar === 'undefined' || typeof data.container === 'undefined' ? | |
83 | + '' : pybossaEndpoint + '/uploads/' + data.container + '/' + data.avatar; | |
84 | + } | |
85 | + | |
86 | + function _updateProgress() { | |
87 | + pybossaApiHelper | |
88 | + .getUserProgress() | |
89 | + .done( | |
90 | + function(response) { | |
91 | + totalTasks = response.total; | |
92 | + doneTasks = response.done; | |
93 | + var percentage = (doneTasks / totalTasks) * 100; | |
94 | + $('#ranking-info-container .progress-bar').attr( | |
95 | + 'aria-valuenow', percentage).css('width', | |
96 | + percentage + '%'); | |
97 | + $('#ranking-container [data-toggle="tooltip"]') | |
98 | + .tooltip( | |
99 | + { | |
100 | + title : '<strong><span class="done-tasks">' | |
101 | + + doneTasks | |
102 | + + '</span> / <span class="total-tasks">' | |
103 | + + totalTasks | |
104 | + + '</span> sinais ensinados.</strong>', | |
105 | + placement : 'bottom', | |
106 | + trigger : 'manual' | |
107 | + }); | |
108 | + }); | |
109 | + } | |
110 | + | |
111 | + function _loadRankingData() { | |
112 | + _getUserData().done(function(response) { | |
113 | + if (typeof response == 'undefined' || response.length < 1) { | |
114 | + return; | |
115 | + } | |
116 | + loggedUser.fullName = response[0].fullname; | |
117 | + loggedUser.avatarUrl = _getAvatarUrl(response[0].info); | |
118 | + _updateRanking(); | |
119 | + }); | |
120 | + } | |
121 | + | |
122 | + function _showRanking() { | |
123 | + $('#validador-container').hide(); | |
124 | + $('#ranking-container').show(); | |
125 | + $('#validador-navbar .ranking-button').html("Voltar"); | |
126 | + if (doneTasks > 0) { | |
127 | + $('#ranking-container [data-toggle="tooltip"]').tooltip('show'); | |
128 | + } | |
129 | + showingRanking = true; | |
130 | + } | |
131 | + | |
132 | + function _hideRanking() { | |
133 | + $('#ranking-container').hide(); | |
134 | + $('#validador-navbar .ranking-button').html("Ver Ranking"); | |
135 | + showingRanking = false; | |
136 | + | |
137 | + if (!tasksEnded) { | |
138 | + $('#validador-container').show(); | |
139 | + } | |
140 | + } | |
141 | + | |
142 | + ranking.toggle = function() { | |
143 | + if (showingRanking) { | |
144 | + _hideRanking(); | |
145 | + } else { | |
146 | + _showRanking(); | |
147 | + } | |
148 | + }; | |
149 | + | |
150 | + ranking.tasksEnded = function() { | |
151 | + tasksEnded = true; | |
152 | + }; | |
153 | + | |
154 | + ranking.setup = function(serverUrl, endpoint, name, user) { | |
155 | + baseUrl = serverUrl; | |
156 | + pybossaEndpoint = endpoint; | |
157 | + projectName = name; | |
158 | + loggedUser.name = user; | |
159 | + loadHtmlHelper.load('#ranking-container', '/ranking/ranking.html', | |
160 | + _loadRankingData); | |
161 | + }; | |
162 | + | |
163 | +}(window.ranking = window.ranking || {}, jQuery)); | ... | ... |
... | ... | @@ -0,0 +1,265 @@ |
1 | +(function(validador, $, undefined) { | |
2 | + | |
3 | + var baseUrl = ''; | |
4 | + var serverBackendUrl = ''; | |
5 | + var videosUrl = ''; | |
6 | + var pybossaEndpoint = ''; | |
7 | + var projectName = ''; | |
8 | + var currentTaskId = -1; | |
9 | + | |
10 | + function _getLoggedUser() { | |
11 | + var pybossaRememberToken = Cookies.get('remember_token'); | |
12 | + var splittedTokenId = pybossaRememberToken.split('|'); | |
13 | + return splittedTokenId.length > 0 ? splittedTokenId[0] : 'anonymous'; | |
14 | + } | |
15 | + | |
16 | + function _disableFinishButton() { | |
17 | + $('#finish-button').off('click'); | |
18 | + $('#finish-button').removeClass('enabled-button'); | |
19 | + $('#finish-button').addClass('disabled-button'); | |
20 | + } | |
21 | + | |
22 | + function _enableFinishButton(task, deferred) { | |
23 | + $('#finish-button').removeClass('disabled-button'); | |
24 | + $('#finish-button').addClass('enabled-button'); | |
25 | + $('#finish-button').off('click').on('click', function() { | |
26 | + _readAnswer(task, deferred, false); | |
27 | + }); | |
28 | + } | |
29 | + | |
30 | + function _hideCommentAvatar() { | |
31 | + $('#comment-avatar').hide(); | |
32 | + $('#finish-task-container').removeClass('finish-padding-top-adjust'); | |
33 | + } | |
34 | + | |
35 | + function _hideCommentRef() { | |
36 | + $('#comment-ref').hide(); | |
37 | + } | |
38 | + | |
39 | + function resetComments() { | |
40 | + $('#comment-avatar textarea').val('') | |
41 | + $('#comment-ref textarea').val(''); | |
42 | + _hideCommentAvatar(); | |
43 | + _hideCommentRef(); | |
44 | + } | |
45 | + | |
46 | + function _enableLoading() { | |
47 | + $('#loading-container').show(); | |
48 | + $('#main-container').addClass('mask'); | |
49 | + } | |
50 | + | |
51 | + function _disableLoading() { | |
52 | + $('#loading-container').hide(); | |
53 | + $('#main-container').removeClass('mask'); | |
54 | + } | |
55 | + | |
56 | + function _handleAvatarRadioClick(el, task, deferred) { | |
57 | + var isIncorrectButton = $(el).val() == 'INCORRECT'; | |
58 | + if (isIncorrectButton) { | |
59 | + _hideCommentRef(); | |
60 | + $('#comment-avatar').show(); | |
61 | + $('#finish-task-container').addClass('finish-padding-top-adjust'); | |
62 | + } else { | |
63 | + _hideCommentAvatar(); | |
64 | + } | |
65 | + var isRefChecked = $('#ref-radio-answers input[type=radio]').is( | |
66 | + ':checked'); | |
67 | + if (isRefChecked) { | |
68 | + _enableFinishButton(task, deferred); | |
69 | + } else { | |
70 | + _disableFinishButton(); | |
71 | + } | |
72 | + } | |
73 | + | |
74 | + function _handleRefRadioClick(el, task, deferred) { | |
75 | + var isIncorrectButton = $(el).val() == 'INCORRECT'; | |
76 | + if (isIncorrectButton) { | |
77 | + $('#incorrect-avatar-button').prop('checked', true); | |
78 | + $('#comment-ref').show(); | |
79 | + _hideCommentAvatar(); | |
80 | + } else { | |
81 | + var isAvatarDisabled = $('#avatar-radio-answers input[type=radio]') | |
82 | + .is(':disabled'); | |
83 | + if (isAvatarDisabled) { | |
84 | + $('#incorrect-avatar-button').prop('checked', false); | |
85 | + } | |
86 | + _hideCommentRef(); | |
87 | + } | |
88 | + $('#avatar-radio-answers input[type=radio]').prop('disabled', | |
89 | + isIncorrectButton); | |
90 | + var isAvatarChecked = $('#avatar-radio-answers input[type=radio]').is( | |
91 | + ':checked'); | |
92 | + if (isAvatarChecked) { | |
93 | + _enableFinishButton(task, deferred); | |
94 | + } else { | |
95 | + _disableFinishButton(); | |
96 | + } | |
97 | + } | |
98 | + | |
99 | + function _setupGUI(task, deferred) { | |
100 | + resetComments(); | |
101 | + _disableFinishButton(); | |
102 | + $('#avatar-radio-answers input[type=radio]').prop('disabled', false); | |
103 | + $('#avatar-radio-answers input[type=radio]').prop('checked', false); | |
104 | + $('#ref-radio-answers input[type=radio]').prop('checked', false); | |
105 | + $('#avatar-radio-answers input[type=radio]').off('click').on('click', | |
106 | + function() { | |
107 | + _handleAvatarRadioClick(this, task, deferred); | |
108 | + }); | |
109 | + $('#ref-radio-answers input[type=radio]').off('click').on('click', | |
110 | + function() { | |
111 | + _handleRefRadioClick(this, task, deferred); | |
112 | + }); | |
113 | + $('#skip-button').off('click').on('click', function() { | |
114 | + _readAnswer(task, deferred, true); | |
115 | + }); | |
116 | + } | |
117 | + | |
118 | + function _readAnswer(task, deferred, hasSkipped) { | |
119 | + var status = ''; | |
120 | + var avatarAnswer = $('#avatar-radio-answers input[type=radio]:checked') | |
121 | + .val(); | |
122 | + var refAnswer = $('#ref-radio-answers input[type=radio]:checked').val(); | |
123 | + if (hasSkipped) { | |
124 | + status = 'SKIPPED'; | |
125 | + } else if (refAnswer == 'INCORRECT') { | |
126 | + status = 'REF_DISAPPROVED'; | |
127 | + } else if (avatarAnswer == 'INCORRECT') { | |
128 | + status = 'AVATAR_DISAPPROVED'; | |
129 | + } else { | |
130 | + status = 'AVATAR_APPROVED'; | |
131 | + } | |
132 | + _submitAnswer(task, deferred, status, hasSkipped); | |
133 | + } | |
134 | + | |
135 | + function _createAnswer(task, status) { | |
136 | + var answer = {}; | |
137 | + var lastAnswer = task.info.last_answer; | |
138 | + var hasLastAnswer = typeof lastAnswer != 'undefined'; | |
139 | + if (hasLastAnswer) { | |
140 | + answer = lastAnswer; | |
141 | + } else { | |
142 | + answer = { | |
143 | + 'number_of_approval' : 0, | |
144 | + 'number_of_avatar_disapproval' : 0, | |
145 | + 'number_of_ref_disapproval' : 0 | |
146 | + }; | |
147 | + } | |
148 | + answer['status'] = status; | |
149 | + answer['comment_avatar'] = ''; | |
150 | + answer['comment_ref'] = ''; | |
151 | + if (status == 'AVATAR_APPROVED') { | |
152 | + answer['number_of_approval'] = answer.number_of_approval + 1; | |
153 | + } else if (status == 'AVATAR_DISAPPROVED') { | |
154 | + answer['number_of_avatar_disapproval'] = answer.number_of_avatar_disapproval + 1; | |
155 | + var commentAvatar = $('#comment-avatar textarea').val(); | |
156 | + if (commentAvatar.trim() != '') { | |
157 | + answer['comment_avatar'] = commentAvatar; | |
158 | + } | |
159 | + } else if (status == 'REF_DISAPPROVED') { | |
160 | + answer['number_of_ref_disapproval'] = answer.number_of_ref_disapproval + 1; | |
161 | + var comment_ref = $('#comment-ref textarea').val(); | |
162 | + if (comment_ref.trim() != '') { | |
163 | + answer['comment_ref'] = comment_ref; | |
164 | + } | |
165 | + } | |
166 | + return answer; | |
167 | + } | |
168 | + | |
169 | + function _finishTask(task, deferred, answer) { | |
170 | + _enableLoading(); | |
171 | + $ | |
172 | + .ajax({ | |
173 | + type : 'POST', | |
174 | + url : serverBackendUrl + '/finish_task', | |
175 | + data : { | |
176 | + 'task_id' : task.id, | |
177 | + 'project_id' : task.project_id, | |
178 | + 'sign_name' : task.info.sign_name, | |
179 | + 'number_of_approval' : answer.number_of_approval, | |
180 | + 'number_of_avatar_disapproval' : answer.number_of_avatar_disapproval, | |
181 | + 'number_of_ref_disapproval' : answer.number_of_ref_disapproval | |
182 | + }, | |
183 | + success : function(response) { | |
184 | + pybossa.saveTask(task.id, answer).done(function() { | |
185 | + _disableLoading(); | |
186 | + $('#success').fadeIn(500); | |
187 | + $('#validador-container').hide(); | |
188 | + setTimeout(function() { | |
189 | + deferred.resolve(); | |
190 | + }, 2000); | |
191 | + }); | |
192 | + }, | |
193 | + error : function(xhr, textStatus, error) { | |
194 | + _disableLoading(); | |
195 | + alert(xhr.responseText); | |
196 | + } | |
197 | + }); | |
198 | + } | |
199 | + | |
200 | + function _submitAnswer(task, deferred, status, hasSkipped) { | |
201 | + var answer = _createAnswer(task, status); | |
202 | + if (hasSkipped) { | |
203 | + _saveAnswer(task, deferred, answer); | |
204 | + } else { | |
205 | + _finishTask(task, deferred, answer); | |
206 | + } | |
207 | + } | |
208 | + | |
209 | + function _saveAnswer(task, deferred, answer) { | |
210 | + pybossa.saveTask(task.id, answer).done(function() { | |
211 | + $('#success').fadeIn(500); | |
212 | + $('#validador-container').hide(); | |
213 | + setTimeout(function() { | |
214 | + deferred.resolve(); | |
215 | + }, 2000); | |
216 | + }); | |
217 | + } | |
218 | + | |
219 | + function _loadTaskInfo(task) { | |
220 | + currentTaskId = task.id; | |
221 | + var signName = task.info.sign_name; | |
222 | + var avatarVidLink = videosUrl + signName + '_AVATAR.webm'; | |
223 | + var refVidLink = videosUrl + signName + '_REF.webm'; | |
224 | + $('.sign-label').text(signName); | |
225 | + $('#avatar-video').attr('src', avatarVidLink); | |
226 | + $('#ref-video').attr('src', refVidLink); | |
227 | + } | |
228 | + | |
229 | + function _loadMainComponents() { | |
230 | + pybossaApiHelper.setup(pybossaEndpoint, projectName); | |
231 | + loadHtmlHelper.setup(baseUrl); | |
232 | + ranking.setup(baseUrl, pybossaEndpoint, projectName, _getLoggedUser()); | |
233 | + } | |
234 | + | |
235 | + pybossa.presentTask(function(task, deferred) { | |
236 | + _loadMainComponents(); | |
237 | + if (!$.isEmptyObject(task) && currentTaskId != task.id) { | |
238 | + _loadTaskInfo(task); | |
239 | + _setupGUI(task, deferred); | |
240 | + $('#success').hide(); | |
241 | + $('#validador-container').fadeIn(500); | |
242 | + } else { | |
243 | + $('#validador-container').hide(); | |
244 | + $('#finish').fadeIn(500); | |
245 | + ranking.tasksEnded(); | |
246 | + } | |
247 | + }); | |
248 | + | |
249 | + // Private methods | |
250 | + function _run(projectname) { | |
251 | + pybossa.setEndpoint(pybossaEndpoint); | |
252 | + pybossa.run(projectname); | |
253 | + } | |
254 | + | |
255 | + // Public methods | |
256 | + validador.run = function(serverhost, serverbackend, projname) { | |
257 | + baseUrl = serverhost; | |
258 | + serverBackendUrl = serverbackend; | |
259 | + videosUrl = baseUrl + '/videos/'; | |
260 | + pybossaEndpoint = '/pybossa'; | |
261 | + projectName = projname; | |
262 | + _run(projectName); | |
263 | + }; | |
264 | + | |
265 | +}(window.validador = window.validador || {}, jQuery)); | |
0 | 266 | \ No newline at end of file | ... | ... |
view/template.html
... | ... | @@ -1,120 +0,0 @@ |
1 | -<link rel="stylesheet" href="{{ server }}/assets/css/main.css"> | |
2 | - | |
3 | -<script src="{{ server }}/assets/js/external-libs/js.cookie.js"></script> | |
4 | -<script src="{{ server }}/assets/js/helpers/pybossa-api-helper.js"></script> | |
5 | -<script src="{{ server }}/assets/js/helpers/load-html-helper.js"></script> | |
6 | -<script src="{{ server }}/assets/js/ranking.js"></script> | |
7 | -<script src="{{ server }}/assets/js/validador.js"></script> | |
8 | - | |
9 | -<div id="alert-container" class="container"> | |
10 | - <div class="row"> | |
11 | - <div id="success" class="alert alert-success" style="display: none;"> | |
12 | - <a class="close" data-dismiss="alert" href="#">×</a> <strong>Parabéns!</strong> | |
13 | - <span>Tarefa concluída.</span> | |
14 | - </div> | |
15 | - <div id="finish" class="alert alert-success" style="display: none;"> | |
16 | - <a class="close" data-dismiss="alert" href="#">×</a> <strong>Que | |
17 | - pena,</strong> <span> não há mais tarefas disponíveis! </span> <br /> | |
18 | - <div class="alert-actions"> | |
19 | - <a class="btn small" href="/">Voltar</a> <a class="btn small" | |
20 | - href="/pybossa/project">ou, olhar outros projetos.</a> | |
21 | - </div> | |
22 | - </div> | |
23 | - </div> | |
24 | -</div> | |
25 | -<div id="loading-container"> | |
26 | - <img src="{{ server }}/assets/img/loading.gif"> | |
27 | -</div> | |
28 | -<div id="main-container" class="container body-container"> | |
29 | - <div id="validador-navbar" class="row"> | |
30 | - <div class="col-sm-12"> | |
31 | - <div class="btn btn-warning ranking-button pull-right" | |
32 | - onclick="ranking.toggle()">Ver Ranking</div> | |
33 | - </div> | |
34 | - </div> | |
35 | - <div id="validador-container" class="row"> | |
36 | - <div id="validador-header"> | |
37 | - <h2 class="validador-question"> | |
38 | - A animação do sinal "<span class="sign-label"></span>" está correta? | |
39 | - </h2> | |
40 | - </div> | |
41 | - <div class="line-separator"></div> | |
42 | - <div class="row"> | |
43 | - <div id="avatar-container" class="col-sm-6 video-container"> | |
44 | - <div class="row"> | |
45 | - <h6> | |
46 | - ANIMAÇÃO "<span class="sign-label"></span>": | |
47 | - </h6> | |
48 | - </div> | |
49 | - <div class="row"> | |
50 | - <video id="avatar-video" src="" preload="metadata" | |
51 | - class="video-body" autoplay loop controls> | |
52 | - <source type="video/webm"> | |
53 | - </video> | |
54 | - </div> | |
55 | - <div id="avatar-radio-answers" class="row radio-options"> | |
56 | - <div class="correct-answer-container""> | |
57 | - <span class="correct-answer-label">ESTÁ CORRETO</span><img | |
58 | - class="icon" src="{{ server }}/assets/img/correct.png"></img><input | |
59 | - value="CORRECT" type="radio" name="avatar-answers"> | |
60 | - </div> | |
61 | - <div> | |
62 | - <span class="incorrect-answer-label">ESTÁ ERRADO</span><img | |
63 | - class="icon" src="{{ server }}/assets/img/incorrect.png"></img><input | |
64 | - id="incorrect-avatar-button" value="INCORRECT" type="radio" | |
65 | - name="avatar-answers"> | |
66 | - </div> | |
67 | - </div> | |
68 | - <div id="comment-avatar" class="form-group"> | |
69 | - <h6>ENVIAR COMENTÁRIO SOBRE A ANIMAÇÃO:</h6> | |
70 | - <textarea class="form-control" rows="2"></textarea> | |
71 | - </div> | |
72 | - </div> | |
73 | - <div id="ref-container" class="col-sm-6 video-container"> | |
74 | - <div class="row"> | |
75 | - <h6> | |
76 | - VÍDEO DE REFERÊNCIA “<span class="sign-label"></span>”: | |
77 | - </h6> | |
78 | - </div> | |
79 | - <div class="row"> | |
80 | - <video id="ref-video" src="" preload="metadata" class="video-body" | |
81 | - autoplay loop controls> | |
82 | - <source type="video/webm"> | |
83 | - </video> | |
84 | - </div> | |
85 | - <div id="ref-radio-answers" class="row radio-options"> | |
86 | - <div class="correct-answer-container""> | |
87 | - <span class="correct-answer-label">ESTÁ CORRETO</span><img | |
88 | - class="icon" src="{{ server }}/assets/img/correct.png"></img><input | |
89 | - value="CORRECT" type="radio" name="ref-answers"> | |
90 | - </div> | |
91 | - <div> | |
92 | - <span class="incorrect-answer-label">ESTÁ ERRADO</span><img | |
93 | - class="icon" src="{{ server }}/assets/img/incorrect.png"></img><input | |
94 | - id="incorrect-ref-button" value="INCORRECT" type="radio" | |
95 | - name="ref-answers"> | |
96 | - </div> | |
97 | - </div> | |
98 | - <div id="comment-ref" class="form-group"> | |
99 | - <h6>ENVIAR COMENTÁRIO SOBRE O VÍDEO DE REFERÊNCIA:</h6> | |
100 | - <textarea class="form-control" rows="2"></textarea> | |
101 | - </div> | |
102 | - <div id="finish-task-container" class="row finish-padding-top"> | |
103 | - <div id="finish-button" class="finish-task-button enabled-button"> | |
104 | - <span id="finish-button-text">ENVIAR ANÁLISE E FINALIZAR</span><img | |
105 | - class="icon" src="{{ server }}/assets/img/finish.svg"></img> | |
106 | - </div> | |
107 | - <div id="skip-button" class="finish-task-button enabled-button"> | |
108 | - PULAR<img class="icon" src="{{ server }}/assets/img/skip.svg"></img> | |
109 | - </div> | |
110 | - </div> | |
111 | - </div> | |
112 | - </div> | |
113 | - </div> | |
114 | - <div id="ranking-container" class="row"></div> | |
115 | -</div> | |
116 | - | |
117 | -<script type="text/javascript"> | |
118 | - validador | |
119 | - .run("{{ server }}", "{{ server_backend }}", "{{ app_shortname }}"); | |
120 | -</script> |
... | ... | @@ -0,0 +1,120 @@ |
1 | +<link rel="stylesheet" href="{{ server }}/css/main.css"> | |
2 | + | |
3 | +<script src="{{ server }}/js/external-libs/js.cookie.js"></script> | |
4 | +<script src="{{ server }}/js/helpers/pybossa-api-helper.js"></script> | |
5 | +<script src="{{ server }}/js/helpers/load-html-helper.js"></script> | |
6 | +<script src="{{ server }}/js/ranking.js"></script> | |
7 | +<script src="{{ server }}/js/validador.js"></script> | |
8 | + | |
9 | +<div id="alert-container" class="container"> | |
10 | + <div class="row"> | |
11 | + <div id="success" class="alert alert-success" style="display: none;"> | |
12 | + <a class="close" data-dismiss="alert" href="#">×</a> <strong>Parabéns!</strong> | |
13 | + <span>Tarefa concluída.</span> | |
14 | + </div> | |
15 | + <div id="finish" class="alert alert-success" style="display: none;"> | |
16 | + <a class="close" data-dismiss="alert" href="#">×</a> <strong>Que | |
17 | + pena,</strong><span> não há mais tarefas disponíveis!</span><br /> | |
18 | + <div class="alert-actions"> | |
19 | + <a class="btn small" href="/">Voltar</a> <a class="btn small" | |
20 | + href="/pybossa/project">ou, olhar outros projetos.</a> | |
21 | + </div> | |
22 | + </div> | |
23 | + </div> | |
24 | +</div> | |
25 | +<div id="loading-container"> | |
26 | + <img src="{{ server }}/img/loading.gif"> | |
27 | +</div> | |
28 | +<div id="main-container" class="container body-container"> | |
29 | + <div id="validador-navbar" class="row"> | |
30 | + <div class="col-sm-12"> | |
31 | + <div class="btn btn-warning ranking-button pull-right" | |
32 | + onclick="ranking.toggle()">Ver Ranking</div> | |
33 | + </div> | |
34 | + </div> | |
35 | + <div id="validador-container" class="row"> | |
36 | + <div id="validador-header"> | |
37 | + <h2 class="validador-question"> | |
38 | + A animação do sinal "<span class="sign-label"></span>" está correta? | |
39 | + </h2> | |
40 | + </div> | |
41 | + <div class="line-separator"></div> | |
42 | + <div class="row"> | |
43 | + <div id="avatar-container" class="col-sm-6 video-container"> | |
44 | + <div class="row"> | |
45 | + <h6> | |
46 | + ANIMAÇÃO "<span class="sign-label"></span>": | |
47 | + </h6> | |
48 | + </div> | |
49 | + <div class="row"> | |
50 | + <video id="avatar-video" src="" preload="metadata" | |
51 | + class="video-body" autoplay loop controls> | |
52 | + <source type="video/webm"> | |
53 | + </video> | |
54 | + </div> | |
55 | + <div id="avatar-radio-answers" class="row radio-options"> | |
56 | + <div class="correct-answer-container""> | |
57 | + <span class="correct-answer-label">ESTÁ CORRETO</span><img | |
58 | + class="icon" src="{{ server }}/img/correct.png"></img><input | |
59 | + value="CORRECT" type="radio" name="avatar-answers"> | |
60 | + </div> | |
61 | + <div> | |
62 | + <span class="incorrect-answer-label">ESTÁ ERRADO</span><img | |
63 | + class="icon" src="{{ server }}/img/incorrect.png"></img><input | |
64 | + id="incorrect-avatar-button" value="INCORRECT" type="radio" | |
65 | + name="avatar-answers"> | |
66 | + </div> | |
67 | + </div> | |
68 | + <div id="comment-avatar" class="form-group"> | |
69 | + <h6>ENVIAR COMENTÁRIO SOBRE A ANIMAÇÃO:</h6> | |
70 | + <textarea class="form-control" rows="2"></textarea> | |
71 | + </div> | |
72 | + </div> | |
73 | + <div id="ref-container" class="col-sm-6 video-container"> | |
74 | + <div class="row"> | |
75 | + <h6> | |
76 | + VÍDEO DE REFERÊNCIA “<span class="sign-label"></span>”: | |
77 | + </h6> | |
78 | + </div> | |
79 | + <div class="row"> | |
80 | + <video id="ref-video" src="" preload="metadata" class="video-body" | |
81 | + autoplay loop controls> | |
82 | + <source type="video/webm"> | |
83 | + </video> | |
84 | + </div> | |
85 | + <div id="ref-radio-answers" class="row radio-options"> | |
86 | + <div class="correct-answer-container""> | |
87 | + <span class="correct-answer-label">ESTÁ CORRETO</span><img | |
88 | + class="icon" src="{{ server }}/img/correct.png"></img><input | |
89 | + value="CORRECT" type="radio" name="ref-answers"> | |
90 | + </div> | |
91 | + <div> | |
92 | + <span class="incorrect-answer-label">ESTÁ ERRADO</span><img | |
93 | + class="icon" src="{{ server }}/img/incorrect.png"></img><input | |
94 | + id="incorrect-ref-button" value="INCORRECT" type="radio" | |
95 | + name="ref-answers"> | |
96 | + </div> | |
97 | + </div> | |
98 | + <div id="comment-ref" class="form-group"> | |
99 | + <h6>ENVIAR COMENTÁRIO SOBRE O VÍDEO DE REFERÊNCIA:</h6> | |
100 | + <textarea class="form-control" rows="2"></textarea> | |
101 | + </div> | |
102 | + <div id="finish-task-container" class="row finish-padding-top"> | |
103 | + <div id="finish-button" class="finish-task-button enabled-button"> | |
104 | + <span id="finish-button-text">ENVIAR ANÁLISE E FINALIZAR</span><img | |
105 | + class="icon" src="{{ server }}/img/finish.svg"></img> | |
106 | + </div> | |
107 | + <div id="skip-button" class="finish-task-button enabled-button"> | |
108 | + PULAR<img class="icon" src="{{ server }}/img/skip.svg"></img> | |
109 | + </div> | |
110 | + </div> | |
111 | + </div> | |
112 | + </div> | |
113 | + </div> | |
114 | + <div id="ranking-container" class="row"></div> | |
115 | +</div> | |
116 | + | |
117 | +<script type="text/javascript"> | |
118 | + validador | |
119 | + .run("{{ server }}", "{{ server_backend }}", "{{ app_shortname }}"); | |
120 | +</script> | ... | ... |
... | ... | @@ -0,0 +1,47 @@ |
1 | +<div id="ranking-info-container" class="col-sm-4"> | |
2 | + <div class="title">WikiRanking</div> | |
3 | + <div>Lorem Ipsum é apenas uma simulação de texto da indústria | |
4 | + tipográfica e de impressos, e vem sendo utilizado desde o século XVI.</div> | |
5 | + <div class="avatar-info col-sm-12"> | |
6 | + <div class="avatar-placeholder col-sm-6 col-sm-offset-3"> | |
7 | + <img src="{{ server }}/img/ranking/user-shape.png"> | |
8 | + </div> | |
9 | + <div class="avatar-container col-sm-8 col-sm-offset-2"> | |
10 | + <img src=""> | |
11 | + </div> | |
12 | + <div class="col-sm-12"> | |
13 | + <div class="username"></div> | |
14 | + <div class="rank-position-container"> | |
15 | + <strong><span class="rank-position"></span>º Posição</strong> | |
16 | + </div> | |
17 | + </div> | |
18 | + </div> | |
19 | + <div class="achievements-container col-sm-12"> | |
20 | + <div class="progress-container col-sm-12"> | |
21 | + <div class="progress"> | |
22 | + <div class="progress-bar" role="progressbar" aria-valuenow="0" | |
23 | + aria-valuemin="0" aria-valuemax="100" data-toggle="tooltip" | |
24 | + data-html="true"></div> | |
25 | + </div> | |
26 | + </div> | |
27 | + <div class="progress-label"> | |
28 | + <span><strong>Progresso:</strong></span> | |
29 | + </div> | |
30 | + </div> | |
31 | +</div> | |
32 | +<div id="leaderboard-container" class="col-sm-8"> | |
33 | + <table class="table table-striped table-hover"> | |
34 | + <thead> | |
35 | + <tr> | |
36 | + <th></th> | |
37 | + <th>#</th> | |
38 | + <th><img src="{{ server }}/img/ranking/trophy-icon.png"> | |
39 | + <div>Membro</div></th> | |
40 | + <th><img src="{{ server }}/img/ranking/signs-icon.png"> | |
41 | + <div>Sinais</div></th> | |
42 | + </tr> | |
43 | + </thead> | |
44 | + <tbody> | |
45 | + </tbody> | |
46 | + </table> | |
47 | +</div> | |
0 | 48 | \ No newline at end of file | ... | ... |