Change the course

Jordi, me comentó que para evitar la carga completa de la página de Informes->Registros, la página de Moodle en la que estoy trabajando, exactamente el fichero moodle/course/report/log/index.php, modificara únicamente el Timeline para agilizar el servidor y mejorar la eficiencia.

Actualmente, estoy trabajando en esta tarea, que consiste en que al cambiar los selectores no se tenga que volver a pedir el documento HTML entero al servidor, sino que solo se actualice el Timeline. Para hacerlo utilizaré filtros, es decir, modificar el Timeline desde el cliente y sin necesida de establecer conexión con el servidor. Pero el problema es que existen algunos casos donde filtrando la información mostrada no es suficiente y hay que recargar los eventos. Para ilustrar este ejemplo supondré que tengo que cambiar una fecha determinada para ver la actividad de todos los días (opción disponible). A la hora de hacer esto hay que controlar los eventos que ya existen y los que tengo que añadir, este punto requiere trabajo en el cliente (administración de eventos) y en el servidor (la petición de los eventos a añadir en el Timeline). Por eso he pensado que sería mejor volver a cargar el archivo XML entero (donde está la información necesaria para dibujar los eventos), una solución sencilla y en la que estoy trabajando actualmente.

De esta forma dependiendo del estado estableceré dos posibles acciones:

• Si falta información
  • Recargo los eventos del XML(getxml.php)
  • Filtrar dependiendo del estado anterior
  
  
• Filtro los eventos liberando el servidor más trabajo

La tarea propuesta por Jordi, empieza ha dar sus frutos después de un tiempo. He conseguido que al cambiar el curso se cambie el Timeline sin tener que recargar la página pero si pidiendo de nuevo la información de los eventos. El visitar la Wiki de Timelines fue decisivo.

... to be continued

Reading

He estado ojeando la Wiki de Timelines de SIMILE y especialmente la sección dedicada a How-Tos, donde he dedicado una especial atención al apartado de "How to Load Events Dynamically".

La sección How-Tos recoge algunos de los problemas y consultas de los usuarios, recopilándolos por temática. Además, hay enlaces directos al Mailing List(foros con información de todos los proyectos de SIMILE) con las preguntas relacionadas.

Si necesitas documentación sobre Timelines, te recomiendo estimado lector que entres primeramente en la sección Wiki , es más completa que la sección de documentación estática. Incluso en la misma página principal de SIMILE Timeline se dice que se ha transferido la información a la wiki para facilitar el mantenimiento.

¡¡¡ Escoge la forma de hacerlo wiki !!!

La notación JSON

Leyendo Introducción a AJAX, he encontrado que la notación utilizada en la mayoría de scripts de Timeline y en su definición, es la JSON, que es básicamente una forma estructurada de componer los objetos y arrays.

Según el libro: “La notación de objetos mediante JSON es una de las características principales de JavaScript y un mecanismo definido en los fundamentos básicos del lenguaje. JSON permite definir arrays y objetos de una manera concisa, lo que supone una gran ventaja respecto de la notación tradicional de los objetos y los arrays”.

Un ejemplo de la notación JSON para crear objetos sería:

var objeto = {
"propiedad1": valor_simple_1,
"propiedad2": valor_simple_2,
"propiedad3": [array1_valor1, array1_valor2],
"propiedad4": { "propiedad anidada": valor },
"metodo1": nombre_funcion_externa,
"metodo2": function() { ... },
"metodo3": function() { ... },
"metodo4": function() { ... }
};

Siguiendo con la lectura, he encontrado una sutil diferencia a la hora de crear objetos o como dice el libro, pseudoclases. La diferencia está en la propiedad prototype. Me explico, los métodos que se definen con protoype se crean una sola vez para todos los objetos, en cambio, si no utilizamos prototype, se crea el mismo método para cada objeto y en consecuencia ocupando más espacio. Utilizando protoype, podemos redefinir metodos de clases ya existentes o bien añadir nuevos.

Para ilustrarlo mejor adjunto un ejemplo de la propiedad prototype.

Clase original
function Factura(idFactura, idCliente) {
this.idFactura = idFactura;
this.idCliente = idCliente;
this.muestraCliente = function() {
alert(this.idCliente);
}
this.muestraId = function() {
alert(this.idFactura);
}
}

Clase que utiliza su prototype
function Factura(idFactura, idCliente) {
this.idFactura = idFactura;
this.idCliente = idCliente;
}
Factura.prototype.muestraCliente = function() {
alert(this.idCliente);
}
Factura.prototype.muestraId = function() {
alert(this.idFactura);
}

AJAX

Tras leer algunos apartados de Introducción a Javascript, que me han servido para solucionar algunos problemas que tenía con los Timelines, he comenzado a leer otro libro que también me puede ser de gran ayuda, se llama Introducción a AJAX, del mismo autor que Introducción al Javascript (Javier Eguíluz Pérez) y de la misma página web.

Este libro trata con más profundidad el tema DOM y Javascript, y por eso creo que me puede servir de cara a trabajar con Timelines.

