Download as
Browse Code »

Commit bb7233b2edeb920035fb502f22df212de62c53fd

Authored by Adabriand Furtado
1 parent d6679032
Exists in master and in 1 other branch dynamic

Suporte para hospedar a aplicação no Apache e integração da tela de ponto de articulação.

Showing 33 changed files with 688 additions and 259 deletions   Show diff stats
contrib/apache/wikilibras.conf.tmpl 0 → 100644
  Diff comments   View file @bb7233b
@@ -0,0 +1,19 @@ @@ -0,0 +1,19 @@
  1 +<VirtualHost *:80>
  2 + ServerName localhost
  3 +
  4 + WSGIDaemonProcess wikilibras user=user1 group=group1 threads=5
  5 + WSGIScriptAlias / <path-to-project>/contrib/wikilibras.wsgi
  6 + Alias /view <path-to-project>/view
  7 +
  8 + <Directory <path-to-project>>
  9 + WSGIProcessGroup wikilibras
  10 + WSGIApplicationGroup %{GLOBAL}
  11 + Order deny,allow
  12 + Allow from all
  13 + </Directory>
  14 +
  15 + ServerAdmin webmaster@localhost
  16 +
  17 + ErrorLog ${APACHE_LOG_DIR}/error.log
  18 + CustomLog ${APACHE_LOG_DIR}/access.log combined
  19 +</VirtualHost>
contrib/wikilibras.wsgi.tmpl 0 → 100644
  Diff comments   View file @bb7233b
@@ -0,0 +1,11 @@ @@ -0,0 +1,11 @@
  1 +# Check the official documentation http://flask.pocoo.org/docs/deploying/mod_wsgi/
  2 +# Activate the virtual env (we assume that virtualenv is in the env folder)
  3 +activate_this = '<path-to-project>/env/bin/activate_this.py'
  4 +execfile(activate_this, dict(__file__=activate_this))
  5 +import logging, sys
  6 +sys.stdout = sys.stderr
  7 +logging.basicConfig(stream=sys.stderr)
  8 +sys.path.insert(0,'<path-to-project>')
  9 +
  10 +# Run the web-app
  11 +from main import app as application
@@ -10,12 +10,6 @@ app = Flask(__name__) @@ -10,12 +10,6 @@ app = Flask(__name__)
10 CORS(app) 10 CORS(app)
11 controller = None 11 controller = None
12 12
13 -@app.route("/<path:path>")  
14 -def send_static_files(path):  
15 - root_dir = os.path.abspath(os.path.dirname(__file__))  
16 - file_dir = os.path.join(root_dir, "view")  
17 - return send_from_directory(file_dir, path)  
18 -  
19 @app.route("/update_project") 13 @app.route("/update_project")
20 def update_project(): 14 def update_project():
21 try: 15 try:
@@ -39,13 +33,19 @@ def finish_task(): @@ -39,13 +33,19 @@ def finish_task():
39 except: 33 except:
40 pyutil.print_stack_trace() 34 pyutil.print_stack_trace()
41 raise 35 raise
42 - 36 +
43 def read_settings(app): 37 def read_settings(app):
44 here = os.path.abspath(__file__) 38 here = os.path.abspath(__file__)
45 config_path = os.path.join(os.path.dirname(here), 'settings_local.py') 39 config_path = os.path.join(os.path.dirname(here), 'settings_local.py')
46 if os.path.exists(config_path): 40 if os.path.exists(config_path):
47 app.config.from_pyfile(config_path) 41 app.config.from_pyfile(config_path)
48 - app.config['HOST_ENDPOINT'] = "http://" + app.config['SERVER_HOST'] + ":" + str(app.config['SERVER_PORT']) 42 +
  43 + if app.config['APACHE_HOST']:
  44 + app.config['HOST_ENDPOINT'] = "http://" + app.config['SERVER_HOST'] + app.config['APACHE_HOST_ENDPOINT']
  45 + app.config['HOST_STATIC_FILES_ENDPOINT'] = "http://" + app.config['SERVER_HOST'] + app.config['APACHE_STATIC_FILES_ENDPOINT']
  46 + else:
  47 + app.config['HOST_ENDPOINT'] = "http://" + app.config['SERVER_HOST'] + ":" + str(app.config['SERVER_PORT'])
  48 + app.config['HOST_STATIC_FILES_ENDPOINT'] = app.config['HOST_ENDPOINT']
49 49
50 def setup_controller(): 50 def setup_controller():
51 global controller 51 global controller
@@ -53,10 +53,20 @@ def setup_controller(): @@ -53,10 +53,20 @@ def setup_controller():
53 env = Environment(loader=PackageLoader('main', 'view')) 53 env = Environment(loader=PackageLoader('main', 'view'))
54 controller = Wikilibras(app.config, env) 54 controller = Wikilibras(app.config, env)
55 55
  56 +def setup_static_files_service(app):
  57 + if not app.config['APACHE_HOST']:
  58 + @app.route("/<path:path>")
  59 + def send_static_files(path):
  60 + root_dir = os.path.abspath(os.path.dirname(__file__))
  61 + file_dir = os.path.join(root_dir, "view")
  62 + return send_from_directory(file_dir, path)
  63 +
56 def run(): 64 def run():
57 - setup_controller()  
58 app.run(host=app.config['SERVER_HOST'], port=app.config['SERVER_PORT']) 65 app.run(host=app.config['SERVER_HOST'], port=app.config['SERVER_PORT'])
59 66
  67 +setup_controller()
  68 +setup_static_files_service(app)
  69 +
60 if __name__ == '__main__': 70 if __name__ == '__main__':
61 try: 71 try:
62 run() 72 run()
settings_local.py.tmpl
  Diff comments   View file @bb7233b
@@ -5,6 +5,11 @@ SERVER_PORT = 8003 @@ -5,6 +5,11 @@ SERVER_PORT = 8003
5 AGREEMENT_NUMBER = 2 5 AGREEMENT_NUMBER = 2
6 API_HOST = "http://localhost:5001" 6 API_HOST = "http://localhost:5001"
7 7
  8 +# Apache Configuration
  9 +APACHE_HOST = False
  10 +APACHE_HOST_ENDPOINT = "/wikilibras-backend"
  11 +APACHE_STATIC_FILES_ENDPOINT = "/wikilibras"
  12 +
8 # PyBossa Configuration 13 # PyBossa Configuration
9 PYBOSSA_APP_NAME = "WikiLibras" 14 PYBOSSA_APP_NAME = "WikiLibras"
10 PYBOSSA_APP_SHORT_NAME = "wikilibras" 15 PYBOSSA_APP_SHORT_NAME = "wikilibras"
view/assets/css/articulation.css 0 → 100644
  Diff comments   View file @bb7233b
@@ -0,0 +1,98 @@ @@ -0,0 +1,98 @@
  1 +.gray-background {
  2 + background-repeat: no-repeat;
  3 + background-position: center 15px, 0 0;
  4 + background-size: 67% 95%, 100% 100%;
  5 + min-width: 285px;
  6 + min-height: 361px
  7 +}
  8 +
  9 +.gray-front-avatar {
  10 + background-image: url(../../img/pa/gray-front-avatar.png), url(../../img/pa/default-base.png);
  11 +}
  12 +
  13 +.gray-side-avatar {
  14 + background-image: url(../../img/pa/gray-side-avatar.png), url(../../img/pa/default-base.png);
  15 +}
  16 +
  17 +.module-x-y {
  18 + display: none
  19 +}
  20 +
  21 +.module-x-y.active {
  22 + display: block
  23 +}
  24 +
  25 +.grid {
  26 + position: relative
  27 +}
  28 +
  29 +.grid .grid-selectors {
  30 + width: 315px;
  31 + height: 361px;
  32 + margin: 5%;
  33 + z-index: 10
  34 +}
  35 +
  36 +.grid .grid-selectors .grid-row {
  37 + height: 20%;
  38 + padding-top: 10%;
  39 + text-align: justify;
  40 + z-index: 20
  41 +}
  42 +
  43 +.grid .grid-selectors .grid-row .ball-selector {
  44 + background-color: #A0D0E8;
  45 + border-radius: 50%;
  46 + z-index: 100;
  47 + width: 13px;
  48 + height: 13px;
  49 + display: inline-block;
  50 + margin-right: 6%;
  51 + margin-bottom: 13%;
  52 + float: left
  53 +}
  54 +
  55 +.grid .grid-selectors .grid-row .ball-selector:nth-last-of-type(1) {
  56 + margin-right: 0
  57 +}
  58 +
  59 +.grid .grid-selectors .grid-row .ball-selector .point-a-selector {
  60 + margin-left: -.5px;
  61 + margin-top: -7.5px
  62 +}
  63 +
  64 +.grid .avatar-base {
  65 + position: absolute;
  66 + width: 100%;
  67 + height: 100%;
  68 + z-index: 0;
  69 + top: 0;
  70 + left: 0
  71 +}
  72 +
  73 +.grid .grid-selectors .grid-row .ball-selector.active,
  74 +.grid .grid-selectors .grid-row .ball-selector:hover {
  75 + box-shadow: 0 0 10px #fff
  76 +}
  77 +
  78 +.grid .grid-selectors .grid-row .ball-selector:hover {
  79 + cursor: pointer
  80 +}
  81 +
  82 +.actions .btn {
  83 + margin-top: 15px
  84 +}
  85 +
  86 +.module-z .grid-selectors .grid-row {
  87 + margin-right: 58%;
  88 + padding-top: 3%;
  89 +}
  90 +
  91 +.module-z .grid-selectors .grid-row .ball-selector {
  92 + float: right;
  93 + margin-right: 15%
  94 +}
  95 +
  96 +.module-z .grid-selectors .grid-row .ball-selector:nth-last-of-type(1) {
  97 + margin-right: 15%
  98 +}
0 \ No newline at end of file 99 \ No newline at end of file
view/assets/css/main.css 100755 → 100644
  Diff comments   View file @bb7233b
  1 +@import url("articulation.css");
  2 +
