User Tools

Site Tools


catalis_en_mozilla

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
Next revision Both sides next revision
catalis_en_mozilla [10/10/2006 19:27]
fernando
catalis_en_mozilla [30/04/2009 16:28]
fernando
Line 1: Line 1:
 +====== Catalis en Mozilla ======
  
 +
 +
 +Lo que sigue son algunas notas sobre la adaptación de Catalis para que funcione sobre Mozilla y Firefox, manteniendo al mismo tiempo compatibilidad con Internet Explorer 6. Este trabajo fue realizado durante febrero-marzo de 2005. Se puede acceder a un demo de la (todavía inconclusa) versión compatible con Mozilla desde [[http://​inmabb.criba.edu.ar/​catalis/​catalis.php?​p=demo|el sitio de Catalis]].
 +
 +
 +===== Problemas =====
 +Los principales problemas sobre los que se debió trabajar son:
 +
 +   ​* ​ **DOCTYPE**:​ pasamos de
 +
 +  <​!DOCTYPE HTML PUBLIC "​-//​W3C//​DTD HTML 4.01 Transitional//​EN">​
 +
 +(que activa el //quirks mode// tanto en Mozilla como en IE6), a
 +
 +  <​!DOCTYPE HTML PUBLIC "​-//​W3C//​DTD HTML 4.01 Transitional//​EN"​ "​http://​www.w3.org/​TR/​html4/​loose.dtd">​
 +
 +para así tener algo parecido a //standards mode// en ambos navegadores. Con esta decisión, **queda excluido IE 5.5 como plataforma para Catalis**.
 +
 +   ​* ​ **CSS**: hubo que realizar ajustes en las dimensiones (''​width'',​ ''​height''​) de varios elementos, para corregir los valores que sólo tenían sentido para IE en //quirks mode//. Se agregó una hoja de estilo ''​catalis-ie.css''​ que sólo es "​vista"​ por IE (usando un comentario condicional). Algunos casos de posicionamiento absoluto no pudieron ser resueltos de manera totalmente satisfactoria,​ en general debido al comportamiento anómalo de IE.
 +
 +   ​* ​ **XML**: mediante la biblioteca Sarissa, que permite emular en Mozilla las funciones ''​selectNodes()''​ y ''​selectSingleNode()''​ de IE, pudimos conservar en gran medida el código original para acceder a porciones de documentos XML.
 +
 +   ​* ​ **Ventanas de diálogo modales y popups**: dado que Mozilla no cuenta con un equivalente a ''​showModalDialog()'',​ recurrimos a simModal.js,​ una solución cross-browser tomada del libro //​JavaScript & DHTML Cookbook//, de O'​Reilly. Esto requirió modificar el código en todas las llamadas a ventanas modales, el código de cada una de las ventanas, y el código que procesa el resultado entregado desde éstas. Tampoco cuenta Mozilla con un equivalente de ''​createPopup()''​.
 +
 +   ​* ​ **Textareas de altura dinámica**:​ la solución original para IE deja de funcionar cuando IE pasa a //standards mode//. Por lo tanto, hubo que reemplazarla por una solución que funcionalmente es un poco inferior, pero que anda bien en ambos navegadores.
 +
 +   ​* ​ **Eventos**:​ el hecho de que Mozilla e IE hayan implementado diferentes modelos de eventos (del W3C y de Microsoft, respectivamente),​ obliga a revisar y corregir la mayoría de los //event handlers// de la aplicación. Algunas de las principales diferencias son: uso del objeto global ''​window.event''​ (IE), capturing & bubbling (W3C) vs. bubbling (IE), ''​event.target''​ (W3C) vs. ''​event.srcElement''​ (IE).
 +
 +   ​* ​ **Foco**: algunos elementos que en IE pueden recibir foco, no pueden hacerlo en Mozilla; por ejemplo, el DIV con los campos de datos y el DIV con la visualización detallada del registro en la pantalla de búsquedas. La rueda del mouse no funciona sobre estos elementos. Aún no tenemos una solución.
 +
 +   ​* ​ **Detalles de Javascript**:​ la función ''​split()''​ produce resultados diferentes:
 +
 +  "​^aUno^bDos^cTres"​.split(/​\^/​) ​  ​=> ​ ["​aUno","​bDos","​cTres"​] ​   (IE)
 +
 +  "​^aUno^bDos^cTres"​.split(/​\^/​) ​  ​=> ​ ["","​aUno","​bDos","​cTres"​] (Mozilla)
 +
 +Es decir, la presencia del delimitador (en este caso, el carácter ''​^''​) en un extremo de la cadena, genera en Mozilla un string vacío en el extremo correspondiente del array resultante. Esa situación es bastante común en Catalis, con los delimitadores ''​^''​ y ''​\n''​ (newline). En algunos casos, tiene el efecto de generar un error; quedan muchos casos por revisar.
 +
 +
 +En Mozilla, los botones en los formularios tienen un comportamiento por defecto: submit. Por lo tanto, hubo que revisar el código para detectar y eliminar efectos no deseados producidos por ese tipo de submits accidentales.
 +
 +La revisión a nivel de CSS estimuló la realización de algunos cambios en el marcado (HTML), eliminando algunas tablas innecesarias y reemplazándolas según el caso por DIVs o listas (UL, LI).
 +
 +Queda pendiente el manejo de URLs largas dentro de un textarea.
 +
 +
 +==== Herramientas ====
 +Trabajar en la depuración del código sobre Mozilla ha resultado mucho más cómodo que sobre IE, al contar con las herramientas que mencionamos a continuación,​ en orden de utilidad:
 +
 +   ​* ​ Javascript console
 +   ​* ​ DOM inspector
 +   ​* ​ Javascript debugger
 +
 +
 +
 +==== Enlaces relacionados ====
 +[[http://​www-128.ibm.com/​developerworks/​web/​library/​wa-ie2mozgd/​|Migrate apps from Internet Explorer to Mozilla: How to make Internet Explorer-specific Web applications work in Mozilla-based browsers]]. Un artículo aparecido en ibm.com (26 de julio de 2005).
 +
 +
 +{{tag>​catalis desarrollo}}
catalis_en_mozilla.txt · Last modified: 04/05/2009 00:00 (external edit)