FlexibleDashboard+Liferay: Collaborative BI dashboards managed in Liferay

FlexibleDashboard+Liferay

FlexibleDashboard+Liferay is an open source BI dashboard app / framework which supports dashboards layouts (user/group) managed in Liferay that can mix pure Flex FlexibleDashboard pods and regular Liferay portlets. This used to be called FlexibleLiferay when it was only a Flex portal container / Liferay front end app for portals with only regular Liferay portlets.

Placeholder “flexpod” portlets from the “FlexibleDashboard+Liferay” category can be added to a page/tab in the regular Liferay web UI, to configure BI dashboards. Then in the FlexibleDashboard+Liferay Flex/AIR app the appropriate FlexibleDashboard Flex pod will be displayed instead of a portlet. A Flex pod means its a pure Flex module being displayed without being wrapped in a portlet / HTML.

All these FlexibleDashboard Flex pods are supported: bar/line chart, pie chart, grid and grid/chart with Spring ActionScript config of BlazeDS data sources, BIRT report, JasperReports report, OLAP pivot grid / XMLA query tool, Pentaho charts, calendar, local files, and HTML.

Current limitations: pod.xml file configures on a portlet basis, would be better to have configurable properties on a portlet instance basis. Also module SWF files load from the Flex/AIR app dir, not from portlet web app dirs.

Flexible Dashboard, FlexibleShare, and Flexible Liferay updates

  FlexibleDashboard

FlexibleDashboard

FlexibleDashboard is a dashboard application / framework focused on the uses of dashboards for BI / Reporting / Charting. It started with esria dashboard code and evolved from there, adding flexmdi cascading / tiling (esria pod drag/drop in tile mode), more pods, pods in Flex modules, Spring ActionScript configurable pods, and both Flex+Browser and Flex+Air versions. 

Additional pods beyond the esria charting pods include: JasperReports viewer, BIRT Report viewer, OLAP pivotable grid with XMLA datasource support and MDX query editor (from Grebulon sourceforge project), Pentaho Charts, GridPod, ChartGridPod, calendar, and iframe html. The AIR version has additional Flex+AIR pods: webkit HTML, web browser, Google gadgets, Liferay portlet gadget, and a local files browser.

In February, FlexibleDashboard was ported from Flex 3 to Flex 4 in build3, including a first pass of using spark controls instead of halo controls. I got mostly through porting the esria dashboard part, then discovered code by Greg Lafrance (who later wrote a 4 part Adobe devnet series of articles part1, part2, part3, part4)  that helped me port the remaining parts of the esria code in FlexibleDashboard. I also used a skin from flexdevtips for pod windows.  Instead of porting the full flexmdi code to Flex 4 / spark, all the style setting code was removed, and just the basic parts were ported.

In April, build 4 of FlexibleDashboard added having pods built in separate flex modules and instead of having the esria style hardcoded switch on pod type to pod class, the module path is listed in the pods xml files on each pod. 

Build 4 also introduced having each use of a pod/module configurable separately with Spring ActionScript in a separate context xml file (in src/spring-actionscript/ dir). This is currently used in 3 differently configured GridPods and in one ChartGridPod.  A similar approach could be used with other Flex frameworks that support modules (Parsley, etc.).  The GridPods and ChartGridPod  just reference a data service interface IDataService, and the particular data service implementation is configured and injected / autowired with Spring ActionScript. 

Build 4 also has 3 simple data service class implementations (SoapDataService, XmlDataService, RemoteObjectDataService) which get data via BlazeDS (or from LCDS).  The shared ChannelSet for the grid pods is configured in src /spring-actionscript/ application-config.xml   The esria dashboard like config is still in data/ FlexibleDashboardPods.xml (or in data/ FlexibleDashboardAirPods.xml for the AIR version).

 FlexibleShare

FlexibleShare

FlexibleShare adds the following to FlexibleDashboard: FlexSpaces pods for Alfresco document management along with Flex based collaboration pod front ends (wiki, blog, calendar, doc lib, discussions) to an Alfresco Share backend.  FlexibleShare was ported from Flex 3 to Flex 4 in May.  The additional pods are now in Flex modules too.

