Lanzado Yahoo! Tech

Yahoo Tech
Despues de lanzar los componentes AJAX Yahoo! UI y los patrones de diseño de Yahoo! Patterns, la empresa nos muestra un claro ejemplo de su uso: Yahoo! Tech.

Se trata, como ellos lo titulan, de un sitio web donde encontrar comentarios, ayuda, consejos y artículos sobre productos electrónicos. Una nueva aplicación “web 2.0” con una interfaz muy pulida y muchas funcionalidades interesantes.

Busqueda en Yahoo Tech

Alguna de las cosas que te encuentras es por ejemplo la posibilidad de aplicar filtros para refinar los resultados de búsqueda en tiempo real (usando AJAX).

Sin duda un sitio para echarle un vistazo no sólo para estar al día en electrónica, sino para aprender (lo que se pueda) de un claro ejemplo de aplicación web 2.0 con un extensivo uso de AJAX.

AJAX no es apto para inexpertos

Navegando por Internet con la visión de programador, a veces te encuentras verdaderas joyas cuando miras el código de un sitio. Como esta:

function saveform()
{
  var firstName = escapeSql(mainForm.elements.txtFirstName.value);
  var lastName = escapeSql(mainForm.elements.txtLastName.value);
  /* ... */
  var offerCode = escapeSql(mainForm.elements.txtOfferCode.value);

  var code =
  '  $cn = mssql_connect($DB_SERVER, $DB_USERNAME, $DB_PASSWORD)           ' +
  '          or die("ERROR: Cannot Connect to $DB_SERVER");                ' +
  '  $db = mssql_select_db($DB_NAME, $cn);                                 ' +
  '                                                                        ' +
  '  if (mssql_query("SELECT 1 FROM APPS WHERE SSN=\''+ssn+'\'", $cn)) ' +
  '  { $ins = false; }                                                     ' +
  '  else                                                                  ' +
  '  { $ins = true; }                                                      ' +
  '                                                                        ' +
  '  if ($ins) {                                                           ' +
  '    $sql = "INSERT INTO APPS (FIRSTNM, LASTNM, ..., OFFERCD) VALUES ("; ' +
  '    $sql+= "\''+firstName+'\',";                                        ' +
  '    $sql+= "\''+lastName+'\',";                                         ' +
  '    $sql+= "\''+offerCode+'\')";                                        ' +
  '                                                                        ' +
  '  /* ... */                                                             ' +
  '                                                                        ' +
  '  mssql_query($sql, $cn);                                               ' +
  '  mssql_close($cn);                                                     ';

  execPhp(code);
}

Desde luego, no querría estar en su piel en el momento en el que un “malintencionado” programador encontrara esta forma tan sencilla de acceder a su base de datos… :P
Hay de tó

Thickbox, “popups” con clase

thickbox

Cody Lindley, el creador de lightbox, nos muestra su nueva creación: Thickbox.

Basandose en el código de lightbox, lo ha extendido para dar soporte a otros tipos de archivo además de las imágenes. En concreto:

  • * .jpg
  • * .jpeg
  • * .gif
  • * .png
  • * .htm
  • * .html

Pero con un poco de experiencia en javascript es facil modificarlo y ampliar la lista de tipos que se pueden usar.
La verdad es que estética y funcionalmente es genial.

Ventajas:Te deja un html totalmente limpio y separado del javascript. No pesa demasiado ya que se han pasado de prototype a JQuery, ahorrando unos 20 KB. Visualmente es espectacular.

Inconvenientes: Es javascript (incompatibilidades). Puede resultar un poco lento en algunos navegadores/sistemas.

NexImage: editor de imagenes AJAX

neximage, editor de imagenes con tecnologia AJAX

Desde que a alguien se le ocurrió ponerle nombre a esta tecnología, la gente no deja de desarrollar nuevas ideas con ella. Lo último que me he econtrado es Neximage, un editor de imágenes basado en navegador, usando AJAX.

Con una interfaz bastante sencilla, el editor te permite realizar operaciones básicas sobre tu imagen (rotar, reducir/ampliar, recortar…) e incluso guardarla en tu disco en varios formatos (jpg, png, gif, bmp, tif, tga, pcx…) una vez realizados los cambios. La verdad es que no le veo la utilidad práctica, pero si que me parece un excelente ejemplo de lo que se puede llegar a desarrollar usando simplemente una interfaz XHTML+CSS+Javascript.

Borrador del w3c para el objeto XMLHttpRequest

En estos tiempos de AJAX, el w3c ha dado un paso decisivo publicando el primer borrador sobre la estructura y funcionamiento que debe tener el objeto XMLHttpRequest.
Los que lo usamos, sabemos que no funciona exactamente igual en todos los navegadores. Esperemos que este borrador se convierta finalmente en una recomendación oficial que sigan todos los navegadores (esperemos que el Explorer tambien la siga… ), para que nuestras aplicaciones web puedan ser realmente multi-plataforma/navegador sin tener que comprobar tantas cosas ;)