Download as
Browse Code »

Commit cd4d97976ef41484fb0a6b0ed950352010237bec

Authored by Adabriand Furtado
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
  Diff comments   View file @cd4d979
... ... @@ -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
  Diff comments   View file @cd4d979
... ... @@ -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
... ...
view/assets/js/helpers/pybossa-api-helper.js 0 → 100644
  Diff comments   View file @cd4d979
... ... @@ -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
  Diff comments   View file @cd4d979
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
  Diff comments   View file @cd4d979
... ... @@ -4,7 +4,6 @@
4 4  
5 5 function _submitParameterJSON(parsedParameterJSON, callback) {
6 6 console.log(parsedParameterJSON);
7   -
8 7 $.ajax({
9 8 type : 'POST',
10 9 url : api_url + '/sign',
... ...
view/assets/js/submit-sign.js
  Diff comments   View file @cd4d979
... ... @@ -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
  Diff comments   View file @cd4d979
... ... @@ -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
  Diff comments   View file @cd4d979
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
  Diff comments   View file @cd4d979
... ... @@ -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
  Diff comments   View file @cd4d979
... ... @@ -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>
... ...