Enviando mais comandos

css/ivprog-visual-1.0.css

@@ -149,7 +149,7 @@ body {
 .function_name_div, .function_return_div, .function_name_parameter, .created_div_valor_var, .function_return, .var_value_menu_div, .variable_rendered, .variable_rendered div, .var_attributed,
 .expression_operand_1, .expression_operand_2, .operator, .div_comment_text, .value_rendered, .parameters_function_called, .parameters_function_called div, .expression_elements,
 .expression_element, .var_rendered, .menu_add_item, .component_element, .component_element, .conditional_expression, .variable_attribution, .attribution_expression, .var_value_expression,
-.incrementation_field, .incrementation_variable, .first_operand, .operator, .second_operand, .variable_to_switch, .variable_case, .button_remove_case {
+.incrementation_field, .incrementation_variable, .first_operand, .operator, .second_operand, .variable_to_switch, .variable_case, .button_remove_case, .editing_name_var {
 	display: inline;
 }
 
@@ -162,7 +162,7 @@ body {
 	font-style: italic;
 }
 
-.enable_edit_name_function, .enable_edit_name_parameter, .add_parameter, .remove_parameter, .add_parameter_button, .remove_variable {
+.enable_edit_name_function, .add_parameter, .remove_parameter, .add_parameter_button, .remove_variable {
 	cursor: pointer;
 }
 
@@ -305,7 +305,6 @@ div.buttons_manage_columns {
 
 .list_globals, .global_const {
 	display: inline;
-	cursor: pointer;
 }
 
 .created_element {
@@ -371,4 +370,61 @@ div.buttons_manage_columns {
 }
 .accordion {
 	margin: auto;
-}
+}
+
+.global_container:hover {
+	border: 2px solid gray;
+	padding-left: 8px;
+	padding-right: 8px;
+	padding-top: 6px;
+	padding-bottom: 4px;
+}
+
+.global_container .global_type, .editing_name_var, .global_container .span_value_variable {
+	background: #cecece;
+	border-radius: 5px;
+	padding: 4px;
+	margin-left: 5px;
+	margin-right: 5px;
+}
+
+.global_container .global_type:hover, .editing_name_var:hover, .global_container .span_value_variable:hover {
+	background: #848484;
+	color: #fff;
+	z-index: 999999;
+}
+
+.editing_name_var {
+	min-width: 40px;
+	padding-top: 3px;
+	padding-bottom: 3px;
+}
+
+.global_container .global_type:active {
+	background: #636363;
+	color: #fff;
+}
+
+.global_container i {
+	cursor: pointer;
+}
+
+.global_container .ui.icon.plus.square.outline, .global_container .ui.icon.minus.square.outline {
+	font-size: 120%;
+}
+
+.character_equals {
+	vertical-align: sub;
+    font-size: 150%;
+}
+
+.red.icon.times.remove_global {
+	float: right;
+    margin-right: -1px;
+    margin-left: 8px;
+}
+
+.tr_manage_lines {
+	padding-top: 10px;
+}
+

index.html

@@ -88,7 +88,7 @@
       </div>
 
       <div class="ui one column container segment ivprog_visual_panel loading">
-        <div class="program_signature"><data class="i18n" value="ui:program">program</data> { </div>
+        <div class="program_signature"><data class="i18n" value="ui:program">program</data> </div>
 
         <div class="global_var">
           
@@ -107,7 +107,7 @@
           <data class="i18n" value="ui:btn_function">Function</data>
           <i class="add icon"></i>
         </div>
-        <div class="program_final">}</div>
+        <div class="program_final"></div>
 
       </div>
 

js/iassign-integration-functions.js

@@ -27,8 +27,12 @@ function getAnswer () {
     // Se o parâmetro "iLM_PARAM_SendAnswer" for false,
     // então trata-se de resolução de atividade
     if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
-        // Montar o retorno da resposta do aluno
-        
+        // Montar o retorno com a resposta do aluno
+        var contentToSend = previousContent.split("algorithm")[0];
+        contentToSend += 'algorithm\n\n';
+        contentToSend += generator();
+        return contentToSend;
+
     } else {
         // Montar o retorno com a criação da atividade do professor
         var ret = ' { ' + prepareTestCases() 
@@ -85,11 +89,11 @@ function prepareTestCases () {
 // O retorno é um valor entre 0.0 e 1.0
 function getEvaluation () {
     if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
-        // Calcula a nota do aluno:
-
         // A chamada do método abaixo é obrigatória!
         // Observe que a chamada parte do iLM para o iTarefa
-        parent.getEvaluationCallback(0);
+        //parent.getEvaluationCallback(window.studentGrade);
+
+        runCodeAssessment();
     }
 }
 
@@ -99,7 +103,7 @@ var settingsDataTypes = null;
 var settingsCommands = null;
 var settingsFunctions = null;
 var algorithm_in_ilm = null;
-
+var previousContent = null;
 
 // Função para que o iMA leia os dados da atividade fornecidos pelo iTarefa
 function getiLMContent () {
@@ -108,6 +112,7 @@ function getiLMContent () {
     // requisitado via AJAX para a captura dos dados da atividade
     $.get(iLMparameters.iLM_PARAM_Assignment, function (data) {
         if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
+            previousContent = data;
             prepareActivityToStudent(data);
         } else {
 
@@ -265,4 +270,28 @@ function prepareTableSettings (div_el) {
     $('.ui.checkbox').checkbox();
 
 
-}
+}
+
+// Tracking mouse movements
+var trackingMatrix = [];
+
+function adCoords(e, code){
+    var x = e.pageX; 
+    var y = e.pageY;
+    var d = new Date();
+    var t = d.getTime();
+    return [x, y, t, code];
+}
+
+$( document ).ready(function() {
+    $('.div_to_body').mousemove(function(e) {
+        console.log('mousemove');
+        trackingMatrix.push(adCoords(e, 0));
+    });
+
+    $('.div_to_body').click(function(e) {
+        console.log('mouseclick');
+        trackingMatrix.push(adCoords(e, 1));                    
+    });
+
+});

js/visualUI/algorithm.js

@@ -13,10 +13,23 @@ import { IVProgParser } from './../ast/ivprogParser';
 import { IVProgProcessor } from './../processor/ivprogProcessor';
 import { LanguageService } from '../services/languageService';
 
+var block_render = false;
+
 export function renderAlgorithm () {
+
+	if (block_render) {
+		return;
+	}
+	block_render = true;
+
+	console.log("rendering algorithm");
+
+	 $('.all_functions').children().off();
 	$('.all_functions').empty();
 
 	for (var i = 0; i < window.program_obj.functions.length; i++) {
 		FunctionsManagement.renderFunction(window.program_obj.functions[i]);
 	}
+
+	setTimeout(function(){ block_render = false; }, 500);
 }

js/visualUI/commands/dowhiletrue.js

@@ -14,10 +14,10 @@ export function createFloatingCommand () {
 
 export function renderCommand (command, function_obj) {
 	var ret = '';
-	ret += '<div class="ui dowhiletrue command_container"> <i class="ui icon small random command_drag"></i> <i class="ui icon times red button_remove_command"></i> <div class="ui context_menu"></div> <span> ' + LocalizedStrings.getUI('text_code_do') + '  { </span>';
+	ret += '<div class="ui dowhiletrue command_container"> <i class="ui icon small random command_drag"></i> <i class="ui icon times red button_remove_command"></i> <div class="ui context_menu"></div> <span> ' + LocalizedStrings.getUI('text_code_do') + ' </span>';
 	ret += '<div class="ui block_commands" data-subblock="" data-idcommand="">';
 	ret += '</div>';
-	ret += '<span> } ' + LocalizedStrings.getUI('text_code_while') + ' </span> <div class="conditional_expression"></div>';
+	ret += '<span> ' + LocalizedStrings.getUI('text_code_while') + ' </span> <div class="conditional_expression"></div>';
 	ret += '</div>';
 
 	var el = $(ret);

js/visualUI/commands/iftrue.js

@@ -16,7 +16,7 @@ export function renderCommand (command, function_obj) {
 	ret += '<div class="ui iftrue command_container"><div class="ui data_block_if" data-if="true">  <i class="ui icon small random command_drag"></i> <i class="ui icon times red button_remove_command"></i> <i class="ui icon redo alternate blue button_refresh_attribution"></i>';
 	ret += '<span> ' + LocalizedStrings.getUI('text_if') + '</span>';
 	ret += ' <div class="conditional_expression"></div>';
-	ret += '<span> { </span> ';
+	ret += '<span> </span> ';
 	ret += '<div class="ui block_commands commands_if conditional_comands_block" data-if="true">';
 
 	/*if ((writer_obj.commands_block == null)
@@ -28,7 +28,7 @@ export function renderCommand (command, function_obj) {
 	}*/
 
 	ret += '</div></div>';
-	ret += '<div class="ui data_block_else" data-else="true"> <span> } ' + LocalizedStrings.getUI('text_else') + ' { </span>';
+	ret += '<div class="ui data_block_else" data-else="true"> <span> ' + LocalizedStrings.getUI('text_else') + ' </span>';
 
 	ret += '<div class="ui block_commands commands_else conditional_comands_block" data-else="true">';
 
@@ -42,7 +42,7 @@ export function renderCommand (command, function_obj) {
 
 	ret += '</div>';
 
-	ret += '<span> }</span></div>';
+	ret += '<span></span></div>';
 	ret += '</div>';
 
 	var el = $(ret);

js/visualUI/commands/switch.js

@@ -14,7 +14,7 @@ export function createFloatingCommand () {
 
 export function renderCommand (command, function_obj) {
 	var ret = '';
-	ret += '<div class="ui switch command_container"> <i class="ui icon small random command_drag" ></i> <i class="ui icon times red button_remove_command"></i> <div class="ui context_menu"></div> <span> '+LocalizedStrings.getUI('text_code_switch')+' ( <div class="ui variable_to_switch"></div> ) { <div class="ui all_cases_div"></div> }</span>';
+	ret += '<div class="ui switch command_container"> <i class="ui icon small random command_drag" ></i> <i class="ui icon times red button_remove_command"></i> <div class="ui context_menu"></div> <span> '+LocalizedStrings.getUI('text_code_switch')+' ( <div class="ui variable_to_switch"></div> ) <div class="ui all_cases_div"></div></span>';
 	ret += '</div>';
 
 	var el = $(ret);

js/visualUI/commands/whiletrue.js

@@ -16,10 +16,10 @@ export function renderCommand (command, function_obj) {
 	var ret = '';
 	ret += '<div class="ui whiletrue command_container"> <i class="ui icon small random command_drag"></i> <i class="ui icon times red button_remove_command"></i> <div class="ui context_menu"></div> <span> ' + LocalizedStrings.getUI('text_code_while') + ' </span>';
 	ret += ' <div class="conditional_expression"></div>';
-	ret += ' { </span>';
+	ret += ' </span>';
 	ret += '<div class="ui block_commands">';
 	ret += '</div>';
-	ret += '<span> }</span>';
+	ret += '<span> </span>';
 	ret += '</div>';
 
 	var el = $(ret);

js/visualUI/functions.js

@@ -13,13 +13,14 @@ import { IVProgProcessor } from './../processor/ivprogProcessor';
 import WatchJS from 'melanke-watchjs';
 import { SemanticAnalyser } from '../processor/semantic/semanticAnalyser';
 import { IVProgAssessment } from '../assessment/ivprogAssessment';
-
+import * as AlgorithmManagement from './algorithm';
 
 var counter_new_functions = 0;
 var counter_new_parameters = 0;
 
+let studentTemp = null;
 let domConsole = null;
-let studentGrade = null;
+window.studentGrade = null;
 const program = new Models.Program();
 /*const variable1 = new Models.Variable(Types.INTEGER, "a", 1);
 const parameter1 = new Models.Variable(Types.INTEGER, "par_1", 1);
@@ -38,10 +39,11 @@ program.addFunction(mainFunction);
 window.program_obj = program;
 
 window.generator = CodeManagement.generate;
+window.runCodeAssessment = runCodeAssessment;
 
 WatchJS.watch(program.globals, function(){
-      console.log("as globais foram alteradas!");
-  }, 1);
+  AlgorithmManagement.renderAlgorithm();
+}, 1);
 
 function addFunctionHandler () {
 
@@ -220,7 +222,7 @@ export function renderFunction (function_obj) {
         + '( <i class="ui icon plus square outline add_parameter_button"></i> <div class="ui large labels parameters_list container_parameters_list">';
   }
     
-  appender += '</div> ) {</div>'
+  appender += '</div> ) </div>'
     + (function_obj.is_hidden ? ' <div class="function_area" style="display: none;"> ' : ' <div class="function_area"> ')
 
     + '<div class="ui top attached segment variables_list_div">'
@@ -230,7 +232,7 @@ export function renderFunction (function_obj) {
 
   appender += '</div>';
 
-  appender += '<div class="function_close_div">}</div>'
+  appender += '<div class="function_close_div"></div>'
     + '</div>'
     + '</div>';
 
@@ -290,9 +292,12 @@ export function initVisualUI () {
 
   $('.assessment').on('click', () => {
     runCodeAssessment();
+    is_iassign = true;
   });
 }
 
+var is_iassign = false;
+
 $( document ).ready(function() {
 
   for (var i = 0; i < program.functions.length; i++) {
@@ -303,7 +308,8 @@ $( document ).ready(function() {
 
 
 function runCodeAssessment () {
-  studentGrade = null;
+  window.studentGrade = null;
+  studentTemp = null;
   const strCode = CodeManagement.generate();
   if (strCode == null) {
     return;
@@ -312,7 +318,25 @@ function runCodeAssessment () {
     domConsole = new DOMConsole("#ivprog-term");
   $("#ivprog-term").slideDown(500);
   const runner = new IVProgAssessment(strCode, testCases, domConsole);
-  runner.runTest().then(grade => studentGrade = grade).catch( err => domConsole.err(err.message));
+
+  runner.runTest().then(grade => studentTemp = grade).catch( err => domConsole.err(err.message));
+  
+  gradeMonitor();
+}
+
+function gradeMonitor () {
+
+  if (studentTemp == null) { 
+    setTimeout(gradeMonitor, 50); 
+  } else {
+    window.studentGrade = studentTemp;
+    if (!is_iassign) {
+      parent.getEvaluationCallback(window.studentGrade);
+    } else {
+      is_iassign = false;
+    }
+  }
+
 }
 
 function runCode () {
@@ -391,7 +415,7 @@ function updateParameterType(parameter_obj, new_type, new_dimensions = 0) {
 function renderParameter (function_obj, parameter_obj, function_container) {
   var ret = "";
 
-  ret += '<div class="ui label function_name_parameter"><span class="span_name_parameter label_enable_name_parameter">'+parameter_obj.name+'</span> <i class="icon small pencil alternate enable_edit_name_parameter label_enable_name_parameter"></i>';
+  ret += '<div class="ui label function_name_parameter">';
 
   ret += '<div class="ui dropdown parameter_type">';
 
@@ -429,6 +453,8 @@ function renderParameter (function_obj, parameter_obj, function_container) {
 
   ret += '</div></div>';
 
+  ret += '<span class="span_name_parameter label_enable_name_parameter">'+parameter_obj.name+'</span> <i class="icon small pencil alternate enable_edit_name_parameter label_enable_name_parameter"></i>';
+
   ret += ' <i class="red icon times remove_parameter"></i></div>';
 
   ret = $(ret);

js/visualUI/globals.js

@@ -230,12 +230,12 @@ function renderValues (global_var, global_container) {
 
 	if (global_var.dimensions == 0) {
 		if (global_var.type == Types.REAL) {
-			ret += '<div class="created_div_valor_var"><span class="span_value_variable simple_var">'+global_var.value.toFixed(1)+'</span> <i class="icon small pencil alternate enable_edit_name_function simple_var"></i></div> ';
+			ret += '<div class="created_div_valor_var"><span class="span_value_variable simple_var">'+global_var.value.toFixed(1)+'</span>  </div> ';
 		} else {
 			if (global_var.type == Types.BOOLEAN) {
-				ret += '<div class="created_div_valor_var"><span class="span_value_variable boolean_simple_type">'+global_var.value+'</span> <i class="icon small pencil alternate enable_edit_name_function boolean_simple_type"></i></div> ';
+				ret += '<div class="created_div_valor_var"><span class="span_value_variable boolean_simple_type">'+global_var.value+'</span>  </div> ';
 			} else {
-				ret += '<div class="created_div_valor_var"><span class="span_value_variable simple_var">'+global_var.value+'</span> <i class="icon small pencil alternate enable_edit_name_function simple_var"></i></div> ';
+				ret += '<div class="created_div_valor_var"><span class="span_value_variable simple_var">'+global_var.value+'</span>  </div> ';
 			}
 		}
 	} else {
@@ -356,12 +356,15 @@ function renderValues (global_var, global_container) {
 	});
 	$( global_container ).find( ".div_valor_var" ).append(ret);
 
+
+	updateColumnsAndRowsText(global_container, global_var);
+
 }
 
 function addHandlers (global_container) {
-	var global_var = $(global_container).data('associatedOject'); 
+	var global_var = global_container.data('associatedOject'); 
 	// Manage constant option:
-	$( global_container ).find( ".alternate_constant" ).on('click', function(e){
+	global_container.find( ".alternate_constant" ).on('click', function(e){
 		toggleConstant(global_var);
 
 		$( this ).removeClass( "on off" );
@@ -373,12 +376,12 @@ function addHandlers (global_container) {
 	});
 
 	// Manage global name: 
-	$( global_container ).find( ".enable_edit_name_parameter" ).on('click', function(e){
+	global_container.find( ".enable_edit_name_parameter" ).on('click', function(e){
 		enableNameUpdate(global_container);
 	});
 
 	// Menu to change type:
-	$( global_container ).find('.ui.dropdown.global_type').dropdown({
+	global_container.find('.ui.dropdown.global_type').dropdown({
 	    onChange: function(value, text, $selectedItem) {
 	    	if ($($selectedItem).data('dimensions')) {
 	    		updateType(global_var, Types[$($selectedItem).data('type')], $($selectedItem).data('dimensions'));
@@ -387,34 +390,49 @@ function addHandlers (global_container) {
 	    	}
 
 	    	renderValues(global_var, global_container);
+
 	    }
 	});
 
 	// Remove global: 
-	$( global_container ).find( ".remove_global" ).on('click', function(e){
+	global_container.find( ".remove_global" ).on('click', function(e){
 		removeGlobal(global_var, global_container);
 	});
 
 }
 
+function updateColumnsAndRowsText (global_container, global_var) {
+	var prev = global_container.find('.text').text().split('[');
+	if (prev.length == 2) {
+		var ff = prev[0] + '[ ' + global_var.columns + ' ] ';
+		global_container.find('.text').empty();
+		global_container.find('.text').text(ff);
+	}
+	if (prev.length == 3) {
+		var ff = prev[0] + '[ ' + global_var.columns + ' ] [ ' + global_var.rows + ' ] ';
+		global_container.find('.text').empty();
+		global_container.find('.text').text(ff);
+	}
+}
+
 function renderGlobal (global_var) {
 
 	var element = '<div class="ui label global_container"><div class="global_const">const: ';
 
-	element += '<i class="ui icon toggle '+(global_var.is_constant?"on":"off")+' alternate_constant"></i></div><span class="span_name_variable enable_edit_name_parameter">'+global_var.name+'</span> <i class="icon small pencil alternate enable_edit_name_parameter"></i>';
+	element += '<i class="ui icon toggle '+(global_var.is_constant?"on":"off")+' alternate_constant"></i></div>';
  	
  	element += '<div class="ui dropdown global_type">';
 
   	if (global_var.dimensions > 0) {
   		element += '<div class="text">'+ i18n('ui:vector') + ':' + LocalizedStrings.getUI(global_var.type);
   		for (var i = 0; i < global_var.dimensions; i ++) {
-  			element += ' [ ] ';
+  			element += ' [ <span class="dimensions_'+i+'"></span> ] ';
   		}
   		element += '</div>';
   	} else {
   		element += '<div class="text">' + LocalizedStrings.getUI(global_var.type.toLowerCase()) + '</div>';
   	}
-	element += '<i class="dropdown icon"></i><div class="menu">';
+	element += '<div class="menu">';
 
 	for (var tm in Types) {
   		if (tm == Types.VOID.toUpperCase()) {
@@ -437,7 +455,7 @@ function renderGlobal (global_var) {
 	    	+ '</div>';	
   	}
 
-    element += '</div></div>  = ';
+    element += '</div></div> <div class="editing_name_var"> <span class="span_name_variable enable_edit_name_parameter">'+global_var.name+'</span> </div> <span class="character_equals"> = </span> ';
 
 	element += '<div class="ui div_valor_var">'+global_var.value+'</div>';    
 
@@ -445,13 +463,21 @@ function renderGlobal (global_var) {
 
 	var complete_element = $(element);
 
-	$(complete_element).data('associatedOject', global_var);
+	complete_element.data('associatedOject', global_var);
 
 	$('.list_globals').append(complete_element);
 
 	addHandlers(complete_element);
 
 	renderValues(global_var, complete_element);
+
+	if (global_var.dimensions == 1) {
+		complete_element.find('.dimensions_0').text(global_var.columns);
+	}
+	if (global_var.dimensions == 2) {
+		complete_element.find('.dimensions_0').text(global_var.columns);
+		complete_element.find('.dimensions_1').text(global_var.rows);
+	}
 }
 
 var opened_name_value_matrix_global_v = false;
@@ -649,36 +675,34 @@ var opened_name_global = false;
 var opened_input_global = null;
 function enableNameUpdate (global_container) {
 
-	var global_var = $(global_container).data('associatedOject'); 
+	var global_var = global_container.data('associatedOject'); 
 
 	if (opened_name_global) {
-		$(opened_input_global).focus();
+		opened_input_global.focus();
 		return;
 	}
 	opened_name_global = true;
 
-	$( global_container ).find('.span_name_variable').text('');
-	$( "<input type='text' class='width-dynamic input_name_function' autocomplete='off' autocorrect='off' autocapitalize='off' spellcheck='false' value='"+global_var.name+"' />" ).insertBefore($(global_container).find('.span_name_variable'));
+	global_container.find('.span_name_variable').text('');
+	$( "<input type='text' class='width-dynamic input_name_function' autocomplete='off' autocorrect='off' autocapitalize='off' spellcheck='false' value='"+global_var.name+"' />" ).insertBefore(global_container.find('.span_name_variable'));
 
 	$('.width-dynamic').on('input', function() {
 	    var inputWidth = $(this).textWidth()+10;
-	    opened_input_global = this;
-	    $(this).focus();
-
-	    var tmpStr = $(this).val();
-		$(this).val('');
-		$(this).val(tmpStr);
+	    opened_input_global = $(this);
+	    opened_input_global.focus();
 
-	    $(this).css({
+	    opened_input_global.css({
 	        width: inputWidth
 	    })
 	}).trigger('input');
 
 	$('.width-dynamic').focusout(function() {
 		/// update array:
-		if ($(this).val().trim()) {
+		if ($(this).val().trim().length > 0) {
 			updateName(global_var, $(this).val().trim());
-			$(global_container).find('.span_name_variable').text(global_var.name);
+			global_container.find('.span_name_variable').text(global_var.name);
+		} else {
+			global_container.find('.span_name_variable').text(global_var.name);
 		}
 		$(this).remove();
 
@@ -692,7 +716,9 @@ function enableNameUpdate (global_container) {
 		if(code == 13) {
 			if ($(this).val().trim()) {
 				updateName(global_var, $(this).val().trim());
-				$(global_container).find('.span_name_variable').text(global_var.name);
+				global_container.find('.span_name_variable').text(global_var.name);
+			} else {
+				global_container.find('.span_name_variable').text(global_var.name);
 			}
 			$(this).remove();
 
@@ -702,7 +728,7 @@ function enableNameUpdate (global_container) {
 		}
 		if(code == 27) {
 
-			$(global_container).find('.span_name_variable').text(global_var.name);
+			global_container.find('.span_name_variable').text(global_var.name);
 
 			$(this).remove();
 
@@ -711,6 +737,8 @@ function enableNameUpdate (global_container) {
 			opened_input_global = false;
 		}
 	});
+
+	 $('.width-dynamic').select();
 	
 }
 

js/visualUI/ivprog_elements.js

@@ -230,16 +230,11 @@ export class Program {
   addFunction (function_to_add) {
 
     WatchJS.watch(function_to_add.parameters_list, function(){
-      console.log("os parametros da função abaixo foram alterados:");
-      console.log(function_to_add);
+      AlgorithmManagement.renderAlgorithm();
     }, 1);
 
     WatchJS.watch(function_to_add.variables_list, function(){
-      console.log("as variáveis da função abaixo foram alteradas: ");
-      console.log(function_to_add);
-
       AlgorithmManagement.renderAlgorithm();
-
     }, 1);
 
     this.functions.push(function_to_add);

js/visualUI/variables.js

@@ -77,13 +77,11 @@ function addHandlers (variable_obj, variable_container) {
 }
 
 
-export function renderVariable(function_container, new_var, function_obj) {
+export function renderVariable (function_container, new_var, function_obj) {
 
 	var element = '<div class="ui label variable_container">';
 
-	element += '<span class="span_name_variable enable_edit_name_variable">'+new_var.name+'</span> <i class="icon small pencil alternate enable_edit_name_variable"></i>';
- 	
- 	element += '<div class="ui dropdown variable_type">';
+	element += '<div class="ui dropdown variable_type">';
 
   	if (new_var.dimensions > 0) {
   		element += '<div class="text">'+ LocalizedStrings.getUI('vector') + ':' + LocalizedStrings.getUI(new_var.type.toLowerCase());
@@ -117,9 +115,11 @@ export function renderVariable(function_container, new_var, function_obj) {
 	    	+ '</div>';	
   	}
 
-    element += '</div></div>  = ';
+    element += '</div></div> ';
 
-	element += '<div class="ui div_valor_var">'+new_var.value+'</div>';    
+    element += '<span class="span_name_variable enable_edit_name_variable">'+new_var.name+'</span> <i class="icon small pencil alternate enable_edit_name_variable"></i>';
+
+	element += ' = <div class="ui div_valor_var">'+new_var.value+'</div>';    
 
 	element += ' <i class="red icon times remove_variable"></i></div>';