1 /* Main */ 3 /* Main */
2 @font-face { 4 @font-face {
3 font-family: 'Titillium Web'; 5 font-family: 'Titillium Web';
@@ -323,7 +325,7 @@ ul.rig.columns-4 li { @@ -323,7 +325,7 @@ ul.rig.columns-4 li {
323 width: 60%; 325 width: 60%;
324 } 326 }
325 327
326 -.selection-panel-option { 328 +.box-panel-option {
327 max-width: 100%; 329 max-width: 100%;
328 border-radius: 5px; 330 border-radius: 5px;
329 border: 3px solid rgb(128, 168, 210); 331 border: 3px solid rgb(128, 168, 210);
@@ -334,7 +336,7 @@ ul.rig.columns-4 li { @@ -334,7 +336,7 @@ ul.rig.columns-4 li {
334 cursor: pointer; 336 cursor: pointer;
335 } 337 }
336 338
337 -.selection-panel-option:hover, .selection-panel-option[select=true] { 339 +.box-panel-option:hover, .box-panel-option[select=true] {
338 border-color: #9678b0; 340 border-color: #9678b0;
339 } 341 }
340 342
@@ -351,7 +353,7 @@ ul.rig.columns-4 li { @@ -351,7 +353,7 @@ ul.rig.columns-4 li {
351 display: none; 353 display: none;
352 } 354 }
353 355
354 -.single-column-option-container .selection-panel-option { 356 +.single-column-option-container .box-panel-option {
355 height: 100px; 357 height: 100px;
356 } 358 }
357 359
@@ -369,11 +371,13 @@ ul.rig.columns-4 li { @@ -369,11 +371,13 @@ ul.rig.columns-4 li {
369 display: none; 371 display: none;
370 } 372 }
371 373
372 -#hand-subconfiguration-options {  
373 - display: none; 374 +.subconfiguration-options {
  375 + overflow-x: hidden;
  376 + white-space: nowrap;
374 } 377 }
375 378
376 .subconfiguration-panel { 379 .subconfiguration-panel {
  380 + display: none;
377 padding: 10px; 381 padding: 10px;
378 margin-top: 10px; 382 margin-top: 10px;
379 margin-bottom: 10px; 383 margin-bottom: 10px;
@@ -392,6 +396,10 @@ ul.rig.columns-4 li { @@ -392,6 +396,10 @@ ul.rig.columns-4 li {
392 padding-top: 5px; 396 padding-top: 5px;
393 } 397 }
394 398
  399 +.arrow[name=right-arrow] {
  400 + padding-left: 10px;
  401 +}
  402 +
395 /* Hand Configuration */ 403 /* Hand Configuration */
396 #moviment-type { 404 #moviment-type {
397 display: none; 405 display: none;
view/assets/fonts/Helvetica.otf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-Black.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-Bold.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-BoldItalic.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-ExtraLight.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-ExtraLightItalic.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-Italic.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-Light.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-LightItalic.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-Regular.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-SemiBold.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/fonts/TitilliumWeb-SemiBoldItalic.ttf 100755 → 100644
View file @bb7233b
No preview for this file type
view/assets/js/articulation.js 0 → 100644
  Diff comments   View file @bb7233b
@@ -0,0 +1,61 @@ @@ -0,0 +1,61 @@
  1 +(function(articulation, $, undefined) {
  2 +
  3 + function _updateASelector(container, ballSelector, serverhost) {
  4 + $(container + " .ball-selector.active").each(function() {
  5 + $(this).removeClass("active"), $(this).find(".point-a-selector").remove()
  6 + }), ballSelector.addClass("active"), ballSelector.append('<div class="point-a-selector"><img src="' + serverhost +
  7 + '/img/pa/A-Seletor.png" class="point-a-selector" alt=""></div>')
  8 + }
  9 +
  10 + function _setupModuleZ(hand, y) {
  11 + if (typeof y == "undefined") return;
  12 + var articulation_z = "#" + hand + "-articulation .module-z";
  13 + $(articulation_z + " .ball-selector").hide();
  14 + $(articulation_z + " .row-number-" + y + " .ball-selector").show();
  15 + }
  16 +
  17 + function _setupBallSelector(serverhost, hand) {
  18 + var articulation_x_y = "#" + hand + "-articulation .module-x-y";
  19 + $(articulation_x_y + " .ball-selector").on("click", function(a) {
  20 + var b = $(a.target),
  21 + c = b.parent(".grid-row"),
  22 + d = $(articulation_x_y),
  23 + f = b.attr("data-x"),
  24 + g = c.attr("data-y");
  25 + d.attr("data-x", f), d.attr("data-y", g), _updateASelector(articulation_x_y, b, serverhost)
  26 + _setupModuleZ(hand, g);
  27 + _updateParameterJSON(hand);
  28 + });
  29 + var articulation_z = "#" + hand + "-articulation .module-z";
  30 + $(articulation_z + " .ball-selector").on("click", function(a) {
  31 + var b = $(a.target),
  32 + c = b.parent(".grid-row"),
  33 + e = $(articulation_z),
  34 + h = b.attr("data-z");
  35 + b.attr("data-z") && e.attr("data-z", h), _updateASelector(articulation_z, b, serverhost);
  36 + _updateParameterJSON(hand);
  37 + });
  38 + }
  39 +
  40 + function _updateParameterJSON(hand) {
  41 + var value = _readValue(hand);
  42 + wikilibras.updateParameterJSON("articulacao", value);
  43 + }
  44 +
  45 + function _readValue(hand) {
  46 + var articulation_x_y = "#" + hand + "-articulation .module-x-y";
  47 + var articulation_z = "#" + hand + "-articulation .module-z";
  48 + var x = parseInt($(articulation_x_y).attr("data-x"));
  49 + var y = parseInt($(articulation_x_y).attr("data-y"));
  50 + var z = $(articulation_z).attr("data-z");
  51 + z = z == ""? 1 : parseInt(z);
  52 + var value = (z-1)*10 + x + 30*(y-1);
  53 + //console.log(value);
  54 + return value;
  55 + }
  56 +
  57 + articulation.setup = function(serverhost) {
  58 + _setupBallSelector(serverhost, "right-hand");
  59 + _setupBallSelector(serverhost, "left-hand");
  60 + };
  61 +}(window.articulation = window.articulation || {}, jQuery));
0 \ No newline at end of file 62 \ No newline at end of file
view/assets/js/wikilibras.js
  Diff comments   View file @bb7233b
@@ -2,6 +2,7 @@ @@ -2,6 +2,7 @@
2 2
3 var videos_url = ""; 3 var videos_url = "";
4 var base_url = ""; 4 var base_url = "";
  5 + var server_backend_url = "";
5 var api_url = ""; 6 var api_url = "";
6 var current_task_id = -1; 7 var current_task_id = -1;
7 var base_parameter_json = {}; 8 var base_parameter_json = {};
@@ -19,7 +20,6 @@ @@ -19,7 +20,6 @@
19 base_parameter_json["sinal"] = sign_name; 20 base_parameter_json["sinal"] = sign_name;
20 base_parameter_json["interpolacao"] = "normal"; 21 base_parameter_json["interpolacao"] = "normal";
21 base_parameter_json["movimentos"] = []; 22 base_parameter_json["movimentos"] = [];
22 - // TODO remover propriedade articulação  
23 moviment_parameter_json = { 23 moviment_parameter_json = {
24 "facial" : {}, 24 "facial" : {},
25 "mao_direita" : {}, 25 "mao_direita" : {},
@@ -157,6 +157,8 @@ @@ -157,6 +157,8 @@
157 function _clearPreviousSelection() { 157 function _clearPreviousSelection() {
158 $(".selection-panel-body").hide(); 158 $(".selection-panel-body").hide();
159 $(".subconfiguration-options").hide(); 159 $(".subconfiguration-options").hide();
  160 + $(".subconfiguration-panel").hide();
  161 +
160 if (_isSelectingState()) { 162 if (_isSelectingState()) {
161 var current_option = _getCurrentMainConfiguration(); 163 var current_option = _getCurrentMainConfiguration();
162 _selectIcon(current_option, false); 164 _selectIcon(current_option, false);
@@ -267,8 +269,18 @@ @@ -267,8 +269,18 @@
267 function _hasMultipleConfigurations(config) { 269 function _hasMultipleConfigurations(config) {
268 return $("#" + config).is("[multiple-config]"); 270 return $("#" + config).is("[multiple-config]");
269 } 271 }
  272 +
  273 + function _handleFingersPositionSubConfiguration(main_config) {
  274 + var finger_group = $(
  275 + "#"
  276 + + main_config
  277 + + "-fingers-position-1 .selection-panel-option[select=true]")
  278 + .attr("group");
  279 + $(".finger-group").hide();
  280 + $(".finger-group[group=" + finger_group + "]").show();
  281 + }
270 282
271 - function _setupMultipleConfiguration(config) { 283 + function _setupMultipleConfiguration(config, selectEvent) {
272 var sub_config_id = "#" + config + " [sub-config]"; 284 var sub_config_id = "#" + config + " [sub-config]";
273 var has_active_config = $(sub_config_id).is(":visible"); 285 var has_active_config = $(sub_config_id).is(":visible");
274 286
@@ -279,7 +291,7 @@ @@ -279,7 +291,7 @@
279 + "]"; 291 + "]";
280 var sub_config = ""; 292 var sub_config = "";
281 293
282 - if (!has_active_config) { 294 + if (!has_active_config || !selectEvent) {
283 sub_config = config + "-1"; 295 sub_config = config + "-1";
284 if (!$(icon_id).is("[tmp-next]")) { 296 if (!$(icon_id).is("[tmp-next]")) {
285 $(icon_id).attr("tmp-next", $(icon_id).attr("next")); 297 $(icon_id).attr("tmp-next", $(icon_id).attr("next"));
@@ -295,15 +307,12 @@ @@ -295,15 +307,12 @@
295 $(icon_id).removeAttr("tmp-next"); 307 $(icon_id).removeAttr("tmp-next");
296 $(icon_id).attr("next", tmp_next); 308 $(icon_id).attr("next", tmp_next);
297 config = tmp_next; 309 config = tmp_next;
  310 + if (_hasMultipleConfigurations(config)) {
  311 + config = _setupMultipleConfiguration(config, selectEvent);
  312 + }
298 } else { 313 } else {
299 if (sub_config.indexOf("fingers-position-2") != -1) { 314 if (sub_config.indexOf("fingers-position-2") != -1) {
300 - var finger_group = $(  
301 - "#"  
302 - + main_config  
303 - + "-fingers-position-1 .selection-panel-option[select=true]")  
304 - .attr("group");  
305 - $(".finger-group").hide();  
306 - $(".finger-group[group=" + finger_group + "]").show(); 315 + _handleFingersPositionSubConfiguration(main_config);
307 } 316 }
308 $("#" + sub_config).show(); 317 $("#" + sub_config).show();
309 } 318 }
@@ -326,7 +335,7 @@ @@ -326,7 +335,7 @@
326 _setupCheckIcon(iconName, true, subconfig); 335 _setupCheckIcon(iconName, true, subconfig);
327 } 336 }
328 337
329 - function _showSubConfiguration(next_config) { 338 + function _showSubConfiguration(next_config, selectEvent) {
330 var current_config = _getCurrentSubConfiguration(); 339 var current_config = _getCurrentSubConfiguration();
331 var next_has_multiple_config = _hasMultipleConfigurations(next_config); 340 var next_has_multiple_config = _hasMultipleConfigurations(next_config);
332 341
@@ -335,7 +344,7 @@ @@ -335,7 +344,7 @@
335 344
336 var onFinish = true; 345 var onFinish = true;
337 if (next_has_multiple_config) { 346 if (next_has_multiple_config) {
338 - next_config = _setupMultipleConfiguration(next_config); 347 + next_config = _setupMultipleConfiguration(next_config, selectEvent);
339 onFinish = next_config != current_config; 348 onFinish = next_config != current_config;
340 } 349 }
341 350
@@ -344,6 +353,11 @@ @@ -344,6 +353,11 @@
344 if (next_config != "end") { 353 if (next_config != "end") {
345 _selectSubConfigurationIcon(next_config, true); 354 _selectSubConfigurationIcon(next_config, true);
346 $("#" + next_config).show(); 355 $("#" + next_config).show();
  356 +
  357 + var main_config = _getCurrentMainConfiguration();
  358 + if (_isHandMovimentComplete(main_config)) {
  359 + $(".subconfiguration-panel").fadeIn(300);
  360 + }
347 } else { 361 } else {
348 _hideSelectionPanel(); 362 _hideSelectionPanel();
349 } 363 }
@@ -357,7 +371,6 @@ @@ -357,7 +371,6 @@
357 }); 371 });
358 } 372 }
359 373
360 - // TODO REFACT  
361 function _setupFacialSelectionPanel() { 374 function _setupFacialSelectionPanel() {
362 var previous_select = $("#facial-subconfiguration-options .icon_container[select=true]").length > 0; 375 var previous_select = $("#facial-subconfiguration-options .icon_container[select=true]").length > 0;
363 if (previous_select) { 376 if (previous_select) {
@@ -370,9 +383,14 @@ @@ -370,9 +383,14 @@
370 $("#facial-expression").fadeIn(300); 383 $("#facial-expression").fadeIn(300);
371 } 384 }
372 $("#facial-subconfiguration-options").fadeIn(300); 385 $("#facial-subconfiguration-options").fadeIn(300);
  386 + $(".subconfiguration-panel").fadeIn(300);
373 } 387 }
374 388
375 - // TODO REFACT 389 + function _isHandMovimentComplete(main_config) {
  390 + return $("#" + main_config
  391 + + "-subconfiguration-options .icon_container[complete=true][name=hand-moviment]").length > 0;
  392 + }
  393 +
376 function _setupHandSelectionPanel(option) { 394 function _setupHandSelectionPanel(option) {
377 var previous_select = $("#" + option 395 var previous_select = $("#" + option
378 + "-subconfiguration-options .icon_container[select=true]").length > 0; 396 + "-subconfiguration-options .icon_container[select=true]").length > 0;
@@ -391,7 +409,11 @@ @@ -391,7 +409,11 @@
391 _selectIcon("hand-moviment", true, option + "-moviment"); 409 _selectIcon("hand-moviment", true, option + "-moviment");
392 $("#" + option + "-moviment").fadeIn(300); 410 $("#" + option + "-moviment").fadeIn(300);
393 } 411 }
  412 +
394 $("#" + option + "-subconfiguration-options").fadeIn(300); 413 $("#" + option + "-subconfiguration-options").fadeIn(300);
  414 + if (_isHandMovimentComplete(option)) {
  415 + $(".subconfiguration-panel").fadeIn(300);
  416 + }
395 } 417 }
396 418
397 function _setupConfigurationPanel() { 419 function _setupConfigurationPanel() {
@@ -447,9 +469,7 @@ @@ -447,9 +469,7 @@
447 if (config == "movimento") { 469 if (config == "movimento") {
448 var first_key = _getFirstKey(moviment_parameter_json[current_main_config]); 470 var first_key = _getFirstKey(moviment_parameter_json[current_main_config]);
449 if (typeof first_key == "undefined") { 471 if (typeof first_key == "undefined") {
450 - moviment_parameter_json[current_main_config][value] = {  
451 - "articulacao" : 71  
452 - }; 472 + moviment_parameter_json[current_main_config][value] = {};
453 } else if (first_key != value) { 473 } else if (first_key != value) {
454 moviment_parameter_json[current_main_config][value] = moviment_parameter_json[current_main_config][first_key]; 474 moviment_parameter_json[current_main_config][value] = moviment_parameter_json[current_main_config][first_key];
455 delete moviment_parameter_json[current_main_config][first_key]; 475 delete moviment_parameter_json[current_main_config][first_key];
@@ -459,27 +479,29 @@ @@ -459,27 +479,29 @@
459 var first_key = _getFirstKey(moviment_parameter_json[current_main_config]); 479 var first_key = _getFirstKey(moviment_parameter_json[current_main_config]);
460 if (typeof first_key == "undefined") { 480 if (typeof first_key == "undefined") {
461 first_key = "placeholder"; 481 first_key = "placeholder";
462 - moviment_parameter_json[current_main_config][first_key] = {  
463 - "articulacao" : 71  
464 - }; 482 + moviment_parameter_json[current_main_config][first_key] = {};
465 } 483 }
466 moviment_parameter_json[current_main_config][first_key][config] = value; 484 moviment_parameter_json[current_main_config][first_key][config] = value;
467 } else { 485 } else {
468 moviment_parameter_json[current_main_config][config] = value; 486 moviment_parameter_json[current_main_config][config] = value;
469 } 487 }
470 } 488 }
  489 +
  490 + function _readConfigValue(el, config_name) {
  491 + if (typeof config_name == "undefined" || config_name == "articulacao") return;
  492 +
  493 + return $(el).attr("value");
  494 + }
471 495
472 function _selectConfig(el) { 496 function _selectConfig(el) {
473 var current_config_id = $(".selection-panel-body").has(el).attr("id"); 497 var current_config_id = $(".selection-panel-body").has(el).attr("id");
474 var current_config_name = $(".selection-panel-body").has(el).attr( 498 var current_config_name = $(".selection-panel-body").has(el).attr(
475 "name"); 499 "name");
476 - var config_value = $(el).attr("value");  
477 - $("#" + current_config_id + " .selection-panel-option[select=true]")  
478 - .removeClass("selection-panel-option-hover");  
479 $("#" + current_config_id + " .selection-panel-option[select=true]") 500 $("#" + current_config_id + " .selection-panel-option[select=true]")
480 .removeAttr("select"); 501 .removeAttr("select");
481 $(el).attr("select", true); 502 $(el).attr("select", true);
482 - 503 +
  504 + var config_value = _readConfigValue(el, current_config_name);
483 _updateParameterJSON(current_config_name, config_value); 505 _updateParameterJSON(current_config_name, config_value);
484 } 506 }
485 507
@@ -491,20 +513,20 @@ @@ -491,20 +513,20 @@
491 "click", function() { 513 "click", function() {
492 _selectConfig(this); 514 _selectConfig(this);
493 var next = _getNextSubConfiguration(); 515 var next = _getNextSubConfiguration();
494 - _showSubConfiguration(next); 516 + _showSubConfiguration(next, true);
495 }); 517 });
496 $(".subconfiguration-options .icon_container").off("click").on("click", 518 $(".subconfiguration-options .icon_container").off("click").on("click",
497 function() { 519 function() {
498 var subconfig = $(this).attr("panel"); 520 var subconfig = $(this).attr("panel");
499 - _showSubConfiguration(subconfig); 521 + _showSubConfiguration(subconfig, false);
500 }); 522 });
501 $(".arrow[name=right-arrow]").off("click").on("click", function() { 523 $(".arrow[name=right-arrow]").off("click").on("click", function() {
502 var next = _getNextSubConfiguration(); 524 var next = _getNextSubConfiguration();
503 - _showSubConfiguration(next); 525 + _showSubConfiguration(next, false);
504 }); 526 });
505 $(".arrow[name=left-arrow]").off("click").on("click", function() { 527 $(".arrow[name=left-arrow]").off("click").on("click", function() {
506 var previous = _getPreviousSubConfiguration(); 528 var previous = _getPreviousSubConfiguration();
507 - _showSubConfiguration(previous); 529 + _showSubConfiguration(previous, false);
508 }); 530 });
509 } 531 }
510 532
@@ -565,12 +587,8 @@ @@ -565,12 +587,8 @@
565 "panel")); 587 "panel"));
566 }); 588 });
567 } 589 }
568 -  
569 - function _setupGUI(task, deferred) {  
570 - _clearGUI();  
571 - _setupConfigurationPanel();  
572 - _setupSelectionPanel();  
573 - 590 +
  591 + function _setupMainScreen(task, deferred) {
574 $("#initial-screen").fadeIn(300); 592 $("#initial-screen").fadeIn(300);
575 $("#start-button").off("click").on("click", function() { 593 $("#start-button").off("click").on("click", function() {
576 $("#initial-screen").hide(); 594 $("#initial-screen").hide();
@@ -590,6 +608,15 @@ @@ -590,6 +608,15 @@
590 }); 608 });
591 } 609 }
592 610
  611 + function _setupGUI(task, deferred) {
  612 + _clearGUI();
  613 + _setupConfigurationPanel();
  614 + _setupSelectionPanel();
  615 + _setupMainScreen(task, deferred);
  616 +
  617 + articulation.setup(base_url);
  618 + }
  619 +
