From 5334472663d585fdae1e9e4177c86e5a6ac8016b Mon Sep 17 00:00:00 2001 From: Cassio Cabral Date: Thu, 11 Feb 2016 15:16:24 -0300 Subject: [PATCH] log when dynflow is loaded and changed tabs to spaces --- view/assets/js/dynamic-loading-engine.js | 6 +++--- view/assets/js/dynamic-selection-workflow.js | 465 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- view/assets/js/wikilibras.js | 847 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- 3 files changed, 660 insertions(+), 658 deletions(-) diff --git a/view/assets/js/dynamic-loading-engine.js b/view/assets/js/dynamic-loading-engine.js index e092389..0a9aaaf 100644 --- a/view/assets/js/dynamic-loading-engine.js +++ b/view/assets/js/dynamic-loading-engine.js @@ -10,12 +10,12 @@ $.get(url, function(data) { // TODO replace or append boolean console.log('got: ' + url); - + var processedHtml = _preprocessHtml(data, serverUrl); if (prepend) { - $(target).prepend(processedHtml); + $(target).prepend(processedHtml); } else { - $(target).append(processedHtml); + $(target).append(processedHtml); } }) .done(function() { diff --git a/view/assets/js/dynamic-selection-workflow.js b/view/assets/js/dynamic-selection-workflow.js index 168e3ad..4a73c9c 100644 --- a/view/assets/js/dynamic-selection-workflow.js +++ b/view/assets/js/dynamic-selection-workflow.js @@ -1,280 +1,281 @@ (function(dynworkflow, $, undefined) { - // Workflow configuration - var jsonWF = {}; - var baseUrl = ""; - + // Workflow configuration + var jsonWF = {}; + var baseUrl = ''; + // Main configurations: right-hand, left-hand and facial - var mainConfig = ""; - // The converted Main Config (right/left-hand) to hand for using the same configuration - var preprocessedMainConfig = ""; - // Subconfigurations: movimento, articulacao, configuracao, orientacao, etc - var currentSubconfig = ""; - var currentSubConfigName = ""; - var currentSubconfigParent = ""; - var currentStep = 0; - + var mainConfig = ''; + // The converted Main Config (right/left-hand) to hand for using the same configuration + var preprocessedMainConfig = ''; + // Subconfigurations: movimento, articulacao, configuracao, orientacao, etc + var currentSubconfig = ''; + var currentSubConfigName = ''; + var currentSubconfigParent = ''; + var currentStep = 0; + function _preprocessMainConfig(config) { - config = config.replace("right-hand", "hand"); - config = config.replace("left-hand", "hand"); - return config; - } - + config = config.replace('right-hand', 'hand'); + config = config.replace('left-hand', 'hand'); + return config; + } + function _getFirstKey(json) { - var first_key = undefined; - for (first_key in json) break; - return first_key; - } - + var first_key = undefined; + for (first_key in json) break; + return first_key; + } + function _getAttributes(json) { - var result = []; - for (attr in json) { - result.push(attr); - } - return result; - } - + var result = []; + for (attr in json) { + result.push(attr); + } + return result; + } + function _updateAndGetFirstMovementSubConfig() { - var selectedMovement = movement.getPreviousSelectedMovement(mainConfig); - if (typeof selectedMovement == "undefined") return -1; - + var selectedMovement = movement.getPreviousSelectedMovement(mainConfig); + if (typeof selectedMovement == "undefined") return -1; + currentSubconfigParent = jsonWF[preprocessedMainConfig]["movimento"][selectedMovement]; - currentSubConfigName = _getFirstKey(currentSubconfigParent); - return currentSubConfigName; - } - + currentSubConfigName = _getFirstKey(currentSubconfigParent); + return currentSubConfigName; + } + function _updateAndGetMovementConfig() { - currentSubconfigParent = jsonWF[preprocessedMainConfig]; - currentSubConfigName = _getFirstKey(currentSubconfigParent); - return currentSubConfigName; - } - + currentSubconfigParent = jsonWF[preprocessedMainConfig]; + currentSubConfigName = _getFirstKey(currentSubconfigParent); + return currentSubConfigName; + } + function _getNextSubConfig(toForward) { - var attrs = _getAttributes(currentSubconfigParent); - for (var i = 0; i < attrs.length; i++) { - if (toForward && attrs[i] == currentSubConfigName && i < attrs.length - 1) { - return attrs[i+1]; - } else if (!toForward && attrs[i] == currentSubConfigName && i >= 1) { - return attrs[i-1]; - } - } - if (toForward && currentSubConfigName == "movimento") { - return _updateAndGetFirstMovementSubConfig(); - } else if (!toForward && preprocessedMainConfig == "hand") { - return _updateAndGetMovementConfig(); - } else if (!toForward) { - return currentSubConfigName; - } else { - return -1; - } - } - + var attrs = _getAttributes(currentSubconfigParent); + for (var i = 0; i < attrs.length; i++) { + if (toForward && attrs[i] == currentSubConfigName && i < attrs.length - 1) { + return attrs[i + 1]; + } else if (!toForward && attrs[i] == currentSubConfigName && i >= 1) { + return attrs[i - 1]; + } + } + if (toForward && currentSubConfigName == "movimento") { + return _updateAndGetFirstMovementSubConfig(); + } else if (!toForward && preprocessedMainConfig == "hand") { + return _updateAndGetMovementConfig(); + } else if (!toForward) { + return currentSubConfigName; + } else { + return -1; + } + } + function _showCurrentSubconfig() { - _showSubconfiguration(mainConfig, currentSubConfigName, currentStep); - } - + _showSubconfiguration(mainConfig, currentSubConfigName, currentStep); + } + // It checks if a selection panel is already loaded - function _isSubconfigurationPanelLoaded(mainConfig, subConfig, stepNumber) { - var stepNumber = stepNumber + 1; - return $(".selection-panel-body[mainConfig=" + mainConfig + "][subConfig=" + subConfig + - "][step=" + stepNumber + "]").length > 0; - } - + function _isSubconfigurationPanelLoaded(mainConfig, subConfig, stepNumber) { + var stepNumber = stepNumber + 1; + return $(".selection-panel-body[mainConfig=" + mainConfig + "][subConfig=" + subConfig + + "][step=" + stepNumber + "]").length > 0; + } + function _showLoadedSubconfigurationPanel(mainConfig, subConfig, stepNumber) { - var stepNumber = stepNumber + 1; - return $(".selection-panel-body[mainConfig=" + mainConfig + "][subConfig=" + subConfig + - "][step=" + stepNumber + "]").show(); - } - + var stepNumber = stepNumber + 1; + return $(".selection-panel-body[mainConfig=" + mainConfig + "][subConfig=" + subConfig + + "][step=" + stepNumber + "]").show(); + } + // It renders or shows the requested selection panel - function _showSubconfiguration(mainConfig, subConfig, stepNumber) { - $(".selection-panel-body").hide(); - if (_isSubconfigurationPanelLoaded(mainConfig, subConfig, stepNumber)) { - _showLoadedSubconfigurationPanel(mainConfig, subConfig, stepNumber); - } else { - var step = currentSubconfig[stepNumber]; - step = typeof step == "undefined" ? "passo-1" : step; - dynengine.render(baseUrl, "/" + preprocessedMainConfig + "/" + subConfig + - "/" + step + ".html", "#selection-panel", true); - } - _selectTimelineIcon(mainConfig, subConfig, true); - } - + function _showSubconfiguration(mainConfig, subConfig, stepNumber) { + $(".selection-panel-body").hide(); + if (_isSubconfigurationPanelLoaded(mainConfig, subConfig, stepNumber)) { + _showLoadedSubconfigurationPanel(mainConfig, subConfig, stepNumber); + } else { + var step = currentSubconfig[stepNumber]; + step = typeof step == "undefined" ? "passo-1" : step; + dynengine.render(baseUrl, "/" + preprocessedMainConfig + "/" + subConfig + + "/" + step + ".html", "#selection-panel", true); + } + _selectTimelineIcon(mainConfig, subConfig, true); + } + function _selectSubConfig(subConfig) { - if (currentSubConfigName == "movimento") { - _updateAndGetFirstMovementSubConfig(); - } - currentSubConfigName = subConfig; - currentSubconfig = currentSubconfigParent[currentSubConfigName]; - currentStep = 0; - _showCurrentSubconfig(); - } - + if (currentSubConfigName == "movimento") { + _updateAndGetFirstMovementSubConfig(); + } + currentSubConfigName = subConfig; + currentSubconfig = currentSubconfigParent[currentSubConfigName]; + currentStep = 0; + _showCurrentSubconfig(); + } + // It shows the next selection panel on the workflow - function _showNextSubConfig() { - _walkOnTheWorklow(true); - } - + function _showNextSubConfig() { + _walkOnTheWorklow(true); + } + function _showPreviousSubConfig() { - _walkOnTheWorklow(false); - } - + _walkOnTheWorklow(false); + } + function _walkOnTheWorklow(toForward) { - currentStep = toForward? currentStep + 1 : currentStep - 1; - + currentStep = toForward ? currentStep + 1 : currentStep - 1; + if (currentStep >= 0 && currentStep < currentSubconfig.length) { - _showCurrentSubconfig(); - } else { - var nextSubConfig = _getNextSubConfig(toForward); - if (nextSubConfig != -1) { - dynworkflow.selectSubConfig(nextSubConfig); - } else { - wikilibras.hideSelectionPanel(); - } - } - } - + _showCurrentSubconfig(); + } else { + var nextSubConfig = _getNextSubConfig(toForward); + if (nextSubConfig != -1) { + dynworkflow.selectSubConfig(nextSubConfig); + } else { + wikilibras.hideSelectionPanel(); + } + } + } + // A callback function to be called when the user selects a option on a panel - function _userSelectedAnOption() { - if (currentStep == currentSubconfig.length - 1) { - _setupCheckIcon(mainConfig, currentSubConfigName); - } - _showNextSubConfig(); + function _userSelectedAnOption() { + if (currentStep == currentSubconfig.length - 1) { + _setupCheckIcon(mainConfig, currentSubConfigName); + } + _showNextSubConfig(); } - + // Timeline functions - function _selectTimelineIcon(mainConfig, subConfig) { - var icon_id = ".subconfiguration-panel[mainConfig=" + mainConfig + - "] .icon_container[json_name=" + subConfig + "]"; - - var previousSelected = $(".subconfiguration-panel[mainConfig=" + mainConfig - + "] .icon_container[select=true]").attr("json_name"); - if (typeof previousSelected != "undefined") { - _deselectTimelineIcon(mainConfig, previousSelected); - } - + function _selectTimelineIcon(mainConfig, subConfig) { + var icon_id = ".subconfiguration-panel[mainConfig=" + mainConfig + + "] .icon_container[json_name=" + subConfig + "]"; + + var previousSelected = $(".subconfiguration-panel[mainConfig=" + mainConfig + + + "] .icon_container[select=true]").attr("json_name"); + if (typeof previousSelected != "undefined") { + _deselectTimelineIcon(mainConfig, previousSelected); + } + wikilibras.enableIconHover($(icon_id), true); - $(icon_id).attr("select", true); - } - + $(icon_id).attr("select", true); + } + function _deselectTimelineIcon(mainConfig, subConfig) { - var icon_id = ".subconfiguration-panel[mainConfig=" + mainConfig + - "] .icon_container[json_name=" + subConfig + "]"; - + var icon_id = ".subconfiguration-panel[mainConfig=" + mainConfig + + "] .icon_container[json_name=" + subConfig + "]"; + if ($(icon_id + "[complete=true]").length > 0) { - _setupCheckIcon(mainConfig, subConfig); - } else { - wikilibras.enableIconHover($(icon_id), false); - $(icon_id).attr("select", false); - } - } - + _setupCheckIcon(mainConfig, subConfig); + } else { + wikilibras.enableIconHover($(icon_id), false); + $(icon_id).attr("select", false); + } + } + function _setupCheckIcon(mainConfig, subConfig) { - var icon_id = $(".subconfiguration-panel[mainConfig=" + mainConfig + - "] .icon_container[json_name=" + subConfig + "]"); - wikilibras.enableIconCheck(icon_id, true); - $(icon_id).attr("complete", true); - $(icon_id).attr("select", false); - } - + var icon_id = $(".subconfiguration-panel[mainConfig=" + mainConfig + + "] .icon_container[json_name=" + subConfig + "]"); + wikilibras.enableIconCheck(icon_id, true); + $(icon_id).attr("complete", true); + $(icon_id).attr("select", false); + } + function _isTimelineLoaded() { - return $(".subconfiguration-panel[mainConfig=" + mainConfig + "]").length > 0; - } - + return $(".subconfiguration-panel[mainConfig=" + mainConfig + "]").length > 0; + } + function _setupTimelineListeners(timelineBaseId) { - $(timelineBaseId + " .icon_container[json_name]").off("click").on("click", + $(timelineBaseId + " .icon_container[json_name]").off("click").on("click", function() { - var subConfig = $(this).attr("json_name"); - _selectSubConfig(subConfig); + var subConfig = $(this).attr("json_name"); + _selectSubConfig(subConfig); }); - + $(timelineBaseId + " .arrow[name=right-arrow]").off("click").on("click", function() { - _showNextSubConfig(); - }); - + _showNextSubConfig(); + }); + $(timelineBaseId + " .arrow[name=left-arrow]").off("click").on("click", function() { - _showPreviousSubConfig(); - }); - } - + _showPreviousSubConfig(); + }); + } + function _setupTimelineIcons(timelineBaseId) { - $(timelineBaseId + " .icon_container[json_name]").hide(); - + $(timelineBaseId + " .icon_container[json_name]").hide(); + for (var name in currentSubconfigParent) { - $(timelineBaseId + " .icon_container[json_name=" + name + "]").show(); - } - if (preprocessedMainConfig == "hand") { - $(timelineBaseId + " .icon_container[json_name=movimento]").show(); - _setupCheckIcon(mainConfig, "movimento"); - _selectTimelineIcon(mainConfig, currentSubConfigName); - } - + $(timelineBaseId + " .icon_container[json_name=" + name + "]").show(); + } + if (preprocessedMainConfig == "hand") { + $(timelineBaseId + " .icon_container[json_name=movimento]").show(); + _setupCheckIcon(mainConfig, "movimento"); + _selectTimelineIcon(mainConfig, currentSubConfigName); + } + _setupTimelineListeners(timelineBaseId); - $(timelineBaseId).show(); - } - + $(timelineBaseId).show(); + } + function _setupTimeline() { - var timelineBaseId = ".subconfiguration-panel[mainConfig=" + mainConfig + "]"; - if (_isTimelineLoaded()) { - $(timelineBaseId).show(); - } else { - dynengine.render(baseUrl, "/" + preprocessedMainConfig + + var timelineBaseId = ".subconfiguration-panel[mainConfig=" + mainConfig + "]"; + if (_isTimelineLoaded()) { + $(timelineBaseId).show(); + } else { + dynengine.render(baseUrl, "/" + preprocessedMainConfig + "/timeline.html", "#selection-panel", false, function() { - _setupTimelineIcons(timelineBaseId); + _setupTimelineIcons(timelineBaseId); }); - } - } - + } + } + // Public methods - dynworkflow.selectMainConfig = function(config) { - mainConfig = config; - preprocessedMainConfig = _preprocessMainConfig(mainConfig); - currentSubconfigParent = jsonWF[preprocessedMainConfig]; - currentSubConfigName = _getFirstKey(currentSubconfigParent); - currentSubconfig = currentSubconfigParent[currentSubConfigName]; - currentStep = 0; - + dynworkflow.selectMainConfig = function(config) { + mainConfig = config; + preprocessedMainConfig = _preprocessMainConfig(mainConfig); + currentSubconfigParent = jsonWF[preprocessedMainConfig]; + currentSubConfigName = _getFirstKey(currentSubconfigParent); + currentSubconfig = currentSubconfigParent[currentSubConfigName]; + currentStep = 0; + _showCurrentSubconfig(); - // hide the timeline on the first subconfiguration for "hand" - if (preprocessedMainConfig != "hand" || _isTimelineLoaded()) { - _setupTimeline(); - } - } - + // hide the timeline on the first subconfiguration for "hand" + if (preprocessedMainConfig != "hand" || _isTimelineLoaded()) { + _setupTimeline(); + } + } + dynworkflow.selectMovement = function(movement) { - var subconfigJSON = currentSubconfig[movement] - currentSubConfigName = _getFirstKey(subconfigJSON); - currentSubconfigParent = subconfigJSON; - currentSubconfig = subconfigJSON[currentSubConfigName]; - currentStep = 0; - + var subconfigJSON = currentSubconfig[movement] + currentSubConfigName = _getFirstKey(subconfigJSON); + currentSubconfigParent = subconfigJSON; + currentSubconfig = subconfigJSON[currentSubConfigName]; + currentStep = 0; + _showCurrentSubconfig(); - _setupTimeline(); - } - + _setupTimeline(); + } + dynworkflow.selectSubConfig = function(subConfig) { - _selectSubConfig(subConfig); - } - + _selectSubConfig(subConfig); + } + dynworkflow.userSelectedAnOption = function() { - _userSelectedAnOption(); - } - + _userSelectedAnOption(); + } + dynworkflow.getFacialParameters = function() { - return _getAttributes(jsonWF["facial"]); - } - + return _getAttributes(jsonWF["facial"]); + } + dynworkflow.getMovementParameters = function(movementName) { - return _getAttributes(jsonWF["hand"]["movimento"][movementName]); - } - + return _getAttributes(jsonWF["hand"]["movimento"][movementName]); + } + dynworkflow.load = function() { - baseUrl = $('#server-url').data('url'); - $.get(baseUrl + "/conf/selection-workflow-json", function(result) { - jsonWF = $.parseJSON(result); - }).fail(function() { - console.log("Failed to load the workflow configuration"); - }); - } + baseUrl = $('#server-url').data('url'); + $.get(baseUrl + "/conf/selection-workflow-json", function(result) { + jsonWF = $.parseJSON(result); + }).fail(function() { + console.log("Failed to load the workflow configuration"); + }); + } -}(window.dynworkflow = window.dynworkflow || {}, jQuery)); \ No newline at end of file +}(window.dynworkflow = window.dynworkflow || {}, jQuery)); diff --git a/view/assets/js/wikilibras.js b/view/assets/js/wikilibras.js index 1a5789d..39bfe6c 100644 --- a/view/assets/js/wikilibras.js +++ b/view/assets/js/wikilibras.js @@ -1,438 +1,439 @@ (function(wikilibras, $, undefined) { - var videos_url = ''; - var base_url = ''; - var server_backend_url = ''; - var api_url = ''; - var current_task_id = -1; - var tmpParameterJSON = {}; - var parsedParameterJSON = {}; - - function _setupTmpParameterJSON(sign_name) { - tmpParameterJSON = { - "sinal" : sign_name, - "facial" : {}, - "right-hand" : {}, - "left-hand" : {} - }; - parsedParameterJSON = {}; - } - - function _loadTaskInfo(task) { - current_task_id = task.id; - var sign_name = task.info.sign_name; - var ref_vid_link = videos_url + sign_name + "_REF.webm"; - $(".sign-label").text(sign_name); - $(".ref-video").attr("src", ref_vid_link); - - _setupTmpParameterJSON(task.info.sign_name); - } - - function _changeImage(img, url) { - img.attr("src", url); - } - - function _enableIconHover(container, isHover) { - var img = $(container).find("img").first(); - var hover_img_url = base_url + "/img/" + $(container).attr("name"); - if (isHover) { - hover_img_url += "-icon-hover.png"; - } else { - hover_img_url += "-icon.png"; - } - _changeImage(img, hover_img_url); - } - - function _selectIcon(iconName, isSelect, panel) { - panel = typeof panel == "undefined" ? "" : "[panel=" + panel + "]"; - var icon_id = ".icon_container[name=" + iconName + "]" + panel; - _enableIconHover(icon_id, isSelect); - $(icon_id).attr("select", isSelect); - } - - function _deselectIcon(iconName, parent) { - _selectIcon(iconName, false, parent); - } - - function _enableIconCheck(container, isCheck) { - var img = $(container).find("img").first(); - var check_img_url = base_url + "/img/" + $(container).attr("name"); - - if (isCheck) { - check_img_url += "-icon-check.png"; - } else { - check_img_url += "-icon.png"; - } - _changeImage(img, check_img_url); - } - - function _setupCheckIcon(option, isCheck, panel) { - panel = typeof panel == "undefined" ? "" : "[panel=" + panel + "]"; - var icon_id = ".icon_container[name=" + option + "]" + panel; - _enableIconCheck(icon_id, isCheck); - $(".icon_container[name=" + option + "]" + panel).attr("complete", - isCheck); - } - - function _isSelectingState() { - return $("#configuration-panel .icon_container[select=true]").length > 0; - } - - function _isConfigurationComplete(config) { - var baseId = ".subconfiguration-panel[mainConfig=" + config + "]"; - var total_config = $(baseId + " .icon_container[json_name]:visible").length; - var completed_config = $(baseId + " .icon_container[complete=true]").length; - return total_config == completed_config; - } - - function _canHover(el) { - var incompleteConfig = typeof $(el).attr("complete") == "undefined" - || $(el).attr("complete") == "false"; - return (!_isSelectingState() && incompleteConfig) - || (typeof $(el).attr("select") == "undefined" && incompleteConfig); - } - - function _getCurrentMainConfiguration() { - return _isSelectingState() ? $( - "#configuration-panel .icon_container[select=true]").attr( - "name") : ""; - } - - function _addZoomInToAvatar(option, callback) { - $("#avatar-default") - .fadeOut( - 500, + var videos_url = ''; + var base_url = ''; + var server_backend_url = ''; + var api_url = ''; + var current_task_id = -1; + var tmpParameterJSON = {}; + var parsedParameterJSON = {}; + + function _setupTmpParameterJSON(sign_name) { + tmpParameterJSON = { + 'sinal': sign_name, + 'facial': {}, + 'right-hand': {}, + 'left-hand': {} + }; + parsedParameterJSON = {}; + } + + function _loadTaskInfo(task) { + current_task_id = task.id; + var sign_name = task.info.sign_name; + var ref_vid_link = videos_url + sign_name + '_REF.webm'; + $('.sign-label').text(sign_name); + $('.ref-video').attr('src', ref_vid_link); + + _setupTmpParameterJSON(task.info.sign_name); + } + + function _changeImage(img, url) { + img.attr('src', url); + } + + function _enableIconHover(container, isHover) { + var img = $(container).find('img').first(); + var hover_img_url = base_url + '/img/' + $(container).attr('name'); + if (isHover) { + hover_img_url += '-icon-hover.png'; + } else { + hover_img_url += '-icon.png'; + } + _changeImage(img, hover_img_url); + } + + function _selectIcon(iconName, isSelect, panel) { + panel = typeof panel == 'undefined' ? '' : '[panel=' + panel + ']'; + var icon_id = '.icon_container[name=' + iconName + ']' + panel; + _enableIconHover(icon_id, isSelect); + $(icon_id).attr('select', isSelect); + } + + function _deselectIcon(iconName, parent) { + _selectIcon(iconName, false, parent); + } + + function _enableIconCheck(container, isCheck) { + var img = $(container).find('img').first(); + var check_img_url = base_url + '/img/' + $(container).attr('name'); + + if (isCheck) { + check_img_url += '-icon-check.png'; + } else { + check_img_url += '-icon.png'; + } + _changeImage(img, check_img_url); + } + + function _setupCheckIcon(option, isCheck, panel) { + panel = typeof panel == 'undefined' ? '' : '[panel=' + panel + ']'; + var icon_id = '.icon_container[name=' + option + ']' + panel; + _enableIconCheck(icon_id, isCheck); + $('.icon_container[name=' + option + ']' + panel).attr('complete', + isCheck); + } + + function _isSelectingState() { + return $('#configuration-panel .icon_container[select=true]').length > 0; + } + + function _isConfigurationComplete(config) { + var baseId = '.subconfiguration-panel[mainConfig=' + config + ']'; + var total_config = $(baseId + ' .icon_container[json_name]:visible').length; + var completed_config = $(baseId + ' .icon_container[complete=true]').length; + return total_config == completed_config; + } + + function _canHover(el) { + var incompleteConfig = typeof $(el).attr('complete') == 'undefined' || + $(el).attr('complete') == 'false'; + return (!_isSelectingState() && incompleteConfig) || + (typeof $(el).attr('select') == 'undefined' && incompleteConfig); + } + + function _getCurrentMainConfiguration() { + return _isSelectingState() ? $( + '#configuration-panel .icon_container[select=true]').attr( + 'name') : ''; + } + + function _addZoomInToAvatar(option, callback) { + $('#avatar-default') + .fadeOut( + 500, function() { - $("#avatar-container").removeClass("col-sm-7"); - $("#avatar-container").addClass("col-sm-5"); - $("#selection-container").removeClass("col-sm-2"); - $("#selection-container").addClass("col-sm-4"); - $("#avatar-container").removeClass( - "avatar-container-zoom-out"); - $("#avatar-container").addClass( - "avatar-container-zoom-in"); - $("#avatar-" + option).removeClass( - "avatar-img-zoom-out"); - $("#avatar-" + option).fadeIn( - 500, + $('#avatar-container').removeClass('col-sm-7'); + $('#avatar-container').addClass('col-sm-5'); + $('#selection-container').removeClass('col-sm-2'); + $('#selection-container').addClass('col-sm-4'); + $('#avatar-container').removeClass( + 'avatar-container-zoom-out'); + $('#avatar-container').addClass( + 'avatar-container-zoom-in'); + $('#avatar-' + option).removeClass( + 'avatar-img-zoom-out'); + $('#avatar-' + option).fadeIn( + 500, function() { - $("#avatar-" + option).addClass( - "avatar-" + option - + "-img-zoom-in"); - callback(); + $('#avatar-' + option).addClass( + 'avatar-' + option + + '-img-zoom-in'); + callback(); }); }); - } + } - function _addZoomOutToAvatar(option, callback) { - $("#avatar-" + option).fadeOut( - 500, + function _addZoomOutToAvatar(option, callback) { + $('#avatar-' + option).fadeOut( + 500, function() { - $("#selection-container").removeClass("col-sm-4"); - $("#selection-container").addClass("col-sm-2"); - $("#avatar-container").removeClass("col-sm-5"); - $("#avatar-container").addClass("col-sm-7"); - $("#avatar-container").removeClass( - "avatar-container-zoom-in"); - $("#avatar-container") - .addClass("avatar-container-zoom-out"); - $("#avatar-default").fadeIn( - 500, + $('#selection-container').removeClass('col-sm-4'); + $('#selection-container').addClass('col-sm-2'); + $('#avatar-container').removeClass('col-sm-5'); + $('#avatar-container').addClass('col-sm-7'); + $('#avatar-container').removeClass( + 'avatar-container-zoom-in'); + $('#avatar-container') + .addClass('avatar-container-zoom-out'); + $('#avatar-default').fadeIn( + 500, function() { - $("#avatar-" + option).removeClass( - "avatar-" + option + "-img-zoom-in"); - $("#avatar-" + option).addClass( - "avatar-img-zoom-out"); - callback(); + $('#avatar-' + option).removeClass( + 'avatar-' + option + '-img-zoom-in'); + $('#avatar-' + option).addClass( + 'avatar-img-zoom-out'); + callback(); }); }); - } - - function _clearPreviousSelection() { - $(".selection-panel-body").hide(); - $(".subconfiguration-panel").hide(); - - if (_isSelectingState()) { - var current_option = _getCurrentMainConfiguration(); - _selectIcon(current_option, false); - if (_isConfigurationComplete(current_option)) { - _setupCheckIcon(current_option, true); - } - $("#avatar-" + current_option).fadeOut(500); - } - } - - function _showSelectionPanel(option) { - _clearPreviousSelection(); - _selectIcon(option, true); - _setupGUIOnSelection(option); - - dynworkflow.selectMainConfig(option); - } - - function _hideSelectionPanel() { - var config = _getCurrentMainConfiguration(); - _deselectIcon(config); - if (_isConfigurationComplete(config)) { - _finishConfiguration(config); - } - - _addZoomOutToAvatar(config, function() { - $("#ready-button").fadeIn(300); - $(".edit-container").fadeIn(300); - }); - $("#selection-panel").fadeOut(300); - } - - function _canRenderSignVideo() { - return _isConfigurationComplete("facial") - && (_isConfigurationComplete("right-hand") || _isConfigurationComplete("left-hand")); - } - - function _finishConfiguration(config) { - _setupCheckIcon(config, true); - _setupCheckIcon("avatar-" + config, true); - $("#" + config + "-edit .check-icon").show(); - - if (_canRenderSignVideo()) { - $("#ready-button").removeClass("disabled"); - } - } - - function _unfinishConfiguration(config, panel) { - _setupCheckIcon(config, false, panel); - _setupCheckIcon("avatar-" + config, false, panel); - $("#" + config + "-edit .check-icon").hide(); - - if (!_canRenderSignVideo()) { - $("#ready-button").addClass("disabled"); - } - } - - function _setupGUIOnSelection(option) { - $("#ready-button").fadeOut(300); - $(".edit-container").fadeOut(300); - _addZoomInToAvatar(option, function() { - $("#selection-panel").fadeIn(300); - }); - } - - function _setupConfigurationPanel() { - $(".icon_container").off("mouseover").on("mouseover", function() { - if (_canHover(this)) { - _enableIconHover(this, true); - } - }); - $(".icon_container").off("mouseout").on("mouseout", function() { - if (_canHover(this)) { - _enableIconHover(this, false); - } - }); - $(".config-panel-option").off("click").on("click", function() { - _showSelectionPanel($(this).attr("panel")); - }); - $("#minimize-icon-container").off("click").on("click", function() { - $("#ref-video-container").hide(); - $("#minimize-icon-container").hide(); - $("#maximize-icon-container").show(); - }); - $("#maximize-icon-container").off("click").on("click", function() { - $("#ref-video-container").show(); - $("#maximize-icon-container").hide(); - $("#minimize-icon-container").show(); - }); - } - - 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) { - $(parentId + " .selection-panel-option[select=true]").removeAttr( - "select"); - $(el).attr("select", true); - - var mainConfig = $(parentId).attr("mainConfig"); - var subConfig = $(parentId).attr("subConfig"); - var step = $(parentId).attr("step"); - _updateTempParameterJSON(mainConfig, subConfig, step, $(el).attr("value")); - } - - function _setupSelectionPanel() { - $("#selection-panel .x").off("click").on("click", function() { - _hideSelectionPanel(); - }); - } - - // Render Screen - function _submitParameterJSON(callback) { - parsedParameterJSON = tmpJSONParser.parse(tmpParameterJSON); - //console.log(parsedParameterJSON); - - $.ajax({ - type : "POST", - url : api_url + "/sign", - data : JSON.stringify(parsedParameterJSON), - contentType : "application/json", - success : function(response) { - console.log(response); - callback(); - }, - error : function(xhr, textStatus, error) { - alert(xhr.responseText); - } - }); - } - - function _showRenderedAvatar() { - var user_id = parsedParameterJSON["userId"]; - var sign_name = parsedParameterJSON["sinal"]; - var rendered_avatar_url = api_url + "/public/" + user_id + "/" - + sign_name + ".webm"; - $("#render-avatar video").attr("src", rendered_avatar_url); - $("#render-avatar").fadeIn(300); - } - - function _setupRenderScreen() { - $("#configuration-screen").hide(); - $("#render-avatar").hide(); - $("#render-screen").show(); - $("#render-loading").fadeIn(300); - $("#finish-button").addClass("disabled"); - $("#render-ref video").prop("controls", false); - $("#render-ref video").get(0).pause(); - - _submitParameterJSON(function() { - $("#render-loading").fadeOut(300); - $("#render-ref video").prop("controls", true); - $("#render-ref video").get(0).play(); - $("#finish-button").removeClass("disabled"); - _showRenderedAvatar(); - }); - } - - function _clearGUI() { - $(".selection-panel-option").removeAttr("select"); - $(".icon_container").removeAttr("select"); - $(".icon_container[complete=true]").each( + } + + function _clearPreviousSelection() { + $('.selection-panel-body').hide(); + $('.subconfiguration-panel').hide(); + + if (_isSelectingState()) { + var current_option = _getCurrentMainConfiguration(); + _selectIcon(current_option, false); + if (_isConfigurationComplete(current_option)) { + _setupCheckIcon(current_option, true); + } + $("#avatar-" + current_option).fadeOut(500); + } + } + + function _showSelectionPanel(option) { + _clearPreviousSelection(); + _selectIcon(option, true); + _setupGUIOnSelection(option); + + dynworkflow.selectMainConfig(option); + } + + function _hideSelectionPanel() { + var config = _getCurrentMainConfiguration(); + _deselectIcon(config); + if (_isConfigurationComplete(config)) { + _finishConfiguration(config); + } + + _addZoomOutToAvatar(config, function() { + $("#ready-button").fadeIn(300); + $(".edit-container").fadeIn(300); + }); + $("#selection-panel").fadeOut(300); + } + + function _canRenderSignVideo() { + return _isConfigurationComplete("facial") && + (_isConfigurationComplete("right-hand") || _isConfigurationComplete("left-hand")); + } + + function _finishConfiguration(config) { + _setupCheckIcon(config, true); + _setupCheckIcon("avatar-" + config, true); + $("#" + config + "-edit .check-icon").show(); + + if (_canRenderSignVideo()) { + $("#ready-button").removeClass("disabled"); + } + } + + function _unfinishConfiguration(config, panel) { + _setupCheckIcon(config, false, panel); + _setupCheckIcon("avatar-" + config, false, panel); + $("#" + config + "-edit .check-icon").hide(); + + if (!_canRenderSignVideo()) { + $("#ready-button").addClass("disabled"); + } + } + + function _setupGUIOnSelection(option) { + $("#ready-button").fadeOut(300); + $(".edit-container").fadeOut(300); + _addZoomInToAvatar(option, function() { + $("#selection-panel").fadeIn(300); + }); + } + + function _setupConfigurationPanel() { + $(".icon_container").off("mouseover").on("mouseover", function() { + if (_canHover(this)) { + _enableIconHover(this, true); + } + }); + $(".icon_container").off("mouseout").on("mouseout", function() { + if (_canHover(this)) { + _enableIconHover(this, false); + } + }); + $(".config-panel-option").off("click").on("click", function() { + _showSelectionPanel($(this).attr("panel")); + }); + $("#minimize-icon-container").off("click").on("click", function() { + $("#ref-video-container").hide(); + $("#minimize-icon-container").hide(); + $("#maximize-icon-container").show(); + }); + $("#maximize-icon-container").off("click").on("click", function() { + $("#ref-video-container").show(); + $("#maximize-icon-container").hide(); + $("#minimize-icon-container").show(); + }); + } + + 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) { + $(parentId + " .selection-panel-option[select=true]").removeAttr( + "select"); + $(el).attr("select", true); + + var mainConfig = $(parentId).attr("mainConfig"); + var subConfig = $(parentId).attr("subConfig"); + var step = $(parentId).attr("step"); + _updateTempParameterJSON(mainConfig, subConfig, step, $(el).attr("value")); + } + + function _setupSelectionPanel() { + $("#selection-panel .x").off("click").on("click", function() { + _hideSelectionPanel(); + }); + } + + // Render Screen + function _submitParameterJSON(callback) { + parsedParameterJSON = tmpJSONParser.parse(tmpParameterJSON); + //console.log(parsedParameterJSON); + + $.ajax({ + type: "POST", + url: api_url + "/sign", + data: JSON.stringify(parsedParameterJSON), + contentType: "application/json", + success: function(response) { + console.log(response); + callback(); + }, + error: function(xhr, textStatus, error) { + alert(xhr.responseText); + } + }); + } + + function _showRenderedAvatar() { + var user_id = parsedParameterJSON["userId"]; + var sign_name = parsedParameterJSON["sinal"]; + var rendered_avatar_url = api_url + "/public/" + user_id + "/" + + sign_name + ".webm"; + $("#render-avatar video").attr("src", rendered_avatar_url); + $("#render-avatar").fadeIn(300); + } + + function _setupRenderScreen() { + $("#configuration-screen").hide(); + $("#render-avatar").hide(); + $("#render-screen").show(); + $("#render-loading").fadeIn(300); + $("#finish-button").addClass("disabled"); + $("#render-ref video").prop("controls", false); + $("#render-ref video").get(0).pause(); + + _submitParameterJSON(function() { + $("#render-loading").fadeOut(300); + $("#render-ref video").prop("controls", true); + $("#render-ref video").get(0).play(); + $("#finish-button").removeClass("disabled"); + _showRenderedAvatar(); + }); + } + + function _clearGUI() { + $(".selection-panel-option").removeAttr("select"); + $(".icon_container").removeAttr("select"); + $(".icon_container[complete=true]").each( function() { - _unfinishConfiguration($(this).attr("name"), $(this).attr( - "panel")); + _unfinishConfiguration($(this).attr("name"), $(this).attr( + "panel")); }); - } - - function _setupMainScreen(task, deferred) { - $("#initial-screen").fadeIn(300); - $("#start-button").off("click").on("click", function() { - $("#initial-screen").hide(); - $("#configuration-screen").show(); - dynengine.load(); - dynworkflow.load(); - console.log('dynengine loaded'); - }); - $("#ready-button").off("click").on("click", function() { - if ($(this).hasClass('disabled')) { - event.preventDefault(); - return; - } - _setupRenderScreen(); - }); - $("#render-edit").off("click").on("click", function() { - $("#render-screen").hide(); - $("#configuration-screen").show(); - }); - $("#finish-button").off("click").on("click", function() { - if ($(this).hasClass('disabled')) { - event.preventDefault(); - return; - } - $("#render-screen").hide(); - $("#thanks-screen").show(); - _saveAnswer(task, deferred) - }); - } - - function _setupGUI(task, deferred) { - _clearGUI(); - _setupConfigurationPanel(); - _setupSelectionPanel(); - _setupMainScreen(task, deferred); - } - - function _saveAnswer(task, deferred) { - var answer = {} - answer["status"] = "FINISHED"; - answer["parameter_json"] = parsedParameterJSON; - - /*pybossa.saveTask(task.id, answer).done(function() { - setTimeout(function() { - $("#thanks-screen").hide(); - deferred.resolve(); - }, 2500); - });*/ - - setTimeout(function() { - $("#thanks-screen").hide(); - deferred.resolve(); - }, 2500); - } - - function _showCompletedAllTaskMsg() { - $("#completed-task-msg").hide(); - $("#completed-all-task-msg").show(); - $("#thanks-screen").fadeIn(300); - } - - pybossa.presentTask(function(task, deferred) { - if (!$.isEmptyObject(task) && current_task_id != task.id) { - _loadTaskInfo(task); - _setupGUI(task, deferred) - $("#main-container").fadeIn(500); - } else { - _showCompletedAllTaskMsg(); - } - }); - - // Private methods - function _run(projectname) { - pybossa.run(projectname); - } - - // Public methods - wikilibras.run = function(serverhost, serverbackend, projectname, apihost) { - base_url = serverhost; - server_back_url = serverbackend; - videos_url = base_url + "/videos/"; - api_url = apihost; - _run(projectname); - }; - - wikilibras.updateTempParameterJSON = function(mainConfig, subConfig, step, value) { - _updateTempParameterJSON(mainConfig, subConfig, step, value); - } - - wikilibras.hideSelectionPanel = function() { - _hideSelectionPanel(); - } - - wikilibras.selectAnOption = function(parentId, el) { - _selectAnOption(parentId, el); - } - - wikilibras.enableIconHover = function(container, isHover) { - _enableIconHover(container, isHover); - } - - wikilibras.enableIconCheck = function(container, isHover) { - _enableIconCheck(container, isHover); - } + } + + function _setupMainScreen(task, deferred) { + $("#initial-screen").fadeIn(300); + $("#start-button").off("click").on("click", function() { + $("#initial-screen").hide(); + $("#configuration-screen").show(); + dynengine.load(); + console.log('dynengine loaded'); + dynworkflow.load(); + console.log('dynworkflow loaded'); + }); + $("#ready-button").off("click").on("click", function() { + if ($(this).hasClass('disabled')) { + event.preventDefault(); + return; + } + _setupRenderScreen(); + }); + $("#render-edit").off("click").on("click", function() { + $("#render-screen").hide(); + $("#configuration-screen").show(); + }); + $("#finish-button").off("click").on("click", function() { + if ($(this).hasClass('disabled')) { + event.preventDefault(); + return; + } + $("#render-screen").hide(); + $("#thanks-screen").show(); + _saveAnswer(task, deferred) + }); + } + + function _setupGUI(task, deferred) { + _clearGUI(); + _setupConfigurationPanel(); + _setupSelectionPanel(); + _setupMainScreen(task, deferred); + } + + function _saveAnswer(task, deferred) { + var answer = {} + answer["status"] = "FINISHED"; + answer["parameter_json"] = parsedParameterJSON; + + /*pybossa.saveTask(task.id, answer).done(function() { + setTimeout(function() { + $("#thanks-screen").hide(); + deferred.resolve(); + }, 2500); + });*/ + + setTimeout(function() { + $("#thanks-screen").hide(); + deferred.resolve(); + }, 2500); + } + + function _showCompletedAllTaskMsg() { + $("#completed-task-msg").hide(); + $("#completed-all-task-msg").show(); + $("#thanks-screen").fadeIn(300); + } + + pybossa.presentTask(function(task, deferred) { + if (!$.isEmptyObject(task) && current_task_id != task.id) { + _loadTaskInfo(task); + _setupGUI(task, deferred) + $("#main-container").fadeIn(500); + } else { + _showCompletedAllTaskMsg(); + } + }); + + // Private methods + function _run(projectname) { + pybossa.run(projectname); + } + + // Public methods + wikilibras.run = function(serverhost, serverbackend, projectname, apihost) { + base_url = serverhost; + server_back_url = serverbackend; + videos_url = base_url + "/videos/"; + api_url = apihost; + _run(projectname); + }; + + wikilibras.updateTempParameterJSON = function(mainConfig, subConfig, step, value) { + _updateTempParameterJSON(mainConfig, subConfig, step, value); + } + + wikilibras.hideSelectionPanel = function() { + _hideSelectionPanel(); + } + + wikilibras.selectAnOption = function(parentId, el) { + _selectAnOption(parentId, el); + } + + wikilibras.enableIconHover = function(container, isHover) { + _enableIconHover(container, isHover); + } + + wikilibras.enableIconCheck = function(container, isHover) { + _enableIconCheck(container, isHover); + } }(window.wikilibras = window.wikilibras || {}, jQuery)); -- libgit2 0.21.2