Adicionado o movimento semicircular.

Adabriand Furtado
1 parent 3bab6ad9
Showing 50 changed files with 150 additions and 37 deletions Show diff stats
view/assets/css/main.css
view/assets/js/articulation.js
view/assets/js/configuration.js
view/assets/js/defaultConfigurationHandler.js
view/assets/js/dynamic-loading-engine.js
view/assets/js/dynamic-selection-workflow.js
view/assets/js/tmpJSONParser.js
view/assets/js/wikilibras.js
view/conf/selection-workflow-json
view/hand/movimento/passo-1.html
view/hand/plano/passo-1.html
view/hand/raio/passo-1.html
view/hand/sentido_inverso/passo-1.html
view/hand/velocidade/passo-1.html
view/img/circular/md/plano-direita-cima.webm
view/img/circular/md/plano-esquerda-cima.webm
view/img/circular/md/plano-tras-cima.webm
view/img/circular/md/plano-tras-esquerda.webm
view/img/circular/md/sentido-anti-horario.webm
view/img/circular/md/sentido-horario.webm
@@ -307,6 +307,7 @@ ul.rig li {
  
 ul.rig.columns-2 li {
 	width: 45%;
+	font-size: 17px;
 }
  
 ul.rig.columns-3 li {
@@ -467,6 +468,3 @@ ul.rig.columns-4 li {
 #completed-all-task-msg {
 	display: none;
 }
-
-
-
@@ -6,9 +6,14 @@
   function _updateASelector(container, ballSelector, step) {
 	var pointSelector = parseInt(step) == 2 ? "A" : "B";  
     $(container + ' .ball-selector.active').each(function() {
-      $(this).removeClass('active'), $(this).find('.point-selector').remove();
-    }), ballSelector.addClass('active'), ballSelector.append('<div class="point-selector"><img src="' + server_host +
-    '/img/pa/' + pointSelector + '-Seletor.png" class="point-selector" alt=""></div>');
+    	$(this).removeClass('active');
+    	$(this).find('.point-selector').remove();
+    }); 
+    ballSelector.addClass('active'); 
+    ballSelector.append('<div class="point-selector"><img src="' + server_host + '/img/pa/'
+    		+ pointSelector + '-Seletor.png" class="point-selector" alt=""></div>');
+    $(container + ' .selection-panel-option[select=true]').attr('select', false);
+    $(ballSelector).attr('select', true);
   }
  
   function _getSelectedY(hand, subConfig, step) {
@@ -21,6 +21,9 @@
  
 	var finger_group = $(stepOneBaseId + ' .selection-panel-option[select=true]').attr('value');
 	finger_group = typeof finger_group == 'undefined' ? '0' : finger_group;
+	
+	// clean next step
+    dynworkflow.cleanStep(hand, subConfig, nextStep);
 	$(stepTwoBaseId + ' .finger-group').hide();
 	$(stepTwoBaseId + ' .finger-group[group=' + finger_group + ']').show();
   }
@@ -9,5 +9,19 @@
           dynworkflow.userSelectedAnOption();
         });
   };
+  
+  function _startVideoLoop(hand, subConfig, step, timeBetweenLoops) {
+	setTimeout(function(){
+	    $('.selection-panel-body[mainConfig=' + hand + '][subConfig=' +
+	    		subConfig + '][step=' + step + '] video').each(function(){
+	        $(this).get(0).play();
+	    });
+	    _startVideoLoop(hand, subConfig, step, timeBetweenLoops);
+	}, timeBetweenLoops);
+  }
+  
+  defaultConfigurationHandler.startVideoLoop = function(hand, subConfig, step, timeBetweenLoops) {
+	  _startVideoLoop(hand, subConfig, step, timeBetweenLoops);
+  }
  
 }(window.defaultConfigurationHandler = window.defaultConfigurationHandler || {}, jQuery));
