Commit cd4d97976ef41484fb0a6b0ed950352010237bec
1 parent
feb70914
Exists in
master
Integração do Ranking com a API do PyBossa.
Showing
10 changed files
with
364 additions
and
211 deletions
Show diff stats
view/assets/css/main.css
... | ... | @@ -146,6 +146,18 @@ body { |
146 | 146 | padding: 0px 0px 50px 0px; |
147 | 147 | } |
148 | 148 | |
149 | +.ref-video { | |
150 | + background-color: #000000; | |
151 | +} | |
152 | + | |
153 | +#initial-screen .ref-video { | |
154 | + max-height: 350px; | |
155 | +} | |
156 | + | |
157 | +#configuration-screen .ref-video { | |
158 | + max-height: 250px; | |
159 | +} | |
160 | + | |
149 | 161 | /* Avatar Container */ |
150 | 162 | #avatar-facial { |
151 | 163 | display: none; |
... | ... | @@ -504,7 +516,6 @@ ul.rig.columns-4 li { |
504 | 516 | } |
505 | 517 | |
506 | 518 | #render-ref video { |
507 | - background-color: #000000; | |
508 | 519 | height: 407px; |
509 | 520 | } |
510 | 521 | |
... | ... | @@ -519,11 +530,6 @@ ul.rig.columns-4 li { |
519 | 530 | margin-bottom: 0px; |
520 | 531 | } |
521 | 532 | |
522 | -#thanks-screen h6 { | |
523 | - margin-top: 0px; | |
524 | - margin-bottom: 60px; | |
525 | -} | |
526 | - | |
527 | 533 | #thanks-screen img { |
528 | 534 | width: 100%; |
529 | 535 | } |
... | ... | @@ -531,3 +537,11 @@ ul.rig.columns-4 li { |
531 | 537 | #completed-all-task-msg { |
532 | 538 | display: none; |
533 | 539 | } |
540 | + | |
541 | +#completed-task-msg h6 { | |
542 | + margin: 0px 0px 60px 0px; | |
543 | +} | |
544 | + | |
545 | +#completed-all-task-msg h6 { | |
546 | + margin: 0px 0px 10px 0px; | |
547 | +} | ... | ... |
view/assets/css/ranking.css
... | ... | @@ -27,57 +27,95 @@ |
27 | 27 | padding-top: 30px; |
28 | 28 | } |
29 | 29 | |
30 | +#ranking-info-container .avatar-container { | |
31 | + display: none; | |
32 | +} | |
33 | + | |
34 | +#ranking-info-container .avatar-info img { | |
35 | + width: 100%; | |
36 | +} | |
37 | + | |
30 | 38 | #ranking-info-container .achievement-info { |
31 | 39 | color: #028c12; |
32 | 40 | } |
33 | 41 | |
42 | +#ranking-info-container .progress-container { | |
43 | + padding-left: 100px; | |
44 | + margin-top: 10px; | |
45 | +} | |
46 | + | |
47 | +#ranking-info-container .achievements-container { | |
48 | + position: relative; | |
49 | + padding: 10px 0px 0px 0px; | |
50 | + word-wrap: break-word; | |
51 | +} | |
52 | + | |
53 | +#ranking-info-container .progress-label { | |
54 | + position: absolute; | |
55 | + left: 0px; | |
56 | +} | |
57 | + | |
58 | +#ranking-info-container .done-tasks { | |
59 | + color: #84DC76; | |
60 | +} | |
61 | + | |
62 | +#ranking-info-container .total-tasks { | |
63 | + color: #f0ad4e; | |
64 | +} | |
65 | + | |
66 | +#ranking-info-container .tooltip-inner { | |
67 | + font-size: 16px; | |
68 | + max-width: 220px; | |
69 | +} | |
70 | + | |
34 | 71 | #leaderboard-container { |
35 | 72 | background-color: #fefcfc; |
36 | 73 | padding: 0px; |
74 | + min-height: 560px; | |
37 | 75 | } |
38 | 76 | |
39 | 77 | #leaderboard-container table { |
40 | 78 | margin-bottom: 0px; |
41 | 79 | } |
42 | 80 | |
43 | -#ranking-container .table-striped>tbody>tr:nth-of-type(odd) { | |
81 | +#leaderboard-container .table-striped>tbody>tr:nth-of-type(odd) { | |
44 | 82 | background-color: #f1f2f2; |
45 | 83 | } |
46 | 84 | |
47 | -#ranking-container .table-striped>tbody>tr:hover { | |
85 | +#leaderboard-container .table-striped>tbody>tr:hover { | |
48 | 86 | background-color: #e0e0e0; |
49 | 87 | } |
50 | 88 | |
51 | -#ranking-container .table-striped>tbody>tr.highlight { | |
89 | +#leaderboard-container .table-striped>tbody>tr.highlight { | |
52 | 90 | background-color: #fbefa3; |
53 | 91 | } |
54 | 92 | |
55 | -#ranking-container .table-striped>tbody>tr.highlight:hover { | |
93 | +#leaderboard-container .table-striped>tbody>tr.highlight:hover { | |
56 | 94 | background-color: #f7e783; |
57 | 95 | } |
58 | 96 | |
59 | -#ranking-container th { | |
97 | +#leaderboard-container th { | |
60 | 98 | text-align: center; |
61 | 99 | border: 0px; |
62 | 100 | padding-bottom: 15px; |
63 | 101 | } |
64 | 102 | |
65 | -#ranking-container td { | |
103 | +#leaderboard-container td { | |
66 | 104 | text-align: center; |
67 | 105 | border: 0px; |
68 | 106 | } |
69 | 107 | |
70 | -#ranking-container td:nth-of-type(1), #ranking-container td:nth-of-type(2) | |
108 | +#leaderboard-container td:nth-of-type(1), #leaderboard-container td:nth-of-type(2) | |
71 | 109 | { |
72 | 110 | width: 75px; |
73 | 111 | } |
74 | 112 | |
75 | -#ranking-container td:nth-of-type(2), #ranking-container th:nth-of-type(2), | |
76 | - #ranking-container td:nth-of-type(3), #ranking-container th:nth-of-type(3) | |
113 | +#leaderboard-container td:nth-of-type(2), #leaderboard-container th:nth-of-type(2), | |
114 | + #leaderboard-container td:nth-of-type(3), #leaderboard-container th:nth-of-type(3) | |
77 | 115 | { |
78 | 116 | text-align: left; |
79 | 117 | } |
80 | 118 | |
81 | -#ranking-container th:nth-of-type(3) img { | |
119 | +#leaderboard-container th:nth-of-type(3) img { | |
82 | 120 | padding-left: 20px; |
83 | 121 | } |
84 | 122 | \ No newline at end of file | ... | ... |
... | ... | @@ -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)); | ... | ... |
view/assets/js/ranking.js
1 | 1 | (function(ranking, $, undefined) { |
2 | 2 | |
3 | + var NUMBER_OF_TOP_USERS = 10; | |
4 | + var STARS_MAP = [ '', 'gold', 'silver', 'bronze' ]; | |
3 | 5 | var baseUrl = ''; |
4 | - | |
6 | + var pybossaEndpoint = ''; | |
7 | + var projectName = ''; | |
8 | + var loggedUser = {}; | |
9 | + var totalTasks = 0; | |
10 | + var doneTasks = 0; | |
11 | + | |
12 | + function _getRankingData(callback) { | |
13 | + $.ajax({ | |
14 | + url : pybossaEndpoint + '/api/leaderboard?limit=' | |
15 | + + NUMBER_OF_TOP_USERS, | |
16 | + success : function(response) { | |
17 | + callback(typeof response == "object" ? response[projectName] | |
18 | + : ''); | |
19 | + }, | |
20 | + error : function(xhr, textStatus, error) { | |
21 | + alert(xhr.responseText); | |
22 | + } | |
23 | + }); | |
24 | + } | |
25 | + | |
26 | + function _processRankingRow(rowData) { | |
27 | + var rank = rowData.rank; | |
28 | + if (rank < 0) { | |
29 | + return ''; | |
30 | + } | |
31 | + var starHTML = ''; | |
32 | + if (rank > 0 && rank < 4) { | |
33 | + starHTML = '<img src="' + baseUrl + '/img/ranking/' | |
34 | + + STARS_MAP[rank] + '-star-icon.png">'; | |
35 | + } | |
36 | + var trHTML = '<tr>'; | |
37 | + if (rowData.name === loggedUser.name) { | |
38 | + trHTML = '<tr class="warning">'; | |
39 | + loggedUser.rank = rowData.rank; | |
40 | + } | |
41 | + rank = rank == 0 ? "-" : rank + '.'; | |
42 | + return trHTML + '<td>' + starHTML + '</td><td>' + rank | |
43 | + + '</td><td><a href="/pybossa/account/' + rowData.name | |
44 | + + '/" target="_blank">' + rowData.fullname + '</a></td><td>' | |
45 | + + rowData.score + '</td></tr>'; | |
46 | + } | |
47 | + | |
48 | + function _updateRanking() { | |
49 | + _getRankingData(function(data) { | |
50 | + if (data === '') | |
51 | + return; | |
52 | + | |
53 | + var rowsHTML = ''; | |
54 | + for (var i = 0; i < data.length; i++) { | |
55 | + rowsHTML += _processRankingRow(data[i]); | |
56 | + } | |
57 | + $("#leaderboard-container tbody").html(rowsHTML); | |
58 | + $("#ranking-info-container .rank-position").html(loggedUser.rank); | |
59 | + $("#ranking-info-container .username").html(loggedUser.fullName); | |
60 | + if (loggedUser.avatarUrl != '') { | |
61 | + $("#ranking-info-container .avatar-container img").attr("src", | |
62 | + loggedUser.avatarUrl); | |
63 | + $("#ranking-info-container .avatar-placeholder").hide(); | |
64 | + $("#ranking-info-container .avatar-container").show(); | |
65 | + } | |
66 | + if (loggedUser.rank === 0) { | |
67 | + $("#ranking-info-container .rank-position-container").hide(); | |
68 | + } | |
69 | + _updateProgress(); | |
70 | + }); | |
71 | + } | |
72 | + | |
73 | + function _getUserData() { | |
74 | + return $.ajax({ | |
75 | + url : pybossaEndpoint + '/api/user?name=' + loggedUser.name | |
76 | + }); | |
77 | + } | |
78 | + | |
79 | + function _getAvatarUrl(data) { | |
80 | + return typeof data.avatar != "undefined" ? pybossaEndpoint | |
81 | + + '/uploads/' + data.container + '/' + data.avatar : ''; | |
82 | + } | |
83 | + | |
84 | + function _updateProgress() { | |
85 | + pybossaApiHelper | |
86 | + .getUserProgress() | |
87 | + .done( | |
88 | + function(response) { | |
89 | + totalTasks = response.total; | |
90 | + doneTasks = response.done; | |
91 | + var percentage = (doneTasks / totalTasks) * 100; | |
92 | + $("#ranking-info-container .progress-bar").attr( | |
93 | + 'aria-valuenow', percentage).css("width", | |
94 | + percentage + '%'); | |
95 | + $("#ranking-container [data-toggle='tooltip']") | |
96 | + .tooltip( | |
97 | + { | |
98 | + title : '<strong><span class="done-tasks">' | |
99 | + + doneTasks | |
100 | + + '</span> / <span class="total-tasks">' | |
101 | + + totalTasks | |
102 | + + '</span> sinais ensinados.</strong>', | |
103 | + placement : "bottom", | |
104 | + trigger : "manual" | |
105 | + }); | |
106 | + }); | |
107 | + } | |
108 | + | |
109 | + function _loadRankingData() { | |
110 | + _getUserData().done(function(response) { | |
111 | + if (typeof response == "undefined" || response.length < 1) { | |
112 | + return; | |
113 | + } | |
114 | + loggedUser.fullName = response[0].fullname; | |
115 | + loggedUser.avatarUrl = _getAvatarUrl(response[0].info); | |
116 | + _updateRanking(); | |
117 | + }); | |
118 | + } | |
119 | + | |
5 | 120 | ranking.show = function() { |
6 | 121 | $(".sub-main-container").hide(); |
7 | 122 | $("#ranking-container").show(); |
123 | + | |
124 | + if (doneTasks > 0) { | |
125 | + $("#ranking-container [data-toggle='tooltip']").tooltip('show'); | |
126 | + } | |
8 | 127 | } |
9 | - | |
10 | - ranking.setup = function(serverUrl) { | |
128 | + | |
129 | + ranking.setup = function(serverUrl, endpoint, name, user) { | |
11 | 130 | baseUrl = serverUrl; |
12 | - loadHtmlHelper.load("#ranking-container", "/ranking/ranking.html"); | |
131 | + pybossaEndpoint = endpoint; | |
132 | + projectName = name; | |
133 | + loggedUser.name = user; | |
134 | + loadHtmlHelper.load("#ranking-container", "/ranking/ranking.html", | |
135 | + _loadRankingData); | |
13 | 136 | }; |
14 | 137 | |
15 | 138 | }(window.ranking = window.ranking || {}, jQuery)); | ... | ... |
view/assets/js/render-sign.js
view/assets/js/submit-sign.js
... | ... | @@ -36,6 +36,7 @@ |
36 | 36 | submitSign.show = function() { |
37 | 37 | $(".sub-main-container").hide(); |
38 | 38 | $("#submit-sign-container").show(); |
39 | + $("#submit-sign-anchor").focus(); | |
39 | 40 | } |
40 | 41 | |
41 | 42 | submitSign.setup = function(uploadSignHost) { |
... | ... | @@ -63,8 +64,8 @@ |
63 | 64 | progressall : function(e, data) { |
64 | 65 | var progress = parseInt(data.loaded / data.total * 100, |
65 | 66 | 10); |
66 | - $("#upload-progress .progress-bar").css("width", | |
67 | - progress + "%"); | |
67 | + $("#upload-progress .progress-bar").attr('aria-valuenow', progress). | |
68 | + css("width", progress + "%"); | |
68 | 69 | }, |
69 | 70 | error : function(error) { |
70 | 71 | alert(error.responseText); | ... | ... |
view/assets/js/teached-signs.js
... | ... | @@ -3,31 +3,8 @@ |
3 | 3 | var totalTasks = 0; |
4 | 4 | var doneTasks = 0; |
5 | 5 | var userId = -1; |
6 | - var pybossaUrl = '/pybossa/'; | |
7 | - var projectname = 'wikilibras'; | |
8 | 6 | var projectId = -1; |
9 | 7 | |
10 | - function _getProjectId() { | |
11 | - return $.ajax({ | |
12 | - url : pybossaUrl + 'api/project?short_name=' + projectname | |
13 | - }); | |
14 | - } | |
15 | - | |
16 | - function _getUserProgress() { | |
17 | - return $.ajax({ | |
18 | - url : pybossaUrl + 'api/project/' + projectname + '/userprogress', | |
19 | - cache : false, | |
20 | - dataType : 'json' | |
21 | - }); | |
22 | - } | |
23 | - | |
24 | - function _getAnswers() { | |
25 | - return $.ajax({ | |
26 | - url : pybossaUrl + 'api/taskrun?project_id=' + projectId | |
27 | - + '&user_id=' + userId | |
28 | - }); | |
29 | - } | |
30 | - | |
31 | 8 | function _updateTeachedSignsMessage() { |
32 | 9 | $(".teached-signs-msg").hide(); |
33 | 10 | if (doneTasks == 0) { |
... | ... | @@ -66,30 +43,30 @@ |
66 | 43 | .html( |
67 | 44 | "<video autoplay loop><source src='" |
68 | 45 | + videoUrl |
69 | - + "' type='video/webm'>Sem suporte a videos</video>"); | |
46 | + + "' type='video/webm'>Sem suporte a vídeos</video>"); | |
70 | 47 | $('#teached-sign-name').html(signName); |
71 | 48 | $('#teached-sign-modal').modal('show'); |
72 | 49 | }); |
73 | 50 | } |
74 | 51 | |
75 | 52 | function _updateTeachedSignsContainer() { |
76 | - _getAnswers().done(function(answers) { | |
53 | + pybossaApiHelper.getAnswers(projectId, userId).done(function(answers) { | |
77 | 54 | _createSigns(answers); |
78 | 55 | }); |
79 | 56 | } |
80 | - | |
57 | + | |
81 | 58 | teachedSigns.show = function() { |
82 | 59 | $(".sub-main-container").hide(); |
83 | 60 | $("#teached-signs-container").show(); |
84 | 61 | } |
85 | 62 | |
86 | 63 | teachedSigns.setup = function() { |
87 | - _getProjectId().done(function(response) { | |
64 | + pybossaApiHelper.getProjectId().done(function(response) { | |
88 | 65 | if (typeof response == "undefined" || response.length < 1) { |
89 | 66 | return; |
90 | 67 | } |
91 | 68 | projectId = response[0].id; |
92 | - _getUserProgress().done(function(response) { | |
69 | + pybossaApiHelper.getUserProgress().done(function(response) { | |
93 | 70 | totalTasks = response.total; |
94 | 71 | doneTasks = response.done; |
95 | 72 | userId = response.user_id; | ... | ... |
view/assets/js/wikilibras.js
1 | 1 | (function(wikilibras, $, undefined) { |
2 | 2 | |
3 | - var videos_url = ''; | |
4 | - var base_url = ''; | |
5 | - var server_backend_url = ''; | |
6 | - var api_url = ''; | |
7 | - var upload_signs_url = ''; | |
8 | - var current_task_id = -1; | |
3 | + var videosUrl = ''; | |
4 | + var baseUrl = ''; | |
5 | + var serverBackendUrl = ''; | |
6 | + var apiUrl = ''; | |
7 | + var uploadSignsUrl = ''; | |
8 | + var currentTaskId = -1; | |
9 | 9 | var tmpParameterJSON = {}; |
10 | 10 | var parsedParameterJSON = {}; |
11 | + var pybossaEndpoint = ''; | |
12 | + var projectName = ''; | |
13 | + var isDemoTask = false; | |
11 | 14 | |
12 | 15 | function _setupTmpParameterJSON(sign_name) { |
13 | 16 | tmpParameterJSON = { |
... | ... | @@ -21,18 +24,18 @@ |
21 | 24 | } |
22 | 25 | |
23 | 26 | function _getLoggedUser() { |
24 | - var pybossa_rembember_token = Cookies.get('remember_token'); | |
25 | - var splitted_token_id = pybossa_rembember_token.split('|'); | |
26 | - return splitted_token_id.length > 0 ? splitted_token_id[0] | |
27 | + var pybossaRememberToken = Cookies.get('remember_token'); | |
28 | + var splittedTokenId = pybossaRememberToken.split('|'); | |
29 | + return splittedTokenId.length > 0 ? splittedTokenId[0] | |
27 | 30 | : 'anonymous'; |
28 | 31 | } |
29 | 32 | |
30 | 33 | function _loadTaskInfo(task) { |
31 | - current_task_id = task.id; | |
32 | - var sign_name = task.info.sign_name; | |
33 | - var ref_vid_link = videos_url + sign_name + '_REF.webm'; | |
34 | - $('.sign-label').text(sign_name); | |
35 | - $('.ref-video').attr('src', ref_vid_link); | |
34 | + currentTaskId = task.id; | |
35 | + var signName = task.info.sign_name; | |
36 | + var refVidLink = videosUrl + signName + '_REF.webm'; | |
37 | + $('.sign-label').text(signName); | |
38 | + $('.ref-video').attr('src', refVidLink); | |
36 | 39 | |
37 | 40 | _setupTmpParameterJSON(task.info.sign_name); |
38 | 41 | } |
... | ... | @@ -43,7 +46,6 @@ |
43 | 46 | tmpParameterJSON[mainConfig][subConfig] = []; |
44 | 47 | subConfigJSON = tmpParameterJSON[mainConfig][subConfig]; |
45 | 48 | } |
46 | - | |
47 | 49 | subConfigJSON[parseInt(step) - 1] = value; |
48 | 50 | } |
49 | 51 | |
... | ... | @@ -63,7 +65,7 @@ |
63 | 65 | videoHelper.pause("#initial-screen video"); |
64 | 66 | } |
65 | 67 | } |
66 | - | |
68 | + | |
67 | 69 | function _showApprovalScreen(toShow, parameterJSON) { |
68 | 70 | if (toShow) { |
69 | 71 | $("#render-button-container .btn").hide(); |
... | ... | @@ -77,21 +79,23 @@ |
77 | 79 | } |
78 | 80 | |
79 | 81 | function _submitAnswer(task, deferred, status) { |
80 | - var answer = _createAnswer(task, status); | |
81 | - if (status == "APPROVED") { | |
82 | - _finishTask(task, deferred, answer); | |
83 | - } else { | |
84 | - _saveAnswer(task, deferred, answer); | |
82 | + if (!isDemoTask) { | |
83 | + var answer = _createAnswer(task, status); | |
84 | + if (status == "APPROVED") { | |
85 | + _finishTask(task, deferred, answer); | |
86 | + } else { | |
87 | + _saveAnswer(task, deferred, answer); | |
88 | + } | |
85 | 89 | } |
86 | 90 | renderSign.showRenderScreen(false); |
87 | 91 | $("#thanks-screen").show(); |
88 | 92 | } |
89 | 93 | |
90 | 94 | function _setupMainScreen(task, deferred) { |
91 | - var last_answer = task.info.last_answer; | |
92 | - var hasLastAnswer = typeof last_answer != "undefined"; | |
95 | + var lastAnswer = task.info.last_answer; | |
96 | + var hasLastAnswer = typeof lastAnswer != "undefined"; | |
93 | 97 | if (hasLastAnswer) { |
94 | - _showApprovalScreen(true, last_answer.parameter_json); | |
98 | + _showApprovalScreen(true, lastAnswer.parameter_json); | |
95 | 99 | } else { |
96 | 100 | _showApprovalScreen(false); |
97 | 101 | _showInitialScreen(true); |
... | ... | @@ -127,12 +131,12 @@ |
127 | 131 | function _createAnswer(task, status) { |
128 | 132 | var answer = {} |
129 | 133 | answer["status"] = status; |
130 | - var last_answer = task.info.last_answer; | |
131 | - var hasLastAnswer = typeof last_answer != "undefined"; | |
134 | + var lastAnswer = task.info.last_answer; | |
135 | + var hasLastAnswer = typeof lastAnswer != "undefined"; | |
132 | 136 | |
133 | 137 | if (hasLastAnswer && status == "APPROVED") { |
134 | - answer["number_of_approval"] = last_answer.number_of_approval + 1; | |
135 | - answer["parameter_json"] = last_answer.parameter_json; | |
138 | + answer["number_of_approval"] = lastAnswer.number_of_approval + 1; | |
139 | + answer["parameter_json"] = lastAnswer.parameter_json; | |
136 | 140 | } else { |
137 | 141 | answer["number_of_approval"] = 0; |
138 | 142 | answer["parameter_json"] = parsedParameterJSON; |
... | ... | @@ -141,13 +145,13 @@ |
141 | 145 | } |
142 | 146 | |
143 | 147 | function _finishTask(task, deferred, answer) { |
144 | - var last_answer = task.info.last_answer; | |
145 | - var hasLastAnswer = typeof last_answer != "undefined"; | |
146 | - var toSubmitUserId = hasLastAnswer ? | |
147 | - last_answer.parameter_json["userId"] : _getLoggedUser(); | |
148 | + var lastAnswer = task.info.last_answer; | |
149 | + var hasLastAnswer = typeof lastAnswer != "undefined"; | |
150 | + var toSubmitUserId = hasLastAnswer ? lastAnswer.parameter_json["userId"] | |
151 | + : _getLoggedUser(); | |
148 | 152 | $.ajax({ |
149 | 153 | type : "POST", |
150 | - url : server_backend_url + "/finish_task", | |
154 | + url : serverBackendUrl + "/finish_task", | |
151 | 155 | data : { |
152 | 156 | "task_id" : task.id, |
153 | 157 | "project_id" : task.project_id, |
... | ... | @@ -180,7 +184,7 @@ |
180 | 184 | // It removes the PyBossa default message |
181 | 185 | $(".row .col-md-12 p").remove(); |
182 | 186 | } |
183 | - | |
187 | + | |
184 | 188 | function _setupLoginContainer() { |
185 | 189 | if ($("#login-container").html() === "") { |
186 | 190 | $("#login-container").html( |
... | ... | @@ -189,23 +193,36 @@ |
189 | 193 | } |
190 | 194 | |
191 | 195 | function _loadMainComponents() { |
192 | - iconHelper.setup(base_url); | |
193 | - loadHtmlHelper.setup(base_url); | |
194 | - dynengine.setup(base_url); | |
195 | - dynworkflow.setup(base_url); | |
196 | - submitSign.setup(upload_signs_url); | |
196 | + pybossaApiHelper.setup(pybossaEndpoint, projectName); | |
197 | + iconHelper.setup(baseUrl); | |
198 | + loadHtmlHelper.setup(baseUrl); | |
199 | + dynengine.setup(baseUrl); | |
200 | + dynworkflow.setup(baseUrl); | |
201 | + submitSign.setup(uploadSignsUrl); | |
197 | 202 | teachedSigns.setup(); |
198 | - renderSign.setup(api_url); | |
199 | - ranking.setup(base_url); | |
203 | + renderSign.setup(apiUrl); | |
204 | + ranking.setup(baseUrl, pybossaEndpoint, projectName, | |
205 | + _getLoggedUser()); | |
200 | 206 | _setupLoginContainer(); |
201 | 207 | } |
202 | 208 | |
209 | + function _showDemoTask() { | |
210 | + isDemoTask = true; | |
211 | + var task = {'info':{'sign_name':'CALAR'}}; | |
212 | + _startTask(task, function() {}); | |
213 | + } | |
214 | + | |
215 | + function _startTask(task, deferred) { | |
216 | + _loadTaskInfo(task); | |
217 | + _setupGUI(task, deferred); | |
218 | + $("#thanks-screen").hide(); | |
219 | + $("#main-container").fadeIn(500); | |
220 | + } | |
221 | + | |
203 | 222 | pybossa.presentTask(function(task, deferred) { |
204 | 223 | _loadMainComponents(); |
205 | - if (!$.isEmptyObject(task) && current_task_id != task.id) { | |
206 | - _loadTaskInfo(task); | |
207 | - _setupGUI(task, deferred) | |
208 | - $("#main-container").fadeIn(500); | |
224 | + if (!$.isEmptyObject(task) && currentTaskId != task.id) { | |
225 | + _startTask(task, deferred); | |
209 | 226 | } else { |
210 | 227 | _showCompletedAllTaskMsg(); |
211 | 228 | } |
... | ... | @@ -213,19 +230,21 @@ |
213 | 230 | |
214 | 231 | // Private methods |
215 | 232 | function _run(projectname) { |
216 | - pybossa.setEndpoint("/pybossa"); | |
233 | + pybossa.setEndpoint(pybossaEndpoint); | |
217 | 234 | pybossa.run(projectname); |
218 | 235 | } |
219 | 236 | |
220 | 237 | // Public methods |
221 | - wikilibras.run = function(serverhost, serverbackend, projectname, apihost, | |
238 | + wikilibras.run = function(serverhost, serverbackend, projname, apihost, | |
222 | 239 | uploadsignshost) { |
223 | - base_url = serverhost; | |
224 | - server_backend_url = serverbackend; | |
225 | - videos_url = base_url + "/videos/"; | |
226 | - api_url = apihost; | |
227 | - upload_signs_url = uploadsignshost; | |
228 | - _run(projectname); | |
240 | + baseUrl = serverhost; | |
241 | + serverBackendUrl = serverbackend; | |
242 | + videosUrl = baseUrl + "/videos/"; | |
243 | + apiUrl = apihost; | |
244 | + uploadSignsUrl = uploadsignshost; | |
245 | + pybossaEndpoint = '/pybossa'; | |
246 | + projectName = projname; | |
247 | + _run(projectName); | |
229 | 248 | }; |
230 | 249 | |
231 | 250 | wikilibras.updateTempParameterJSON = function(mainConfig, subConfig, step, |
... | ... | @@ -243,4 +262,8 @@ |
243 | 262 | $("#tutorial-container").show(); |
244 | 263 | } |
245 | 264 | |
265 | + wikilibras.showDemoTask = function() { | |
266 | + _showDemoTask(); | |
267 | + } | |
268 | + | |
246 | 269 | }(window.wikilibras = window.wikilibras || {}, jQuery)); |
247 | 270 | \ No newline at end of file | ... | ... |
view/ranking/ranking.html
... | ... | @@ -2,26 +2,30 @@ |
2 | 2 | <div class="title">WikiRanking</div> |
3 | 3 | <div>Lorem Ipsum é apenas uma simulação de texto da indústria |
4 | 4 | tipográfica e de impressos, e vem sendo utilizado desde o século XVI.</div> |
5 | - <div class="avatar-info"> | |
6 | - <img src="{{ server }}/img/ranking/user-shape.png"> | |
7 | - <div>Teste 11</div> | |
8 | - </div> | |
9 | - <div> | |
10 | - <div> | |
11 | - <strong>Nível</strong>: 5 | |
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"> | |
12 | 8 | </div> |
13 | - <div> | |
14 | - <strong>Conquista</strong>:<span class="achievement-info"> construir | |
15 | - 5 sinais em 24 horas.</span> | |
9 | + <div class="avatar-container col-sm-8 col-sm-offset-2"> | |
10 | + <img src=""> | |
16 | 11 | </div> |
17 | - <div> | |
18 | - <strong>Atributo</strong>: lorem ipsum | |
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> | |
19 | 17 | </div> |
20 | - <div> | |
21 | - <strong>Atributo</strong>: lorem ipsum | |
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> | |
22 | 26 | </div> |
23 | - <div> | |
24 | - <strong>Atributo</strong>: lorem ipsum | |
27 | + <div class="progress-label"> | |
28 | + <span><strong>Progresso:</strong></span> | |
25 | 29 | </div> |
26 | 30 | </div> |
27 | 31 | </div> |
... | ... | @@ -38,83 +42,6 @@ |
38 | 42 | </tr> |
39 | 43 | </thead> |
40 | 44 | <tbody> |
41 | - <tr> | |
42 | - <td><img src="{{ server }}/img/ranking/gold-star-icon.png"></td> | |
43 | - <td>1.</td> | |
44 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
45 | - 1</a></td> | |
46 | - <td>6</td> | |
47 | - </tr> | |
48 | - <tr> | |
49 | - <td><img src="{{ server }}/img/ranking/silver-star-icon.png"></td> | |
50 | - <td>2.</td> | |
51 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
52 | - 2</a></td> | |
53 | - <td>3</td> | |
54 | - </tr> | |
55 | - <tr> | |
56 | - <td><img src="{{ server }}/img/ranking/bronze-star-icon.png"></td> | |
57 | - <td>3.</td> | |
58 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
59 | - 3</a></td> | |
60 | - <td>2</td> | |
61 | - </tr> | |
62 | - <tr> | |
63 | - <td></td> | |
64 | - <td>4.</td> | |
65 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
66 | - 4</a></td> | |
67 | - <td>2</td> | |
68 | - </tr> | |
69 | - <tr> | |
70 | - <td></td> | |
71 | - <td>5.</td> | |
72 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
73 | - 5</a></td> | |
74 | - <td>2</td> | |
75 | - </tr> | |
76 | - <tr> | |
77 | - <td></td> | |
78 | - <td>6.</td> | |
79 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
80 | - 6</a></td> | |
81 | - <td>2</td> | |
82 | - </tr> | |
83 | - <tr> | |
84 | - <td></td> | |
85 | - <td>7.</td> | |
86 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
87 | - 7</a></td> | |
88 | - <td>2</td> | |
89 | - </tr> | |
90 | - <tr> | |
91 | - <td></td> | |
92 | - <td>8.</td> | |
93 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
94 | - 8</a></td> | |
95 | - <td>2</td> | |
96 | - </tr> | |
97 | - <tr> | |
98 | - <td></td> | |
99 | - <td>9.</td> | |
100 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
101 | - 9</a></td> | |
102 | - <td>2</td> | |
103 | - </tr> | |
104 | - <tr> | |
105 | - <td></td> | |
106 | - <td>10.</td> | |
107 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
108 | - 10</a></td> | |
109 | - <td>2</td> | |
110 | - </tr> | |
111 | - <tr class="highlight"> | |
112 | - <td></td> | |
113 | - <td>25.</td> | |
114 | - <td><a href="/pybossa/account/adabriand/" target="_blank">Teste | |
115 | - 11</a></td> | |
116 | - <td>2</td> | |
117 | - </tr> | |
118 | 45 | </tbody> |
119 | 46 | </table> |
120 | 47 | </div> |
121 | 48 | \ No newline at end of file | ... | ... |
view/template.html
... | ... | @@ -16,20 +16,17 @@ |
16 | 16 | </button> |
17 | 17 | </div> |
18 | 18 | <!-- Collect the nav links, forms, and other content for toggling --> |
19 | - <div class="collapse navbar-collapse" | |
20 | - id="navbar-collapse-1"> | |
19 | + <div class="collapse navbar-collapse" id="navbar-collapse-1"> | |
21 | 20 | <ul class="nav navbar-nav navbar-right"> |
22 | 21 | <li><a href="javascript:void(0);" |
23 | 22 | onclick="wikilibras.showTeachContainer()">Ensinar</a></li> |
24 | - <li><a href="javascript:void(0);" | |
23 | + <li><a id="submit-sign-anchor" href="javascript:void(0);" | |
25 | 24 | onclick="submitSign.show()">Enviar sinal</a></li> |
26 | - <li><a href="javascript:void(0);" | |
27 | - onclick="teachedSigns.show()">Sinais | |
25 | + <li><a href="javascript:void(0);" onclick="teachedSigns.show()">Sinais | |
28 | 26 | ensinados</a></li> |
29 | 27 | <li><a href="javascript:void(0);" |
30 | 28 | onclick="wikilibras.showTutorialContainer()">Tutorial</a></li> |
31 | - <li><a href="javascript:void(0);" | |
32 | - onclick="ranking.show()">Ranking</a></li> | |
29 | + <li><a href="javascript:void(0);" onclick="ranking.show()">Ranking</a></li> | |
33 | 30 | <li id="login-container"></li> |
34 | 31 | </ul> |
35 | 32 | </div> |
... | ... | @@ -130,8 +127,8 @@ |
130 | 127 | <img src="{{ server }}/img/avatar-right-hand-icon.png"></img> |
131 | 128 | </div> |
132 | 129 | <div id="avatar-body-left-hand" |
133 | - class="icon_container config-menu-option" | |
134 | - name="avatar-left-hand" panel="left-hand"> | |
130 | + class="icon_container config-menu-option" name="avatar-left-hand" | |
131 | + panel="left-hand"> | |
135 | 132 | <img src="{{ server }}/img/avatar-left-hand-icon.png"></img> |
136 | 133 | </div> |
137 | 134 | <img class="avatar-img-zoom-out" src="{{ server }}/img/avatar.png"></img> |
... | ... | @@ -201,15 +198,24 @@ |
201 | 198 | </div> |
202 | 199 | </div> |
203 | 200 | <div id="thanks-screen"> |
204 | - <div class="col-sm-6 col-centered"> | |
201 | + <div class="col-sm-7 col-centered"> | |
205 | 202 | <div id="completed-task-msg"> |
206 | 203 | <h3 class="text-center">Obrigado,</h3> |
207 | 204 | <h6 class="text-center">você configurou o sinal com sucesso!</h6> |
208 | 205 | </div> |
209 | - <div id="completed-all-task-msg"> | |
210 | - <h3 class="text-center">Parabéns,</h3> | |
211 | - <h6 class="text-center">você configurou todos os sinais | |
212 | - disponíveis!</h6> | |
206 | + <div id="completed-all-task-msg" class="text-center"> | |
207 | + <h4> | |
208 | + Que pena, não há disponíveis sinais no momento! | |
209 | + </h6> | |
210 | + <h6> | |
211 | + Ajude a expandir o dicionário <a href="javascript:void(0);" | |
212 | + onclick="submitSign.show()">enviando um novo sinal</a>, ou | |
213 | + </h6> | |
214 | + <h6> | |
215 | + experimente <a href="javascript:void(0);" | |
216 | + onclick="wikilibras.showDemoTask()">uma tarefa de | |
217 | + demonstração.</a> | |
218 | + </h6> | |
213 | 219 | </div> |
214 | 220 | <div class="col-sm-11 col-centered"> |
215 | 221 | <img src="{{ server }}/img/avatar-thanks.png"></img> |
... | ... | @@ -350,6 +356,7 @@ |
350 | 356 | <script src="{{ server }}/assets/js/selection-panel/selection-panel.js"></script> |
351 | 357 | |
352 | 358 | <!-- Helpers --> |
359 | +<script src="{{ server }}/assets/js/helpers/pybossa-api-helper.js"></script> | |
353 | 360 | <script src="{{ server }}/assets/js/helpers/load-html-helper.js"></script> |
354 | 361 | <script src="{{ server }}/assets/js/helpers/video-helper.js"></script> |
355 | 362 | <script src="{{ server }}/assets/js/helpers/icon-helper.js"></script> | ... | ... |