{"id":3142,"date":"2016-01-10T22:15:45","date_gmt":"2016-01-10T20:15:45","guid":{"rendered":"http:\/\/reddescartes.org\/documentacion\/?p=3142"},"modified":"2021-08-06T17:25:57","modified_gmt":"2021-08-06T16:25:57","slug":"comunicacion-con-javascript-desde-una-escena-descartes-a-la-api-de-una-plataforma-educativa-via-paquete-scorm","status":"publish","type":"post","link":"https:\/\/reddescartes.org\/documentacion\/comunicacion-con-javascript-desde-una-escena-descartes-a-la-api-de-una-plataforma-educativa-via-paquete-scorm\/","title":{"rendered":"Comunicaci\u00f3n con JavaScript desde una escena Descartes a la API de una plataforma educativa v\u00eda paquete Scorm"},"content":{"rendered":"

Elena \u00c1lvarez nos ense\u00f1aba en un post (elaboraci\u00f3n Scorm con Reload)<\/a> el modo de usar las funciones de comunicaci\u00f3n de Descartes que, mediante la inclusi\u00f3n de un iFrame (v\u00e9ase este art\u00edculo)<\/a> en una escena de descartes, nos permit\u00eda elaborar un paquete Scorm funcional y capaz de pasar par\u00e1metros (la nota, por ejemplo) a una plataforma educativa (por ejemplo Moodle).<\/p>\n

En un anterior post m\u00edo indicaba el modo de comunicar mediante instrucciones de JavaScript una escena de descartes con una p\u00e1gina web totalmente independiente. En el ejemplo que expon\u00eda pas\u00e1bamos 6 par\u00e1metros a una p\u00e1gina independiente o, incluso, pod\u00edamos pasar par\u00e1metros a Google Maps con JavaScript. V\u00e9ase post explicativo<\/a><\/p>\n

Tenemos otro modo de comunicar una escena de Descartes-JS con la API de la plataforma educativa (Mooddle, por ejemplo) usando directamente JavaScript.  He realizado un paquete scorm con una actividad (con test) desde un punto de vista diferente al realizado por la compa\u00f1era Elena \u00c1lvarez.<\/p>\n

En este caso, la escena de descartes (descartes.html) es la que est\u00e1 embebida (como un iframe) en la p\u00e1gina padre (index.html) y se env\u00eda la informaci\u00f3n a trav\u00e9s de dos botones incluidos en la escena de Descartes (comunicaci\u00f3n entre una escena descartes y una p\u00e1gina web<\/a>) que en este caso se denominan \u00abvalidar nota\u00bb y \u00abfinalizar\u00bb.<\/p>\n

En este caso, no necesitamos ning\u00fan fichero.js ni librer\u00eda adicional ya que los scripts necesarios para la comunicaci\u00f3n con el API de la plataforma educativa se encuentran en la p\u00e1gina index.html, en la que podemos a\u00f1adir otras funcionalidades.<\/p>\n

Por otra parte, podemos enviar otro tipo de informaci\u00f3n adicional (bien desde la propia escena.html descartes, o bien desde la p\u00e1gina index.html, seg\u00fan convenga) como el tiempo que dur\u00f3 la realizaci\u00f3n del test o la visualizaci\u00f3n de la escena, n\u00famero de tentativas realizadas…<\/p>\n

En la escena debemos incluir una variable llamada nota4  y otra llamada Score (el nombre de estas variables, l\u00f3gicamente, los podemos cambiar) que ser\u00e1 el resultado del c\u00e1lculo de la nota final de la escena en un algoritmo de descartes:<\/p>\n

nota4=’getElementById(cogenota).value = Score’<\/span><\/strong><\/p>\n

\"\"

Aspecto del algoritmo<\/p><\/div>\n

Lo que hace el algoritmo es depositar el resultado (Score) en el elemento de la p\u00e1gina index.html identificado como \u00abcogenota\u00bb (que est\u00e1 oculto).<\/p>\n

Si descomprimimos el paquete scorm que adjunto, podemos simplificar mucho su elaboraci\u00f3n, ya que simplemente deber\u00edamos sustituir la p\u00e1gina escena.html por otra con el mismo nombre adicionando estos dos botones:
\nid=’n37′ tipo=’num\u00e9rico’ interfaz=’bot\u00f3n’ regi\u00f3n=’interior’ espacio=’E5′ nombre=’Validar respuestas’ expresi\u00f3n='(160,150,140,30)’ fijo=’s\u00ed’ visible=’s\u00ed’ color=’blanco’ color-int=’rojo’ negrita=’s\u00ed’ subrayada=’s\u00ed’ fuente puntos=’14’ acci\u00f3n=’abrir URL’ par\u00e1metro=’javascript:void(parent.document.getElementById(&squot;cogenota&squot;).innerHTML=[Score]);’<\/span><\/strong><\/p>\n

\"\"

Bot\u00f3n \u00abValidar respuestas\u00bb. El c\u00f3digo se inserta en \u00abAbrir URL\u00bb de la escena de Descartes<\/p><\/div>\n

La funci\u00f3n parent.document.getElementById(\u00abcogenota\u00bb).innerHTML=[Score] <\/em>toma la nota de la p\u00e1gina index.html.<\/p>\n

y<\/p>\n

id=’n47′ tipo=’num\u00e9rico’ interfaz=’bot\u00f3n’ regi\u00f3n=’interior’ espacio=’E5′ nombre=’Finalizar’ expresi\u00f3n='(300,150,80,30)’ fijo=’s\u00ed’ visible=’s\u00ed’ color=’blanco’ color-int=’azul’ negrita=’s\u00ed’ subrayada=’s\u00ed’ fuente puntos=’14’ acci\u00f3n=’abrir URL’ par\u00e1metro=’javascript:void(window.parent.SetScormScore());’ pos_mensajes=’centro’<\/span><\/strong><\/p>\n

\"\"

Bot\u00f3n \u00abFinalizar\u00bb. El c\u00f3digo lo colocamos en \u00abAbrir URL\u00bb de Descartes<\/p><\/div>\n

La funci\u00f3n window.parent.SetScormScore(),  <\/em>env\u00eda la nota al core de Moodle (por ejemplo) .
\nPara finalizar, metemos la escena.html en el scorm (arrastrar y soltar) y, si es necesario, modificamos las dimensiones del iframe en index.html para que se adapte a las dimensiones de la simulaci\u00f3n.
\nLa escena.html se puede abrir perfectamente en el editor de Descartes (la he abierto muchas veces y no se perdi\u00f3 informaci\u00f3n).
\nAdjunto el scorm para que se pruebe (lo pod\u00e9is descomprimir y cambiar la escena), se hicieron pruebas en Moodle 2.6++ y 3.0.1 y funcion\u00f3 bien.<\/p>\n

Pod\u00e9is bajar el Scorm en: Bajada del scorm<\/a>
\nTambi\u00e9n pod\u00e9is a\u00f1adir el paquete scorm como \u00abpaquete bajado\u00bb  en las definiciones de Moodle desde la direcci\u00f3n anterior en:<\/p>\n

https:\/\/www.reddescartes.org\/repositorio\/pasovariableswebindep-JS\/scorm_descartes.zip<\/a><\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Elena \u00c1lvarez nos ense\u00f1aba en un post (elaboraci\u00f3n Scorm con Reload) el modo de usar las funciones de comunicaci\u00f3n de Descartes que, mediante la inclusi\u00f3n de un iFrame (v\u00e9ase este art\u00edculo) en una escena de descartes, nos permit\u00eda elaborar un paquete Scorm funcional y capaz de pasar par\u00e1metros (la nota, por ejemplo) a una plataforma educativa (por ejemplo Moodle). En un anterior post m\u00edo indicaba el modo de comunicar mediante instrucciones de JavaScript una escena de descartes con una p\u00e1gina web totalmente independiente. En el ejemplo que expon\u00eda pas\u00e1bamos 6 par\u00e1metros a una p\u00e1gina independiente o, incluso, pod\u00edamos pasar par\u00e1metros a<\/p>\n[Leer m\u00e1s...]<\/a>","protected":false},"author":11,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[4,23,103,32],"tags":[116,118,92,117],"_links":{"self":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts\/3142"}],"collection":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/comments?post=3142"}],"version-history":[{"count":9,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts\/3142\/revisions"}],"predecessor-version":[{"id":3357,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/posts\/3142\/revisions\/3357"}],"wp:attachment":[{"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/media?parent=3142"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/categories?post=3142"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/reddescartes.org\/documentacion\/wp-json\/wp\/v2\/tags?post=3142"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}