@@ -34,6 +34,14 @@
         }
     }
  
+    var replaceMovementNameTag = function(data, mainConfig) {
+    	var selectedMovement = movement.getPreviousSelectedMovement(mainConfig);
+    	if (typeof selectedMovement != "undefined") {
+    		return data.replace(/{{ movement-name }}/g, selectedMovement);
+    	} 
+    	return data
+    }
+    
     if (matchSubConfig) { // case defined
       // There is no specific(right or left hand dependent) assets for: articulacao, duracao, expressao, movimento, transicao
       // Specific configurations: configuracao, orientacao
@@ -59,6 +67,7 @@
       }
     }
     goodData = replaceHandFolderTag(goodData, currentMainConfig);
+    goodData = replaceMovementNameTag(goodData, currentMainConfig);
     goodData = goodData.replace(/{{ hand }}/g, currentMainConfig);
     return goodData.replace(/{{ server }}/g, url);
   };
@@ -66,7 +75,6 @@
   dynengine.render = function(serverUrl, templatePath, target, prepend, callback) {
     var url = serverUrl + templatePath;
     $.get(url, function(data) {
-      // TODO replace or append boolean
       console.log('got: ' + url);
  
       var processedHtml = _preprocessHtml(data, serverUrl);
@@ -103,6 +103,8 @@
   function _selectSubConfig(subConfig) {
     if (subConfig == 'movimento') {
     	_updateAndGetMovementConfig();
+    } else if (currentSubConfigName == 'movimento') {
+    	_updateAndGetFirstMovementSubConfig();
     }
     currentSubConfigName = subConfig;
     currentSubconfig = currentSubconfigParent[currentSubConfigName];
@@ -133,14 +135,30 @@
       }
     }
   }
+  
+  function _checkIfFinished(mainConfig, currentSubConfigName) {
+	  var numberOfSteps = currentSubconfig.length;
+	  var completedSteps = $('.selection-panel-body[mainConfig=' + mainConfig + 
+			  '][subConfig=' + currentSubConfigName + '] .selection-panel-option[select=true]').length;
+	  return completedSteps != 0 && completedSteps == numberOfSteps;
+  }
  
   // A callback function to be called when the user selects a option on a panel
   function _userSelectedAnOption() {
-    if (currentStep == currentSubconfig.length - 1) {
+    if (_checkIfFinished(mainConfig, currentSubConfigName)) {
       _setupCheckIcon(mainConfig, currentSubConfigName);
     }
     _showNextSubConfig();
   }
+  
+  function _cleanStep(mainConfig, subConfig, step) {
+	var baseId = '.selection-panel-body[mainConfig=' + mainConfig + '][subConfig=' +
+	subConfig + '][step=' + step + ']';
+	$(baseId + ' .selection-panel-option').removeAttr('select');
+	var icon_id = '.subconfiguration-panel[mainConfig=' + mainConfig +
+		'] .icon_container[json_name=' + subConfig + ']';
+	$(icon_id).removeAttr('complete');
+  } 
  
   // Timeline functions
   function _selectTimelineIcon(mainConfig, subConfig) {
@@ -251,6 +269,20 @@
     }
   };
  
+  function _cleanPreviousLoadedPanel() {
+	  $('.selection-panel-body[mainConfig=' + mainConfig + ']').each(function() {
+		  var subConfigName = $(this).attr("subConfig");
+		  if (subConfigName.indexOf("articulacao") != -1 ||
+				  subConfigName.indexOf("configuracao") != -1  ||
+				  	subConfigName.indexOf("orientacao") != -1 ||
+				  		subConfigName.indexOf("movimento") != -1) {
+			  return;
+		  }
+		  $('.selection-panel-body[mainConfig=' + mainConfig + '][subConfig=' +
+				  subConfigName + ']').remove();
+	  });
+  }
+  
   dynworkflow.selectMovement = function(movement) {
     var subconfigJSON = currentSubconfig[movement];
     currentSubConfigName = _getFirstKey(subconfigJSON);
@@ -258,6 +290,7 @@
     currentSubconfig = subconfigJSON[currentSubConfigName];
     currentStep = 0;
  
+    _cleanPreviousLoadedPanel();
     _showCurrentSubconfig();
     _setupTimeline(true);
   };
@@ -269,7 +302,11 @@
   dynworkflow.userSelectedAnOption = function() {
     _userSelectedAnOption();
   };
-
+  
+  dynworkflow.cleanStep = function(mainConfig, subConfig, step) {
+	  _cleanStep(mainConfig, subConfig, step);
+  };
+  
   dynworkflow.getFacialParameters = function() {
     return _getAttributes(jsonWF['facial']);
   };
@@ -24,9 +24,9 @@
   }
  
   function _parseParameterValue(value) {
-	if (typeof value == "string" && value.toLowerCase() == 'true') {
+	if (typeof value == 'string' && value.toLowerCase() == 'true') {
 		return true;
-	} else if (typeof value == "string" && value.toLowerCase() == 'false') {
+	} else if (typeof value == 'string' && value.toLowerCase() == 'false') {
 		return false;
 	} else {
 		return !isNaN(value) ? parseInt(value) : value;
@@ -102,7 +102,20 @@
   function _circularMovementParser(tmpJSON, movementName, hand) {
 	  var parsedHand = _parseHand(hand);
 	  _defaultMovementParser(tmpJSON, movementName, hand);
-	  movement_parameter_json[parsedHand][movementName]['lado_oposto'] = false;
+	  var movPlane = movement_parameter_json[parsedHand][movementName]['plano'];
+	  if (movPlane.indexOf('direita') != -1 || movPlane.indexOf('tras') != -1) {
+		  movPlane = movPlane.replace('direita', 'esquerda');
+		  movPlane = movPlane.replace('tras', 'frente');
+		  movement_parameter_json[parsedHand][movementName]['plano'] = movPlane;
+		  movement_parameter_json[parsedHand][movementName]['lado_oposto'] = true;
+	  } else {
+		  movement_parameter_json[parsedHand][movementName]['lado_oposto'] = false;
+	  }
+	  
+	  if (movPlane == 'frente-cima' || movPlane == 'tras-cima') {
+		  movement_parameter_json[parsedHand][movementName]['sentido_inverso'] =
+			  !movement_parameter_json[parsedHand][movementName]['sentido_inverso'];
+	  }
   }
  
   function _parseTempMovementParameterJSON(tmpJSON, hand) {
@@ -115,7 +128,8 @@
  
     if (movementName == 'retilineo') {
     	_retilinearMovementParser(tmpJSON, movementName, hand);
-    } else if (movementName == 'circular') {
+    } else if (movementName == 'circular' ||
+    				movementName == 'semicircular') {
     	_circularMovementParser(tmpJSON, movementName, hand);
     } else {
     	_defaultMovementParser(tmpJSON, movementName, hand);
@@ -256,14 +256,12 @@
  
   function _updateTempParameterJSON(mainConfig, subConfig, step, value) {
     var subConfigJSON = tmpParameterJSON[mainConfig][subConfig];
-
     if (typeof subConfigJSON == 'undefined') {
       tmpParameterJSON[mainConfig][subConfig] = [];
       subConfigJSON = tmpParameterJSON[mainConfig][subConfig];
     }
-
+    
     subConfigJSON[parseInt(step) - 1] = value;
-    //console.log(tmpParameterJSON);
   }
  
   function _selectAnOption(parentId, el) {
@@ -11,6 +11,11 @@
 				"configuracao" : ["passo-1", "passo-2"],
 				"orientacao" : ["passo-1"]
 			},
+			"retilineo" : {
+				"articulacao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
+				"configuracao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
+				"orientacao-retilineo": ["passo-1", "passo-2"]
+			},
 			"circular" : {
 				"articulacao" : ["passo-1", "passo-2"],
 				"configuracao" : ["passo-1", "passo-2"],
@@ -20,10 +25,14 @@
 				"velocidade" : ["passo-1"],
 				"sentido_inverso" : ["passo-1"]
 			},
-			"retilineo" : {
-				"articulacao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
-				"configuracao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
-				"orientacao-retilineo": ["passo-1", "passo-2"]
+			"semicircular" : {
+				"articulacao" : ["passo-1", "passo-2"],
+				"configuracao" : ["passo-1", "passo-2"],
+				"orientacao" : ["passo-1"],
+				"plano": ["passo-1"],
+				"raio" : ["passo-1"],
+				"velocidade" : ["passo-1"],
+				"sentido_inverso" : ["passo-1"]
 			}
 		}
 	}
@@ -20,6 +20,11 @@
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video> Circular</li>
+			<li><video src="{{ server }}/img/mov/CIRCULAR.webm"
+					preload="metadata" value="semicircular"
+					class="box-panel-option selection-panel-option" autoplay loop>
+					<source type="video/webm">
+				</video> Semi-Circular</li>
 			<!--
       <li><img class="box-panel-option selection-panel-option"
         src="{{ server }}/img/exf/0000.png" value="semicircular"/>Semi-Circular</li>
@@ -5,24 +5,46 @@
 	</div>
 	<div class="selection-panel-inner-body">
 		<ul class="rig columns-2">
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/plano-esquerda-cima.webm"
-					preload="metadata" value="esquerda-cima"
-					class="box-panel-option selection-panel-option" autoplay loop>
+			<li><video
+					src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/plano-esquerda-cima.webm"
+					preload="metadata" value="direita-cima"
+					class="box-panel-option selection-panel-option" autoplay>
 					<source type="video/webm">
 				</video>Esquerda - Cima</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/plano-frente-esquerda.webm"
+			<li><video
+					src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/plano-direita-cima.webm"
+					preload="metadata" value="esquerda-cima"
+					class="box-panel-option selection-panel-option" autoplay>
+					<source type="video/webm">
+				</video>Direita - Cima</li>
+			<li><video
+					src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/plano-frente-esquerda.webm"
 					preload="metadata" value="frente-esquerda"
-					class="box-panel-option selection-panel-option" autoplay loop>
+					class="box-panel-option selection-panel-option" autoplay>
 					<source type="video/webm">
 				</video>Frente - Esquerda</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/plano-frente-cima.webm"
+			<li><video
+					src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/plano-tras-esquerda.webm"
+					preload="metadata" value="tras-esquerda"
+					class="box-panel-option selection-panel-option" autoplay>
+					<source type="video/webm">
+				</video>Trás - Esquerda</li>
+			<li><video
+					src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/plano-frente-cima.webm"
 					preload="metadata" value="frente-cima"
-					class="box-panel-option selection-panel-option" autoplay loop>
+					class="box-panel-option selection-panel-option" autoplay>
 					<source type="video/webm">
 				</video>Frente - Cima</li>
+			<li><video
+					src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/plano-tras-cima.webm"
+					preload="metadata" value="tras-cima"
+					class="box-panel-option selection-panel-option" autoplay>
+					<source type="video/webm">
+				</video>Trás - Cima</li>
 		</ul>
 	</div>
 </div>
 <script type="text/javascript">
 	defaultConfigurationHandler.setup("{{ hand }}", "plano", "1");
+	defaultConfigurationHandler.startVideoLoop("{{ hand }}", "plano", "1", 2500);
 </script>
@@ -5,17 +5,17 @@
 	</div>
 	<div class="selection-panel-inner-body">
 		<ul class="rig columns-2">
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/raio-pequeno.webm"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/raio-pequeno.webm"
 					preload="metadata" value="pequeno"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video>Pequeno</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/raio-normal.webm"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/raio-normal.webm"
 					preload="metadata" value="normal"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video>Médio</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/raio-grande.webm"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/raio-grande.webm"
 					preload="metadata" value="grande"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
@@ -5,13 +5,13 @@
 	</div>
 	<div class="selection-panel-inner-body">
 		<ul class="rig columns-2">
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/sentido-horario.webm"
-					preload="metadata" value="false"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/sentido-horario.webm"
+					preload="metadata" value="true"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video>Horário</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/sentido-anti-horario.webm"
-					preload="metadata" value="true"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/sentido-anti-horario.webm"
+					preload="metadata" value="false"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video>Anti-horário</li>
@@ -5,17 +5,17 @@
 	</div>
 	<div class="selection-panel-inner-body">
 		<ul class="rig columns-2">
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/velocidade-lento.webm"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/velocidade-lento.webm"
 					preload="metadata" value="lento"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video>Lento</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/velocidade-normal.webm"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/velocidade-normal.webm"
 					preload="metadata" value="normal"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
 				</video>Normal</li>
-			<li><video src="{{ server }}/img/circular/{{ hand-folder }}/velocidade-rapido.webm"
+			<li><video src="{{ server }}/img/{{ movement-name }}/{{ hand-folder }}/velocidade-rapido.webm"
 					preload="metadata" value="rapido"
 					class="box-panel-option selection-panel-option" autoplay loop>
 					<source type="video/webm">
...	...	@@ -307,6 +307,7 @@ ul.rig li {
307	307
308	308	ul.rig.columns-2 li {
309	309	width: 45%;
	310	+ font-size: 17px;
310	311	}
311	312
312	313	ul.rig.columns-3 li {
...	...	@@ -467,6 +468,3 @@ ul.rig.columns-4 li {
467	468	#completed-all-task-msg {
468	469	display: none;
469	470	}
470		-
471		-
472		-
...	...
...	...	@@ -6,9 +6,14 @@
6	6	function _updateASelector(container, ballSelector, step) {
7	7	var pointSelector = parseInt(step) == 2 ? "A" : "B";
8	8	$(container + ' .ball-selector.active').each(function() {
9		- $(this).removeClass('active'), $(this).find('.point-selector').remove();
10		- }), ballSelector.addClass('active'), ballSelector.append('<div class="point-selector"><img src="' + server_host +
11		- '/img/pa/' + pointSelector + '-Seletor.png" class="point-selector" alt=""></div>');
	9	+ $(this).removeClass('active');
	10	+ $(this).find('.point-selector').remove();
	11	+ });
	12	+ ballSelector.addClass('active');
	13	+ ballSelector.append('<div class="point-selector"><img src="' + server_host + '/img/pa/'
	14	+ + pointSelector + '-Seletor.png" class="point-selector" alt=""></div>');
	15	+ $(container + ' .selection-panel-option[select=true]').attr('select', false);
	16	+ $(ballSelector).attr('select', true);
12	17	}
13	18
14	19	function _getSelectedY(hand, subConfig, step) {
...	...
...	...	@@ -21,6 +21,9 @@
21	21
22	22	var finger_group = $(stepOneBaseId + ' .selection-panel-option[select=true]').attr('value');
23	23	finger_group = typeof finger_group == 'undefined' ? '0' : finger_group;
	24	+
	25	+ // clean next step
	26	+ dynworkflow.cleanStep(hand, subConfig, nextStep);
24	27	$(stepTwoBaseId + ' .finger-group').hide();
25	28	$(stepTwoBaseId + ' .finger-group[group=' + finger_group + ']').show();
26	29	}
...	...
...	...	@@ -9,5 +9,19 @@
9	9	dynworkflow.userSelectedAnOption();
10	10	});
11	11	};
	12	+
	13	+ function _startVideoLoop(hand, subConfig, step, timeBetweenLoops) {
	14	+ setTimeout(function(){
	15	+ $('.selection-panel-body[mainConfig=' + hand + '][subConfig=' +
	16	+ subConfig + '][step=' + step + '] video').each(function(){
	17	+ $(this).get(0).play();
	18	+ });
	19	+ _startVideoLoop(hand, subConfig, step, timeBetweenLoops);
	20	+ }, timeBetweenLoops);
	21	+ }
	22	+
	23	+ defaultConfigurationHandler.startVideoLoop = function(hand, subConfig, step, timeBetweenLoops) {
	24	+ _startVideoLoop(hand, subConfig, step, timeBetweenLoops);
	25	+ }
12	26
13	27	}(window.defaultConfigurationHandler = window.defaultConfigurationHandler \|\| {}, jQuery));
...	...
...	...	@@ -34,6 +34,14 @@
34	34	}
35	35	}
36	36
	37	+ var replaceMovementNameTag = function(data, mainConfig) {
	38	+ var selectedMovement = movement.getPreviousSelectedMovement(mainConfig);
	39	+ if (typeof selectedMovement != "undefined") {
	40	+ return data.replace(/{{ movement-name }}/g, selectedMovement);
	41	+ }
	42	+ return data
	43	+ }
	44	+
