David Esperalta

No es la primera vez que refiero en esta bitácora al plugin Hotkeys para jQuery, y es que lo utilizo en Gesbit desde hace cierto tiempo, si bien hubo una especie de lapsus, y es que el plugin no se terminaba de actualizar, y tenía algún que otro error.

Pero esto se ha acabado, quiero decir, ahora el plugin parece actualizarse a menudo, se han corregido no pocos problemas, y su futuro está asegurado desde el punto de vista de sus autores, que quieren implementar nuevas características en el plugin.

Por ejemplo, una de las características que quieren implementar es sucesivas versiones, es la posibilidad de añadir "accesos directos" no ya mediante una tecla, o una combinación de estas, sino algo parecido a lo que se hace en GMail.

Me estoy refiriendo a la posibilidad de añadir "accesos directos" mediante dos o más teclas, es decir, reaccionar cuando el usuario pulse la tecla "a", por ejemplo, y, justo a continuación, pulse la tecla "b". Por otro lado, no dejes de echar un vistazo a la demostración del plugin Hotkeys, que deja bien claro lo que vale.

Hace poco se planteó en esta bitácora un debate acerca de jQuery y sus plugins, y, digamos, que, con los plugins para jQuery de que quiero hablar en esta entrada, tal vez tenga que dar la razón a mis "adversarios". Efectivamente, ¿para qué usar jQuery con el fin de obtener el "hash" MD5 de una cadena si se cuenta con soluciones "en un sólo script" que se demuestran efectivas? Sobra jQuery, probablemente, y a no ser que ya se utilizase yo mismo optaría por la otra solución, es decir, utilizar el "script" que implemente el algoritmo MD5.

Sin embargo, una cosa no quita la otra, como lo demuestran los plugins para jQuery que hace poco se han publicado, todos ellos del mismo autor, y que permiten obtener de una cadena sus firmas SHA1, MD5, CRC32 y Base64, ahí es nada. Evidentemente, estos plugins se implementan como "funciones de jQuery", puesto que no se aplican a ningún elemento en concreto, sino que requieren de los correspondientes argumentos, para obtener el oportuno resultado. El autor ha preparado una página web donde también es posible encontrar todos estos plugins.

A partir del código fuente de cierto plugin PassMeter para jQuery, a Mathieu Basile se le ha ocurrido que acaso no fuera mala idea cierta amplicación, por decirlo así, de modo que se ha puesto a ello y a convertido a PassMeter en KunePassMeter. Como acaso sepas, PassMeter "mide" la fortaleza de una determinada contraseña, y muestra una especie de ranking, en la misma casilla en que se escribe, de modo que se indica si la contraseña en cuestión es "débil", "fuerte", "muy fuerte", etc. Pero el caso es que el ranking se muestra en la misma casilla.

Pues bien, KunePassMeter lo que hace es "sacar" dicho ranking de la casilla de edición, siendo posible situarlo en otro elemento HTML cualquiera. Bueno. Pues no esta mal. Tal vez le sea útil a alguien, ¿no? Yo lo comento aquí además porque el autor se ha molestado en escribirme para contarme de la existencia de KunePassMeter, que no ha podido ser más amable, y eso sólo me ha llevado a hablar de este plugin para jQuery aquí, que Mathious no sabe, el hombre, que yo visito a diario el sitio web de los plugins de jQuery. ;-)

Hoy toca doblete con los plugins para jQuery, ya que si antes hablamos del plugin ElementReady, ahora toca hacerlo del plugin jGesture, que te permite incorporar a tus páginas o aplicaciones web los conocidos "gestos del ratón", es decir, una forma de interactuar con el usuario a través de los movimientos del ratón que este lleve a cabo.

La documentación de jGesture lo describe de arriba abajo, además de mostrar varios ejemplos de uso. Verás que con jGesture es posible ejecutar cierto código cuando el usuario mueva el ratón hacia arriba, hacia abajo, a la izquierda o a la derecha, pero, también en distintos ángulos, además de poder especificar diversos "gestos del ratón" más o menos complejos.

Es posible que jGestures no sea un plugin de uso diario, en el sentido de que no todas las aplicaciones necesiten de una interacción tal con el usuario, empero, no viene mal saber que, en caso necesario, o viéndolo conveniente, podemos contar con este plugin para jQuery. Tú no dejes de revisar su documentación y sus ejemplos, por si acaso te dan alguna idea.

Chico, qué quieres que te diga, que, no me canso de echar un vistazo diario (incluso varias veces al día) al sitio web de plugins para jQuery. ¡Es que te encuentras con algunas "piezas de código" muy curiosas, interesantes y útiles! Como, por ejemplo, el plugin con el que me topo hoy mismo, para empezar, el plugin ElementReady.