593 function _saveAnswer(task, deferred) { 620 function _saveAnswer(task, deferred) {
594 var answer = {} 621 var answer = {}
595 answer["status"] = "FINISHED"; 622 answer["status"] = "FINISHED";
@@ -619,8 +646,6 @@ @@ -619,8 +646,6 @@
619 _loadTaskInfo(task); 646 _loadTaskInfo(task);
620 _setupGUI(task, deferred) 647 _setupGUI(task, deferred)
621 $("#main-container").fadeIn(500); 648 $("#main-container").fadeIn(500);
622 - console.log(base_parameter_json);  
623 - console.log(moviment_parameter_json);  
624 } else { 649 } else {
625 _showCompletedAllTaskMsg(); 650 _showCompletedAllTaskMsg();
626 } 651 }
@@ -632,11 +657,16 @@ @@ -632,11 +657,16 @@
632 } 657 }
633 658
634 // Public methods 659 // Public methods
635 - wikilibras.run = function(serverhost, projectname, apihost) { 660 + wikilibras.run = function(serverhost, serverbackend, projectname, apihost) {
636 base_url = serverhost; 661 base_url = serverhost;
  662 + server_back_url = serverbackend;
637 videos_url = base_url + "/videos/"; 663 videos_url = base_url + "/videos/";
638 api_url = apihost; 664 api_url = apihost;
639 _run(projectname); 665 _run(projectname);
640 }; 666 };
  667 +
  668 + wikilibras.updateParameterJSON = function(config, value) {
  669 + _updateParameterJSON(config, value);
  670 + }
641 671
642 }(window.wikilibras = window.wikilibras || {}, jQuery)); 672 }(window.wikilibras = window.wikilibras || {}, jQuery));
643 \ No newline at end of file 673 \ No newline at end of file
view/facial-configuration.html
  Diff comments   View file @bb7233b