37	45	if (matchSubConfig) { // case defined
38	46	// There is no specific(right or left hand dependent) assets for: articulacao, duracao, expressao, movimento, transicao
39	47	// Specific configurations: configuracao, orientacao
...	...	@@ -59,6 +67,7 @@
59	67	}
60	68	}
61	69	goodData = replaceHandFolderTag(goodData, currentMainConfig);
	70	+ goodData = replaceMovementNameTag(goodData, currentMainConfig);
62	71	goodData = goodData.replace(/{{ hand }}/g, currentMainConfig);
63	72	return goodData.replace(/{{ server }}/g, url);
64	73	};
...	...	@@ -66,7 +75,6 @@
66	75	dynengine.render = function(serverUrl, templatePath, target, prepend, callback) {
67	76	var url = serverUrl + templatePath;
68	77	$.get(url, function(data) {
69		- // TODO replace or append boolean
70	78	console.log('got: ' + url);
71	79
72	80	var processedHtml = _preprocessHtml(data, serverUrl);
...	...
...	...	@@ -103,6 +103,8 @@
103	103	function _selectSubConfig(subConfig) {
104	104	if (subConfig == 'movimento') {
105	105	_updateAndGetMovementConfig();
	106	+ } else if (currentSubConfigName == 'movimento') {
	107	+ _updateAndGetFirstMovementSubConfig();
106	108	}
107	109	currentSubConfigName = subConfig;
108	110	currentSubconfig = currentSubconfigParent[currentSubConfigName];
...	...	@@ -133,14 +135,30 @@
133	135	}
134	136	}
135	137	}
	138	+
	139	+ function _checkIfFinished(mainConfig, currentSubConfigName) {
	140	+ var numberOfSteps = currentSubconfig.length;
	141	+ var completedSteps = $('.selection-panel-body[mainConfig=' + mainConfig +
	142	+ '][subConfig=' + currentSubConfigName + '] .selection-panel-option[select=true]').length;
	143	+ return completedSteps != 0 && completedSteps == numberOfSteps;
	144	+ }
136	145
137	146	// A callback function to be called when the user selects a option on a panel
138	147	function _userSelectedAnOption() {
139		- if (currentStep == currentSubconfig.length - 1) {
	148	+ if (_checkIfFinished(mainConfig, currentSubConfigName)) {
140	149	_setupCheckIcon(mainConfig, currentSubConfigName);
141	150	}
142	151	_showNextSubConfig();
143	152	}
	153	+
	154	+ function _cleanStep(mainConfig, subConfig, step) {
	155	+ var baseId = '.selection-panel-body[mainConfig=' + mainConfig + '][subConfig=' +
	156	+ subConfig + '][step=' + step + ']';
	157	+ $(baseId + ' .selection-panel-option').removeAttr('select');
	158	+ var icon_id = '.subconfiguration-panel[mainConfig=' + mainConfig +
	159	+ '] .icon_container[json_name=' + subConfig + ']';
	160	+ $(icon_id).removeAttr('complete');
	161	+ }
144	162
145	163	// Timeline functions
146	164	function _selectTimelineIcon(mainConfig, subConfig) {
...	...	@@ -251,6 +269,20 @@
251	269	}
252	270	};
253	271
	272	+ function _cleanPreviousLoadedPanel() {
	273	+ $('.selection-panel-body[mainConfig=' + mainConfig + ']').each(function() {
	274	+ var subConfigName = $(this).attr("subConfig");
	275	+ if (subConfigName.indexOf("articulacao") != -1 \|\|
	276	+ subConfigName.indexOf("configuracao") != -1 \|\|
	277	+ subConfigName.indexOf("orientacao") != -1 \|\|
	278	+ subConfigName.indexOf("movimento") != -1) {
	279	+ return;
	280	+ }
	281	+ $('.selection-panel-body[mainConfig=' + mainConfig + '][subConfig=' +
	282	+ subConfigName + ']').remove();
	283	+ });
	284	+ }
	285	+
254	286	dynworkflow.selectMovement = function(movement) {
255	287	var subconfigJSON = currentSubconfig[movement];
256	288	currentSubConfigName = _getFirstKey(subconfigJSON);
...	...	@@ -258,6 +290,7 @@
258	290	currentSubconfig = subconfigJSON[currentSubConfigName];
259	291	currentStep = 0;
260	292
	293	+ _cleanPreviousLoadedPanel();
261	294	_showCurrentSubconfig();
262	295	_setupTimeline(true);
263	296	};
...	...	@@ -269,7 +302,11 @@
269	302	dynworkflow.userSelectedAnOption = function() {
270	303	_userSelectedAnOption();
271	304	};
272		-
	305	+
	306	+ dynworkflow.cleanStep = function(mainConfig, subConfig, step) {
	307	+ _cleanStep(mainConfig, subConfig, step);
	308	+ };
	309	+
273	310	dynworkflow.getFacialParameters = function() {
274	311	return _getAttributes(jsonWF['facial']);
275	312	};
...	...
...	...	@@ -24,9 +24,9 @@
24	24	}
25	25
26	26	function _parseParameterValue(value) {
27		- if (typeof value == "string" && value.toLowerCase() == 'true') {
	27	+ if (typeof value == 'string' && value.toLowerCase() == 'true') {
28	28	return true;
29		- } else if (typeof value == "string" && value.toLowerCase() == 'false') {
	29	+ } else if (typeof value == 'string' && value.toLowerCase() == 'false') {
30	30	return false;
31	31	} else {
32	32	return !isNaN(value) ? parseInt(value) : value;
...	...	@@ -102,7 +102,20 @@
102	102	function _circularMovementParser(tmpJSON, movementName, hand) {
103	103	var parsedHand = _parseHand(hand);
104	104	_defaultMovementParser(tmpJSON, movementName, hand);
105		- movement_parameter_json[parsedHand][movementName]['lado_oposto'] = false;
	105	+ var movPlane = movement_parameter_json[parsedHand][movementName]['plano'];
	106	+ if (movPlane.indexOf('direita') != -1 \|\| movPlane.indexOf('tras') != -1) {
	107	+ movPlane = movPlane.replace('direita', 'esquerda');
	108	+ movPlane = movPlane.replace('tras', 'frente');
	109	+ movement_parameter_json[parsedHand][movementName]['plano'] = movPlane;
	110	+ movement_parameter_json[parsedHand][movementName]['lado_oposto'] = true;
	111	+ } else {
	112	+ movement_parameter_json[parsedHand][movementName]['lado_oposto'] = false;
	113	+ }
	114	+
	115	+ if (movPlane == 'frente-cima' \|\| movPlane == 'tras-cima') {
	116	+ movement_parameter_json[parsedHand][movementName]['sentido_inverso'] =
	117	+ !movement_parameter_json[parsedHand][movementName]['sentido_inverso'];
	118	+ }
106	119	}
107	120
108	121	function _parseTempMovementParameterJSON(tmpJSON, hand) {
...	...	@@ -115,7 +128,8 @@
115	128
116	129	if (movementName == 'retilineo') {
117	130	_retilinearMovementParser(tmpJSON, movementName, hand);
118		- } else if (movementName == 'circular') {
	131	+ } else if (movementName == 'circular' \|\|
	132	+ movementName == 'semicircular') {
119	133	_circularMovementParser(tmpJSON, movementName, hand);
120	134	} else {
121	135	_defaultMovementParser(tmpJSON, movementName, hand);
...	...
...	...	@@ -256,14 +256,12 @@
256	256
257	257	function _updateTempParameterJSON(mainConfig, subConfig, step, value) {
258	258	var subConfigJSON = tmpParameterJSON[mainConfig][subConfig];
259		-
260	259	if (typeof subConfigJSON == 'undefined') {
261	260	tmpParameterJSON[mainConfig][subConfig] = [];
262	261	subConfigJSON = tmpParameterJSON[mainConfig][subConfig];
263	262	}
264		-
	263	+
265	264	subConfigJSON[parseInt(step) - 1] = value;
266		- //console.log(tmpParameterJSON);
267	265	}
268	266
269	267	function _selectAnOption(parentId, el) {
...	...
...	...	@@ -11,6 +11,11 @@
11	11	"configuracao" : ["passo-1", "passo-2"],
12	12	"orientacao" : ["passo-1"]
13	13	},
	14	+ "retilineo" : {
	15	+ "articulacao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
	16	+ "configuracao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
	17	+ "orientacao-retilineo": ["passo-1", "passo-2"]
	18	+ },
14	19	"circular" : {
15	20	"articulacao" : ["passo-1", "passo-2"],
16	21	"configuracao" : ["passo-1", "passo-2"],
...	...	@@ -20,10 +25,14 @@
20	25	"velocidade" : ["passo-1"],
21	26	"sentido_inverso" : ["passo-1"]
22	27	},
23		- "retilineo" : {
24		- "articulacao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
25		- "configuracao-retilineo": ["passo-1", "passo-2", "passo-3", "passo-4"],
26		- "orientacao-retilineo": ["passo-1", "passo-2"]
	28	+ "semicircular" : {
	29	+ "articulacao" : ["passo-1", "passo-2"],
	30	+ "configuracao" : ["passo-1", "passo-2"],
	31	+ "orientacao" : ["passo-1"],
	32	+ "plano": ["passo-1"],
	33	+ "raio" : ["passo-1"],
	34	+ "velocidade" : ["passo-1"],
	35	+ "sentido_inverso" : ["passo-1"]
27	36	}
28	37	}
29	38	}
...	...
...	...	@@ -20,6 +20,11 @@
20	20	class="box-panel-option selection-panel-option" autoplay loop>
21	21	<source type="video/webm">
22	22	</video> Circular</li>
	23	+ <li><video src="{{ server }}/img/mov/CIRCULAR.webm"
	24	+ preload="metadata" value="semicircular"
	25	+ class="box-panel-option selection-panel-option" autoplay loop>
	26	+ <source type="video/webm">
	27	+ </video> Semi-Circular</li>
23	28	<!--
24	29	<li><img class="box-panel-option selection-panel-option"
25	30	src="{{ server }}/img/exf/0000.png" value="semicircular"/>Semi-Circular</li>
...	...