Como sabes, si usas la biblioteca jQuery, tenemos a nuestra disposición una especie de función, que, será ejecutada cuando y sólo cuando el "DOM" (Document Object Model) esté completamente disponible. Esta función viene a sustituir al evento "onload" del "BODY" de un determinado documento, proporcionando un mejor control sobre lo que queremos hacer.

Pues bien, a alguien se le ocurrió la idea de que tal vez nosotros no necesitemos esperar a que el "DOM" esté completamente cargado, sino que, precisamente, lo que nos interesa es actuar justo en el momento en que un determinado elemento del documento esté disponible. Y eso es, justamente, lo que proporciona el plugin ElementReady.

Con ElementReady es posible predeterminar la ejecución de cierto código JavaScript en el preciso instante en que un elemento en concreto esté ya disponible, antes, por lo tanto, de que todo el "DOM" lo esté. En definitiva, un plugin muy curioso, desde luego, y que no sé porqué me da en la nariz que acaso se incluya en la propia jQuery, que no sería la primera vez.

En fin, no dejes de echar un vistazo a ElementReady para jQuery. Además de su página web en el sitio web de jQuery, tienes a tu disposición esta entrada en la bitácora del autor, donde se muestran varios ejemplos de uso del plugin, entre otros recursos y documentación relacionada con el mismo.

Del "rock" del Javascript, no te vayas a pensar otra cosa. Pero ese es el "lema" del nuevo sitio web de la biblioteca jQuery: "Sé una estrella del rock Javascript". No les ha quedado nada mal a los chicos de jQuery el nuevo sitio web, algo más "estilizado" que el anterior, aunque, para gustos los colores.

También se ha llevado a cabo el cambio del logotipo de la biblioteca, que ahora tiene fondo azul, en lugar de rojo, aunque sigue siendo muy similar al anterior: como una especie de bloques de "lego" situado uno encima de otro. De momento no parece que la propia jQuery se actualizara. Solo los sitios web relacionados.

Si llevas cierto tiempo en el desarrollo web, por decirlo mal y pronto, más de una vez te habrás topado con "paquetes de JavaScript" que incluían decenas de "scripts" más o menos útiles, que hacían un poco de todo, que se separaban incluso en varias categorías, y hasta alguna vez habrás utilizado uno de estos "trozos de código" para tus propios proyectos.

Hace bastante que no se ve este tipo de "software", es decir, recopilatorios de "scripts", y a buen seguro mucha de la culpa (¡bendita culpa!) la tienen las bibliotecas del estilo de jQuery, que han cambiado la forma en que se escribe JavaScript, sin lugar a dudas. Pongamos por caso uno de los "trozos de código" que no podía faltar en ningún recopilatorio que se preciara.

Me estoy refiriendo al JavaScript necesario para conseguir un efecto de "máquina de escribir", quizás ya no tan usado como "antaño", puesto que han tendido a desaparecer (también en buena hora) los elementos como "GIF animados" y cualesquiera otros que de hecho distraían más que otra cosa a los lectores de una página web. Sin embargo, en el medio está la virtud, dicen.

Esto es, que, bien utilizado, un efecto "máquina de escribir" puede ser muy adecuado. Y esto es, precisamente, lo que te puede ofrecer el plugin para jQuery jTypeWriter, un efecto "máquina de escribir" allí donde te sea menester. Pero estamos hablando de un plugin para la fantástica biblioteca jQuery, lo que es igual que decir que jTypeWrite cuenta con varias opciones útiles.

Con el plugin jTypeWriter para jQuery puedes mostrar un determinado texto con un efecto de "máquina de escribir" caracter por caracter o palabra por palabra; puedes especificar el tiempo total de duración del efecto; es posible predeterminar que el efecto se muestre en un "bucle", y también puedes estar al tanto de la finalización del efecto y reaccionar ante tal evento.

En definitiva, otro plugin a tener presente para la biblioteca jQuery. Quizá me extraña un poco que no se acompañe del código fuente sino "empaquetado". No es habitual en los plugins para jQuery esta circunstancia, y quizá sea posible conseguir el código fuente "tal cual" en el sitio web del plugin y yo no he sido capaz de encontrarlo, porque el plugin se ofrece bajo la licencia GNU GPL.

Curiosísimo plugin para jQuery, One Click Upload. Michael Mitchell, su autor, lo explica en su bitácora. Básicamente puede utilizarse para sustituir el "feo" botón "Examinar", para que los usuarios puedan elegir el archivo que quieren "subir" en un momento dado. Dicho botón, además, cada navegador lo interpreta y muestra a su manera: no suele ser posible, sencillamente, personalizar cómo se ve el susomentado botoncito.

Pero el plugin One Click Upload, de código elegante, por lo poco que he podido ver, antes de escribir esto, hace uso de un enlace normal, corriente y moliente. Cuando el usuario hace click sobre dicho enlace ¡tachán! El cuadro de diálogo para elegir archivos es abierto, y, si el usuario elige alguno, efectivamente, este comienza a subirse vía "AJAX", es decir, "en segundo plano".