@@ -6,47 +6,47 @@ @@ -6,47 +6,47 @@
6 </div> 6 </div>
7 <div class="selection-panel-inner-body"> 7 <div class="selection-panel-inner-body">
8 <ul class="rig columns-3"> 8 <ul class="rig columns-3">
9 - <li><img class="selection-panel-option" 9 + <li><img class="box-panel-option selection-panel-option"
10 src="{{ server }}/img/exf/0000.png" value="0" /> 1.</li> 10 src="{{ server }}/img/exf/0000.png" value="0" /> 1.</li>
11 - <li><img class="selection-panel-option" 11 + <li><img class="box-panel-option selection-panel-option"
12 src="{{ server }}/img/exf/0001.png" value="1" /> 2.</li> 12 src="{{ server }}/img/exf/0001.png" value="1" /> 2.</li>
13 - <li><img class="selection-panel-option" 13 + <li><img class="box-panel-option selection-panel-option"
14 src="{{ server }}/img/exf/0002.png" value="2" /> 3.</li> 14 src="{{ server }}/img/exf/0002.png" value="2" /> 3.</li>
15 - <li><img class="selection-panel-option" 15 + <li><img class="box-panel-option selection-panel-option"
16 src="{{ server }}/img/exf/0003.png" value="3" /> 4.</li> 16 src="{{ server }}/img/exf/0003.png" value="3" /> 4.</li>
17 - <li><img class="selection-panel-option" 17 + <li><img class="box-panel-option selection-panel-option"
18 src="{{ server }}/img/exf/0004.png" value="4" /> 5.</li> 18 src="{{ server }}/img/exf/0004.png" value="4" /> 5.</li>
19 - <li><img class="selection-panel-option" 19 + <li><img class="box-panel-option selection-panel-option"
20 src="{{ server }}/img/exf/0005.png" value="5" /> 6.</li> 20 src="{{ server }}/img/exf/0005.png" value="5" /> 6.</li>
21 - <li><img class="selection-panel-option" 21 + <li><img class="box-panel-option selection-panel-option"
22 src="{{ server }}/img/exf/0006.png" value="6" /> 7.</li> 22 src="{{ server }}/img/exf/0006.png" value="6" /> 7.</li>
23 - <li><img class="selection-panel-option" 23 + <li><img class="box-panel-option selection-panel-option"
24 src="{{ server }}/img/exf/0007.png" value="7" /> 8.</li> 24 src="{{ server }}/img/exf/0007.png" value="7" /> 8.</li>
25 - <li><img class="selection-panel-option" 25 + <li><img class="box-panel-option selection-panel-option"
26 src="{{ server }}/img/exf/0008.png" value="8" /> 9.</li> 26 src="{{ server }}/img/exf/0008.png" value="8" /> 9.</li>
27 - <li><img class="selection-panel-option" 27 + <li><img class="box-panel-option selection-panel-option"
28 src="{{ server }}/img/exf/0009.png" value="9" />10.</li> 28 src="{{ server }}/img/exf/0009.png" value="9" />10.</li>
29 - <li><img class="selection-panel-option" 29 + <li><img class="box-panel-option selection-panel-option"
30 src="{{ server }}/img/exf/0010.png" value="10" />11.</li> 30 src="{{ server }}/img/exf/0010.png" value="10" />11.</li>
31 - <li><img class="selection-panel-option" 31 + <li><img class="box-panel-option selection-panel-option"
32 src="{{ server }}/img/exf/0011.png" value="11" />12.</li> 32 src="{{ server }}/img/exf/0011.png" value="11" />12.</li>
33 - <li><img class="selection-panel-option" 33 + <li><img class="box-panel-option selection-panel-option"
34 src="{{ server }}/img/exf/0012.png" value="12" />13.</li> 34 src="{{ server }}/img/exf/0012.png" value="12" />13.</li>
35 - <li><img class="selection-panel-option" 35 + <li><img class="box-panel-option selection-panel-option"
36 src="{{ server }}/img/exf/0013.png" value="13" />14.</li> 36 src="{{ server }}/img/exf/0013.png" value="13" />14.</li>
37 - <li><img class="selection-panel-option" 37 + <li><img class="box-panel-option selection-panel-option"
38 src="{{ server }}/img/exf/0014.png" value="14" />15.</li> 38 src="{{ server }}/img/exf/0014.png" value="14" />15.</li>
39 - <li><img class="selection-panel-option" 39 + <li><img class="box-panel-option selection-panel-option"
40 src="{{ server }}/img/exf/0015.png" value="15" />16.</li> 40 src="{{ server }}/img/exf/0015.png" value="15" />16.</li>
41 - <li><img class="selection-panel-option" 41 + <li><img class="box-panel-option selection-panel-option"
42 src="{{ server }}/img/exf/0016.png" value="16" />17.</li> 42 src="{{ server }}/img/exf/0016.png" value="16" />17.</li>
43 - <li><img class="selection-panel-option" 43 + <li><img class="box-panel-option selection-panel-option"
44 src="{{ server }}/img/exf/0017.png" value="17" />18.</li> 44 src="{{ server }}/img/exf/0017.png" value="17" />18.</li>
45 - <li><img class="selection-panel-option" 45 + <li><img class="box-panel-option selection-panel-option"
46 src="{{ server }}/img/exf/0018.png" value="18" />19.</li> 46 src="{{ server }}/img/exf/0018.png" value="18" />19.</li>
47 - <li><img class="selection-panel-option" 47 + <li><img class="box-panel-option selection-panel-option"
48 src="{{ server }}/img/exf/0019.png" value="19" />20.</li> 48 src="{{ server }}/img/exf/0019.png" value="19" />20.</li>
49 - <li><img class="selection-panel-option" 49 + <li><img class="box-panel-option selection-panel-option"
50 src="{{ server }}/img/exf/0020.png" value="20" />21.</li> 50 src="{{ server }}/img/exf/0020.png" value="20" />21.</li>
51 </ul> 51 </ul>
52 </div> 52 </div>
@@ -58,7 +58,7 @@ @@ -58,7 +58,7 @@
58 </div> 58 </div>
59 <div class="single-column-option-container"> 59 <div class="single-column-option-container">
60 <div class="single-column-option"> 60 <div class="single-column-option">
61 - <img class="selection-panel-option" 61 + <img class="box-panel-option selection-panel-option"
62 src="{{ server }}/img/exf/0000.png" value="lento" /> 62 src="{{ server }}/img/exf/0000.png" value="lento" />
63 </div> 63 </div>
64 <img class="single-column-option" 64 <img class="single-column-option"
@@ -66,7 +66,7 @@ @@ -66,7 +66,7 @@
66 </div> 66 </div>
67 <div class="single-column-option-container"> 67 <div class="single-column-option-container">
68 <div class="single-column-option"> 68 <div class="single-column-option">
69 - <img class="selection-panel-option" 69 + <img class="box-panel-option selection-panel-option"
70 src="{{ server }}/img/exf/0000.png" value="normal" /> 70 src="{{ server }}/img/exf/0000.png" value="normal" />
71 </div> 71 </div>
72 <img class="single-column-option" 72 <img class="single-column-option"
@@ -74,7 +74,7 @@ @@ -74,7 +74,7 @@
74 </div> 74 </div>
75 <div class="single-column-option-container"> 75 <div class="single-column-option-container">
76 <div class="single-column-option"> 76 <div class="single-column-option">
77 - <img class="selection-panel-option" 77 + <img class="box-panel-option selection-panel-option"
78 src="{{ server }}/img/exf/0000.png" value="rapido" /> 78 src="{{ server }}/img/exf/0000.png" value="rapido" />
79 </div> 79 </div>
80 <img class="single-column-option" 80 <img class="single-column-option"
@@ -88,7 +88,7 @@ @@ -88,7 +88,7 @@
88 </div> 88 </div>
89 <div class="single-column-option-container"> 89 <div class="single-column-option-container">
90 <div class="single-column-option"> 90 <div class="single-column-option">
91 - <img class="selection-panel-option" 91 + <img class="box-panel-option selection-panel-option"
92 src="{{ server }}/img/exf/0000.png" value="lento" /> 92 src="{{ server }}/img/exf/0000.png" value="lento" />
93 </div> 93 </div>
94 <img class="single-column-option" 94 <img class="single-column-option"
@@ -96,7 +96,7 @@ @@ -96,7 +96,7 @@
96 </div> 96 </div>
97 <div class="single-column-option-container"> 97 <div class="single-column-option-container">
98 <div class="single-column-option"> 98 <div class="single-column-option">
99 - <img class="selection-panel-option" 99 + <img class="box-panel-option selection-panel-option"
100 src="{{ server }}/img/exf/0000.png" value="normal" /> 100 src="{{ server }}/img/exf/0000.png" value="normal" />
101 </div> 101 </div>
102 <img class="single-column-option" 102 <img class="single-column-option"
@@ -104,7 +104,7 @@ @@ -104,7 +104,7 @@
104 </div> 104 </div>
105 <div class="single-column-option-container"> 105 <div class="single-column-option-container">
106 <div class="single-column-option"> 106 <div class="single-column-option">
107 - <img class="selection-panel-option" 107 + <img class="box-panel-option selection-panel-option"
108 src="{{ server }}/img/exf/0000.png" value="rapido" /> 108 src="{{ server }}/img/exf/0000.png" value="rapido" />
109 </div> 109 </div>
110 <img class="single-column-option" 110 <img class="single-column-option"
@@ -122,8 +122,7 @@ @@ -122,8 +122,7 @@
122 <div class="icon_container" name="facial-expression-velocity" 122 <div class="icon_container" name="facial-expression-velocity"
123 panel="facial-expression-velocity" previous="facial-expression" 123 panel="facial-expression-velocity" previous="facial-expression"
124 next="facial-expression-duration"> 124 next="facial-expression-duration">
125 - <img style="position: relative; top: -4px;"  
126 - src="{{ server }}/img/facial-expression-velocity-icon.png" /> 125 + <img src="{{ server }}/img/facial-expression-velocity-icon.png" />
127 </div> 126 </div>
128 <div class="icon_container" name="facial-expression-duration" 127 <div class="icon_container" name="facial-expression-duration"
129 panel="facial-expression-duration" 128 panel="facial-expression-duration"
view/hand-configuration.html
  Diff comments   View file @bb7233b
1 -{% macro selectionPanel(name) -%}  
2 -{% if name == 'right-hand' %}  
3 -{% set fingers_position_dir = "cmd" %}  
4 -{% set orientation_dir = "ord" %}  
5 -{% else %}  
6 -{% set fingers_position_dir = "cme" %}  
7 -{% set orientation_dir = "ore" %}  
8 -{% endif %} 1 +{% macro selectionPanel(name) -%} {% if name == 'right-hand' %} {% set
  2 +fingers_position_dir = "cmd" %} {% set orientation_dir = "ord" %} {%
  3 +else %} {% set fingers_position_dir = "cme" %} {% set orientation_dir =
  4 +"ore" %} {% endif %}
9 5
10 -<div id="{{ name }}-moviment" class="selection-panel-body" name="movimento"> 6 +<div id="{{ name }}-moviment" class="selection-panel-body"
  7 + name="movimento">
11 <div class="panel-header"> 8 <div class="panel-header">
12 <h8>Escolha o movimento mais parecido</h8> 9 <h8>Escolha o movimento mais parecido</h8>
13 </div> 10 </div>
14 <div class="selection-panel-inner-body"> 11 <div class="selection-panel-inner-body">
15 <ul class="rig columns-2"> 12 <ul class="rig columns-2">
16 - <li><img class="selection-panel-option"  
17 - src="{{ server }}/img/mov/CALAR.gif" value="pontual"/>Pontual</li>  
18 - <!--  
19 - <li><img class="selection-panel-option" 13 + <li><video src="{{ server }}/img/mov/PONTUAL.webm"
  14 + preload="metadata" value="pontual"
  15 + class="box-panel-option selection-panel-option" autoplay loop>
  16 + <source type="video/webm">
  17 + </video> Pontual</li>
  18 + <!--
  19 + <li><img class="box-panel-option selection-panel-option"
