• Servicio de plantillas.
• Editor a pantalla completa.
• Revisión de ortografía.
• Inclusión de imágenes y capacidad de integración con tu tecnología del servidor para hacer la subida de imagenes.
• Integración con CKFinder par explorar los archivos disponibles en el servidor.
• Un gran número de opciones estándar de edición de texto (negrilla, cursiva, formatos de texto, colores de fuente y fondo y un largo etcétera).

La integración resultó bastante sencilla, basta con seguir los pasos publicados en la documentación oficial, sin embargo al extender la funcionalidad, vaya que me ha causado algún dolor de cabeza.

Problema 1: Al recargar parte de la página que contiene el area de texto e intentar inicializar el editor de nuevo me lanza el error:

The instance “ipHTML” already exists.”]

uncaught exception: [CKEDITOR.editor

El problema radica en que la instancia del editor ya ha sido creada y para prevenir problemas de cargas de memoia en el javascript, CKEditor no nos permite recrearla, he solucionado el error removiendo la instancia del editor “ipHTML”, así:


if (edInstance) {
CKEDITOR.remove(edInstance);
}

Esto me ha funcionado de forma temporal, sin embargo, luego vino un problema, que a pesar de nos ser un error constante, si causaba bastante molestia al tratar de obtener el contenido html del editor, el error es el siguiente (Visto con firebug y ni quiero decir lo que sale en internet explorer xD):

Problema 2: Al tratar de acceder al contenido del editor me lanza el error:

i.contentWindow is null

He revisado un poco en el track de la versión anterior y nos dan una explicación de problema javascript al recargar el contenido de un textarea, sin embargo eso no solucionaba mi problema, en el sitio oficial de la versión actual lo comentan pero sin citar la solución , al continuar investigando he encontrado una solución, la cual consiste en remover por completo la instancia del editor, así:


if (edInstance) {
CKEDITOR.remove(edInstance);
edInstance.destroy();
edInstance= null;
}

Este par de soluciones no están muy bien documentadas en el sitio oficial y por tal razón me ha tocado investigar en los foros y sitios allegados, por esto he decidido publicarlos aquí por si les llegase a pasar en algún momento.

El primero de este tipo se ha denominado Introducción a Spring Framwork y es un excelente punto de partida para quienes quieran comenzar a comprender y utilizar este proyecto que a día de hoy se ha convertido casí en un estándar de la plataforma Java.

Sin más rodeos aquí les dejo el video.

Enlace a SpringHispano>>

Ver video en Vimeo>>

Como ya les había contado, hace poco instalé oracle XE en una maquina virtual de Virtual Box con ubuntu server, sin embargo a pesar que la instancia me funcionaba perfecto, pues me lograba conectar desde el Oracle SQLDeveloper, cuando trabata de conectarme al apex por el navegador web de mi máquina física, nunca lograba encontrar la página.

Decidí buscar un poco sobre navegadores en modo texto par intentarlo de forma local desde el ubuntu server y en efecto me dí cuenta que el problema era sólo al tratar de accederlo de forma remota, ya que al probarlo desde la misma máquina virtual en links2 todo fue bastante bien.

Ahora el problema es,  cómo demonios se supone que pueda activar el acceso remoto al apex?, bueno la respuesta es bastante sencilla, basta con seguir lo pasos que describo a continuación:

• Inicia SQLPlus sin establecer una conexión a la base de datos.

  sqlplus /nolog

• Conectate como un usuario administrador de base de datos, para efectos de esta entrada usaremos el usuarios sys que viene por defecto.

  connect sys/contraseña@xe as sysdba

• Una vez estés conectado, ejecuta la siguiente instrucción, que habilitará el acceso remoto al apex.

  EXEC DBMS_XDB.SETLISTENERLOCALACCESS(FALSE);

Listo, eso es todo, vuelve a intentar conectarte desde el navegador y todo deberá ir bien.

• Barra de menús.
• Gestor de descargas.
• Soporte de imagenes (JPEG, GIF, PNG, XBM, TIFF).
• Marcadores.
• Soporte de tablas.
• Fuentes con anti-aliasing.
• Compatibilidad con HTML 4.0
• Soporte para FTP.
• Soporte para SSL.
• Además es multiplataforma y también soporta varios idiomas entre ellos el español.

La instalación resultó bastante sencilla, basta con escribir en la terminal:

sudo apt-get install links2

escribimos nuestra contraseña y listo, solo resta esperar a que termine de descargar e instalar los paquetes necesarios.

Una vez instaldo lo podemos probar escribiendo el comando links2 seguido de la dirección que queremos visitar:

links2 http://sysdent.nete23.net

Sysdent visto desde la consola de linux

y listo, estaremos navegando en páginas web, en modo texto, bastante sorprendente verdad?, sin embargo, aún hay más, existe una forma de cargar las imagenes de las páginas, claro en sistemas que lo soporten, y bastan con agregar el parámetro -g antes de la url así:

links2 -g http://sysdent.net23.net

Que te parece? te animas a probarlo?

Luego de esta desilusión, decidí investigar un poco por que no podía hacerlo así, y encontré en la propia documentación de VirtualBox que al igual que los nuevos sistemas operativos linux, este software de virtualización también asigna un número de identificación único a cada disco de la máquina virtual, si usas ubuntu o alguna otra distribución basada en linux, puedes ver las particiones montada y su correspondiente ID ejecutando el comando:

less /etc/fstab

Ok, luego de esta pequeña introducción sobre identificadores y discos, vamos a lo que realmente nos puede servir, cuando necesitemos copiar o clonar una máquina virtual en VirtualBox, lo que debemos hacer es:

1. Abrir una termina.
2. Navegar hasta la carpeta donde tienes los discos duros.
3. Ejeuctar el comando: VBoxManage clonehd DiscoOrigen.vdi DiscoClonado.vdi
4. Una vez termina, crearemos una nueva máquina virtual indicando la configuración básica, pero en la sección donde seleccionas el disco duro, recuerda no crear uno nuevo, sino en su lugar usar el que acabas de clonal, es decir DiscoClonado.vdi.
5. Inicia tu máquina virtual y ya tendrás una copia de la original.

Este método es bastente sencillo, sin embargo ya es hora de que VirtualBox vaya creando una interfaces gráfica para este tipo de tareas, no crees?

Sin embargo el día de hoy me he encontrado con Highcharts, una estupenda librería escrita completamente en Javascript que nos permite crear gráficas en el navegador, y que es compatible con la gran mayoría de navegadores web usados en la actualidad, incluso nos garantizan el resultado en el navegador del iPhone o mejor aún en Internet Explorer 6, para los que aún tenemos que lidiar con él.

Click en la imagen para ver el demo

Otra gran ventaja de la libraría es su fácil configuración, ya que basta con incluir los scripts de la misma, luego crear un div en nuestra página y configurar las opciones que deseemos mediante una notación JSon, algo que la gran mayoría conoce.

Hablemos sobre la licencia, ya que con lo que hemos visto se nos ha aguado la boca y de seguro estamos ansiosos de incluirlo en nuestro proyectos web, pero, no tan rápido, todo depende del tipo de proyecto que desarrolles, si es un sitio personal, o sin ánimo de lucro lo puedes usar libremente, pero si ya es un proyecto comercial deberás pagar por usarlo, aunque desde mi punto de vista es un precio bastante bajo para los resultados que se logran, puedes encontrar mayor información en esta página.

Ya para terminar y poner mi nota personal, una de las grandes ventajas que nos ofrecen estas dos librerías de gráficas, es que el procesamiento y generado de las mismas se realiza en el cliente, esto tiene dos implicaciones a nuestro favor, por un lado liberamos nuestro servidor de realizar un procesamiento que lo podemos delegar a la máquina del cliente y segundo podemos agregar mayor interactividad a las mismas, cosa que se complica un poco más con las librarías del lado del servidor.

Y tú qué librería o framework usas para generar las gráficas de tus aplicaciones web?

Página oficial de Gcharts>>

Demo GCharts>>

Página oficial de HighCharts>>

Demo de HighCharts>>

Primero que todo necesitas tu copia del SDK de GWT 2.0 RC 2, lo puedes encontrar aquí.

Para poder aprovechar todas las nuevas funcionalidades de Gwt 2.0, deberás descargar e instalar el plugin de google para eclipse, que dependerá de la versión del IDE que tengas, así:

3.5 (Galileo): http://dl.google.com/eclipse/plugin/3.5/zips/gpe-e35-1.2rc2.zip
3.4 (Ganymede) http://dl.google.com/eclipse/plugin/3.4/zips/gpe-e34-1.2rc2.zip
3.3 (Europa): http://dl.google.com/eclipse/plugin/3.3/zips/gpe-e33-1.2rc2.zip

Una vez hayas descargado el plugin, deberás descomprimir su contenido en la carpeta dropins de tu instalación de eclipse, esto hará que ahora tengas un directorio:

ECLIPSE_HOME/dropins/eclipse/features/com.google.gdt.eclipse.suite.e35.feature_version

y  otro

ECLIPSE_HOME/dropins/eclipse/plugins/

Luego, reinicia el eclipse y  ya tienes instalado el nuevo plugin, solo nos resta configurar el kit de desarrollo de GWT.

Parqa configurar el sdk de gwt 2.0, deberás descomprimir el archivo gwt-2.0.0-rc2.zip que descargamos al inicio del artículo y copiarlo en la carpeta que desees, una vez hecho esto, vamos a  ir al menú Windows->Preferences del eclipse, y en la ventana que se abrirá selecciona la  sección bajo el nombre de Google, luego, ubica el item Google Web Toolkit y se nos deberá recargar una pantalla como la que vemos a continuación:

Ahora deberás presionar el botón Add y ubicar mediante el botón Browse el directorio, en el cual descomprimiste el contenido del sdk de gwt.

Para terminar de configurar el entorno de desarollo de Gwt2.0Rc2, es necesario instalar y configurar nuestro plugin para el modo de desarrollo en el navegador, para esto, debemos importar nuestro proyecto existente o bien crear un nuevo proyecto desde cero e intentar ejecutarlo como siempre lo hemos hecho desde el eclipse, una vez hecho esto, veremos una nueva vista incorporada en el plugin de google para eclipse, que nos indica que debemos abrir el navegador en que deseamos desarrollar y dirigirnos a la dirección:

http://localhost:8888/Gwt20Rc2Demo.html?gwt.codesvr=127.0.1.1:9997

En mi caso traté de hacerlo con Google Chrome sobre Ubuntu, sin embargo el plugin aún no está disponible para este navegador así que tuve que hacerlo con firefox 3.0, así que lo único que debo hacer es inciar mi navegador web y dirigirme a la dirección especificada en la vista “Development mode” del eclipse.

Esto nos mostrará una pantalla indicando que aún no tenemos instalado el plugin, para hacerlo, bastará con hacer click sobre el recuadro azul y seguir el asistente. Recuerda dar la opción de permitir instalar agregados a tu navegador ya que como es un plugin que se descarga de una página no oficial de mozilla el navegador no lo reconoce como seguro.

Finalmente solo nos resta reinciar el navegador y a disfrutar de la nueva versión de Gwt.

Como era de esperarse, he decidido probarla un poco y tengo que reconocer que han sido bastantes los cambios, entre estos voy a resaltar los siguientes:

• In-Browser development mode: Este es el nuevo modo de desarrollo que nos han preparado, el cual viene a ser el remplazo
  del antiguo Hosted mode que nos abría una ventana con un navegador incluido, en está nueva versión tenemos la posibilidad de desarrollar desde nuestro navegador favorito, con todos los beneficios que esto nos ofrece, por ejemplo el uso de firebug y demás herramientas en Firefox. Para esto debemos instalar un plugin llamado Google Web Toolkit Developer Plugin, el cual está disponible para los navegadores: Safari, Firefox, IE,y Chrome (Win2).
• Developer-guided Code Splitting: Esta es una característica que me gusta muchísimo, la cual consiste en poder cargar los fragmentos más mínimos de nuestra aplicación web y luego a medida que se vayan necesitando más recursos ir solicitándolos desde el servidor, esto nos permite ahorrar un tiempo considerable de la carga de nuestro sitio.
• UiBinder: Bueno, la verdad es que nunca he trabajado con esta herramienta, pero básicamente lo que nos ofrecen es poder crear interfaces de forma más declarativa, esto quiere decir que ya no hará falta configurar nuestras vistas en el código fuente sino que lo podremos hacer mediante archivos xml.
• Nuevos paneles y layouts aún más veloces: Se han añadido nuevos paneles como RootLayoutPanel, LayoutPanel, DockLayoutPanel, SplitLayoutPanel, StackLayoutPanel y TabLayoutPanel, y se ha mejorado la velocidad de los mismos, incrementando con esto el rendimiento general de nuestras aplicaciones.
• Unificación de recursos con ClientBundle: Creo que ya casi todos conocíamos el famoso ImageBundle de Gwt 1.x sin embargo este ha sido extendido para soportar un mayor número de recursos entre los que tenemos archivos de texto como xml’s o css.
• Y por último algunas mejoras en cuanto a la integración de las pruebas unitarias con HtmlUnit, en este sentido tengo que decir que las aplicaciones que he desarrollado hasta el momento, aún no han incluido pruebas unitarias, así que tengo muy poco que decir.