Flex-ible.

  La nueva versión de Delphi incorpora una nueva actualización de IntraWeb, con más  soporte Ajax y de librerías externas. Empezando por jQuery  y soporte para silverligth.  También prometen integrarse con Dojo y quizás otras librerías. Al fin y al cabo estas formas de conectar IntraWeb con dichas librerías es lo que intentamos hacer aquí hace tiempo.


 

Flex y IntraweB Library Extension. Usando Flex en un programa Delphi/IntraWeb (IW).

 

Abstract


El Objetivo es usar Flex en una aplicación IW. Realmente no es tan "difícil" como puedas pensar.

 


Truco 1. Poner las librerias Ajax en el directorio /files de la aplicación IW.

 

Parece un paso muy obvio, pero es la primera y más simple forma de usar cualquier librería Ajax en tu viejo programa IW.

 

El primer ejemplo es proiw1, que es un programa muy sencillo que usaremos para comprobar los primeros pasos.



Crearemos un Formulario sencillo en Flex, con un boton y una entrada de datos de texto (EditText). Si hacemos la exportación final del proyecto en el directorio /files de nuestra aplicación IW, tendremos generados los ficheros HTML y SWF que ejecutan la aplicación Flex.

 

Si comprobamos la aplicación (abriendo en navegador Web), poniendo por ejemplo :

 

http://127.0.0.1:8080/files/proiw1.html

 

Puedes ver que la aplicación Flex, se está ejecutando dentro de la infraestructura de la aplicación IW.

Pero son mundos distintos nuestra aplicación IW del programa hecho en Flex. No hay una forma directa de comunicarlos.

Necesiramos encontrar la forma de comunicar Flex con nuestro programa IW, para intercambiar datos.

Flex es en leguaje ActionScript y no JavaScript. Es como un entorno "cerrado" que no se comunica con el exterior.  

 

Adobe ha desarrollado Ajax Bridge (Hay que revisarlo).

 

Pero queremos buscar un camino "original" para comunicar los dos mundos Flex y IW.

Puesto que "ya sabemos" como comunicar desde el JavaScript de la página web con el servidor IW, usaremos esta forma para comunicar con el servidor.

 

El problema principal es conectar Flex con el JavaScript que va a hacer las llamas Ajax, y que JavaScript conecte con Flex para devolver los resultados del servidor.

 

Quizás no sea la única solución, pero está bien para empezar y ver los detalles que entraña. 

 

 

Antes de continuar tenemos que terminar de dar acogida a Flex en las páginas generadas por IW.

Vamos a empezar suponiendo que usamos IwTemplates.

Una aplicación Flex, es una página Web que "carga" la máquina Flex y el programa a ejecutar.

Nuestro "template" Intraweb debe tener el código que carga la aplicación Flex.

Deberiamos incluir los javascript utilizados por Flex en la cabecera de la plantilla HTML y

la función AC_FL_RunContent, en el Body del documento.

 

 

 


 

.. header

<link rel="stylesheet" type="text/css" href="/files/flex/history/history.css" />

<script src="/files/granflex.js" language="javascript"></script>

<script src="/files/flex/AC_OETags.js" language="javascript"></script>

<script src="/files/flex/history/history.js" language="javascript"></script>

... body

<script>


AC_FL_RunContent(

   "src",

"/files/flex/proiw1",

   "width", "100%",

   "height",

"100%",

   "align", "middle",

   "id", "proiw1",

   "quality",

"high",

   "bgcolor", "#869ca7",

   "name",

"proiw1",

   "allowScriptAccess","sameDomain",

   "type",

"application/x-shockwave-flash",

   "pluginspage", "http://www.adobe.com/go/getflashplayer"

 );

</script> 

 


 

 

Truco 2. Usando JavaScript desde flex.

 

Flex tiene un interface muy simple para llamar al código JavaScript.

Veamos un ejemplo generico.

 



public

 

function Call2Js(fun:String,eventObj:Object):String {

var s:String; 

if (ExternalInterface.available) { 

var wrapperFunction:String = fun;

  s = ExternalInterface.call(wrapperFunction, eventObj);

else {

s =

"Wrapper not available";

}; 

return s;

}

 

Queremos usar este puente con JavaScript para comunicar las llamadas Ajax al servidor, para obtener resultados.

 

a) Para hacer la llamada tenemos que hacerlo de la forma de Iw. Usando metodo Post y enviando como parametros, el formulario, el objeto que recibe la petición, etc...

 

b) Queremos tener la respuesta de la manera Ajax, es decir de forma asincrona. El resultado viene en un tiempo indeterminado, así que necesitamos la forma de comunicar desde JavaScript a Flex para pasarle el resultado de esta llamada. Hay varias formas de hacerlo, alguna de ellas muy enrevesada.

 

 La forma elegante y sencilla de hacerlo es "publicando en JavaScript" la función Flex. Usando de nuevo ExternalInterface, se puede usar addCallback  para declarar la función referida como accesible desde JavaScript

 


 


public

 

 

function setGpxDataSource(value:String):String

{

 

return "FromFlex"

}

 

 

 

private function initApp():void{



ExternalInterface.addCallback (

"setDataSource", setGpxDataSource);

 

}

 


 

 Queremos usar esta técnica para intercambiar datos, no solo strings, si no cadenas XML y otras cosas.

 

XML, es uno de los primeros objetivos, porque es lo que usa Flex mayormente para crear tablas y otros muchos objetos de presentación de datos.

 

Tendremos que estudiar la forma más sencilla de intercambiar datos XML entre el navegador y el servidor.

a) Definir en detalle un componente IW para gestionar las llamadas desde Flex. Basado en TAjaxLibrary.

b) Objeto tabla IW. Generar una tabla Flex desde una base de datos del programa IW.

c) Formulario IW, para intercambiar contenido entre un formulario Flex y el servidor.

 

 

Para comunicar con el servidor IntraWeb usaremos la técnica mostrada en http://www.multite.es/granprimo/miajax1.htm

 

De momento tengo desarrollado

TFlexLibrary , que hace "puente" entre Flex e IntraWeb y

TFlexGrid, que devuelve una cadena XML de datos a la aplicación Flex.

 

Esta ya integrado dentro de IntroAjax

 

 El siguiente objetivo es serializar Form de Flex a la aplicación delphi

 

 

 

Comments