20 src="{{ server }}/img/exf/0000.png" value="retilineo"/>Retilíneo</li> 20 src="{{ server }}/img/exf/0000.png" value="retilineo"/>Retilíneo</li>
21 - <li><img class="selection-panel-option" 21 + <li><img class="box-panel-option selection-panel-option"
22 src="{{ server }}/img/exf/0000.png" value="circular"/>Circular</li> 22 src="{{ server }}/img/exf/0000.png" value="circular"/>Circular</li>
23 - <li><img class="selection-panel-option" 23 + <li><img class="box-panel-option selection-panel-option"
24 src="{{ server }}/img/exf/0000.png" value="semicircular"/>Semi-Circular</li> 24 src="{{ server }}/img/exf/0000.png" value="semicircular"/>Semi-Circular</li>
25 - <li><img class="selection-panel-option" 25 + <li><img class="box-panel-option selection-panel-option"
26 src="{{ server }}/img/exf/0000.png" value="helicoidal"/>Espiral</li> 26 src="{{ server }}/img/exf/0000.png" value="helicoidal"/>Espiral</li>
27 - <li><img class="selection-panel-option" 27 + <li><img class="box-panel-option selection-panel-option"
28 src="{{ server }}/img/exf/0000.png" value="senoidal"/>Curvas</li> 28 src="{{ server }}/img/exf/0000.png" value="senoidal"/>Curvas</li>
29 - <li><img class="selection-panel-option" 29 + <li><img class="box-panel-option selection-panel-option"
30 src="{{ server }}/img/exf/0000.png" value="contato"/>Contato</li> 30 src="{{ server }}/img/exf/0000.png" value="contato"/>Contato</li>
31 --> 31 -->
32 </ul> 32 </ul>
33 </div> 33 </div>
34 </div> 34 </div>
  35 +
  36 +<div id="{{ name }}-articulation" multiple-config>
  37 + <div id="{{ name }}-articulation-1" class="selection-panel-body"
  38 + style="display: none;" next="{{ name }}-articulation-2" sub-config>
  39 + <div class="panel-header">
  40 + <h8>Onde é feito o sinal?</h8>
  41 + </div>
  42 + <div class="selection-panel-inner-body">
  43 + <div data-x="" data-y=""
  44 + class="module-x-y grid gray-background gray-front-avatar active">
  45 + <div class=grid-selectors>
  46 + <div class="grid-row row-number-1" data-y=1>
  47 + <div class="ball-selector selection-panel-option ball-1" data-x=1></div>
  48 + <div class="ball-selector selection-panel-option ball-2" data-x=2></div>
  49 + <div class="ball-selector selection-panel-option ball-3" data-x=3></div>
  50 + <div class="ball-selector selection-panel-option ball-4" data-x=4></div>
  51 + <div class="ball-selector selection-panel-option ball-5" data-x=5></div>
  52 + <div class="ball-selector selection-panel-option ball-6" data-x=6></div>
  53 + <div class="ball-selector selection-panel-option ball-7" data-x=7></div>
  54 + <div class="ball-selector selection-panel-option ball-8" data-x=8></div>
  55 + <div class="ball-selector selection-panel-option ball-9" data-x=9></div>
  56 + <div class="ball-selector selection-panel-option ball-10"
  57 + data-x=10></div>
  58 + </div>
  59 + <div class="grid-row row-number-2" data-y=2>
  60 + <div class="ball-selector selection-panel-option ball-1" data-x=1></div>
  61 + <div class="ball-selector selection-panel-option ball-2" data-x=2></div>
  62 + <div class="ball-selector selection-panel-option ball-3" data-x=3></div>
  63 + <div class="ball-selector selection-panel-option ball-4" data-x=4></div>
  64 + <div class="ball-selector selection-panel-option ball-5" data-x=5></div>
  65 + <div class="ball-selector selection-panel-option ball-6" data-x=6></div>
  66 + <div class="ball-selector selection-panel-option ball-7" data-x=7></div>
  67 + <div class="ball-selector selection-panel-option ball-8" data-x=8></div>
  68 + <div class="ball-selector selection-panel-option ball-9" data-x=9></div>
  69 + <div class="ball-selector selection-panel-option ball-10"
  70 + data-x=10></div>
  71 + </div>
  72 + <div class="grid-row row-number-3" data-y=3>
  73 + <div class="ball-selector selection-panel-option ball-1" data-x=1></div>
  74 + <div class="ball-selector selection-panel-option ball-2" data-x=2></div>
  75 + <div class="ball-selector selection-panel-option ball-3" data-x=3></div>
  76 + <div class="ball-selector selection-panel-option ball-4" data-x=4></div>
  77 + <div class="ball-selector selection-panel-option ball-5" data-x=5></div>
  78 + <div class="ball-selector selection-panel-option ball-6" data-x=6></div>
  79 + <div class="ball-selector selection-panel-option ball-7" data-x=7></div>
  80 + <div class="ball-selector selection-panel-option ball-8" data-x=8></div>
  81 + <div class="ball-selector selection-panel-option ball-9" data-x=9></div>
  82 + <div class="ball-selector selection-panel-option ball-10"
  83 + data-x=10></div>
  84 + </div>
  85 + <div class="grid-row row-number-4" data-y=4>
  86 + <div class="ball-selector selection-panel-option ball-1" data-x=1></div>
  87 + <div class="ball-selector selection-panel-option ball-2" data-x=2></div>
  88 + <div class="ball-selector selection-panel-option ball-3" data-x=3></div>
  89 + <div class="ball-selector selection-panel-option ball-4" data-x=4></div>
  90 + <div class="ball-selector selection-panel-option ball-5" data-x=5></div>
  91 + <div class="ball-selector selection-panel-option ball-6" data-x=6></div>
  92 + <div class="ball-selector selection-panel-option ball-7" data-x=7></div>
  93 + <div class="ball-selector selection-panel-option ball-8" data-x=8></div>
  94 + <div class="ball-selector selection-panel-option ball-9" data-x=9></div>
  95 + <div class="ball-selector selection-panel-option ball-10"
  96 + data-x=10></div>
  97 + </div>
  98 + <div class="grid-row row-number-5" data-y=5>
  99 + <div class="ball-selector selection-panel-option ball-1" data-x=1></div>
  100 + <div class="ball-selector selection-panel-option ball-2" data-x=2></div>
  101 + <div class="ball-selector selection-panel-option ball-3" data-x=3></div>
  102 + <div class="ball-selector selection-panel-option ball-4" data-x=4></div>
  103 + <div class="ball-selector selection-panel-option ball-5" data-x=5></div>
  104 + <div class="ball-selector selection-panel-option ball-6" data-x=6></div>
  105 + <div class="ball-selector selection-panel-option ball-7" data-x=7></div>
  106 + <div class="ball-selector selection-panel-option ball-8" data-x=8></div>
  107 + <div class="ball-selector selection-panel-option ball-9" data-x=9></div>
  108 + <div class="ball-selector selection-panel-option ball-10"
  109 + data-x=10></div>
  110 + </div>
  111 + </div>
  112 + </div>
  113 + </div>
  114 + </div>
  115 +
  116 + <div id="{{ name }}-articulation-2" class="selection-panel-body"
  117 + style="display: none;" next="end" sub-config name="articulacao">
  118 + <div class="panel-header">
  119 + <h8>Escolha a distância entre a mão e o corpo</h8>
  120 + </div>
  121 + <div class="selection-panel-inner-body">
  122 + <div data-z="" class="module-z grid gray-background gray-side-avatar">
  123 + <div class="grid-selectors pull-right">
  124 + <div class="grid-row row-number-1">
  125 + <div class="ball-selector selection-panel-option ball-number-1"
  126 + data-z=1></div>
  127 + <div class="ball-selector selection-panel-option ball-number-2"
  128 + data-z=2></div>
  129 + <div class="ball-selector selection-panel-option ball-number-3"
  130 + data-z=3></div>
  131 + </div>
  132 + <div class="grid-row row-number-2">
  133 + <div class="ball-selector selection-panel-option ball-1" data-z=1></div>
  134 + <div class="ball-selector selection-panel-option ball-2" data-z=2></div>
  135 + <div class="ball-selector selection-panel-option ball-3" data-z=3></div>
  136 + </div>
  137 + <div class="grid-row row-number-3">
  138 + <div class="ball-selector selection-panel-option ball-1" data-z=1></div>
  139 + <div class="ball-selector selection-panel-option ball-2" data-z=2></div>
  140 + <div class="ball-selector selection-panel-option ball-3" data-z=3></div>
  141 + </div>
  142 + <div class="grid-row row-number-4">
  143 + <div class="ball-selector selection-panel-option ball-1" data-z=1></div>
  144 + <div class="ball-selector selection-panel-option ball-2" data-z=2></div>
  145 + <div class="ball-selector selection-panel-option ball-3" data-z=3></div>
  146 + </div>
  147 + <div class="grid-row row-number-5">
  148 + <div class="ball-selector selection-panel-option ball-1" data-z=1></div>
  149 + </div>
  150 + </div>
  151 + </div>
  152 + </div>
  153 + </div>
  154 +</div>
  155 +
