jsMSX: emulador de MSX con Javascript y Canvas

MSX es un ordenador de hace la tira de años que cuando eramos pequeños nos parecía increíble y que ahora nos parece paleolítico. jsMSX es un emulador realizado en Javascript y Canvas que permite ejecutar juegos para ese sistema.
jsmsx.png
En sí la aplicación no tiene mucha utilidad, pero es interesante desde el punto de vista de lo que se está consiguiendo mediante Javascript y Canvas.
jsMSX
Via / @lardissone

7 reglas para realizar Javascript de calidad

Siete consejos para realizar un javascript de calidad y no intrusivo:

  • No hagas suposiciones: no pienses que el usuario tendrá el javascript activado o que usará un navegador adecuado.
  • Usa IDs y relaciones entre elementos: para no depender de un HTML mal estructurado y que el javascript sea imposible de realizar, utiliza IDs para acceder a los elementos con los que se quiere tratar y busca elementos que faciliten acceder a otros elementos.
  • Utiliza estilos: en vez de modificar los estilos de los elementos HTML mediante Javascript, usa clases CSS que modifiquen los estilos, y mediante Javascript se le puede añadir la clase a un elemento superior.
  • Comprende el navegador y a los usuarios: debes pensar cómo funciona un navegador, no sobre saturar su comportamiento (abuso de drag&drop, eventos, …). Además debes pensar qué espera el usuario que haga el navegador, y respetarlo.
  • Comprende los eventos: los eventos no solo corresponden a un objeto, sino a los elementros hijo que contiene. Así se pueden realizar eventos sobr un único elemento y no tener que modificar los demás.
  • Respeta el código de otros: seguro que a parte de tu código existe algún otro que has añadido, por lo que deberás programar teniendo en cuenta que hay que evitar conflicto entre funciones.
  • Después de ti vendrá otro: es muy frecuente que alguien acabe modificando tu código, ten un poco de consideración por los demás y escribe código legible y entendible.

The seven rules of Unobtrusive JavaScript

Vía / @dcedilotte

UIzard: herramienta de desarrollo via Ajax

UIzard es un entorno de trabajo open source vía web que utiliza Ajax, y que funciona en varios navegadores Firefox y Safari (la versión para IE está siendo optimizada).
uizard.png
Se trata de un GUI muy completo en el que se pueden realizar páginas web, añadiendo elementos, con orígenes de datos, formularios, …
La mayor parte viene en coreano, pero creo que es bastante claro para poder entenderlo facilmente.
UIzard
Vía / @knight

linkNotify: plugin jQuery que indica que se carga un enlace

linkNotify es un plugin jQuery que permite modificar enlaces y mostrar un texto personalizado que indica que el enlace se está cargando. Algo que puede ser muy útil para aplicaciones en la que el usuario es algo básico y pincha y pincha en el enlace eternamente hasta que ve algún resultado sin esperar a que cargue la primera vez.

$('a').linkNotify('Espera mientras carga la pagina...');

linkNotify

Web of Data

Interesante artículo sobre el futuro de la web y el cambio de pensamiento entre la WWW como una web de ficheros y la Web of Data, como una web de datos y relaciones.
El concepto es sencillo de entender, mientras que la WWW se basa en ficheros y enlaces entre unos y otros, la Web of Data, basada en Graph Database (diferentes a las base de datos relacionales ya que se basan en nodos, propiedades y relaciones entre nodos), donde los datos se almacenan en nodos, y estos puede relacionarse de forma muy variada y sencilla entre ellos.
www_vs_web_data.png
Viendo que las aplicaciones sociales (Twitter, Facebook, …) se basan en datos (usuarios, mensajes) y sus relaciones (updates, followers, …), es lógico pensar en este tipo de base de datos (Graph DB) que en la base de datos relacional. Aunque claro, al ser algo un tanto nuevo, quizás no existan alternativas potentes y el problema está en el escalado y el rendimiento.
La presentación es muy interesante y las bases de datos que indican (neo4j…) pueden estar muy bien para organizar estructura tipo nodo (yo ya tengo un ejemplo para probar).
Graph Databases and the Future of Large-Scale Knowledge Management
Vía / High Scalability

Mostrar el tiempo transcurrido con MySQL

Algo muy común a la hora de realizar una aplicación web es indicar las fechas según el tiempo transcurrido, en vez de poner 2009-06-03 poner “hace 7 días”.

Para aquellos que necesiten mostrar las fechas de esta forma usando MySQL es posible hacerlo usando una función:

DELIMITER //
CREATE FUNCTION TimeDiffUnits (old DATETIME, new DATETIME) RETURNS CHAR(50) DETERMINISTIC NO SQL
BEGIN
DECLARE diff INTEGER;
SET diff = UNIX_TIMESTAMP(new) - UNIX_TIMESTAMP(old);
CASE
WHEN (diff < 3600) THEN
RETURN CONCAT(FLOOR(diff / 60) , ' Minutes');
WHEN (diff < 86400) THEN
RETURN CONCAT(FLOOR(diff / 3600), ' Hours');
WHEN (diff < 604800) THEN
RETURN CONCAT(FLOOR(diff / 86400), ' Days');
WHEN (diff < 2592000) THEN
RETURN CONCAT(FLOOR(diff / 604800), ' Weeks');
WHEN (diff < 31536000) THEN
RETURN CONCAT(FLOOR(diff / 2592000), ' Months');
ELSE
RETURN CONCAT(FLOOR(diff / 31536000), ' Years');
END CASE;
END //
DELIMITER ;

Importante: no uséis jamás está función ni en el WHERE ni en el ORDER BY ni en el GROUP BY, ya que se ejecutaría para cada registro de las tablas.

User Friendly Age Function for MySQL

Crear aplicaciones Facebook con CodeIgniter

No me apasiona especialmente realizar aplicaciones para Facebook, pero cuando no te queda otra, es mejor no complicarse la existencia y usar un buen framework como CodeIgniter (claro, que algunas aplicaciones si se realizan sin más tampoco pasa nada).

Para aquellos que quieran realizar aplicaciones en Facebook usando CodeIgniter le puede venir bien estas dos guías y dos librerías. Tanto las guías hablan de lo mismo, y las librerías son para Facebook-Connect (pero en una de ellas la explican paso a paso).

De forma resumida podríamos decir que para integrar Facebook en CodeIgniter debemos usar la librería facebook.php como un plugin de CI.