FlexibleLiferay

FlexibleLiferay extends FlexibleDashboard to provide a Flex portal container for Liferay.  The Flex+AIR client is able to get all of the places/layouts, tabs, and portlets you would normally see as a Liferay portal user and display them using a Flex based container with an HTML control for each portlet (doesn’t support pure Flex/Flash portlets yet).

The basic idea was for a Flex Portal, instead of starting from scratch, leverage the server side and services of an existing portal. Another use case is for views from an existing portal can be included in a larger enterprise Flex application.  Note that FlexibleDashboard and FlexibleShare can also display individual Liferay portlets in a configurable pod using the Liferay widget, just not whole existing portal layouts.

Recently FlexibleLiferay was ported from Flex 3 to Flex 4. The server side code was changed from Liferay 5.x ext environment code to a simpler web plugin for Liferay 6.x. The FlexibleLiferay client uses BlazeDS/AMF to remote to Java APIs provided in the web plugin. Built versions of the AIR client and the server piece (web plugin) are now available (previously there was only code available in the svn).

FlexibleDashboard, FlexibleShare, FlexibleLiferay

FlexibleDashboard+AIR

FlexibleDashboard (new google code project)
1. Has both Flex+Browser and Flex+AIR versions
2. Based on the non doc mgt code from FlexibleShare
3. Based on esria dashboard / adobe flex devnet dashboard sample with added flexmdi cascade/tile (esria pod drag/drop in tile mode)
4. Flex+Browser pods: line, bar, pie charts, form, todo list, JasperReports viewer, Pentaho dashboard, BlazeDS samples, external Flex app SWFLoader, calendar, iframe html (iframe has not hiding issues)
5. Flex+AIR additional pods: webkit HTML, web browser, Google gadgets, Liferay portlets, local files browser

FlexibleShare
1. Now has Flex+Browser in addition to Flex+AIR
2. Adds Alfresco, Alfresco Share, LiveCycle Content Services features to FlexibleDashboard

FlexibleLiferay+AIR

FlexibleLiferay (new google code project)
(Flex+AIR based portal container application for Liferay)
1. Can display regular Liferay portlets (JSR-168, JSR-286, HTML/Ajax etc.)
2. All of Liferay backend, standards it supports can be leveraged
3. Can display Flex portlets (swfs) without html wrapper (no need for special handling of restarting when resize portlet) from within a portlet war
4. Leverage Liferay app catalog to also manage Flex portlets
5. Leverage Liferay security / authentication (ldap, sso, etc.) to also manage Flex portlets
6. Flex portlets can take advantage of AIR specific features (native desktop file drag / drop, native clipboard, local files, offline db)
7. No Flex+Browser version yet due to iframe issues

FlexibleLiferay Implementation:
1. Uses BlazeDS to remote to some Java Apis added via Liferay Ext environment (used Liferay 5.2.3)
2. Built on top of FlexibleDashboard

FlexibleLiferay Implemented:
1. Sign in (Login dialog), Sign out
2. My Places menu
3. Display of tabs for pages in selected place
4. Display of a Liferay pod (uses HTML with Liferay widget) for each portlet in selected page

FlexibleShare+AIR (dashboard/portal for Alfresco, LiveCycle): build1 available

A first build and source for FlexibleShare+AIR, an open source, Flex based dashboard/portal container focused on document management (Alfresco, Adobe LiveCycle Content Services ES), collaboration (Alfresco Share),  and BI/charting/reporting, is now available on the Alfresco Forge and on Google Code.

As a Flex based dashboard for FlexSpaces view pods (doc mgt, wcm, search, workflow tasks), its further along. (Note that the WCM pod is commented out in data/pods.xml).

The Flex based pods (blog, wiki, discussions, doclib, calendar) for Share back-end are prototypes. No commenting/reply feature yet. The calendar doesn’t hook into the Share backend yet. The Share dashboard html pod runs the Share overall dashboard (no pods for individual Surf dashlets yet).  (Note that you need to confgure Share pods with the correct site short url name in the siteUrlName attributes in pods.xml)