35 <div id="{{ name }}-fingers-position" multiple-config> 156 <div id="{{ name }}-fingers-position" multiple-config>
36 <div id="{{ name }}-fingers-position-1" class="selection-panel-body" 157 <div id="{{ name }}-fingers-position-1" class="selection-panel-body"
37 style="display: none;" next="{{ name }}-fingers-position-2" sub-config> 158 style="display: none;" next="{{ name }}-fingers-position-2" sub-config>
@@ -40,22 +161,22 @@ @@ -40,22 +161,22 @@
40 </div> 161 </div>
41 <div class="selection-panel-inner-body"> 162 <div class="selection-panel-inner-body">
42 <ul class="rig columns-3"> 163 <ul class="rig columns-3">
43 - <li><img class="selection-panel-option" 164 + <li><img class="box-panel-option selection-panel-option"
44 src="{{ server }}/img/{{ fingers_position_dir }}/0007.png" 165 src="{{ server }}/img/{{ fingers_position_dir }}/0007.png"
45 group="0" /> 0.</li> 166 group="0" /> 0.</li>
46 - <li><img class="selection-panel-option" 167 + <li><img class="box-panel-option selection-panel-option"
47 src="{{ server }}/img/{{ fingers_position_dir }}/0014.png" 168 src="{{ server }}/img/{{ fingers_position_dir }}/0014.png"
48 group="1" /> 1.</li> 169 group="1" /> 1.</li>
49 - <li><img class="selection-panel-option" 170 + <li><img class="box-panel-option selection-panel-option"
50 src="{{ server }}/img/{{ fingers_position_dir }}/0045.png" 171 src="{{ server }}/img/{{ fingers_position_dir }}/0045.png"
51 group="2" /> 2.</li> 172 group="2" /> 2.</li>
52 - <li><img class="selection-panel-option" 173 + <li><img class="box-panel-option selection-panel-option"
53 src="{{ server }}/img/{{ fingers_position_dir }}/0048.png" 174 src="{{ server }}/img/{{ fingers_position_dir }}/0048.png"
54 group="3" /> 3.</li> 175 group="3" /> 3.</li>
55 - <li><img class="selection-panel-option" 176 + <li><img class="box-panel-option selection-panel-option"
56 src="{{ server }}/img/{{ fingers_position_dir }}/0040.png" 177 src="{{ server }}/img/{{ fingers_position_dir }}/0040.png"
57 group="4" /> 4.</li> 178 group="4" /> 4.</li>
58 - <li><img class="selection-panel-option" 179 + <li><img class="box-panel-option selection-panel-option"
59 src="{{ server }}/img/{{ fingers_position_dir }}/0000.png" 180 src="{{ server }}/img/{{ fingers_position_dir }}/0000.png"
60 group="5" /> 5.</li> 181 group="5" /> 5.</li>
61 </ul> 182 </ul>
@@ -69,196 +190,261 @@ @@ -69,196 +190,261 @@
69 <div class="selection-panel-inner-body"> 190 <div class="selection-panel-inner-body">
70 <div class="finger-group" group="0"> 191 <div class="finger-group" group="0">
71 <ul class="rig columns-4"> 192 <ul class="rig columns-4">
72 - <li><img class="selection-panel-option"  
73 - src="{{ server }}/img/{{ fingers_position_dir }}/0001.png" value="1"/> 1.</li>  
74 - <li><img class="selection-panel-option"  
75 - src="{{ server }}/img/{{ fingers_position_dir }}/0002.png" value="2"/> 2.</li>  
76 - <li><img class="selection-panel-option"  
77 - src="{{ server }}/img/{{ fingers_position_dir }}/0007.png" value="7"/> 3.</li>  
78 - <li><img class="selection-panel-option"  
79 - src="{{ server }}/img/{{ fingers_position_dir }}/0008.png" value="8"/> 4.</li>  
80 - <li><img class="selection-panel-option"  
81 - src="{{ server }}/img/{{ fingers_position_dir }}/0009.png" value="9"/> 5.</li>  
82 - <li><img class="selection-panel-option"  
83 - src="{{ server }}/img/{{ fingers_position_dir }}/0010.png" value="10"/> 6.</li>  
84 - <li><img class="selection-panel-option"  
85 - src="{{ server }}/img/{{ fingers_position_dir }}/0011.png" value="11"/> 7.</li>  
86 - <li><img class="selection-panel-option"  
87 - src="{{ server }}/img/{{ fingers_position_dir }}/0016.png" value="16"/> 8.</li>  
88 - <li><img class="selection-panel-option"  
89 - src="{{ server }}/img/{{ fingers_position_dir }}/0017.png" value="17"/> 9.</li>  
90 - <li><img class="selection-panel-option"  
91 - src="{{ server }}/img/{{ fingers_position_dir }}/0018.png" value="18"/> 10.</li>  
92 - <li><img class="selection-panel-option"  
93 - src="{{ server }}/img/{{ fingers_position_dir }}/0019.png" value="19"/> 11.</li>  
94 - <li><img class="selection-panel-option"  
95 - src="{{ server }}/img/{{ fingers_position_dir }}/0020.png" value="20"/> 12.</li>  
96 - <li><img class="selection-panel-option"  
97 - src="{{ server }}/img/{{ fingers_position_dir }}/0021.png" value="21"/> 13.</li>  
98 - <li><img class="selection-panel-option"  
99 - src="{{ server }}/img/{{ fingers_position_dir }}/0022.png" value="22"/> 14.</li>  
100 - <li><img class="selection-panel-option"  
101 - src="{{ server }}/img/{{ fingers_position_dir }}/0023.png" value="23"/> 15.</li>  
102 - <li><img class="selection-panel-option"  
103 - src="{{ server }}/img/{{ fingers_position_dir }}/0024.png" value="24"/> 16.</li>  
104 - <li><img class="selection-panel-option"  
105 - src="{{ server }}/img/{{ fingers_position_dir }}/0058.png" value="58"/> 17.</li>  
106 - <li><img class="selection-panel-option"  
107 - src="{{ server }}/img/{{ fingers_position_dir }}/0059.png" value="59"/> 18.</li>  
108 - <li><img class="selection-panel-option"  
109 - src="{{ server }}/img/{{ fingers_position_dir }}/0060.png" value="60"/> 19.</li> 193 + <li><img class="box-panel-option selection-panel-option"
  194 + src="{{ server }}/img/{{ fingers_position_dir }}/0001.png"
  195 + value="1" /> 1.</li>
  196 + <li><img class="box-panel-option selection-panel-option"
  197 + src="{{ server }}/img/{{ fingers_position_dir }}/0002.png"
  198 + value="2" /> 2.</li>
  199 + <li><img class="box-panel-option selection-panel-option"
  200 + src="{{ server }}/img/{{ fingers_position_dir }}/0007.png"
  201 + value="7" /> 3.</li>
  202 + <li><img class="box-panel-option selection-panel-option"
  203 + src="{{ server }}/img/{{ fingers_position_dir }}/0008.png"
  204 + value="8" /> 4.</li>
  205 + <li><img class="box-panel-option selection-panel-option"
  206 + src="{{ server }}/img/{{ fingers_position_dir }}/0009.png"
  207 + value="9" /> 5.</li>
  208 + <li><img class="box-panel-option selection-panel-option"
  209 + src="{{ server }}/img/{{ fingers_position_dir }}/0010.png"
  210 + value="10" /> 6.</li>
  211 + <li><img class="box-panel-option selection-panel-option"
  212 + src="{{ server }}/img/{{ fingers_position_dir }}/0011.png"
  213 + value="11" /> 7.</li>
  214 + <li><img class="box-panel-option selection-panel-option"
  215 + src="{{ server }}/img/{{ fingers_position_dir }}/0016.png"
  216 + value="16" /> 8.</li>
  217 + <li><img class="box-panel-option selection-panel-option"
  218 + src="{{ server }}/img/{{ fingers_position_dir }}/0017.png"
  219 + value="17" /> 9.</li>
  220 + <li><img class="box-panel-option selection-panel-option"
  221 + src="{{ server }}/img/{{ fingers_position_dir }}/0018.png"
  222 + value="18" /> 10.</li>
  223 + <li><img class="box-panel-option selection-panel-option"
  224 + src="{{ server }}/img/{{ fingers_position_dir }}/0019.png"
  225 + value="19" /> 11.</li>
  226 + <li><img class="box-panel-option selection-panel-option"
  227 + src="{{ server }}/img/{{ fingers_position_dir }}/0020.png"
  228 + value="20" /> 12.</li>
  229 + <li><img class="box-panel-option selection-panel-option"
  230 + src="{{ server }}/img/{{ fingers_position_dir }}/0021.png"
  231 + value="21" /> 13.</li>
  232 + <li><img class="box-panel-option selection-panel-option"
  233 + src="{{ server }}/img/{{ fingers_position_dir }}/0022.png"
  234 + value="22" /> 14.</li>
  235 + <li><img class="box-panel-option selection-panel-option"
  236 + src="{{ server }}/img/{{ fingers_position_dir }}/0023.png"
  237 + value="23" /> 15.</li>
  238 + <li><img class="box-panel-option selection-panel-option"
  239 + src="{{ server }}/img/{{ fingers_position_dir }}/0024.png"
  240 + value="24" /> 16.</li>
  241 + <li><img class="box-panel-option selection-panel-option"
  242 + src="{{ server }}/img/{{ fingers_position_dir }}/0058.png"
  243 + value="58" /> 17.</li>
  244 + <li><img class="box-panel-option selection-panel-option"
  245 + src="{{ server }}/img/{{ fingers_position_dir }}/0059.png"
  246 + value="59" /> 18.</li>
  247 + <li><img class="box-panel-option selection-panel-option"
  248 + src="{{ server }}/img/{{ fingers_position_dir }}/0060.png"
  249 + value="60" /> 19.</li>
110 </ul> 250 </ul>
111 </div> 251 </div>
112 <div class="finger-group" group="1"> 252 <div class="finger-group" group="1">
113 <ul class="rig columns-4"> 253 <ul class="rig columns-4">
114 - <li><img class="selection-panel-option"  
115 - src="{{ server }}/img/{{ fingers_position_dir }}/0003.png" value="3"/> 1.</li>  
116 - <li><img class="selection-panel-option"  
117 - src="{{ server }}/img/{{ fingers_position_dir }}/0005.png" value="5"/> 2.</li>  
118 - <li><img class="selection-panel-option"  
119 - src="{{ server }}/img/{{ fingers_position_dir }}/0006.png" value="6"/> 3.</li>  
120 - <li><img class="selection-panel-option"  
121 - src="{{ server }}/img/{{ fingers_position_dir }}/0012.png" value="12"/> 4.</li>  
122 - <li><img class="selection-panel-option"  
123 - src="{{ server }}/img/{{ fingers_position_dir }}/0013.png" value="13"/> 5.</li>  
124 - <li><img class="selection-panel-option"  
125 - src="{{ server }}/img/{{ fingers_position_dir }}/0014.png" value="14"/> 6.</li>  
126 - <li><img class="selection-panel-option"  
127 - src="{{ server }}/img/{{ fingers_position_dir }}/0030.png" value="30"/> 7.</li>  
128 - <li><img class="selection-panel-option"  
129 - src="{{ server }}/img/{{ fingers_position_dir }}/0052.png" value="52"/> 8.</li> 254 + <li><img class="box-panel-option selection-panel-option"
  255 + src="{{ server }}/img/{{ fingers_position_dir }}/0003.png"
  256 + value="3" /> 1.</li>
  257 + <li><img class="box-panel-option selection-panel-option"
  258 + src="{{ server }}/img/{{ fingers_position_dir }}/0005.png"
  259 + value="5" /> 2.</li>
  260 + <li><img class="box-panel-option selection-panel-option"
  261 + src="{{ server }}/img/{{ fingers_position_dir }}/0006.png"
  262 + value="6" /> 3.</li>
  263 + <li><img class="box-panel-option selection-panel-option"
  264 + src="{{ server }}/img/{{ fingers_position_dir }}/0012.png"
  265 + value="12" /> 4.</li>
  266 + <li><img class="box-panel-option selection-panel-option"
  267 + src="{{ server }}/img/{{ fingers_position_dir }}/0013.png"
  268 + value="13" /> 5.</li>
  269 + <li><img class="box-panel-option selection-panel-option"
  270 + src="{{ server }}/img/{{ fingers_position_dir }}/0014.png"
  271 + value="14" /> 6.</li>
  272 + <li><img class="box-panel-option selection-panel-option"
  273 + src="{{ server }}/img/{{ fingers_position_dir }}/0030.png"
  274 + value="30" /> 7.</li>
  275 + <li><img class="box-panel-option selection-panel-option"
  276 + src="{{ server }}/img/{{ fingers_position_dir }}/0052.png"
  277 + value="52" /> 8.</li>
