Blog en modo Stand-by

Ufff!!!!, muchos meses sin postear nada seguido, todo por falta de tiempo. No es por escasez de cosas interesantes que escribir: Node.js, MongoDB, GWT, mil cosas nuevas en HTML5, SIP Servlets, XMPP Servlets, Web Sockets, Data Visualization, D3.js... y mil cosas mas, todo tan interesante que apabulla. Tengo un pendiente de unos 12 libros y subiendo solo desde el vamos, los cuales merecerían cada uno un post aparte -muy buenos los de  O'reilly y  Packt Publishing-, que se yo, mil, en conclusión: por ahora una necesaria pausa :)

The Developer's Toolkit

Infografía sobre las herramientas más utilizadas por los desarrolladores top... sin embargo a mi nadie me pregunto nada, y yo que creía que por hacer un par de páginas lo era :)

GWT: eventos touch

GWT me recuerda a Django, si bien la documentación es muy extensa tiene multitud de trucos y tips que 

leyendo solamente el Javadoc son imposibles de descubrir, el manejo de eventos touch es un ejemplo perfecto por lo que creí oportuno escribir esta micro-guia para manejar esas situaciones. Los dispositivos táctiles como tablets y smartphones son medios de acceso cada vez más habituales a nuestras aplicaciones web por tanto no podemos quedarnos solamente con los eventos relacionados al mouse, algo tan común como mostrar un mensaje al hacer mouseover sobre un elemento de la interfaz simplemente no funciona.

GWT tiene clases especificas relacionadas al touch así que vamos a ver como utilizarlas, básicamente manejaremos los eventos TouchStartEvent, TouchMoveEvent y TouchEndEvent a través de sus handlers TouchStartHandler, TouchMoveHandler y TouchEndHandler, los resultados puedes verlos en el video: 

El ejemplo es muy sencillo, como vemos en el código en el método onModuleLoad está el manejo de los eventos, añadí clear() solo para limpiar los estilos y poder cambiar el fondo del panel que implementa el touch. El gran truco para que funcione es añadir la línea event.preventDefault(), esta cancela la propagación del evento disparado y permite que la aplicación detecte los siguientes, si no lo especificamos la aplicación no puede distinguir cundo pasamos de uno a otro y se queda con el primero detectado, lamentablemente esto no lo vi por ningún lado en la documentación ya que te envía a la Safari Touch Event Documentation donde seguramente no encuentres muchos ejemplos de GWT :)

public class Touch_test implements EntryPoint {

 // utilizamos un FocusPanel para detectar los eventos y un Label para mostrar su nombre  
 private final FocusPanel fpanel = new FocusPanel();
 private final Label lbl = new Label("evento: ");


 // limpiamos los estilos para mostrar cada evento con un color diferente
 private void clear() {
  fpanel.removeStyleName("back_red");
  fpanel.removeStyleName("back_gray");
 }

 
 public void onModuleLoad() {
  
  // le damos alto, ancho y un borde  
  fpanel.setStyleName("fPanel");
  
  // detectamos el evento TouchStartEvent 
  fpanel.addTouchStartHandler(new TouchStartHandler() {
   @Override
   public void onTouchStart(TouchStartEvent event) {
    event.preventDefault(); // IMPORTANTE!!

    lbl.setText("evento: touch");
    clear();
    fpanel.addStyleName("back_red"); // coloreamos de rojo el panel
   }
  });
  
  // detectamos el evento TouchMoveEvent
  fpanel.addTouchMoveHandler(new TouchMoveHandler() {
   @Override
   public void onTouchMove(TouchMoveEvent event) {
    event.preventDefault(); // IMPORTANTE!!

    lbl.setText("evento: move");
    clear();
    fpanel.addStyleName("back_gray"); // coloreamos de gris el panel
   }
  });
  
  // detectamos el evento TouchEndEvent
  fpanel.addTouchEndHandler(new TouchEndHandler() {
   @Override
   public void onTouchEnd(TouchEndEvent event) {
    event.preventDefault(); // IMPORTANTE!!

    lbl.setText("evento: end");
    clear();  // dejamos si estilos el panel
   }
  });

  RootPanel.get().add(lbl);
  RootPanel.get().add(fpanel);
 
 }
}

Los estilos son solo para darle un toque visual:

.fPanel {
 height:200px; 
 width:200px;
 border: solid 1px #CCC;
}

.back_red{
 background-color:red; 
}

.back_gray{
 background-color: #CCC; 
}

Es bastante simple, lo que quiero destacar es asegurarse de agregarle la dichosa línea event.preventDefault() y funciona bastante bien, lo probé en un iPad y un smartphone con Android y en ambos responde de forma similar, otra cosita que sumar a nuestro arsenal de desarrollo.

Por qué iOS es más fluido que Android

No soy de compartir enlaces sin agregar algo más pero este vale la pena, nada de subjetividades, puro argumento técnico, sin más les recomiendo Por qué iOS es más fluido que Android

Redirigiendo peticiones en Apache