DOM Inspector

Utilizando el DOM Inspector de la pestaña de herramientas de Mozilla, he encontrado que aunque el código del html tenga dos bodys (uno con identidad y el otro no) los eventos de onload y onresize, que están en el segundo, pasan a estar en el primer body.

Igualmente he quitado el body que servía para cargar el Timeline y reescalarlo, y he añadido estos dos eventos a través de un javascript con las siguientes instrucciones:

---

window.onload=onLoad;
window.onresize=onResize;

---

Al objeto window podemos definirle cuales serán las funciones o sentencias a llamar cuando se generen los eventos onload y onresize de la ventana.

El menú del día

Esta tarde he estado practicando en un menú opcional para la visualización del Timeline. Esta idea consiste en añadir una menú para poder redefinir algunos aspectos de la visualización del Timeline (el tamaño básicamente, pero también otras personalizaciones), y también de paso, empezar ha trabajar más en JavaScript. Hasta ahora, la mayor parte de código que he programado ha sido en php y quería comenzar ha trabajar un poco más JavaScript.

El primer libro que leí de JavaScript durante el verano, Guía Practica de JavaScript , ha sido de ayuda en algunos aspectos, pero no abarcaba otros que son importantes. El libro se centraba en la manipulación de objetos ya existentes en html pero no se hacía referencia al Document Object Model, DOM.

En la búsqueda de otro manual más reciente, he encontrado un libro con licencia Creative Commons llamado “Introducción al JavaScript” de Javier Eguíluz Pérez. En este libro he encontrado funciones del navegador(?) que desconocía, como por ejemplo createElement, appendChild o removeChild. Solo decir que me ha ayudado bastante para empezar ha trabajar más en JavaScript.

See you.

getxml.php, O.K.

He acabado de solucionar los problemas que había descrito anteriormente.

El primer problema es que habían caracteres inválidos en la variable $getaxml, dicha variable tenía comillas dobles repetidas e innecesarias. Que afectaban directamente a la función loadXML.

El segundo problema era que se realizaba una llamada a la función build_logs_array en de la librería /moodle/course/lib.php con un parámetro incorrecto.

También he creado el archivo /moodle/course/report/log/timeline.lib.php con dos sencillas funciones que se utilizan en /moodle/course/report/log/getxml.php, comentadas en formato javadoc.

Con más técnica!!!

Entre ayer y hoy, he acabado de leer el documento del Dfwikiteam de “Tècniques de programació especifiques per PHP” de Ferran Recio Calderó. Ha sido un lectura muy amena de un manual de programación, su tono informal y los ejemplos facilitan considerablemente la compresión a lector.

Reordenando

Hoy, he estado trabajando en cambiar la función que generaba el archivo xml, que estaba almacenada en /moodle/course/report/log/lib.php al nuevo archivo /moodle/course/report/log/get_xml.php.

Me he encontrado con dos problemas que espero solucionar lo antes posible. El primero es que el timeline no se muestra bien y el segundo que es independiente del primero, la información de los eventos que genera el archivo get_xml.php, no inserta ningún evento, seguramente se trata de una llamada errónea en la obtención de los logs de la base de datos de Moodle.

"Revisando código"

Tras la reunión del pasado lunes, estoy revisando el código ya hecho de timelines por los compañeros del DFWikiteam.

De momento tengo que cambiar el funcionamiento de generar un archivo para cada usuario, donde se encuentran los eventos solicitados, por el de llamar a una nueva página php para generar el xml de forma más dinámica, con el fin de evitar que cualquier persona pueda ver los logs (xml’s guardados en el disco) solicitados por los demás. La idea propuesta por Jordi Piguillem, es de los más acertada. Primero me centraré en conseguir esto y después comprobaré la seguridad, al igual que lo hace Moodle.

He conseguido solucionar el problema que tenía con la API de Timelines. Resulta que no había descargado todos los archivos necesarios para el correcto funcionamiento del Timeline. Y por este motivo tenía que acceder constantemente a la página oficial.

Identifícate

Había detectado un fallo cuando se cambiaban los participante.

Cuando se seleccionaba de “Todos los usuarios” a “Invitado”, siempre se pintaban en el timeline los mismos eventos. Esto era debido a que tras haber conseguido los registros de todos los usuarios, se creaba el archivo 0_info_timeline.xml (“id. del participante solicitado”_info_timeline.xml, en este caso todos) y al pedir el registro del invitado creaba otro archivo con un número distinto, pero en la inicialización de variables del timeline solo se utilizaba el archivo 0_info_timeline.xml.

Este error conceptual lo he solucionado cambiando la “id. del participante” por la “id. de la persona que esta accediendo a los registros” que era en principio lo que tenia en mente, de esta forma solo hay un archivo por usuario en el servidor. Otra razón era la de evitar conflictos con los archivos.

Más detalladamente, he insertado un input hidden con el número de identificación del usuario y desde el JavaScript tomo el valor guardado, esto implica que la inicialización de las variables del timeline debe ser posterior a la definición del input.