Todo parece funcionar bien además en los cuatro navegadores en que lo he probado, Firefox, Opera, Safari e Internet Explorer. Quizás podría uno pensar que no es un plugin que "degrade" bien, puesto que, de no tener el usuario activado y funcionando a JavaScript, me temo que el invento se vendría abajo, y, aunque tal vez podríamos prevenirlo, lo cierto es que esto parece ser algo en contra de tan estupendo plugin para jQuery.

Tal vez, si el plugin pudiera adaptar el campo "file" de un formulario... en lugar de conformar él mismo el formulario, suponiendo que JavaScript está disponible, tal vez podría adaptar el botón "file" de un formulario ya existente, de modo que este se mostrara tal cual, si el plugin no puede entrar en acción. Pero, hasta donde yo llego se trata de una primera versión del plugin One Click Upload, e igual cosas como esta se contemplarán en sucesivas versiones.

No es el primer plugin para jQuery que ayuda en estos menesteres, que de alguna manera hace algo más sencillo, más elegante, la subida de archivos a nuestro servidor por parte de un usuario. Pero, One Click Upload me ha caído bien, porque su código, sin mirarlo detenidamente, es limpio y claro, porque ha funcionado como se esperaba en los cuatro navegadores en que lo he probado, en fin, porque pesa sólo un par de "kilobytes". Creo que puede merecer la pena en un momento dado.

Otra estupenda "pieza de código" que se suma a los plugins para jQuery, el fantástico plugin  jQuery Corners, que te hará realmente sencillo redondear las esquinas de ciertos elementos de tus páginas web, incluso elementos "en línea", con lo que se consiguen efectos muy curiosos, como enlaces a modo de "botones" realmente chulos.

jQuery Corners se suma a una larga lista de plugins para jQuery que persiguen el mismo objetivo con peor o peor fortuna, pero, Corners tiene bastantes cosas a su favor. Abajo puedes ver una imagen que sirve de ejemplo, y que también describe el plugin e informa de los navegadores soportados.

¿Qué hace especial a jQuery Corners? Pues que no utiliza imágenes, que no es obstrusivo (separado del HTML), que degrada bien (si no se dispone de JavaScript), que funciona en todos los navegadores "modernos", que su funcionamiento es realmente intuitivo y sencillo, que ocupa 12 KB aún sin comprimir... ¿No es bastante? Desde luego merece la pena echar un vistazo a los ejemplos del plugin, si te resulta interesante.

Siguiendo con mi costumbre de visitar prácticamente a diario el sitio web de los plugins para la biblioteca de JavaScript jQuery, sigo encontrándome con plugins cuando menos curiosos, y que, en no pocas ocasiones ya, termino por utilizar en mis proyectos. En este caso me topo con el plugin DataTables, de Allan Jardine, que, me deja sorprendido ante la cantidad de características que puede añadir a las tablas de nuestros documentos HTML, con sólo una instrucción de Javascript.

El plugin transforma por completo una tabla normal y corriente. De repente es posible para el usuario especificar cuántos registros se muestran en la tabla, se pone a su disposición un buscador "en tiempo real" para que pueda buscar información dentro de la tabla en cuestión. Los registros de la tabla aparecen "paginados", de modo que el lector del documento pueda cambiar de páginas para ir viendo los distintos registros de esta forma. ¡Y todo sin tocar el HTML!

Haz clic en la imagen para agrandarla

Con la magia de jQuery, el plugin logra además otras muchas cosas interesantes. Entre otras, el plugin es completamente "internacionalizable", y los archivos de lenguaje pueden ser eso, diferentes archivos de lenguaje, aunque el plugin deja la posibilidad de cambiar las cadenas de su interfaz directamente, de modo que podremos usar la opción que más nos convenga en cada momento. En fin, yo te lo valoro, pero, puedes ver tú mismo numeros ejemplos de uso del plugin DataTables.

Creo que voy a descargar el plugin DataTables y a echarle un vistazo más de cerca, porque, desde luego tiene una pinta excelente. Y seguiré visitando el sitio web de los plugins para jQuery, porque, raro es el día que no te enteras de un nuevo plugin para esta fantástica biblioteca, o bien de la actualización de alguno que ya estás usando, vamos, que merece la pena darse una vuelta por ahí de vez en cuando, ya lo he dicho.

Actualización: Mostrar la interfaz del plugin DataTable en cualquier idioma resulta muy sencillo, como queda dicho arriba, si se cuenta con el correspondiente archivo de lenguaje, por ejemplo. Así que, me he permitido llevar a cabo la traducción del plugin al español: en realidad pocas cadenas había que traducir, no pretento arrogarme mérito alguno, y así he informado al autor del plugin, por si quiere incluir el archivo en la distribución del mismo. Si quieres, tú también puedes, con el archivo de lenguaje español.