130 </ul> 278 </ul>
131 </div> 279 </div>
132 <div class="finger-group" group="2"> 280 <div class="finger-group" group="2">
133 <ul class="rig columns-4"> 281 <ul class="rig columns-4">
134 - <li><img class="selection-panel-option"  
135 - src="{{ server }}/img/{{ fingers_position_dir }}/0004.png" value="4"/> 1.</li>  
136 - <li><img class="selection-panel-option"  
137 - src="{{ server }}/img/{{ fingers_position_dir }}/0015.png" value="15"/> 2.</li>  
138 - <li><img class="selection-panel-option"  
139 - src="{{ server }}/img/{{ fingers_position_dir }}/0029.png" value="29"/> 3.</li>  
140 - <li><img class="selection-panel-option"  
141 - src="{{ server }}/img/{{ fingers_position_dir }}/0031.png" value="31"/> 4.</li>  
142 - <li><img class="selection-panel-option"  
143 - src="{{ server }}/img/{{ fingers_position_dir }}/0032.png" value="32"/> 5.</li>  
144 - <li><img class="selection-panel-option"  
145 - src="{{ server }}/img/{{ fingers_position_dir }}/0035.png" value="35"/> 6.</li>  
146 - <li><img class="selection-panel-option"  
147 - src="{{ server }}/img/{{ fingers_position_dir }}/0036.png" value="36"/> 7.</li>  
148 - <li><img class="selection-panel-option"  
149 - src="{{ server }}/img/{{ fingers_position_dir }}/0045.png" value="45"/> 8.</li>  
150 - <li><img class="selection-panel-option"  
151 - src="{{ server }}/img/{{ fingers_position_dir }}/0051.png" value="51"/> 9.</li> 282 + <li><img class="box-panel-option selection-panel-option"
  283 + src="{{ server }}/img/{{ fingers_position_dir }}/0004.png"
  284 + value="4" /> 1.</li>
  285 + <li><img class="box-panel-option selection-panel-option"
  286 + src="{{ server }}/img/{{ fingers_position_dir }}/0015.png"
  287 + value="15" /> 2.</li>
  288 + <li><img class="box-panel-option selection-panel-option"
  289 + src="{{ server }}/img/{{ fingers_position_dir }}/0029.png"
  290 + value="29" /> 3.</li>
  291 + <li><img class="box-panel-option selection-panel-option"
  292 + src="{{ server }}/img/{{ fingers_position_dir }}/0031.png"
  293 + value="31" /> 4.</li>
  294 + <li><img class="box-panel-option selection-panel-option"
  295 + src="{{ server }}/img/{{ fingers_position_dir }}/0032.png"
  296 + value="32" /> 5.</li>
  297 + <li><img class="box-panel-option selection-panel-option"
  298 + src="{{ server }}/img/{{ fingers_position_dir }}/0035.png"
  299 + value="35" /> 6.</li>
  300 + <li><img class="box-panel-option selection-panel-option"
  301 + src="{{ server }}/img/{{ fingers_position_dir }}/0036.png"
  302 + value="36" /> 7.</li>
  303 + <li><img class="box-panel-option selection-panel-option"
  304 + src="{{ server }}/img/{{ fingers_position_dir }}/0045.png"
  305 + value="45" /> 8.</li>
  306 + <li><img class="box-panel-option selection-panel-option"
  307 + src="{{ server }}/img/{{ fingers_position_dir }}/0051.png"
  308 + value="51" /> 9.</li>
152 </ul> 309 </ul>
153 </div> 310 </div>
154 <div class="finger-group" group="3"> 311 <div class="finger-group" group="3">
155 <ul class="rig columns-4"> 312 <ul class="rig columns-4">
156 - <li><img class="selection-panel-option"  
157 - src="{{ server }}/img/{{ fingers_position_dir }}/0033.png" value="33"/> 1.</li>  
158 - <li><img class="selection-panel-option"  
159 - src="{{ server }}/img/{{ fingers_position_dir }}/0034.png" value="34"/> 2.</li>  
160 - <li><img class="selection-panel-option"  
161 - src="{{ server }}/img/{{ fingers_position_dir }}/0037.png" value="37"/> 3.</li>  
162 - <li><img class="selection-panel-option"  
163 - src="{{ server }}/img/{{ fingers_position_dir }}/0039.png" value="39"/> 4.</li>  
164 - <li><img class="selection-panel-option"  
165 - src="{{ server }}/img/{{ fingers_position_dir }}/0043.png" value="43"/> 5.</li>  
166 - <li><img class="selection-panel-option"  
167 - src="{{ server }}/img/{{ fingers_position_dir }}/0044.png" value="44"/> 6.</li>  
168 - <li><img class="selection-panel-option"  
169 - src="{{ server }}/img/{{ fingers_position_dir }}/0046.png" value="46"/> 7.</li>  
170 - <li><img class="selection-panel-option"  
171 - src="{{ server }}/img/{{ fingers_position_dir }}/0047.png" value="47"/> 8.</li>  
172 - <li><img class="selection-panel-option"  
173 - src="{{ server }}/img/{{ fingers_position_dir }}/0048.png" value="48"/> 9.</li>  
174 - <li><img class="selection-panel-option"  
175 - src="{{ server }}/img/{{ fingers_position_dir }}/0049.png" value="49"/> 10.</li>  
176 - <li><img class="selection-panel-option"  
177 - src="{{ server }}/img/{{ fingers_position_dir }}/0050.png" value="50"/> 11.</li> 313 + <li><img class="box-panel-option selection-panel-option"
  314 + src="{{ server }}/img/{{ fingers_position_dir }}/0033.png"
  315 + value="33" /> 1.</li>
  316 + <li><img class="box-panel-option selection-panel-option"
  317 + src="{{ server }}/img/{{ fingers_position_dir }}/0034.png"
  318 + value="34" /> 2.</li>
  319 + <li><img class="box-panel-option selection-panel-option"
  320 + src="{{ server }}/img/{{ fingers_position_dir }}/0037.png"
  321 + value="37" /> 3.</li>
  322 + <li><img class="box-panel-option selection-panel-option"
  323 + src="{{ server }}/img/{{ fingers_position_dir }}/0039.png"
  324 + value="39" /> 4.</li>
  325 + <li><img class="box-panel-option selection-panel-option"
  326 + src="{{ server }}/img/{{ fingers_position_dir }}/0043.png"
  327 + value="43" /> 5.</li>
  328 + <li><img class="box-panel-option selection-panel-option"
  329 + src="{{ server }}/img/{{ fingers_position_dir }}/0044.png"
  330 + value="44" /> 6.</li>
  331 + <li><img class="box-panel-option selection-panel-option"
  332 + src="{{ server }}/img/{{ fingers_position_dir }}/0046.png"
  333 + value="46" /> 7.</li>
  334 + <li><img class="box-panel-option selection-panel-option"
  335 + src="{{ server }}/img/{{ fingers_position_dir }}/0047.png"
  336 + value="47" /> 8.</li>
  337 + <li><img class="box-panel-option selection-panel-option"
  338 + src="{{ server }}/img/{{ fingers_position_dir }}/0048.png"
  339 + value="48" /> 9.</li>
  340 + <li><img class="box-panel-option selection-panel-option"
  341 + src="{{ server }}/img/{{ fingers_position_dir }}/0049.png"
  342 + value="49" /> 10.</li>
  343 + <li><img class="box-panel-option selection-panel-option"
  344 + src="{{ server }}/img/{{ fingers_position_dir }}/0050.png"
  345 + value="50" /> 11.</li>
178 </ul> 346 </ul>
179 </div> 347 </div>
180 <div class="finger-group" group="4"> 348 <div class="finger-group" group="4">
181 <ul class="rig columns-4"> 349 <ul class="rig columns-4">
182 - <li><img class="selection-panel-option"  
183 - src="{{ server }}/img/{{ fingers_position_dir }}/0038.png" value="38"/> 1.</li>  
184 - <li><img class="selection-panel-option"  
185 - src="{{ server }}/img/{{ fingers_position_dir }}/0040.png" value="40"/> 2.</li>  
186 - <li><img class="selection-panel-option"  
187 - src="{{ server }}/img/{{ fingers_position_dir }}/0041.png" value="41"/> 3.</li>  
188 - <li><img class="selection-panel-option"  
189 - src="{{ server }}/img/{{ fingers_position_dir }}/0042.png" value="42"/> 4.</li> 350 + <li><img class="box-panel-option selection-panel-option"
  351 + src="{{ server }}/img/{{ fingers_position_dir }}/0038.png"
  352 + value="38" /> 1.</li>
  353 + <li><img class="box-panel-option selection-panel-option"
  354 + src="{{ server }}/img/{{ fingers_position_dir }}/0040.png"
  355 + value="40" /> 2.</li>
  356 + <li><img class="box-panel-option selection-panel-option"
  357 + src="{{ server }}/img/{{ fingers_position_dir }}/0041.png"
  358 + value="41" /> 3.</li>
  359 + <li><img class="box-panel-option selection-panel-option"
  360 + src="{{ server }}/img/{{ fingers_position_dir }}/0042.png"
  361 + value="42" /> 4.</li>
190 </ul> 362 </ul>
191 </div> 363 </div>
192 <div class="finger-group" group="5"> 364 <div class="finger-group" group="5">
193 <ul class="rig columns-4"> 365 <ul class="rig columns-4">
194 - <li><img class="selection-panel-option"  
195 - src="{{ server }}/img/{{ fingers_position_dir }}/0025.png" value="25"/> 1.</li>  
196 - <li><img class="selection-panel-option"  
197 - src="{{ server }}/img/{{ fingers_position_dir }}/0026.png" value="26"/> 2.</li>  
198 - <li><img class="selection-panel-option"  
199 - src="{{ server }}/img/{{ fingers_position_dir }}/0027.png" value="27"/> 3.</li>  
200 - <li><img class="selection-panel-option"  
201 - src="{{ server }}/img/{{ fingers_position_dir }}/0028.png" value="28"/> 4.</li>  
202 - <li><img class="selection-panel-option"  
203 - src="{{ server }}/img/{{ fingers_position_dir }}/0053.png" value="53"/> 5.</li>  
204 - <li><img class="selection-panel-option"  
205 - src="{{ server }}/img/{{ fingers_position_dir }}/0054.png" value="54"/> 6.</li>  
206 - <li><img class="selection-panel-option"  
207 - src="{{ server }}/img/{{ fingers_position_dir }}/0055.png" value="55"/> 7.</li>  
208 - <li><img class="selection-panel-option"  
209 - src="{{ server }}/img/{{ fingers_position_dir }}/0056.png" value="56"/> 8.</li>  
210 - <li><img class="selection-panel-option"  
211 - src="{{ server }}/img/{{ fingers_position_dir }}/0057.png" value="57"/> 9.</li> 366 + <li><img class="box-panel-option selection-panel-option"
  367 + src="{{ server }}/img/{{ fingers_position_dir }}/0025.png"
  368 + value="25" /> 1.</li>
  369 + <li><img class="box-panel-option selection-panel-option"
  370 + src="{{ server }}/img/{{ fingers_position_dir }}/0026.png"
  371 + value="26" /> 2.</li>
  372 + <li><img class="box-panel-option selection-panel-option"
  373 + src="{{ server }}/img/{{ fingers_position_dir }}/0027.png"
  374 + value="27" /> 3.</li>
  375 + <li><img class="box-panel-option selection-panel-option"
  376 + src="{{ server }}/img/{{ fingers_position_dir }}/0028.png"
  377 + value="28" /> 4.</li>
  378 + <li><img class="box-panel-option selection-panel-option"
  379 + src="{{ server }}/img/{{ fingers_position_dir }}/0053.png"
  380 + value="53" /> 5.</li>
  381 + <li><img class="box-panel-option selection-panel-option"
  382 + src="{{ server }}/img/{{ fingers_position_dir }}/0054.png"
  383 + value="54" /> 6.</li>
  384 + <li><img class="box-panel-option selection-panel-option"
  385 + src="{{ server }}/img/{{ fingers_position_dir }}/0055.png"
  386 + value="55" /> 7.</li>
  387 + <li><img class="box-panel-option selection-panel-option"
  388 + src="{{ server }}/img/{{ fingers_position_dir }}/0056.png"
  389 + value="56" /> 8.</li>
  390 + <li><img class="box-panel-option selection-panel-option"
  391 + src="{{ server }}/img/{{ fingers_position_dir }}/0057.png"
  392 + value="57" /> 9.</li>