Esta es una de esas tareas sencillas que donde se complique un poco prepárate para perder más tiempo del que pensabas. Cuando buscamos redirigir peticiones con Apache, más si no implica reescribir direcciones o algo complejo, una de la opciones más simple es utilizar un archivo .htaccess en el directorio que nos interesa modificar el comportamiento, el tema es que no basta solo con eso ya que hay una pequeña serie de cosas a tener configuradas para que funcione.

La solución básica como comentaba es utilizar este tipo de archivos que contienen directivas para modificar el comportamiento del servidor, Apache verifica su existencia antes de responder habiendo infinidad de opciones desde simples como no listar los archivos en un directorio hasta cosas más elaboradas como sustituir partes de una URL, manejar errores y demás.

En este caso la directiva que nos interesa se llama Redirect, siendo su sintaxis:

Redirect 301 /Directorio/old_index.php http://localhost/Directorio/new_index.php

Aquí Redirect es la directiva que especifica redirigir la petición y la acompañamos con los códigos de estado, estos si bien generalmente los pasamos de largo son bastante importantes teniendo cada uno un significado particular y es buena cosa conocerlos, aunque parezca que el resultado sea el mismo son fundamentales para que los navegadores puedan "comprender" el estado de un recurso, en este caso utilizamos uno de la serie 3xx que comprende las redirecciones, 301 significa que el recurso fue Movido permanentemente.

Luego colocamos la ruta del archivo original que ya no será accesible y separada la nueva dirección completa, es decir incluyendo el http://, el archivo se coloca en el directorio raíz o podemos incluirlo en el directorio específico donde se encuentre el archivo a excluir, lo importante es esté en nuestra ruta de búsqueda para que Apache lo tenga en cuenta (más adelante el porque es importante su ubicación).

Bien, ahora accedemos a http://localhost/Directorio/old_index.php y debemos ser redirigidos a http://localhost/Directorio/new_index.php, pero.... nada sucede, algo anda mal... y bueno, a prepararse para googlear un rato :)

El tema es que algunas de estas directivas hacen uso de funcionalidades de módulos de Apache, por lo que tenemos que verificar también que el módulo este primero disponible, y segundo, habilitado. En este caso es el llamado mod_alias, que viene incluido por defecto en Apache, así que a verificar si lo tenemos habilitado, en Ubuntu tipeamos en la terminal:

a2enmod alias

este comando y su contrapartida a2dismod son para habilitar (en-abled)  o desahabiliar (dis-abled) módulos, obtenemos:

Module alias already enabled

significa que ya lo tenemos y está habilitado, bien, no es problema  de módulos, que más verifico?

Lo siguiente a tener en cuenta son los archivo de configuración de Apache, supuestamente el httpd.conf pero en mi caso esta en blanco así que los buscamos en el directorio sites-enabled (en Ubuntu bajo /etc/apache2/sites-enabled), esta estructura es similar a la de módulos, los disponibles en mods-available y los activos en mods-enabled. En este caso tenemos los sites-available y los sites-enabled (son simplemente links), vamos a este último ya que posee los específicamente habilitados. En mi caso solo tengo un sito habilitado pero este archivo varía de una instalación a otra, buscamos algo como:

 
<Directory /var/www/>
  AllowOverride none
  Order allow,deny
  allow from all
</Directory>

Aquí esta el culpable, entre todas las opciones disponibles tenemos la infame AllowOverride, según la documentación "AllowOverride controls what directives may be placed in .htaccess files.", observamos que tiene un rotundo None, ahora sí, de ahí que no funcione el .htaccess que colocamos, lo sustituimos por un "All" y reiniciamos el servidor. Efectivamente ahora sí las peticiones son redirigidas a la nueva ruta, si examinamos el request con Firebug o similares vemos:

  Request URL:http://localhost/Directorio/
  Request Method:GET
  Status Code:301 Moved Permanently

siendo redirigidos a la nueva ruta, hay que tener en cuenta que también podemos especificar que directorios queremos habilitar y no todo el sitio (como en mi caso <Directory /var/www/>) y de ahí la importancia de donde colocaremos el .htaccess, también para con None/All hay más opciones, ahi depende de cuanto queramos customizar el server. Es sencillo pero como decía hay que verificar un par de cosas en caso de que no ande, si luego de esta corta guía sigue sin funcionar prepárate para leer un rato más.

Cherokee Market

Bien decíamos que las tiendas de aplicaciones llegaron para quedarse, ahora no pensé que el rango de escenarios fuera tan diverso, leyendo por ahí me traigo el Cherokee Market, no sé si es el único en su tipo pero tiene pinta. Aparentemente es como los hostings con aplicaciones prearmadas pero en tu propia infraestructura, viniendo de la mano de Cherokee no debe ser malo, tuve la oportunidad de jugar un poco con este servidor y es muy amigable, con una interfaz cuidada que simplifica bastante el trabajo.

Y lo fundamental, el rendimiento parece ser bastante bueno, no debe ser lo óptimo para configuraciones muy exigentes donde haya que afinar mucho las perillas pero es interesante.
A mí personalmente instalar un Nagios o un Redmine no me engancha demasiado así que si con un par de clicks tengo el tema solucionado no lo dudo, en precios ambos por ejemplo figuran como gratuitos y un Liferay CE está a U$S 29.95, tampoco tan escandaloso, habrá que probarla a ver que tal.

Off topic