iassign-integration-functions.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510
  1. // Função para ler parâmetros informados pelo iTarefa via URL
  2. // Apesar de não ser obrigatório, será muito útil para capturar os parâmetros
  3. function getParameterByName (name, defaultReturn = null) {
  4. var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
  5. return match ? decodeURIComponent(match[1].replace(/\+/g, ' ')) : defaultReturn;
  6. }
  7. // Criando um object com os parâmetros informados pelo iTarefa
  8. // Observe que para cada parâmetro, é realizada a chamada do método getParameterByName, implementado acima
  9. var iLMparameters = {
  10. iLM_PARAM_ServerToGetAnswerURL: getParameterByName("iLM_PARAM_ServerToGetAnswerURL"),
  11. iLM_PARAM_SendAnswer: getParameterByName("iLM_PARAM_SendAnswer"),
  12. iLM_PARAM_AssignmentURL: getParameterByName("iLM_PARAM_AssignmentURL"),
  13. iLM_PARAM_Assignment: getParameterByName("iLM_PARAM_Assignment"),
  14. lang: getParameterByName("lang", "pt")
  15. };
  16. // Set the lang parameter to the localStorage for easy access
  17. // and no dependency to the global scope, avoind future 'strict mode' problems
  18. //localStorage.setItem('ivprog.lang', iLMparameters.lang);
  19. // Função chamada pelo iTarefa quando o professor finaliza a criação da atividade
  20. // ou quando o aluno finaliza a resolução do exercício
  21. // O retorno é um JSON com os dados do exercício ou da resolução
  22. // Esse retorno será armazenado no banco de dados do Moodle, pelo iTarefa
  23. function getAnswer () {
  24. // Se o parâmetro "iLM_PARAM_SendAnswer" for false,
  25. // então trata-se de resolução de atividade
  26. if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
  27. // Montar o retorno com a resposta do aluno
  28. var contentToSend = previousContent.split("\n::algorithm::")[0];
  29. contentToSend += '\n::algorithm::\n';
  30. contentToSend += JSON.stringify(window.program_obj, function(key, value) {
  31. if (key == 'dom_object') {
  32. return;
  33. }
  34. return value;
  35. });
  36. contentToSend += '\n::logs::';
  37. contentToSend += getTrackingLogs();
  38. return contentToSend;
  39. } else {
  40. // Montar o retorno com a criação da atividade do professor
  41. var ret = ' { ' + prepareTestCases()
  42. + ',\n"settings_data_types": \n' + JSON.stringify($('form[name="settings_data_types"]').serializeArray())
  43. + ',\n"settings_commands": \n' + JSON.stringify($('form[name="settings_commands"]').serializeArray())
  44. + ',\n"settings_functions": \n' + JSON.stringify($('form[name="settings_functions"]').serializeArray())
  45. + ' } ';
  46. if ($("input[name='include_algo']").is(':checked')) {
  47. ret += '\n::algorithm::\n';
  48. ret += JSON.stringify(window.program_obj, function(key, value) {
  49. if (key == 'dom_object') {
  50. return;
  51. }
  52. return value;
  53. });
  54. }
  55. return ret;
  56. }
  57. }
  58. function prepareTestCases () {
  59. var ret = ' \n "testcases" : [ '
  60. var test_cases_array = $('form[name="test_cases"]').serializeArray();
  61. for (var i = 0; i < test_cases_array.length; i = i + 2) {
  62. ret += '\n{ ';
  63. ret += '\n "input": [';
  64. var inps = test_cases_array[i].value.match(/[^\r\n]+/g);
  65. if (inps) {
  66. for (var j = 0; j < inps.length; j++) {
  67. ret += '"' + inps[j] + '"';
  68. if ((j + 1) < inps.length) {
  69. ret += ', ';
  70. }
  71. }
  72. }
  73. ret += '], \n "output": [';
  74. var outs = test_cases_array[i+1].value.match(/[^\r\n]+/g);
  75. if (outs) {
  76. for (var j = 0; j < outs.length; j++) {
  77. ret += '"' + outs[j] + '"';
  78. if ((j + 1) < outs.length) {
  79. ret += ', ';
  80. }
  81. }
  82. }
  83. ret += ']';
  84. ret += '\n}'
  85. if ((i + 2) < test_cases_array.length) {
  86. ret += ',';
  87. }
  88. }
  89. ret += '\n] ';
  90. return ret;
  91. }
  92. // Função chamada pelo iTarefa para receber a nota do aluno na atividade
  93. // O retorno é um valor entre 0.0 e 1.0
  94. function getEvaluation () {
  95. if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
  96. // A chamada do método abaixo é obrigatória!
  97. // Observe que a chamada parte do iLM para o iTarefa
  98. //parent.getEvaluationCallback(window.studentGrade);
  99. runCodeAssessment();
  100. }
  101. }
  102. //var testCases = null;
  103. var settingsDataTypes = null;
  104. var settingsCommands = null;
  105. var settingsFunctions = null;
  106. var algorithm_in_ilm = null;
  107. var previousContent = null;
  108. // Função para que o iMA leia os dados da atividade fornecidos pelo iTarefa
  109. function getiLMContent () {
  110. // O parâmetro "iLM_PARAM_Assignment" fornece o URL do endereço que deve ser
  111. // requisitado via AJAX para a captura dos dados da atividade
  112. $.get(iLMparameters.iLM_PARAM_Assignment, function (data) {
  113. // Aluno está trabalhando em alguma atividade:
  114. if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
  115. previousContent = data;
  116. prepareActivityToStudent(data);
  117. } else { // Professor está editando uma atividade:
  118. previousContent = data;
  119. prepareActivityToEdit(data);
  120. }
  121. window.block_render = false;
  122. renderAlgorithm();
  123. });
  124. }
  125. function prepareActivityToEdit (ilm_cont) {
  126. //var content = JSON.parse(ilm_cont.split('\n::algorithm::')[0]);
  127. // Ver arquivo js/util/iassignHelpers.js
  128. var content = ivprogCore.prepareActivityToStudentHelper(ilm_cont);
  129. var testCases = ivprogCore.getTestCases();
  130. settingsDataTypes = content.settingsDataTypes;
  131. settingsCommands = content.settingsCommands;
  132. settingsFunctions = content.settingsFunctions;
  133. for (var i = 0; i < testCases.length; i++) {
  134. addTestCase(testCases[i]);
  135. }
  136. if (content.algorithmInIlm != null) {
  137. algorithm_in_ilm = content.algorithmInIlm;
  138. $("input[name='include_algo']").prop('checked', true);
  139. includePreviousAlgorithm();
  140. renderAlgorithm();
  141. }
  142. }
  143. function parsePreviousAlgorithm () {
  144. window.program_obj.functions = JSON.parse(algorithm_in_ilm).functions;
  145. window.program_obj.globals = JSON.parse(algorithm_in_ilm).globals;
  146. }
  147. function includePreviousAlgorithm () {
  148. parsePreviousAlgorithm();
  149. window.watchW.watch(window.program_obj.globals, function(){
  150. if (window.insertContext) {
  151. setTimeout(function(){ renderAlgorithm(); }, 300);
  152. window.insertContext = false;
  153. } else {
  154. renderAlgorithm();
  155. }
  156. }, 1);
  157. for (var i = 0; i < window.program_obj.functions.length; i ++) {
  158. window.watchW.watch(window.program_obj.functions[i].parameters_list, function(){
  159. if (window.insertContext) {
  160. setTimeout(function(){ renderAlgorithm(); }, 300);
  161. window.insertContext = false;
  162. } else {
  163. renderAlgorithm();
  164. }
  165. }, 1);
  166. window.watchW.watch(window.program_obj.functions[i].variables_list, function(){
  167. if (window.insertContext) {
  168. setTimeout(function(){ renderAlgorithm(); }, 300);
  169. window.insertContext = false;
  170. } else {
  171. renderAlgorithm();
  172. }
  173. }, 1);
  174. if (window.program_obj.functions[i].is_main) {
  175. window.program_obj.functions[i].name = LocalizedStrings.getUI("start");
  176. }
  177. }
  178. window.watchW.watch(window.program_obj.functions, function(){
  179. if (window.insertContext) {
  180. setTimeout(function(){ renderAlgorithm(); }, 300);
  181. window.insertContext = false;
  182. } else {
  183. renderAlgorithm();
  184. }
  185. }, 1);
  186. }
  187. function prepareActivityToStudent (ilm_cont) {
  188. // Ver arquivo js/util/iassignHelpers.js
  189. var content = ivprogCore.prepareActivityToStudentHelper(ilm_cont);
  190. // Casos de testes agora são delegados ao tratamento apropriado pela função acima
  191. // var testCases = content.testcases;
  192. settingsDataTypes = content.settingsDataTypes;
  193. settingsCommands = content.settingsCommands;
  194. settingsFunctions = content.settingsFunctions;
  195. if (content.algorithmInIlm != null) {
  196. algorithm_in_ilm = content.algorithmInIlm;
  197. includePreviousAlgorithm();
  198. }
  199. $('.assessment_button').removeClass('disabled');
  200. renderAlgorithm();
  201. }
  202. // Função para organizar se para criação, visualização ou resolução de atividade
  203. function prepareEnvironment () {
  204. if ((iLMparameters.iLM_PARAM_AssignmentURL == "true") && (iLMparameters.iLM_PARAM_SendAnswer == "true")) {
  205. prepareActivityCreation();
  206. }
  207. }
  208. $(document).ready(function() {
  209. // Disable by default...
  210. $('.assessment_button').addClass('disabled');
  211. // Se iLM_PARAM_SendAnswer for false, então trata-se de resolução de atividade,
  212. // portanto, a "DIV" de resolução é liberada
  213. if (iLMparameters.iLM_PARAM_SendAnswer == 'false') {
  214. //$('.resolucao').css("display","block");
  215. getiLMContent();
  216. $('.div_to_body').mousemove(function(e) {
  217. trackingMatrix.push(adCoords(e, 0));
  218. });
  219. $('.div_to_body').click(function(e) {
  220. trackingMatrix.push(adCoords(e, 1));
  221. });
  222. } else {
  223. // Caso não esteja em modo de resolução de atividade, a visualização no momento
  224. // é para a elaboração de atividade:
  225. //$('.elaboracao').css("display","block");
  226. // Se possuir o parâmetro iLMparameters.iLM_PARAM_Assignment, o professor
  227. // está editando uma atividade:
  228. if (iLMparameters.iLM_PARAM_Assignment) {
  229. getiLMContent();
  230. }
  231. }
  232. if (inIframe()) {
  233. orderIcons();
  234. orderWidth();
  235. }
  236. // renderAlgorithm();
  237. });
  238. // Função para preparar a interface para o professor criar atividade:
  239. function prepareActivityCreation () {
  240. $('.add_accordion').addClass('accordion');
  241. $('.default_visual_title').toggle();
  242. $('.default_visual_title').append('<span>'+LocalizedStrings.getUI('text_teacher_algorithm')+'</span>');
  243. $('.height_100').removeClass('height_100');
  244. $('.main_title').remove();
  245. $('.ui.accordion').addClass('styled');
  246. $('<div class="content_margin"></div>').insertBefore($('.add_accordion').find('.content').find('.div_to_body'));
  247. $('<div class="ui checkbox"><input type="checkbox" name="include_algo" class="include_algo" tabindex="0" class="hidden"><label>'+LocalizedStrings.getUI('text_teacher_algorithm_include')+'</label></div>').insertAfter('.content_margin');
  248. var cases_test_div = $('<div class="ui accordion styled"><div class="active title"><i class="dropdown icon"></i>'+LocalizedStrings.getUI('text_teacher_test_case')+'</div><div class="active content"></div></div>');
  249. cases_test_div.insertBefore('.accordion');
  250. var config_div = $('<div class="ui accordion styled"><div class="title"><i class="dropdown icon"></i>'+LocalizedStrings.getUI('text_teacher_config')+'</div><div class="content"></div></div>');
  251. config_div.insertAfter(cases_test_div);
  252. $('.ui.accordion').accordion();
  253. $('.ui.checkbox').checkbox();
  254. prepareTableSettings(config_div.find('.content'));
  255. prepareTableTestCases(cases_test_div.find('.content'));
  256. if (inIframe()) {
  257. $('.ui.styled.accordion').css('width', '96%');
  258. }
  259. }
  260. function prepareTableTestCases (div_el) {
  261. var table_el = '<form name="test_cases"><table class="ui blue table"><thead><tr><th width="30px">#</th><th>'+LocalizedStrings.getUI('text_teacher_test_case_input')+'</th><th>'+LocalizedStrings.getUI('text_teacher_test_case_output')+'</th><th width="80px">'+LocalizedStrings.getUI('text_teacher_test_case_actions')+'</th></tr></thead>'
  262. + '<tbody class="content_cases"></tbody></table></form>';
  263. div_el.append(table_el);
  264. div_el.append('<button class="ui teal labeled icon button button_add_case"><i class="plus icon"></i>'+LocalizedStrings.getUI('text_teacher_test_case_add')+'</button>');
  265. $('.button_add_case').on('click', function(e) {
  266. addTestCase();
  267. });
  268. }
  269. var hist = false;
  270. function addTestCase (test_case = null) {
  271. var new_row = null;
  272. if (test_case) {
  273. var text_row = '';
  274. text_row += '<tr><td class="counter"></td><td class="expandingArea"><textarea rows="'+test_case.input.length+'" name="input" class="text_area_input">';
  275. for (var i = 0; i < test_case.input.length; i ++) {
  276. text_row += test_case.input[i];
  277. if ((i + 1) < test_case.input.length) {
  278. text_row += '\n';
  279. }
  280. }
  281. text_row += '</textarea></td><td class="expandingArea"><textarea rows="'+test_case.output.length+'" name="output" class="text_area_output">';
  282. for (var i = 0; i < test_case.output.length; i ++) {
  283. text_row += test_case.output[i];
  284. if ((i + 1) < test_case.output.length) {
  285. text_row += '\n';
  286. }
  287. }
  288. text_row += '</textarea></td><td class="btn_actions"><div class="ui button_remove_case"><i class="red icon times large"></i></div></td></tr>';
  289. new_row = $(text_row);
  290. } else {
  291. new_row = $('<tr><td class="counter"></td><td class="expandingArea"><textarea rows="1" name="input" class="text_area_input"></textarea></td><td class="expandingArea"><textarea rows="1" name="output" class="text_area_output"></textarea></td><td class="btn_actions"><div class="ui button_remove_case"><i class="red icon times large"></i></div></td></tr>');
  292. }
  293. $('.content_cases').append(new_row);
  294. new_row.find('.button_remove_case').click(function(e) {
  295. new_row.remove();
  296. updateTestCaseCounter();
  297. });
  298. new_row.find('textarea').on('input', function(e) {
  299. var lines = $(this).val().split('\n').length;
  300. $(this).attr('rows', lines);
  301. });
  302. updateTestCaseCounter();
  303. $('.text_area_output').keydown(function(e) {
  304. var code = e.keyCode || e.which;
  305. if (code == 9 && $(this).closest("tr").is(":last-child")) {
  306. hist = true;
  307. addTestCase();
  308. }
  309. });
  310. if (test_case == null) {
  311. if (!hist) {
  312. $( ".content_cases tr:last" ).find('.text_area_input').focus();
  313. } else {
  314. hist = false;
  315. }
  316. }
  317. }
  318. function updateTestCaseCounter () {
  319. var i = 1;
  320. $( ".content_cases" ).find('tr').each(function() {
  321. $( this ).find('.counter').text(i);
  322. i ++;
  323. });
  324. }
  325. function prepareTableSettings (div_el) {
  326. div_el.append('<h4 class="ui header">'+LocalizedStrings.getUI('text_teacher_data_types')+'</h4>');
  327. div_el.append('<form name="settings_data_types"><div class="ui stackable five column grid">'
  328. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="integer_data_type" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('integer')+'</label></div></div>'
  329. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="real_data_type" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('real')+'</label></div></div>'
  330. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="text_data_type" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text')+'</label></div></div>'
  331. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="boolean_data_type" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('boolean')+'</label></div></div>'
  332. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="void_data_type" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('void')+'</label></div></div>'
  333. +'</div></form>');
  334. div_el.append('<h4 class="ui header">'+LocalizedStrings.getUI('text_teacher_commands')+'</h4>');
  335. div_el.append('<form name="settings_commands"><div class="ui stackable three column grid">'
  336. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_read" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_read_var')+'</label></div></div>'
  337. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_write" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_write_var')+'</label></div></div>'
  338. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_comment" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_comment')+'</label></div></div>'
  339. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_attribution" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_attribution')+'</label></div></div>'
  340. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_functioncall" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_functioncall')+'</label></div></div>'
  341. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_iftrue" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_iftrue')+'</label></div></div>'
  342. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_repeatNtimes" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_repeatNtimes')+'</label></div></div>'
  343. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_while" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_whiletrue')+'</label></div></div>'
  344. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_dowhile" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_dowhiletrue')+'</label></div></div>'
  345. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="commands_switch" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_switch')+'</label></div></div>'
  346. +'</div></form>');
  347. div_el.append('<h4 class="ui header">'+LocalizedStrings.getUI('text_teacher_functions')+'</h4>');
  348. div_el.append('<form name="settings_functions"><div class="ui stackable one column grid">'
  349. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="functions_creation" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_teacher_create_functions')+'</label></div></div>'
  350. +'<div class="column"><div class="ui checkbox"><input type="checkbox" name="functions_move" checked tabindex="0" class="hidden small"><label>'+LocalizedStrings.getUI('text_teacher_create_movement_functions')+'</label></div></div>'
  351. +'</div></form>');
  352. $('.ui.checkbox').checkbox();
  353. }
  354. function getTrackingLogs () {
  355. var ret = "";
  356. for (var i = 0; i < trackingMatrix.length; i++) {
  357. ret += "\n" + trackingMatrix[i][0] + "," + trackingMatrix[i][1] + "," + trackingMatrix[i][2];
  358. if (trackingMatrix[i][3] === 1) {
  359. ret += ',' + trackingMatrix[i][3] + ',"' + trackingMatrix[i][4] + '"';
  360. }
  361. }
  362. return ret;
  363. }
  364. // Tracking mouse movements
  365. var trackingMatrix = [];
  366. function adCoords(e, code){
  367. var x = e.pageX;
  368. var y = e.pageY;
  369. if (code === 1) {
  370. return [new Date().getTime(), x, y, code, e.target.classList['value']];
  371. } else {
  372. return [x, y, code];
  373. }
  374. }
  375. // $( document ).ready(function() {
  376. // if (inIframe()) {
  377. // orderIcons();
  378. // orderWidth();
  379. // }
  380. // renderAlgorithm();
  381. // });
  382. function orderWidth() {
  383. $('.ui.raised.container.segment.div_to_body').css('width', '100%');
  384. $('.ui.one.column.container.segment.ivprog_visual_panel').css('width', '100%');
  385. }
  386. function orderIcons() {
  387. $('.ui.one.column.doubling.stackable.grid.container').css('display', 'none');
  388. $('.only_in_frame').css('display', 'block');
  389. }
  390. function inIframe () {
  391. try {
  392. return window.self !== window.top;
  393. } catch (e) {
  394. return true;
  395. }
  396. }
  397. function full_screen() {
  398. // check if user allows full screen of elements. This can be enabled or disabled in browser config. By default its enabled.
  399. //its also used to check if browser supports full screen api.
  400. if("fullscreenEnabled" in document || "webkitFullscreenEnabled" in document || "mozFullScreenEnabled" in document || "msFullscreenEnabled" in document) {
  401. if(document.fullscreenEnabled || document.webkitFullscreenEnabled || document.mozFullScreenEnabled || document.msFullscreenEnabled) {
  402. var element = document.getElementById("ui_main_div");
  403. //requestFullscreen is used to display an element in full screen mode.
  404. if("requestFullscreen" in element) {
  405. element.requestFullscreen();
  406. }
  407. else if ("webkitRequestFullscreen" in element) {
  408. element.webkitRequestFullscreen();
  409. }
  410. else if ("mozRequestFullScreen" in element) {
  411. element.mozRequestFullScreen();
  412. }
  413. else if ("msRequestFullscreen" in element) {
  414. element.msRequestFullscreen();
  415. }
  416. }
  417. } else {
  418. $('.expand_button').addClass('disabled');
  419. }
  420. }