The Charting, Pentaho charting, JasperReports report viewer pods are samples only (additional BI/reporting capabilities to come). Liferay html pod runs the full Liferay portal (no pods for individual Liferay portlets yet).

FlexibleShare uses the Esria dashboard sample. I still need to look into leveraging the  Anvil project to provide more modular support for loading Flex portlets. (Note see previous blog post with more details on FlexibleShare)

Do to use of AIR, you can drag desktop files into FlexibleShare folder views. Regular AIR drag / drop also allows you to drag files from the local files pod to folder view pods and between folder view pods. Calais semantic auto-tagging, tag suggesting can be used in Doclib pods and in the search pod (switch from having the “simplesearch” pod to the “search” pod in pods.xml), and setup the Calais key / set enableCalais in FlexSpacesConfig.xml

To get FlexibleShare to run on LiveCycle Content Services (8.2.1), FlexSpacesConfig.xml needs to be changed following its LiveCycle comments (different setting for alfresoUrlPart, set isLiveCycleContentService value to true, and set serverVersion to 2.1 to reflect its embedded Alfreso. Also in data/pods.xml comment out the tasks pod, and remove the pods in Share section. Note: for FlexibleShare on LiveCycle on non localhost, currently need to recompile with service-config.xml changed.

FlexibleShare Document Management (WCM pod not shown) screenshot (click on for larger):

FlexibleShare+AIR  document management

FlexibleShare Collaboration screenshot (click on for larger):

FlexibleShare+AIR Alfresco Share Collaboration

First FlexibleShare prototype sneak peak

Here is a screencam of an early prototype of FlexibleShare, an open source Flex  based portal container / dashboard with Flex based pods for open source enterprise SW (Alfresco ECM, Alfresco Share,  reporting/BI, BPM, portals):

FlexibleShare prototype

This will initially focus on Flex+AIR, and later will have Flex+Browser support.  Also plan to enable the pods to be used as Adobe Genesis Tiles.  (Note: the Flex based pods for Alfresco ECM will support Adobe LiveCycle Content Services ES too).

Overview of  the prototype:

The prototype currently uses the Esria dashboard sample (inside a Flex+AIR application) as its portal container (also looking at the Anvil project to provide more modular support for loading Flex portlets).

Alfresco ECM / FlexSpaces tab:
The first tab in the prototype screencam has pods based on FlexSpaces (Doc Lib, Search, Tasks, WCM, Local Files). The cool thing in AIR is that desktop drag / drop into the Doc Lib and WCM pods just “works”. The Local Files pod takes advantage of AIR apis to access local files and drag / drop from it into the Doc Lib and WCM pods works too.  FlexSpaces support for Calais integration semantic tagging is also supported if enabled.

Flex-ification of Alfesco Share tab:
This tab has the early beginnings of some Flex UI (blog, wiki, discussions, site doc lib, calendar) for Alfresco Share backend. For the calendar, I am using code based on Ely’s interactive calendar. For the overall Share dashboard and Share site dashboards, using the AIR webkit HTML control to display them (so Ajax Surf dashlets can be used in them). Update: for blog, wiki, discussions, now working on more specific UI  instead of FolderViews (instead will have post/comment tree,  selected item content viewer pane, etc.) Update: Later will look into pods for individual Surf dashlets.

JasperReports tab:
This tab is using a modified version of the flex based JasperReports flash viewer to display jrpxml files.

Charts tab:
This has left in pods from the ESRIA dashboard sample. These use the Quietly Scheming chart animation effects.

Pentaho tab:
This is based on a Flex version of the Pentaho dashboard sample.

Liferay tab:
This runs Liferay in a AIR webkit HTML control. Update: later will look into pods for individual Liferay portlets.

CMIS:
Update: Will look into pod for CMIS api repositories with drag / drop from desktop and with Alfresco pods