1 O3 Portal CustomizationIdeasoft
2 Contenido Introducción Customización Básica Customización AvanzadaO3 Portal Tecnología Instalación Customización Customización Básica Logo, Colores, Acceso Anónimo, etc. Customización Avanzada
3 Introducción Qué es customizar O3 Portal..Objetivo Presentación: Preparar para afrontar con éxito pedidos de customización de O3 Portal por parte del cliente 2 posibles soluciones en cuanto a quien la realiza Distribuidor o cliente, si la customización es básica Ideasoft, si la customización es compleja o es una integración con otro sitio
4 O3 Portal El O3 Portal es la implementación Web de la herramienta O3Browser. El O3 Portal es una aplicación desarrollada con tecnología JSP (Java Server Pages). Es un conjunto de páginas jsp, html, archivos css, js, xml, imágenes, etc. Su páginas principales son las que se observan a la derecha: 1) Login, 2) Selección de componente (cubo, vista, tablero, dashboard, report, etc.) 3) Navegación (1) (2) (3)
5 Tecnología (conocimientos requeridos)En la implementación del O3 Portal se utilizaron diversas tecnologías: HTML, Scripting (Java Script), CSS Stylesheet, etc. JSP (Java Server Pages), tecnología utilizada en las aplicaciones Java para crear paginas dinámicas (http://java.sun.com/products/jsp/). JSP Tag Libraries, a fin de contar con componentes reutilizables para facilitar la programación de las páginas se utilizan estas librerías de tags, JAVA, como el resto de O3, el O3 Portal esta basado completamente con tecnología JAVA (http://java.sun.com)
6 Tecnología - Tomcat Tomcat es un servidor Web de distribución libre que tiene la capacidad de alojar páginas JSP. Por la posibilidad de redistribuirlo y la amplia difusión que este tiene es que se incluye opcionalmente como soporte para el O3 Portal. Algunos detalles: La instalación de tomcat se hace en la carpeta con el mismo nombre bajo la carpeta de instalación de O3. En la carpeta webapps dentro de tomcat es donde se alojan las aplicaciones web. Las aplicaciones web son carpetas o archivos war (variación de los archivos ZIP).
7 Tecnología - JBoss JBoss es un Servidor de Aplicaciones Java de distribución libre que tiene integrado internamente Tomcat. Al igual que Tomcat se incluye opcionalmente como soporte para el O3 Portal. Algunos detalles: La instalación de jboss se hace en la carpeta con el mismo nombre bajo la carpeta de instalación de O3. En el caso de JBoss el sitio O3 Portal se encuentra dentro del archivo o3portal.war en la carpeta {o3_install_dir}\jboss\server\default\deploy\gserver\0o3.ear\ { "@context": "http://schema.org", "@type": "ImageObject", "contentUrl": "http://slideplayer.es/4414226/14/images/7/Tecnolog%C3%ADa+-+JBoss+JBoss+es+un+Servidor+de+Aplicaciones+Java+de+distribuci%C3%B3n+libre+que+tiene+integrado+internamente+Tomcat..jpg", "name": "Tecnología - JBoss JBoss es un Servidor de Aplicaciones Java de distribución libre que tiene integrado internamente Tomcat.", "description": "Al igual que Tomcat se incluye opcionalmente como soporte para el O3 Portal. http://jboss.org/products/jbossas. Algunos detalles: La instalación de jboss se hace en la carpeta con el mismo nombre bajo la carpeta de instalación de O3. En el caso de JBoss el sitio O3 Portal se encuentra dentro del archivo o3portal.war en la carpeta {o3_install_dir}\jboss\server\default\deploy\gserver\0o3.ear\", "width": "800" }
9 Customización Básica
10 Customización básica Caso mas frecuenteSon cambios que tratan de adecuar O3 Portal a la imagen institucional de la empresa. Estilo: Colores, Tipos de letra, Imágenes, Textos, Nuevos links, etc. todo esto representa el caso mas habitual de modificaciones. Cambios de comportamiento de algunas componentes: lista (árbol) de selección, panel de navegación, etc. Todos estos cambios requieren: tener conocimientos mínimos de HTML, saber en que lugar de la instalación se encuentra el sitio y conocer un poco su estructura.
11 Cambios Básicos - Logo Se desea cambiar logo de Ideasoft por logo del cliente Para esto: (suponiendo que la url es y que el logo lo tiene en un archivo logo.jpg) Colocar el logo en la carpeta {o3_install_dir}/jboss/…./0o3.ear/o3portal.war/images Y realizar el cambio que se marca en negrita en la página {o3_install_dir}/jboss/…./0o3.ear/o3portal.war/header.jsp: 
12 Cambios Básicos – Colores, Tipo de Letra, etc.Cambios de colores, tipos de letra, estilos: En {o3_install_dir}/jboss/…./0o3.ear/o3portal.war/styles se encuentran las hojas de estilos del sitio, en particular o3web.css tiene la mayoría de los estilos involucrados. Si se modifica por ejemplo este elemento body y se deja como se ve a la derecha, el color de fondo de las páginas de O3 será rojo: body { background-color: #5B95BF; color: #FFFFFF; font-size: 9pt; font-family: 'Arial','Helvetica'; } background-color: red;
13 Cambios Básicos – EtiquetasPara cambiar etiquetas hay dos opciones: Modificar directamente la página jsp que la contiene. Se pierde la internacionalización (multi-lenguaje) Es sencillo Modificar los archivos de internacionalización Se mantiene la internacionalización Es más engorroso Ejemplo: En página login.jsp en lugar de encontrar el texto “Login” van a encontrar el texto:
14 Cambios Básicos – Acceso AnónimoSi se desea que los usuarios ingresen como un usuario anónimo (es decir usuario por defecto), entonces usar la página anonymous.jsp que se provee con la distribución. Se debe configurar ../o3portal.war/WEB-INF/context.xml descomentando el texto: Luego ingresar con la url: en lugar de
15 Tag wt:extTree Además de código HTML y javascript las páginas jsp contienen tags similares a los del propio HTML que permiten hacer la customización con mayor facilidad. Un ejemplo es el tag
16 Cambios Básicos – No mostrar fecha en listaPara no mostrar la fecha, en la lista de cubos y vistas disponibles que se despliega al entrar al sitio. Boolean showCubeTime = Boolean.TRUE; Boolean showViewSecurityLevel = Boolean.TRUE; Boolean cubeCreateLink = Boolean.FALSE; Boolean viewCreateLink = Boolean.TRUE; Para mostrar la lista colapsada
17 Cambios Básicos – No mostrar menúsSi no se desea mostrar los menús de exploración de O3, dado que por ejemplo no desea que los usuarios naveguen por el cubo. Para esto se debe realizar el cambio que se marca en negrita en la página {o3_install_dir}/jboss/…/o3portal.war/browser/browser.jsp:
18 Cambios Básicos – No click en gráficoSe desea deshabilitar la posibilidad de hacer click en el gráfico y navegar, por ejemplo porque no se quiere que el usuario navegue la vista Se debe realizar el cambio que se marca en negrita en la página {o3_install_dir}/jboss/…/o3portal.war/browser/view.jsp:
19 Cambios Básicos – No click en gráficoSe debe realizar el cambio que se marca en negrita en la página {o3_install_dir}/jboss/…/o3portal.war/browser/view-chart.jsp:
20 Resumen y Ejemplos Es posible customizar con éxito tanto por Cliente como por el Distribuidor Alcanza con tener conocimientos de HTML y contar con cierta documentación de tags libs Ejemplos de sitios customizados
21 Customización Avanzada
22 Modificaciones avanzadasEjemplos: otra página de login (login contra otro sistema y por afuera) comportamientos especiales (drill automático) cambios en la organización de la página mas complejos integración fuerte con otro sitio un sitio totalmente nuevo Todas estas modificaciones requieren conocer más: HTML, tag libs propios, JSP, y Java, etc. Existen dos caminos a seguir: Partir del O3 Portal y cambiar lo que sea necesario. Partir de una versión simplificada del O3 Portal y hacer los cambios.
23 Arquitectura O3 Portal (I)Al llegar a bookmarksPage ya el usuario esta logeado y eligiendo que cubo o vista ver. index.jsp header.jsp main.jsp mainHeader.jsp login.jsp ¿Login? NO SI bookmarksPage.jsp Como muestra la figura partiendo de la pagina index, las paginas se van componiendo para formar el resultado (antes del login). Indica que una pagina incluye a otra
24 Arquitectura O3 Portal (II)bookmarksPage.jsp viewdesktop.jsp desktop.jsp browser.jsp /servlet/o3portal/dispatcher /dispatcher/o3portal/o3PortalHandler.jsp redirect.jsp Aquí intentamos mostrar que el proceso de mostrar un cubo es complejo y no es la idea alterar las interacciones que aquí ocurren hasta que el cubo es desplegado.
25 Estructura de Carpetas (I)La estructura se encuentra en la carpeta {o3_install_dir}/jboss/…/o3portal.war y las carpetas mas importantes son las siguientes: o3portal: Páginas JSP que implementan la página inicial de login (index.jsp, main.jsp y login.jsp) y la página con la lista de vistas y cubos (booksmarksPage.jsp). browser: Páginas JSP que implementan la funcionalidad de navegación de cubos, entre las que se destacan browser.jsp que es la principal y se encarga de componer las paginas drillbar.jsp, commandsbar.jsp y view.jsp para formar el panel de navegación. Paginas JSP que implementan los diálogos de ordenar (ranking.jsp), ocultar (hide.jsp), expresiones (expressions.jsp), grabado de vistas (saveView.jsp), impresión (print.jsp), etc,
26 Estructura de Carpetas (II)images: Imágenes utilizadas en el sitio. Se destaca ideasoft.jpg que es el log de Ideasoft que aparece en el header del sitio. Esta imagen es un pedido usual de cambio. La referencia a esta imagen se encuentra en la pagina o3portal/header.jsp. scripts: Fuentes javascripts utilizados. styles: Archivos .css utilizados. Se destaca o3web.css que debe ser modificado para cambiar el estilo general del sitio, como colores de fondos, fonts, bordes, etc.
27 Estructura de Carpetas (III)WEB-INF: Archivos de configuración y librerías utilizadas en el portal. Se destaca webapp.properties que contiene parámetros de funcionamiento importantes como son: gclient.server.port y gclient.server.host cuyos valores son el puerto y el nombre del host donde se encuentra atendiendo O3Server. Estas properties necesitan ser modificadas en caso de que el Web Server (tomcat) que hospeda a O3 Portal este corriendo en una maquina diferente que O3Server y/o en caso de que este ultimo atienda en un puerto diferente a 1099. webapp.log.debug y webapp.log.file se configuran para que se genere log de debug en un determinado archivo. Estas properties son importantes en el caso de que el Portal de errores, para intentar detectar cual es el problema, o para enviar el log generado junto a un pedido de soporte.
28 Estructura de Carpetas (IV)Archivos .tld (tag lib definition). Estos archivos contienen definiciones de tags libs utilizados en el Portal. Se destacan los que son propios de Ideasoft: o3.tld, que contiene los tags mas importantes. Por ejemplo contiene el tag
29 Lista de Tag’s Actualmente la lista de los tag’s de O3 disponibles es la siguiente: o3:axisChoice. o3:axisLabel. o3:cellSpan o3:command o3:dimensionName o3:expressionState o3:form o3:o3Export o3:o3page o3:selectChartType o3:selectDimension o3:selectDimensionElement o3:selectMeasure o3:selectRole o3:submit o3:viewList Algunos tags son muy interesantes y valiosos como el o3:viewList pero otros son muy particulares. La documentación de cada uno se encuentra en formato HTML.
30 Lista de Tag’s Además de los tags de O3 hay otros disponibles:Chart: para manejar la tabla. Panes: para manejar paneles (ocultar, visualizar, etc). Web: para manejar algunos aspectos web. DnD: para manejar los aspectos del drag & drop. charttld:chart webtld:repeatRow webtld:repeatCell webtld:tabstrip webtld:tab webtld:tabcontent dndtld:ddsource dndtld:acceptdrag dndtld:ddtarget dndtld:acceptdrop dndtld:ddhandler dndtld:ddwindow dndtld:imgrenderer dndtld:txtrenderer dndtld:classrenderer o3panes:window o3panes:panes o3panes:pane o3panes:default-pane-renderer o3panes:default-panesbar-renderer
31 Ejemplo Simplificado Con el fin de dar una alternativa a la hora de reorganizar / reimplementar un portal, esta disponible un ejemplo mas sencillo y utilizando directamente la API. ¿Porque es mas simple?: porque no tiene mucha lógica y permite ver algunos aspectos mas claramente. porque consta de 6 paginas que hacen la mayoría del trabajo. SI error.jsp ¿Login? cubeList.jsp active_view.jsp logout.jsp NO index.jsp loginForm.jsp
32 Instalación del Ejemplo SimplificadoSimplemente descomprima el zip dentro de la carpeta {o3_install_dir}/jboss/…/o3portal.war Para acceder
33 Definición, Principales ClasesO3 Portal API Definición, Principales Clases
34 Principales Clases - ConexiónO3PortalSessionFactory: Esta clase permite obtener una instancia de O3PortalSession que representa una sesión en el portal de O3. openServerSession(O3PortalSessionContext): Es el método que crea la sesión mencionada, recibe como parámetro el contexto. ClientManagerFactory: Esta clase permite obtener una instancia de ClientManager que es el objeto utilizado para conectar con el servidor. getNewClientManager(String user, String pass): Crea un objeto ClientManager con un usuario y contraseña indicados.
35 Principales Clases – Trabajo con CuboO3PortalSourceSession: Es el objeto que nos permite interactuar con un cubo (O3PortalSession.openSourceSession(“Demo”)). Metadata: Representa el acceso a la metadata del cubo (O3PortalSourceSession.getMetadata()). getDimensionsCount(): Cantidad de dimensiones. getDimension(i): Una dimensión en particular. O3PortalQueryModel: Representa el modelo que nos permitira hacer consultas sobre el cubo (O3PortalSourceSession.getQueryModel()) drillTo(dimension, member) addDimension(axis, level, dimension)
36 Ejemplo programado en JavaO3 Portal API Ejemplo programado en Java
37 Ejemplo de la O3 API Se trata de archivos de ejemplo ideados para ver las funcionalidades del API de O3. Se muestra la secuencia normal de trabajo: conectarse, abrir un cubo, realizar operaciones, etc. La distribución contiene: O3ApiExample.bat que sirve para ejecutar el ejemplo. O3ApiExample.jar son las clases del ejemplo compiladas en caso que no desearan compilarse. O3ApiExample_src.zip es un zip con los códigos fuente de las clases de O3. o3portal.jar son las clases que implementan la O3 API. o3PortalDocs.zip es la documentación estilo Java Doc sobre el API.
38 Consideraciones del EjemploEl ejemplo muestra código java que podría ser colocado en cualquier aplicación, en particular podría colocarse en un portal ya existente para utilizar O3. A continuación veremos secciones relevantes del código que precisamente realizan las tareas que mencionábamos anteriormente. El ejemplo esta compuesto por dos clases: com/ideasoft/o3/portal/impl/test/PortalTest.java com/ideasoft/o3/portal/impl/test/StandaloneSessionContext.java
39 Abriendo la Sesión El siguiente código se puede ver en la clase PortalTest para abrir la sesión: StandaloneSessionContext ctx = new StandaloneSessionContext(); O3PortalSessionFactory factory = new O3PortalSessionFactoryImpl(Context.getIEnv()); O3PortalSession session = factory.openServerSession(ctx); Donde la información de login sale de la clase StandaloneSessionContext y en particular del método getClientManager() donde encontraremos este código: public ClientManager getClientManager() throws O3PortalException { … return ClientManagerFactory.getNewClientManager("user", "user"); } Donde se esta utilizando “user” como usuario con contraseña “user”, como sabemos cuales son los parámetros lo veremos en la siguiente transparencia.
40 Información sobre los métodosPara obtener información sobre los parámetros de los distintos métodos y los métodos que existen, siempre nos referiremos a la documentación incluida en o3PortalDocs.zip. La documentación de las aplicaciones Java se estila distribuir en un formato llamado “JavaDoc”, donde esto es un conjunto de páginas Web que pueden ser navegadas para encontrar la información. Para el ejemplo anterior:
41 Una vez conectados… Podemos imprimir la lista de roles del usuario conectado: ArrayUtilities.printArray("Roles", session.getRoleNames()); Obtener la lista de cubos y vistas disponibles, como siempre si quisiéramos averiguar mas información sobre lo que nos ofrece cada clase debemos consultar el JavaDoc: Iterator it = session.getSourcesInfo(); while (it.hasNext()) { System.out.println("\tsource: " + it.next()); }
42 Abriendo el cubo Demo y mostrando dimensionesO3PortalSourceSession sourceSession = session.openSourceSession("Demo"); int dimsCount = sourceSession.getMetadata().getDimensionsCount(); System.out.println("Cantidad de dimensiones: " + dimsCount); for (int i = 0; i < dimsCount; i++) { System.out.println("\tDimension: " + sourceSession.getMetadata().getDimension(i).getName()); }
43 Haciendo consultas Abro un modelo de consulta para operar:O3PortalQueryModel queryModel = sourceSession.getQueryModel(); Hago un DrillTo (dimension, member): queryModel.drillTo(0, queryModel.getMember(0).getChild(0)); Agrego una dimensión a un eje (axis, level, dimension): queryModel.addDimension(GridModel.Y, 0, 2);
44 Instalación de Ejemplo de la O3 APISe supone que se dispone de instalación de O3 de versión superior o igual a Copiar en {o3_install_dir}/classes el archivo O3ApiExample.jar que contiene el ejemplo, o compilar los fuentes del ejemplo y copiar las classes resultantes en el mismo lugar Copiar en {o3_install_dir}/classes el archivo o3portal.jar Copiar en {o3_install_dir}/bat el archivo O3ApiExample.bat Iniciar el servidor de O3 Desde una consola DOS y situado en la carpeta {o3_install_dir}/bat ejecutar O3ApiExample.bat (pasarle el parámetro -debug para ver mas log si se desea)