Creating Portlets in DeepSee

What is a portlet?

The simple answer is: a custom widget. A portlet can exist by itself on a DeepSee dashboard, it can be used along side standard DeepSee widgets, or along side other portlets. The rendering of the custom widget is completely user defined. This means you can embed a web page, create a form to perform any sort of action needed based on the data on your dashboard, use third party charting libraries, or simply display data from outside of a DeepSee cube.

How to get started

Documentation on how to create a portlet exists, it goes into detail of different methods that can be used. This article will function as a walk through of creating a widget from the ground up.

1) Create a new class that extends %DeepSee.Component.Portlet.abstractPortlet

2) Define your %DrawHTML method:

Method %DrawHTML()
{
    Set ..renderFlag = ..renderFlag + 1
}

  This will tell the portlet that it needs to call the renderContents method. The renderContents method uses Javascript.

3) Define your renderContents method:

ClientMethod renderContents() [ Language = javascript ]
{
    var html=[]
    html[html.length]="Testing"
    this.getEnclosingDiv().innerHTML = html.join('');
}

At this point, our portlet is not very exciting, but we have the minimum for it to display on our dashboard. We will see what it looks like.

4) Create a new dashboard and add the new portlet.

4a) Navigate to the User Portal

4b) Create a New Dashboard

4c) Assign a Dashboard Name

4d) Add a New Widget

4e) Select the portlet and a Data Source (Data Source is optional, in later Parts it will be used)

4f) View your dashboard with portlet

5) Our portlet is very basic at this point, but the door is wide open for customization. In later parts of this series, we will explore different customization options.

Are there any downsides?

The customization that is the major benefit is also the downside of portlets. Everything must be customized. After using this portlet shell and getting data from the data source, everything is up to you to implement.

What is next?

Part 2 - Embedding other web pages

Part 3 - Using data from DeepSee

Part 4 - Using data outside of DeepSee

Part 5 - Using third party charting libraries

The associated Portlet and Dashboard can be found on Open Exchange

Please comment below if any further explanation is needed. Also let me know if there are any other custom types you would like to see.