Compatibilidad con JQuery, MooTools, ExtCore y Prototype en Kumbia Enterprise
Publish at Thursday, March 11, 2010
By Core Developers - Louder
La versión 1.71 de Kumbia Enterprise mejora considerablemente el soporte para Javascript. Históricamente
solo era posible usar Prototype+Scriptaculous y el framework en general estaba escrito para solo soportar
este framework javascript.
Hoy en día hay más frameworks Javascript que ofrecen ventajas y funcionalidades interesantes y que al
usarlos podía hacer que dejara de funcionar algunos helpers ó componentes del framework.
No queriamos que usar un framework Javascript fuera camisa de fuerza, es decir, que solo se pudiese usar
uno en especifico y que el desarrollador tuviera que adaptarse a él, ó, en el caso contrario, dejar
de usar alguna funcionalidad de Kumbia Enterprise porque no se adaptara al framework escogido.
El framework javascript "Base"
Kumbia Enterprise ahora incluye un mini-framework javascript llamado "Base". Su objetivo no es
reinventar la rueda volviendo a hacer toda la funcionalidad que ya tienen otros frameworks javascript.
Su meta más bien, es ofrecer una capa de abstracción al framework javascript que haya escogido el desarrollador
de tal forma que Kumbia Enterprise pueda acceder de manera uniforme a las funciones de cada framework.
"Base" representa la misma idea que se implementó en componente
ActiveRecord
el cuál permite usar diferentes bases de datos (MySQL, Oracle, Informix, SQL Server, etc) usando el
mismo código, ni depender de la implementación SQL de cada motor.
Uso del Javascript en Kumbia Enterprise
Anteriormente se podia visualizar en la vista views/index.phtml de cada aplicación como
se incluía el framework Javascript y se creaba la variable $Kumbia usando un archivo externo:
<?php
//Se incluía Prototype+Scriptaculous
echo Tag::javascriptLibrary("framework/scriptaculous/protoculous");
//Se incluían los javascript basicos del KEF
echo Tag::javascriptBase();
Se usaba un archivo externo main.php para crear la variable $Kumbia y esto impactaba en el rendimiento
de la aplicación
Se cargaba el archivo validations.js aún cuando no se requería en cada petición
Como se puede usar el Javascript ahora
El Javascript incluye mejoras en varios sentidos, todos en miras a ofrecer una mayor libertad para
usar plugins y librerias de terceros asi como el rendimiento de las aplicaciones.
Incluir el framework Javascript que se desee
Kumbia Enterprise ahora incluye los 4 principales frameworks para javascript como
parte de su distribución. Podemos escoger el que más nos guste ó el que necesitemos.
A continuación listamos los frameworks disponibles. Sus descripciones son tomadas
de la Wikipedia que se enlaza también:
Permite simplificar la manera de interactuar con
los documentos HTML, manipular el arbol DOM, manejar eventos, desarrollar animaciones, etc.
Licencia MIT
ExtCore
Una libreria multi-navegador para construir páginas web dinámicas. Licencia MIT
MooTools
Es un framework web orientado a objetos para JavaScript, de código abierto, compacto y modular.
Licencia MIT
Los frameworks se escogieron por ser los más usados y completos actualmente. El min-framework "Base" que mencionamos
anteriormente permite aprovechar la funcionalidad más común de estos frameworks de manera uniforme sin reescribir código.
Importar el framework en la aplicación
Un nuevo helper se ha incorporado para hacer esta tarea más sencilla, su uso es el siguiente:
El uso es muy sencillo, lo que hace internamente es generar un tag html llamado script que incluye
la libreria indicada.
Incluir otro contenido Javascript
Los helpers Tag::javascriptInclude y Tag::javascriptLibrary permitian incluir de forma inmediata un
recurso javascript externo en una vista cualquiera:
Estos helpers funcionaban perfectamente cuando se queria que la etiqueta SCRIPT se insertara en esa
posición de la vista.
Incluir Javascript de forma más organizada
Kumbia Enterprise v.1.71 incluye los nuevos helpers Tag::addJavascript y Tag::javascriptSources que permiten
agregar de manera más organizada los javascripts durante una petición.
Tag::javascriptSources debe ser llamado donde se requiera que aparezcan todos los javascripts
agregados con Tag::addJavascript. Este último no imprime nada donde sea invocado solo agrega
el javascript indicado a una lista interna que es procesada finalmente por Tag::javascriptSources.
Tag::javascriptSources es usualmente colocado en la vista principal del sistema views/index.phtml, de esta
forma recibe todos los javascript agregados por los layouts, partials y vistas. De está forma la vista principal
podría quedar así:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Título de la Aplicación</title>
<?php
//Agregar framework JQuery y mostrar los recursos agregados
Tag::addJavascriptFramework("jquery");
echo Tag::javascriptSources();
//Agregar recursos CSS
Tag::stylesheetLink("style");
echo Tag::stylesheetLinkTags();
?>
</head>
<body>
<?php View::getContent(); ?>
</body>
</html>
Si por ejemplo en una vista se hubiese agregado otro javascript así:
echo Tag::javascriptInclude("menu");
Entonces la salida al explorador sería la siguiente:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Título de la Aplicación</title>
<script type="text/javascript" src="/javascript/core/framework/jquery/jquery.js"></script>
<script type="text/javascript" src="/javascript/core/menu.js"></script>
<link rel="stylesheet" type="text/css" href="/css/style.css" />
</head>
<body></body>
</html>
Como se puede observar el menu.js se incluyo en la cabecera del documento HTML sin importar que este
fue agregado desde una vista diferente a la vista principal. El concepto es mismo que maneja las hojas
de estilo CSS con los helpers Tag::stylesheetLink y Tag::stylesheetLinkTags.
Más adelante explicaremos como usar el mini-framework "Base" para crear aplicaciones Javascript un poco
más portables.
Conclusiones
Gracias al framework "Base" es posible usar cualquiera de los frameworks mencionados y poder
seguir usando helpers como Tag::linkToRemote, Tag::formRemote y componentes dependientes de javascript
como StandardForm sin problema alguno.
Kumbia Enterprise tiene una política de compatibilidad hacia atrás, de esta forma se puede entender
que los cambios a continuación son opcionales y que las aplicaciones actuales no se ven afectadas
por estos nuevas mejoras. Se recomienda al desarrollador revisar la viabilidad para implementar estos
cambios ya que mejoran la eficiencia de las aplicaciones.
Tell friends about this article on social networks: