Configuración de un entorno de desarrollo iWidget basado en IBM Rational Application Developer

Cuando se desarrollan widgets para su implementación en IBM® Mashup Center, se pueden usar dos herramientas de desarrollo de IBM: IBM Mashup Center Widget Factory o IBM Rational® Application Developer. Este artículo le explica cómo configurar IBM Rational Application Developer para que lo pueda usar para crear iWidgets para su implementación en IBM Mashup Center.

Denitsa Tsolova, Software Engineer, Musala Soft

Denitsa Tsolova is a Software Engineer with Musala Soft. She joined the Musala Soft jump start (jStart) team in early 2008 and participated in development and documentation of multiple iWidgets for IBM Mashup Center. She has more than three years of professional experience as a developer and extensive experience in teaching computer science. She has a B.S. in Informatics from Sofia University, Bulgaria.



Milen Penchev, Software Engineer, Musala Soft

Milen Penchev is a Software Engineer with Musala Soft, joining the Musala Soft jStart team in February 2008. He has participated in the development and documentation of multiple mashups and widgets for IBM Mashup Center. Milen has delivered several conference presentations to support IBM partners and clients in getting started with widget development. He has more that two years of professional experience in software development and has a B.S in Computer Systems and Technologies from Technical University in Sofia, Bulgaria.



Anislav Atanasov, Team Leader, Musala Soft

Anislav Atanasov is a Team Leader with Musala Soft. In March 2007 he started helping the IBM jStart team in developing mashups based on QEDWiki; after IBM Mashup Center was introduced, he developed several widgets and mashups. Anislav’s experience includes working with J2EE, Eclipse RCP, and Web 2.0. He has a B.S. in Computer Science and an M.S. in Software Engineering from Sofia University, Bulgaria.



Sam Thompson, Senior IT Architect, IBM

Sam Thompson is a Senior IT Architect in IBM Software Group’s Emerging Technologies Group. Since joining IBM in 1980 he has held various technical and management positions in VM product development. In 1992, he moved to the Systems Management Development Lab in Raleigh, North Carolina, helping bring several SystemView products to market. When SystemView merged with Tivoli Systems, he traveled the world as a technical evangelist, explaining the merger, the new Tivoli strategy and products, and the convergence strategy for the IBM and Tivoli workgroup products. In March 1997 he helped form the IBM's Emerging Technologies jStart group, which works with IBM's clients to help them architect and build solutions that use XML, Java, Web services, rich client, autonomic computing, Web 2.0, Ajax, and mashup technologies.



20-11-2009

Introducción

El propósito de este artículo consiste en describir los pasos de configuración que resultan necesarios para configurar IBM Rational Application Developer de manera tal que se lo pueda usar para crear iWidgets para su implementación en IBM Mashup Center.

Requisitos previos

Para sacar el mayor provecho posible de este artículo, usted debería tener instalado el siguiente software:

  • IBM Mashup Center 1.1. Tenga en cuenta que, de aquí en más, se hará referencia al directorio de instalación de IBM Mashup Center como <imc_dir>.
  • IBM Rational Application Developer. Como IBM Mashup Center se ejecuta en IBM WebSphere® Application Server V6.1, la versión de Rational Application Developer debe ser una que pueda usar WebSphere Application Server V6.1. Para este artículo, se usó Rational Application Developer 7.5.

Configuraciones del entorno

En primer lugar, abra Rational Application Developer. Aunque es posible volver a usar un espacio de trabajo ya existente, a los propósitos de este artículo, usamos un espacio de trabajo completamente nuevo. No existen limitaciones en lo referido a la ubicación en el sistema de archivos de este espacio de trabajo.

Creación de una instancia de servidor

Cree una instancia de servidor del WebSphere Application Server de Mashup Center en Rational Application Developer de la siguiente forma:

  1. Abra la vista Servers (Servidores) en Rational Application Developer. Esta vista se visualiza automáticamente cuando se abre la perspectiva Java™ Platform, Enterprise Edition (Java EE). Sin embargo, si la vista Servers no se visualiza, diríjase al menú de Windows y seleccione Show View - Other (Mostrar Vista - Otra).
  2. Desde la ventana que se visualiza (ver Figura 1), expanda la capeta Server y seleccione la opción Servers.
  3. Presione el botón derecho del mouse sobre esta vista y seleccione New - Server (Nuevo - Servidor).
  4. En la ventana New Server (Nuevo servidor) que se visualiza, ingrese localhost en el campo Server host (Host del servidor). Para configurar el tipo de servidor, en la carpeta de IBM, seleccione WebSphere Application Server v6.1 (ver Figura 1).

    Figura 1. Ventana de Nuevo Servidor
    Ventana de Nuevo Servidor
  5. Ingrese el nombre de servidor que desee en el campo Server name (Nombre del servidor).
  6. En el campo Server runtime environment (Entorno de tiempo de ejecución del servidor), seleccione el entorno WebSphere Application Server que se instaló junto con IBM Mashup Center. Haga clic en Next (Siguiente).

    NOTA:Si dicho entorno no existe, créelo haciendo clic en el botón Add (Agregar) (vea la próxima sección para conocer todos los pasos de configuración necesarios).

  7. En la ventana New Server Runtime Environment (Entorno de tiempo de ejecución del nuevo servidor), ingrese un nombre para el entorno del nuevo servidor en el campo Name (Nombre). Por ejemplo, ingrese IMC Server Runtime 6.1 (ver Figura 3).
  8. En el campo Installation directory (Directorio de instalación), navegue hacia la carpeta AppServer que se encuentra debajo del directorio de instalación de IMC (<imc_dir>\AppServer).

    Tenga en cuenta que esta ventana sólo se visualiza si usted hizo clic en el botón Add en la ventana anterior para crear un entorno de nuevo servidor.

  9. Luego de completar todos estos campos, haga clic en Finish (Finalizar). En la ventana Define New Server (Definir nuevo servidor), haga clic en Next.
  10. En la ventana WebSphere Server Settings (Configuración del servidor WebSphere), defina la configuración necesaria (ver Figura 2). Por ejemplo, aquí usamos mm_profile para el nombre del perfil de WebSphere. Además, asegúrese de activar las siguientes opciones: Automatically determine connection settings (Determinar la configuración de conexión automáticamente), Run server with resources within the workspace (Ejecute el servidor con los recursos dentro del espacio de trabajo) y Security is enabled on this server (Seguridad activada en este servidor).
  11. Ingrese la ID y la contraseña de usuario correspondientes a la instancia WebSphere Application Server de IBM Mashup Center (definidas durante el procedimiento de instalación de IBM Mashup Center). Haga clic en Finish.

    NOTA:Si hace clic en el botón Next en vez de sobre el botón Finish, la ventaja que se visualiza (Add and Remove Projects [Agregar y eliminar proyectos]) le permitirá implementar todos los proyectos existentes del espacio de trabajo en el nuevo servidor.

    Figura 2. Página WebSphere Server Settings (Configuración del servidor WebSphere)
    Página WebSphere Server Settings (Configuración del servidor WebSphere)
  12. Cuando haya terminado con esto, podrá iniciar la instancia de WebSphere Application Server recientemente definida desde la vista Servers (presione el botón derecho del mouse sobre la instancia recientemente definida y seleccione Start (Iniciar)).

Configuración básica para el proyecto iWidget

La configuración del proyecto iWidget requiere el cumplimiento de los dos siguientes pasos: la creación del proyecto y el agregado de archivos específicos a iWidget.

Creación del proyecto

Para crear un proyecto iWidget, siga estos pasos:

  1. Desde el menú principal de Rational Application Developer, seleccione File - New - Project (Archivo - Nuevo - Proyecto).
  2. En la ventana New Project (Proyecto nuevo), seleccione Dynamic Web Project (Proyecto Web dinámico) en la carpeta Web.
  3. En la ventana New Dynamic Web Project (Nuevo proyecto Web dinámico), ingrese el nombre del proyecto, por ejemplo, com.ibm.basic.hello (ver Figura 3). En Target Runtime (Tiempo de ejecución objetivo), seleccione el tiempo de ejecución de IBM Mashup Center WebSphere Application Server recientemente creado. En esta instancia, use IMC Server Runtime v6.1.

    Tenga en cuenta que no es necesario crear un proyecto Enterprise Archive (EAR) nuevo para crear IBM Mashup Center iWidgets.

  4. Si se desea contar con un proyecto EAR nuevo, active la opción Add project to an EAR (Agregar proyecto a un EAR). Usted puede crear y configurar el proyecto EAR haciendo clic en el botón New (Nuevo). De lo contrario, el nombre del proyecto (previamente poblado por Rational Application Developer) se puede modificar en el campo EAR Project Name (Nombre del proyecto EAR). Además, el proyecto EAR se crea con la configuración predeterminada o recomendada.

    Figura 3. Ventana New Dynamic Web Project
    Ventana New Dynamic Web Project
  5. Haga clic en Finish. Se crea y se visualiza el proyecto (el proyecto y su EAR) en Rational Application Developer.

    NOTA:Se hace referencia a la carpeta principal del proyecto como <project_root>. Además, se hace referencia a la carpeta principal del proyecto EAR como <ear_project_root>.

Agregado de archivos específicos al iWidget

Para crear cada uno de los archivos que figuran a continuación, presione el botón derecho del mouse sobre su carpeta principal y seleccione New - File (Nuevo - Archivo):

  • mashup.properties.Cree este archivo en la carpeta <project_root>/WebContent/WEB-INF.

    Este archivo de propiedades (ver Listado 1) debería incluir dos pares de valores clave, contextRoot y componentName. La propiedad contextRoot define la raíz de contexto para el proyecto WebSphere Archive (WAR). El servidor usa la propiedad componentName durante el proceso de implementación.

Listado 1. Archivo mashup.properties
contextRoot=basic/hello
                componentName=com.ibm.basic.helo
  • catalog.xml.Cree este archivo en la carpeta <project_root>/WebContent/WEB-INF.

    Este archivo XML incluye la descripción del iWidget (ver Listado 2). Cada iWidget en el proyecto WAR debería tener su propia entrada en el archivo catalog.xml. La declaración del iWidget debería cumplir con los requisitos de IBM Mashup Center y, por lo tanto, incluir etiquetas específicas al widget (como, por ejemplo, título, descripción, definición e ícono).

Listado 2. Archivo catalog.xml
<?xml version="1.0"
                    encoding="UTF-8"?> <catalog> <category
                    name="Demo"> <entry id="HelloWidget" unique
                    name="HelloWidget"> <title> <nls-string
                    lang="en"> Hello iWidgets</nls-string>
                </title> <description> <nls-string
                    lang="en">iWidget, created by RAD</nls-string>
                </description>
                <definition>HelloWidget.xml</definition>
                <content>http://www.ibm.com</content>
                <preview>http://www.ibm.com</preview>
                <icon>hello_widget_icon.gif</icon>
                </entry> </category> </catalog>

Tenga en cuenta que la entrada de la definición apunta hacia el archivo de definición del iWidget y que la entrada del ícono apunta hacia la imagen para el iWidget. Ambos registros de las rutas de archivo son relativos al directorio <project_root>/WebContent.

Personalización de los contenidos del iWidget

Cuando se crea el iWidget, se involucran dos archivos fundamentales: un archivo XML, que incluye la definición del iWidget, y un archivo JavaScript™, que incluye la funcionalidad del iWidget.

Archivo de definición

Para crear este archivo, presione el botón derecho del mouse sobre la carpeta <project_root>/WebContent y seleccione New - File. Ingrese el nombre del archivo de definición en el campo File name (Nombre del archivo) (por ejemplo, HelloWidget.xml) y haga clic en Finish. El archivo debería aparecer en Rational Application Developer con una extensión de archivo XML.

Tenga en cuenta lo siguiente:

  • El nombre del archivo XML y su ubicación debe coincidir con los valores especificados en el archivo catalog.xml.
  • El archivo de definición debe cumplir con la especificación del iWidget. En este caso, las entradas principales son <iw:iwidget> y <iw:content> (ver listado 3). El archivo de definición incluye el HTML para la interfaz de usuario del widget.
Listado 3. Archivo de definición
<iw:iwidget id="HelloWidget"
                    xmlns:iw="http://www.ibm.com/xmlns/prod/iWidget"
                    iScope="HelloWidget" allowInstanceContent="true"
                    supportedModes="view edit" mode="view" lang="en">
                <iw:resource url="HelloWidget.js" /> <iw:content
                    mode="view"> <![CDATA[ <div style="color: #aa00ff;"
                Hello! </div> ]]> </iw:content>
                </iw:iwidget>

No se requiere la etiqueta <iw:resource>. Se puede crear un iWidget que sólo incluya un archivo XML (por ejemplo, cuando no es necesario contar con un script o cuando se lo escribe dentro de una etiqueta <script> en el archivo XML.

Este tipo de iWidget no usa ningún otro archivo a modo de recurso. Por lo tanto, en esta situación, la etiqueta <iw:resource> se puede omitir. El valor dentro de la etiqueta se refiere al archivo de recursos principal del iWidget y la ruta es relativa al archivo de declaración en sí mismo.

El valor del atributo iScope de <iw:iwidget> se refiere a la clase principal del iWidget. Esta clase se declara en uno de los archivos de recursos y su nombre debe coincidir con el valor del atributo iScope.

Archivo de recursos

Para crear el archivo de recursos, presione el botón derecho del mouse sobre la carpeta <project_root>/WebContent y seleccione New - File. Ingrese el nombre del archivo de recursos y haga clic en Finish. El archivo aparecerá en Rational Application Developer.

El nombre del archivo de recursos y su ubicación deberían coincidir con los valores especificados en la etiqueta <iw:resource> en el archivo de definición que figura con anterioridad.

Ahora, agregue el código fuente del iWidget, como se puede observar en el listado 4.

Listado 4. Código fuente de HelloWidget.js
Dojo.declare("HelloWidget",null, {
                    Id:null, onLoad:function() {this.id = "_"
                +this.iContext.widgetId = "_"; alert(Hello from the iWidget with value "
                    +this.id); } }};

Tenga en cuenta que usted puede escribir el iWidget usando estilos de implementación diferentes, entre los que podemos incluir los lenguajes, la estructura de clase y muchos más. La única limitación del producto IBM Mashup Center es que la clase principal (definida en el valor del atributo <iScope> del archivo de definición) debe ser una clase Dojo.

Otros archivos

En el proyecto iWidget, muchos otros archivos pueden existir y se los puede usar para personalizar el iWidget. A los propósitos de este artículo, el ícono correspondiente al iWidget (una imagen en formato GIF) se crea dentro de una carpeta interna. Para realizar esta tarea, siga estos pasos:

  1. Presione el botón derecho del mouse sobre la carpeta <project_root>/WebContent y seleccione New - Folder (Nueva - Carpeta). En la venta que se visualiza, inserte el nombre correspondiente a la carpeta nueva. Aquí, usamos imágenes como nombre.
  2. El ícono del iWidget debe ser un archivo de imagen. Pegue o importe el archivo dentro de la carpeta que acaba de crear.

Tenga en cuenta lo siguiente:

  • La descripción de cada ruta de archivo debería coincidir con la ubicación del archivo. La ruta de archivo en el archivo catalog.xml es relativa a la carpeta <project_root>/WebContent.
  • Cuando un archivo de recursos se incluye en el archivo de definición, la ruta de archivo hacia el archivo incluido debería ser relativa a la ubicación del archivo de definición.
  • Cuando un archivo de recursos se incluye en otros archivos de recursos, la ruta de archivo hacia el archivo incluido debería tener el siguiente formato:

    /widgets/<context_root>/<relative_path>

    donde <context_root> representa el valor de contextRoot en el archivo mashup.properties y <relative_path> representa la ruta de archivo relativa a la carpeta <project_root>/WebContent (a este detalle se lo explica más adelante en este artículo).


Implementación de iWidgets

Ahora, discutamos cómo implementar iWidgets.

Creación del archivo WAR del iWidget

Para crear el archivo WAR, siga estos pasos:

  1. Presione el botón derecho del mouse sobre <project_root> (el nombre del proyecto) y seleccione Export (ver Figura 14).
  2. Desde la ventana que se visualiza, expanda la carpeta Web, seleccione el elemento del archivo WAR y haga clic en Next.
  3. En la siguiente pantalla que se visualiza, ingrese la información de destino y haga clic en Finish. Se crea el archivo WAR en la carpeta de destino.

Carga del iWidget en MashupHub

Para cargar el iWidget en MashupHub, siga estos pasos:

  1. Asegúrese de que IBM Mashup Center esté en funcionamiento. Usted puede iniciar y detener el servidor en Rational Application Developer usando el menú de contexto de la instancia de servidor.
  2. Abra MashupHub e inicie sesión.
  3. Desde la sección Create (Crear) de la página principal de MashupHub, seleccione Upload Widget (Cargar Widget) (ver Figura 4).

    Figura 4. Sección Create de MashupHub
    Sección Create de MashupHub
  4. Para la fuente del tipo, seleccione la opción iWidget Package (Paquete iWidget) (.war), como se puede observar en la figura 5. Haga clic en Next.

    Figura 5. Seleccione la fuente del tipo de widget
    Seleccione la fuente del tipo de widget
  5. En la siguiente ventana, navegue hacia el archivo WAR del iWidget que se exportó como lo describimos con anterioridad. Haga clic en Next.
  6. En la siguiente ventana, especifique la información específica al widget (ver Figura 6). Aquí, usamos "HelloWidget" en el campo Title (Título), "Hello iWidget demonstration" en el campo Description y 1.0 en el campo Version.
  7. Haga clic en Finish. El iWidget se agregará al catálogo.

    Figura 6. Ingrese la información específica al widget
    Ingrese la información específica al widget
  8. En la sección What’s Next (¿Qué sigue?), seleccione View widget details (Ver detalles del widget).
  9. En la página iWidget details (Detalles del iWidget), seleccione Add to Lotus Mashups (Agregar a Lotus Mashups).
  10. En la ventana Add to Lotus Mashups, especifique las credenciales para IBM Mashup Center ID y haga clic en Next. En la siguiente página, seleccione la categoría (aquí, seleccionamos Demo) para el iWidget y haga clic en Finish (ver Figura 7).

    Figura 7. Segunda ventana: Add to Lotus Mashups
    Segunda ventana: Add to Lotus Mashups

Se agregó el iWidget a la categoría seleccionada en Lotus Mashups y se lo puede arrastrar hacia una página mashup. Tenga en cuenta que, si se abrió Lotus Mashups en el navegador, la página se deberá recargar para que muestre el iWidget dentro de la categoría (ver Figura 8).

Figura 8. Uso del nuevo HelloWidget en un mashup
Uso del nuevo HelloWidget en un mashup

Observe lo que ocurren en las siguientes situaciones:

  • Si selecciona la opción Adding the widget to Lotus Mashups (Agregar el widget a Lotus Mashups), el iWidget se implementa en el WebSphere Application Server de IBM Mashup Center.
  • Su carga un iWidget en MashupHub, cada archivo de proyecto iWidget recibe una URL exclusiva y se puede acceder al mismo por medio de un navegador Web. Esta URL se compone de la siguiente manera:

    http://<host>:<port>/widgets/<context_root>/<relative_path>

    donde <host> y <port> son los valores del host y del puerto del WebSphere Application Server de IBM Mashup Center, y ocurre lo siguiente:

    • MashupHub agrega /widgets/ automáticamente.
    • <context_root> es el valor de contextRoot en el archivo mashup.properties.
    • <relative_path> es la ruta de archivo relativa a la carpeta <project_root>/WebContent.

    También se pueden usar HTTPS con el puerto adecuado.

  • Si agrega un iWidget a Lotus Mashups, se agrega una entrada al archivo <imc_dir>\mm\public\cat\catalog_<username>.xml. Esta entrada se crea con los contenidos del archivo catalog.xml del proyecto del iWidget. Tenga en cuenta que los valores de <definition> y <icon> se vuelven a escribir en /widgets/<context_root>/<relative_path>.

Depuración o cambio dinámico de un widget en Rational Application Developer

Si se instala un servidor IBM Mashup Center en la misma computadora que Rational Application Developer, es posible modificar dinámicamente y depurar iWidgets sin que exista la necesidad de crear archivos WAR manualmente e instalarlos en el servidor IBM Mashup Center usando MashupHub.

Desinstalación de un iWidget implementado

Esta subsección describe cómo desinstalar un iWidget usando la consola de WebSphere Application Server de manera tal que usted pueda editar el código fuente del widget (como se lo indica a continuación). Para desinstalar un iWidget completamente, vea la sección "Desinstalación de un iWidget" que figura más adelante en este artículo.

  1. Abra la consola administrativa de IBM Mashup Center WebSphere Application Server (Integrated Solutions Console [Consola de Soluciones Integradas]) y seleccione Applications - Enterprise Applications (Aplicaciones - Aplicaciones empresariales).
  2. Se mostrará una lista de las aplicaciones implementadas (ver Figura 9). Seleccione la aplicación (es decir, el widget) que se debería desinstalar y haga clic en el botón Uninstall (Desinstalar).

    Figura 9. Lista de aplicaciones implementadas
    Lista de aplicaciones implementadas
  3. Guarde la nueva configuración del servidor.

Configuración del archivo de catálogo

Cuando se agregan iWidgets a Lotus Mashups, se los coloca en cajones diferentes definidos por el archivo <imc_dir>/mm/public/cat/catalog_<username>.xml.

Cada uno de estos cajones se describe mediante el uso de una etiqueta XML <category>. Para que un iWidget se visualice en un cajón de Lotus Mashups, la etiqueta correspondiente <entry> debe estar presente en el archivo.

Tanga en cuenta que, si el iWidget ya se agregó a Lotus Mashups usando MashupHub, la entrada se realizó automáticamente y no es necesario realizar ningún tipo de modificación.

Si no existe ninguna entrada correspondiente al iWidget en el archivo de catálogo, se la debe realizar de manera manual siguiendo estos pasos:

  1. Copie los contenidos de la etiqueta <category> o <entry> del archivo catalog.xml del proyecto y agréguela al archivo <imc_dir>/mm/public/cat/catalog_<username>.xml, preservando la disposición de la estructura jerárquica de etiquetas.
  2. Edite los valores de las etiquetas <definition> y <icon> agregando /widgets/<context_root>/ al principio de <relative_path>, como se lo describe en el último punto de la sección anterior ("Carga del iWidget en MashupHub").
  3. Cuando se modifique el archivo <imc_dir>/mm/public/cat/catalog_<username>.xml, usted deberá reiniciar IBM Mashup Center WebSphere Application Server para que los cambios tomen efecto.

Tenga en cuenta que existe un límite de cinco categorías en IBM Mashup Center. Por lo tanto, cuando modifique el archivo <imc_dir>/mm/public/cat/catalog_<username>.xml, asegúrese de que no existan más de cinco etiquetas <category> dentro del archivo.

Modificación del proyecto EAR

Si se creó un proyecto EAR para el iWidget (como se describió con anterioridad en "Creación de la sección del proyecto"), se lo visualizará en Rational Application Developer. Para modificar este archivo, siga estos pasos:

  1. Abra el archivo <ear_project_root>/META_INF/application.xml.
  2. Cambie a la vista del código fuente y configure el valor <context-root>. El valor correspondiente a la raíz de contexto del módulo del iWidget debería tener el siguiente formato:

    widgets/<context_root>

    donde <context_root> es el valor de contextRoot en el archivo mashup.properties.

  3. Guarde las modificaciones hechas al archivo.

Implemente el archivo EAR en el WebSphere Application Server de IBM Mashup Center

Para implementar el archivo EAR, siga estos pasos:

  1. Asegúrese de que el servidor esté en funcionamiento. La instancia de servidor de Rational Application Developer indica este detalle mostrándole su estado como Started (Iniciado) o Debugging (En depuración).
  2. Presione el botón derecho del mouse sobre la instancia de servidor y seleccione Add and Remove Projects.
  3. En la ventana Add and Remove Projects (ver Figura 10), seleccione el proyecto EAR del iWidget (en este caso, es com.ibm.basic.helloEAR) y muévalo hacia el área de proyectos ConFigurad haciendo clic en el botón Add.
  4. Haga clic en Finish. El archivo EAR del proyecto se implementa en el WebSphere Application Server de IBM Mashup Center.

    Figura 10. Ventana Add and Remove Projects
    Ventana Add and Remove Projects

El iWidget se puede arrastrar desde un cajón de Lotus Mashups y soltar en una página Mashup debido a que se agregó una entrada para el iWidget al archivo de catálogo del usuario.

Los archivos de definición y de código fuente del iWidget son editables debido a que se los cargó en el WebSphere Application Server de IBM Mashup Center por medio del proyecto EAR usando un valor apropiado para la raíz de contexto.

Modificaciones del código fuente del tiempo de ejecución

Los archivos de definición y de recursos implementados del iWidget ahora se pueden editar de manera dinámica en Rational Application Developer. Cada vez que un cambio se guarda y se construye el proyecto iWidget, el archivo EAR se vuelve a publicar de manera automática en el WebSphere Application Server de IBM Mashup Center.

No es necesario reiniciar el servidor cuando se realizan cambios, ya que los cambios se aplican de manera automática.

Para ver las modificaciones realizadas al iWidget en Lotus Mashups, usted debe actualizar la página Web (y lo más aconsejable es limpiar la caché del navegador). La Figura 11 le muestra el widget actualizado.

Figura 11. Mashup Page (Página Mashup) con el texto nuevo, "Bye", que se visualiza en HelloWidget
Mashup Page (Página Mashup) con el texto nuevo,

Tenga en cuenta que usted puede desinstalar la aplicación EAR, implementada usando Rational Application Developer en el WebSphere Application Server de IBM Mashup Center, usando uno de los siguientes dos métodos:

  • Como se lo describe en la sección "Desinstalación de un iWidget implementado". El nombre de la aplicación es el valor de la etiqueta <display-name> que se especifica en el archivo <ear_project_root>/META_INF/application.xml.
  • Usando la instancia de IBM Mashup Center WebSphere Application Server en Rational Application Developer. En la ventana Add and Remove Projects, elimine el proyecto EAR del área de proyectos ConFigurad y haga clic en Finish.

Desinstalación de un iWidget

Aquí le explicamos cómo desinstalar un iWidget.

Eliminación de la aplicación del widget del servidor de IBM Mashup Center WebSphere Application Server

Para eliminar la aplicación del widget, siga estos pasos:

  • Si la aplicación del widget se implementó en el WebSphere Application Server de IBM Mashup Center mediante la carga del widget usando MashupHub, vea la subsección anterior, "Desinstalación de un iWidget implementado".
  • Si la aplicación del widget se implementó en la instancia de servidor de Rational Application Developer, presione el botón derecho del mouse sobre la instancia de servidor y seleccione Add and Remove Projects. En la ventana Add and Remove Projects, seleccione el proyecto EAR del iWidget y elimínelo del área del proyectos ConFigurad.

Borrado de una entrada de widget de un cajón

Para borrar una entrada de widget de un cajón, siga estos pasos:

  1. Abra Lotus Mashups y seleccione Go to Edit mode (Ir a modo Editar) para visualizar los cajones.
  2. Encuentre el widget en el cajón apropiado.
  3. Pase el cursor sobre la entrada de widget y haga clic en el botón Configuration. Desde el menú de contexto, seleccione Remove (Eliminar). El widget se borrará del cajón.

Borrado de un widget de MashupHub

Para borrar un widget de MashupHub, siga estos pasos:

  1. Abra MashupHub e inicie sesión usando la ID de administrador de MashupHub o la ID que usó para agregar el widget a Lotus Mashups.
  2. Desde la sección Catalog, seleccione List Widgets (Lista de widgets) y elija el nombre del iWidget.
  3. En la página de detalles del iWidget, en la sección Actions (Acciones), seleccione Delete (Borrar) (ver Figura 12). El widget se borrará del MashupHub.

    Figura 12. Página de detalles del Widget
    Página de detalles del Widget

Conclusión

Esperamos que ahora sepa cómo crear algunos widgets personalizados rápidamente para los mashups de su IBM Mashup Center. Ahora, usted debería poder hacer lo siguiente:

  • Crear un HelloWidget simple que sólo muestre texto (por ejemplo, "Hello" o "Bye").
  • Implementar el widget nuevo en una instancia remota de IBM Mashup Center usando MashupHub.
  • Implementar el widget nuevo directamente desde Rational Application Developer cuando tanto Rational Application Developer como IBM Mashup Center estén instalados en el mismo sistema.

Descargas

DescripciónNombretamaño
Código de ejemplocom.ibm.basic.hello_src.zip9880B
Código de ejemplocom.ibm.basic.hello.war4054B

Recursos

Aprender

Obtener los productos y tecnologías

Comentar

Comentarios

developerWorks: Ingrese

Los campos obligatorios están marcados con un asterisco (*).


¿Necesita un IBM ID?
¿Olvidó su IBM ID?


¿Olvidó su Password?
Cambie su Password

Al hacer clic en Enviar, usted está de acuerdo con los términos y condiciones de developerWorks.

 


La primera vez que inicie sesión en developerWorks, se creará un perfil para usted. La información en su propio perfil (nombre, país/región y nombre de la empresa) se muestra al público y acompañará a cualquier contenido que publique, a menos que opte por la opción de ocultar el nombre de su empresa. Puede actualizar su cuenta de IBM en cualquier momento.

Toda la información enviada es segura.

Elija su nombre para mostrar



La primera vez que inicia sesión en developerWorks se crea un perfil para usted, teniendo que elegir un nombre para mostrar en el mismo. Este nombre acompañará el contenido que usted publique en developerWorks.

Por favor elija un nombre de 3 - 31 caracteres. Su nombre de usuario debe ser único en la comunidad developerWorks y debe ser distinto a su dirección de email por motivos de privacidad.

Los campos obligatorios están marcados con un asterisco (*).

(Por favor elija un nombre de 3 - 31 caracteres.)

Al hacer clic en Enviar, usted está de acuerdo con los términos y condiciones de developerWorks.

 


Toda la información enviada es segura.


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=90
Zone=Lotus, Rational
ArticleID=448455
ArticleTitle=Configuración de un entorno de desarrollo iWidget basado en IBM Rational Application Developer
publish-date=11202009