212 </ul> 393 </ul>
213 </div> 394 </div>
214 </div> 395 </div>
215 </div> 396 </div>
216 </div> 397 </div>
217 -<div id="{{ name }}-orientation" class="selection-panel-body" name="orientacao"> 398 +
  399 +<div id="{{ name }}-orientation" class="selection-panel-body"
  400 + name="orientacao">
218 <div class="panel-header"> 401 <div class="panel-header">
219 <h8>Palma da mão</h8> 402 <h8>Palma da mão</h8>
220 </div> 403 </div>
221 <div class="selection-panel-inner-body"> 404 <div class="selection-panel-inner-body">
222 <ul class="rig columns-3"> 405 <ul class="rig columns-3">
223 - <li><img class="selection-panel-option"  
224 - src="{{ server }}/img/{{ orientation_dir }}/01.png" value="68"/>1.</li>  
225 - <li><img class="selection-panel-option"  
226 - src="{{ server }}/img/{{ orientation_dir }}/02.png" value="66"/>2.</li>  
227 - <li><img class="selection-panel-option"  
228 - src="{{ server }}/img/{{ orientation_dir }}/03.png" value="64"/>3.</li>  
229 - <li><img class="selection-panel-option"  
230 - src="{{ server }}/img/{{ orientation_dir }}/04.png" value="2"/>4.</li>  
231 - <li><img class="selection-panel-option"  
232 - src="{{ server }}/img/{{ orientation_dir }}/05.png" value="9"/>5.</li>  
233 - <li><img class="selection-panel-option"  
234 - src="{{ server }}/img/{{ orientation_dir }}/06.png" value="16"/>6.</li>  
235 - <li><img class="selection-panel-option"  
236 - src="{{ server }}/img/{{ orientation_dir }}/07.png" value="92"/>7.</li>  
237 - <li><img class="selection-panel-option"  
238 - src="{{ server }}/img/{{ orientation_dir }}/08.png" value="90"/>8.</li>  
239 - <li><img class="selection-panel-option"  
240 - src="{{ server }}/img/{{ orientation_dir }}/09.png" value="88"/>9.</li>  
241 - <li><img class="selection-panel-option"  
242 - src="{{ server }}/img/{{ orientation_dir }}/10.png" value="4"/>10.</li>  
243 - <li><img class="selection-panel-option"  
244 - src="{{ server }}/img/{{ orientation_dir }}/11.png" value="11"/>11.</li>  
245 - <li><img class="selection-panel-option"  
246 - src="{{ server }}/img/{{ orientation_dir }}/12.png" value="18"/>12.</li> 406 + <li><img class="box-panel-option selection-panel-option"
  407 + src="{{ server }}/img/{{ orientation_dir }}/01.png" value="68" />1.</li>
  408 + <li><img class="box-panel-option selection-panel-option"
  409 + src="{{ server }}/img/{{ orientation_dir }}/02.png" value="66" />2.</li>
  410 + <li><img class="box-panel-option selection-panel-option"
  411 + src="{{ server }}/img/{{ orientation_dir }}/03.png" value="64" />3.</li>
  412 + <li><img class="box-panel-option selection-panel-option"
  413 + src="{{ server }}/img/{{ orientation_dir }}/04.png" value="2" />4.</li>
  414 + <li><img class="box-panel-option selection-panel-option"
  415 + src="{{ server }}/img/{{ orientation_dir }}/05.png" value="9" />5.</li>
  416 + <li><img class="box-panel-option selection-panel-option"
  417 + src="{{ server }}/img/{{ orientation_dir }}/06.png" value="16" />6.</li>
  418 + <li><img class="box-panel-option selection-panel-option"
  419 + src="{{ server }}/img/{{ orientation_dir }}/07.png" value="92" />7.</li>
  420 + <li><img class="box-panel-option selection-panel-option"
  421 + src="{{ server }}/img/{{ orientation_dir }}/08.png" value="90" />8.</li>
  422 + <li><img class="box-panel-option selection-panel-option"
  423 + src="{{ server }}/img/{{ orientation_dir }}/09.png" value="88" />9.</li>
  424 + <li><img class="box-panel-option selection-panel-option"
  425 + src="{{ server }}/img/{{ orientation_dir }}/10.png" value="4" />10.</li>
  426 + <li><img class="box-panel-option selection-panel-option"
  427 + src="{{ server }}/img/{{ orientation_dir }}/11.png" value="11" />11.</li>
  428 + <li><img class="box-panel-option selection-panel-option"
  429 + src="{{ server }}/img/{{ orientation_dir }}/12.png" value="18" />12.</li>
247 </ul> 430 </ul>
248 </div> 431 </div>
249 </div> 432 </div>
250 -{%- endmacro %}  
251 -  
252 -{%- macro subconfigPanel(name) -%} 433 +{%- endmacro %} {%- macro subconfigPanel(name) -%}
253 <div id="{{ name }}-subconfiguration-options" 434 <div id="{{ name }}-subconfiguration-options"
254 class="subconfiguration-options col-sm-10"> 435 class="subconfiguration-options col-sm-10">
255 <div class="icon_container" name="hand-moviment" 436 <div class="icon_container" name="hand-moviment"
256 panel="{{ name }}-moviment" previous="{{ name }}-moviment" 437 panel="{{ name }}-moviment" previous="{{ name }}-moviment"
257 - next="{{ name }}-fingers-position"> 438 + next="{{ name }}-articulation">
258 <img src="{{ server }}/img/hand-moviment-icon.png" /> 439 <img src="{{ server }}/img/hand-moviment-icon.png" />
259 </div> 440 </div>
  441 + <div class="icon_container" name="hand-articulation"
  442 + panel="{{ name }}-articulation" previous="{{ name }}-moviment"
  443 + next="{{ name }}-fingers-position">
  444 + <img src="{{ server }}/img/hand-articulation-icon.png" />
  445 + </div>
260 <div class="icon_container" name="hand-fingers-position" 446 <div class="icon_container" name="hand-fingers-position"
261 - panel="{{ name }}-fingers-position" previous="{{ name }}-moviment" 447 + panel="{{ name }}-fingers-position" previous="{{ name }}-articulation"
262 next="{{ name }}-orientation"> 448 next="{{ name }}-orientation">
263 <img src="{{ server }}/img/hand-fingers-position-icon.png" /> 449 <img src="{{ server }}/img/hand-fingers-position-icon.png" />
264 </div> 450 </div>
view/img/hand-articulation-icon-check.png 0 → 100644
View file @bb7233b

1.63 KB
view/img/hand-articulation-icon-hover.png 0 → 100644
View file @bb7233b

981 Bytes
view/img/hand-articulation-icon.png 0 → 100644
View file @bb7233b

977 Bytes
view/img/mov/CALAR_old.gif
View file @d667903

567 KB
view/img/mov/PONTUAL.webm 0 → 100644
View file @bb7233b
No preview for this file type
view/img/pa/A-Seletor.png 0 → 100644
View file @bb7233b

253 Bytes
view/img/pa/default-base.png 0 → 100644
View file @bb7233b

443 Bytes
view/img/pa/gray-front-avatar.png 0 → 100644
View file @bb7233b

29.8 KB
view/img/pa/gray-side-avatar.png 0 → 100644
View file @bb7233b

14.6 KB
view/template.html
  Diff comments   View file @bb7233b
1 <link rel="stylesheet" href="{{ server }}/assets/css/main.css"> 1 <link rel="stylesheet" href="{{ server }}/assets/css/main.css">
2 2
3 -<script src="{{ server }}/assets/js/js.cookie.js"></script>  
4 -<script src="{{ server }}/assets/js/wikilibras.js"></script>  
5 -  
6 {% import 'hand-configuration.html' as handConfig with context %} {% 3 {% import 'hand-configuration.html' as handConfig with context %} {%
7 import 'facial-configuration.html' as facialConfig with context %} 4 import 'facial-configuration.html' as facialConfig with context %}
8 5
@@ -195,6 +192,11 @@ import &#39;facial-configuration.html&#39; as facialConfig with context %} @@ -195,6 +192,11 @@ import &#39;facial-configuration.html&#39; as facialConfig with context %}
195 </div> 192 </div>
196 </div> 193 </div>
197 </div> 194 </div>
  195 +
  196 +<script src="{{ server }}/assets/js/js.cookie.js"></script>
  197 +<script src="{{ server }}/assets/js/articulation.js"></script>
  198 +<script src="{{ server }}/assets/js/wikilibras.js"></script>
  199 +
198 <script type="text/javascript"> 200 <script type="text/javascript">
199 - wikilibras.run("{{ server }}", "{{ app_shortname }}", "{{ api_host }}"); 201 + wikilibras.run("{{ server }}", "{{ server_backend }}", "{{ app_shortname }}", "{{ api_host }}");
200 </script> 202 </script>
201 \ No newline at end of file 203 \ No newline at end of file
@@ -33,7 +33,7 @@ class Wikilibras: @@ -33,7 +33,7 @@ class Wikilibras:
33 33
34 def __update_project_info(self, project): 34 def __update_project_info(self, project):
35 template = self.env.get_template('template.html') 35 template = self.env.get_template('template.html')
36 - project.info['task_presenter'] = template.render(server=self.config['HOST_ENDPOINT'], app_shortname=self.config['PYBOSSA_APP_SHORT_NAME'], api_host=self.config['API_HOST']) 36 + 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'], api_host=self.config['API_HOST'])
37 project.info['thumbnail'] = self.config['HOST_ENDPOINT'] + "/img/thumbnail.png" 37 project.info['thumbnail'] = self.config['HOST_ENDPOINT'] + "/img/thumbnail.png"
38 project.info['sched'] = "incremental" 38 project.info['sched'] = "incremental"
39 project.allow_anonymous_contributors = False 39 project.allow_anonymous_contributors = False