Messi, plugin jQuery para mostrar alertas, preguntas, mensajes e imágenes

En el proyecto que estoy realizando para el trabajo necesitaba un plugin sencillo que me permitiese lanzar alertas y mensajes con la posibilidad de obtener la respuesta del usuario para realizar una acción en particular.

Hay varios plugins jQuery por ahí que permiten esta funcionalidad, pero decidí desarrollar uno nuevo para aplicar las opciones que más me interesaban y aplicarle un estilo visual personalmente más atractivo y limpio que las soluciones actuales. El plugin que he desarrollado se llama Messi.


Messi (por message, por por el jugador del Barça) permite de un modo sencillo generar un mensaje visual en la página en el que podremos incluir una alerta, un mensaje html (incluso el resultado de una petición ajax) o una imagen.

Con las diferentes opciones de configuración podremos especificar los botones que se deben incluir y asignar un valor a cada uno que se enviará a la función callback que especifique el usuario. Tenemos flexibilidad para indicar si el mensaje lleva un título, si el mensaje se muestra en una “ventana” modal o la posición del mismo.

Además he incluido funciones rápidas para lanzar de forma sencilla un mensaje de alerta (Messi.alert()), una pregunta (Messi.ask()), una petición ajax (Messi.load()) o una imagen (Messi.img()).

Podéis encontrar más información y demos en http://marcosesperon.es/apps/messi/, así como el repositorio de GitHub del proyecto por si queréis verle las tripas o enviarme sugerencias.

Mi primera extensión para Google Chrome

Hoy me he interesado por cómo se desarrollaban las extensiones para el navegador Google Chrome y al final he acabado publicando la primera…

La extensión es para mi blog dolcebita. Con esta extensión instalada podrás visualizar rápidamente las entradas más recientes del blog sin necesidad de salir de la página en la que te encuentres. Al pulsar el icono de dolcebita se mostrará un ventana flotante en la que te aparecerán los artículos más recientes del blog.

Podrás ver una pequeña descripción del contenido del artículo y tendrás opción de compartirlo con tus amigos a través de los botones de envío a Twitter, Facebook y Google Buzz.

En la parte inferior dispones de las diferentes secciones que tenemos para ver las últimas entradas de cada una de ellas y además se ha habilitado un buscador en la esquina superior derecha para realizar consultas sobre un determinado término: iphone, google, apple, microsoft…

El desarrollo de extensiones normalitas para Chrome no es muy complicado para un desarrollador web. Están realizadas utilizando HTML y JavaScript, y siguiendo los pasos del tutorial es sencillo crear extensiones como esta.

¿La instaláis y me comentáis qué os parece? ;)

Ir a la página de la extensión…

Otro plugin para WordPress: WP Timeline Archive

Estos días estuve haciendo pruebas con la página de archivo de dolcebita. Encontré algunos plugins interesantes pero quería uno que me ofreciera una apariencia un poco más atractiva. Así que me puse manos a la obra… :P

Lo he llamado WP Timeline Archive (toma originalidad) y ediante una linea temporal podrás ver todos los artículos escritos en el blog, ordenados por antigüedad y separados por años y los días de publicación. Si el artículo tiene alguna imagen adjunta se visualizará al posicionar el cursor sobre cada una de las cajas.

Se pueden indicar las categorías a excluir y personalizar la apariencia copiando el archivo ‘wp-timeline-archive.css‘ que viene en el plugin a la carpeta del tema actual para editarlo.

La llamada se introduce en el contenido de una entrada o página con un short code:

[tla eid="1"]

De momento aún no me han habilitado desde WordPress la gestión para subirlo al repositorio, pero espero que no tarden más de una semana. Mientras puedes verlo en funcionamiento en dolcebita.com

Tras unas horas de funcionamiento ya estoy pensando en futuras opciones de configuración así que si tenéis alguna sugerencia o crítica constructiva será bienvenida :)

http://www.dolcebita.com/wordpress/wp-timeline-archive/

Estaré en la Drupalcamp Spain 2010

drupalcamp.png

Lo bueno de vivir en Barcelona es que puedo asistir a multitud de eventos interesantes y beneficiosos para mi trabajo. Así que no podía dejar pasar la oportunidad de pasarme por la Drupalcamp Spain 2010, el evento que reunirá a los profesionales y amantes del CMS Drupal los días 26, 27 y 28 de este mes en el Citilab de Cornellà.

He utilizado Drupal en varios de mis proyectos web, tanto en mi empresa como desarrollos a título personal y sin duda es uno de los CMS más potentes que existen en la actualidad. Gracias a la comunidad tan activa que existe en torno al proyecto la aplicación ha avanzado muchísimo en los últimos años y la cantidad de módulos disponibles para implementar funcionalidades a Drupal es increíble.

Espero que la Drupalcamp me sirva para refrescar conocimientos y aprender nuevas técnicas de desarrollo del que para mi es el mejor CMS web que existe en la actualidad (y que me perdonen los fieles a WordPress) ;)

Puedes seguir la actividad del evento a través de http://drupalcamp.es/drupalcampspain-en-twitter

Nos vemos!

Usando Screenr para mostraros Tasks

Hoy me he enterado gracias al chow de ALT1040 de la existencia de Screenr. Screenr es un servicio web que te permite realizar una captura de video de tu pantalla de forma sencilla y publicarlo en twitter inmediatamente.

Quería hacer una prueba del servicio y me acordé de un proyecto que comencé hace unos meses y que dejé estancado. Se trata de Tasks, un clon de la aplicación Things para Mac para gestionar las tareas pendientes. Como yo no tengo un Mac, me propuse crear una versión web, usando MySQL, PHP y jQuery, para uso personal y practicar un poco.

Bueno, ¿qué os parece? Tiene muchos fallos y necesita bastantes mejoras pero para el día a día me funciona a la perfección… y aprendí mucho jQuery desarrollándola :)

FlipClock, tutorial para desarrollar un plugin de jQuery

Si os gusta el desarrollo web seguro que conoceis el framework de javascript jQuery. Personalmente yo comencé mis primeros desarrollos usando otros frameworks disponibles (sobre todo mootools) pero debido a la popularidad de jQuery y su integración en sistemas como WordPress o Drupal he tenido que adaptarme a esta biblioteca.

A pesar de que jQuery tiene una muy buena documentación comparado con otros proyectos, en su momento eché en falta la información sobre como desarrollar un plugin básico para jQuery explicado de forma sencilla. Así que he desarrollado un pequeño plugin a modo de ejemplo para intentar solucionar las dudas iniciales que podais tener. Para ello vamos a programar un flip clock:

FlipClock for jQuery

(más…)