Blog Tecnológico de Azalorea

Tras implementar Google Maps en algunos proyectos decidí crear una clase (no encontré ninguna que me ofrecía lo que biscaba) con las funcionalidades que necesito.

Al final resultó ser bastante modular y supongo que le puede servir a otra gente para facilitar el uso del API. Iré ampliandola con el tiempo según surja la necesidad.

Para usar la clase hay que disponer de Prototype y Scriptaculous (builder.js para la creación de nodos en caso de querer usar controles costumizados).

El uso de la clase es muy fácil:

myMap = new azaPlotter( ‘idDivDelMapa’ );
myMap.setCoords( latitud, longitud );
myMap.add_control( ‘tipoControl’ ); // opcional
myMap.add_custom_control( {img:’pathDeLaImagen’,x:posicionX,y:posicionY,onclick:miFuncion} ); // opcional
myMap.add_marker( posicionX,posicionY, ‘texto para el tooltip’ ); // opcional
myMap.draw();

add_control(): añade un objeto control predefinido por Google como el zoom o el tipo de vista (mapa,satélite,mixto).
add_custom_control(): añade un objeto control propio… por momento solo puede ser una imagen y la posición se define partiendo del rincón derecho arriba.
add_marker(). añade un objeto tipo marcador al mapa. El tooltip aparece cuando el usuario hace click en el marcador.

La diferencia entre el objeto control y el objeto marcador está en que el control es fijo y el marcador se mueve con el mapa.

Ir a la página de la librería

Es una primera versión que seguramente irá evolucionando

[UPDATE] He creado una página aparte para la librería en la cual se podrá seguir la evolución de la misma.

Prototype ha visto la luz en su nueva versión 1.5. Paralelamente Sam Stephenson (el inventor de Prototype) ha publicado un nuevo website, http.//prototypejs.org, con la documentación online que tanto pidieron los usuarios. Un apartado de la página está dedicado a artículos sobre el funcionamiento de Prototype y otro a la documentación del API.

Al parecer se ha formado un núcleo de desarrolladores para Prototype que se reparte las tareas de actualizar la documentación y empujar el desarrollo de Prototype… cosa que obviamente era imposible para una sola persona.

Miguel

Ha salido una nueva versión de Scriptaculous en la cual han arreglado algunos Bugs y también hay nuevas funcionalidades.

La comunidad alrededor de Scriptaculous/Prototype parece haberse abierto debido al fuerte empuje de otras librerías de JavaScript que muchas veces se aprovechan de los puntos flojos de Scriptaculous cómo la documentación y el peso.

Por momento Scriptaculous/Prototype sigue siendo líder en lo que respecta al número de usuarios, pero los desarrolladores ya se han dado cuenta que tienen que cambiar su modelo si quieren seguir siendolo a medio/largo plazo.

Thomas Fuchs anuncia que se está trabajando en la versión 1.7 que saldrá con muchas novedades y paralelamente hay gente trabajando en una documentación completa de todas las funcionalidades de Scriptaculous y Prototype.

Veremos lo que nos depara el futuro

Entrado de pleno en la guerra de las librerías DOM para JavaScript, Claudio Cicali se ha puesto a comparar la velocidad de los selectores de Prototype y jQuery. En particular las funciones que ha usado son $() para jQuery y $$() para Prototye.

El resultado de su benchmark es que las 2 librerías tienen un rendimiento muy parecido, ganando Prototype en algunas asignaturas y jQuery en otras.

Hay un patch para Prototype que mejora sensiblemente el rendimiento de la función $$() y según un comentario en el blog de Claudio usando el patch Prototype gana a jQuery en todos los campos.

Queda preguntarse porque el patch aún no forma parte del core de Prototype.

Muchos desarrolladores que usan Prototype para sus proyectos estaban algo asustados porque hacía meses que no había movimiento en el desarrollo de este. Hoy, por fin, Encytemedia ha publicado un artículo con los cambios que ha habido está misma mañana en el repositorio de Prototype.

Uno de los cambios más importantes se refiere a que Sam ha implementado chaining (encadenamiento de comandos) para muchos de los métodos de Prototype. Esto posiblemente se deba a que últimamente han sido publicados varios artículos comparando Prototype/Scriptaculous con jQuery… este último tenía hasta ahora la gran ventaja de ofrecer chaining desde hace tiempo. El día que salga la nueva versión (o si lo bajamos del SVN) y actualizamos nuestro código tendremos que ir al tanto ya que este cambio romperá con algunas metodologías usadas hasta ahora.

Otro cambio ha sido incluir los métodos de formularios (Form y Form Element) dentro de $() y $$(). Por tanto podremos hacer $(’miForm’).getElements();

Lo mismo vale para la gestión de eventos… Para observar un elemento podemos hacer $(’miElemento’).observe(’click’, function(){//código a ejecutar});

Con estos cambios se nos abre un nuevo mundo para poder ser más vagos a la hora de programar

Jesse James Garett, el inventor de la palabra “Ajax” admite que Ajax ya no define solamente “Asynchronous JavaScript + XML” sino que es válido para todo tipo de aplicación web que hacen uso de:
- un modelo de interacción asincronea
- tecnologías nativas del navegador.

Ajax se ha convertido en la palabra de moda para todo tipo de aplicaciones web. Muchas de estas no merecen el nombre Ajax porque las funcionalidades son puramente DHTML o DOM Scripting sin comunicarse con el servidor.

Pero hay otras muchas que usan iframes para la comunicación o devuelven (x)HTML en vez de XML (caso de Prototype)… y esto si debe considerarse Ajax… y ahora con el beneplácito de Jesse

Miguel

Una particularidad que tiene Prototype es que la respuesta de un request JSON la espera en la cabecera de la respuesta, dentro del tag propietario X-JSON. En principio eso no causa ningún problema hasta que no coincidan 2 elementos… el uso de Internet Explorer y un tamaño excesivo del contenido devuelto.

Desconozco la motivación para usar la cabecera para el transporte del contenido JSON, pero a la vista de los problemas que nos puede dar con IE es algo que debería replantearse.

Miguel

Protoype ha implementado una nueva potente herramienta para su nueva versión (1.5.0 beta1).
Esto nos permite usar atributos en el seleccionador ($$).

La síntaxis es

$$('form#foo input[type=text]‘).each(function(input) {
Element.setStyle(input, {color: ‘red’});
});

Esto aplicaría color:red a todos los campos de texto dentro del formulario ‘foo’.

Además de usar la expresión ‘=’ tenemos la opción de usar los selectores definidos por w3.org.
Otra funcionalidad muy interesante es poder seleccionar por varios atributos usando

form#foo input[type=text][class=test]

Nos ahorraremos bastantes líneas do código con esta nueva variante

La versión beta1 de Prototype se puede bajar en aquí
Miguel

Prototype de por si ya es una herramienta fabulosa.
Ahora su creador se ha puesto a hacerlo aún más manejable mejorando la sintáxis del objeto Element.

Hasta ahora teníamos que usar…

Element.hide( miElemento );

… y no es exáctamente la manera típica de javascript.

En la nueva versión podremos usar…

miElemento.hide();

Mucho mejor, no?
Miguel