D2 v4.5 Inbox Widget — Part 2

In my previous post, I provided an overview of my D2 Inbox widget design.  In this post I will discuss the JavaScript code required to maintain the freshness of the login ticket.  The JavaScript and OpenAjaxHub for the Inbox widget work essentially the same as they did for the D2 DQL Editor widget, with the exceptions discussed below.

As with the D2 DQL Editor widget, a ticket is generated when the JSP page initially loads.  This ticket is consumed by the query that immediately updates the page with the list of notifications in the user’s Inbox.  When a user clicks the subject of a notification to view its details, another query is generated to retrieve those details from the Docbase.  This means another ticket is required to login to the Docbase and run the query, which means the JavaScript must publish another D2_ACTION_DM_TICKET_GENERATE message.  Recall that the callback function for the message subscription event is onNewTicket().  In the D2 DQL Editor widget, this function immediately called the servlet to run the query.  With the D2 Inbox widget, a set of states are defined (INIT, UPDATE, DETAILS) that determine how the onNewTicket() responds once it has received the new ticket.  See the code snippet below.


function onNewTicket(event, oMessage) {
  ticket = oMessage.get("ticket");

  if (inBoxState === INIT) {
    inBoxEvent = "";
    updateInbox();
  }

  if (inBoxState === UPDATE) {
    inBoxEvent = "";
    updateInbox();
  }

  if (inBoxState === DETAILS) {
    inBoxEvent = "";
    doShowItemDetail();
  }
}

The INIT state is set when the page first loads.  The result of this state is that the page of Inbox notifications is built.  The UPDATE state is set upon the closing of the Inbox Notification Details pop-up window.  When the pop-up closes, the Inbox notifications list is refreshed — one could have been deleted from the Details page.  The DETAILS state is set when a user clicks a link to view the details of a notification.  When the onNewTicket() function identifies a DETAILS state, it calls doShowItemDetail() to display the notification’s details.  More of the JavaScript is displayed below.

updateInbox()

The updateInbox() function calls the D2QueryInboxServlet servlet to run the query to display the Inbox notifications.  It inserts the username, ticket, and Docbase name into a URL string and uses AJAX to call the servlet. Here is the most interesting snippet of that code.


var  xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

// do AJAX
xmlhttp.onreadystatechange = function () {
  if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
    document.getElementById("InboxTable").innerHTML = xmlhttp.responseText;
  }
};

xmlhttp.open("POST", "D2InboxQueryServlet", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("user=" + user + "&docbase=" + docbase + "&ticket=" + ticket);

showItemDetail()

The showItemDetail() function is called when a user clicks on the subject of an Inbox notification.  The URL built for each notification on the page, calls this function and passes the r_object_id of the corresponding dmi_queue_item.  You can see the function sets the inBoxState variable to DETAILS and requests a new ticket.  Once the new ticket is received by the onNewTicket() function, the doShowItemDetail() method is called to present the pop-up.


function showItemDetail(objId) {
  objectId = objId;
  inBoxState = DETAILS;
  publishNewTicketRequest();
}

doShowItemDetail()

The doShowItemDetail() function pops open the window containing the details for the selected Inbox item.  Clicking the link opens the InboxDetail.jsp page, which uses Java and AJAX.

function doShowItemDetail() {
  var url = "InboxDetail.jsp?itemId=" + objectId + "&user=" + user + "&docbase=" + docbase + "&ticket=" + ticket;
  window.open(url, 'newwindow', config = 'height=400,width=500, toolbar=no, menubar=no, scrollbars=yes, resizable=no,location=no, 
    directories=no,   status=no');
  objectId = "";
}

onDetailsClose()

This function is called when the Details pop-up window closes.  It sets the inBoxState to UPDATE and requests a new ticket.  When a new ticket is received, the list of Inbox notifications is refreshed.

function on_DetailsClose() {
  inBoxState = UPDATE;
  publishNewTicketRequest();
}

In summary, this isn’t a very complicated widget.  The primary difference between this widget and the D2 Query Editor widget is the necessity to refresh the tickets and to react differently depending upon the inBoxState state variable.  I hope you find this widget useful and use it as a foundation for building your own D2 external widgets.

You can download the D2 Inbox WAR file here.

Advertisements

About Scott
I have been implementing Documentum solutions since 1997. In 2005, I published a book about developing Documentum solutions for the Documentum Desktop Client (ISBN 0595339689). In 2010, I began this blog as a record of interesting and (hopefully) helpful bits of information related to Documentum, and as a creative outlet.

3 Responses to D2 v4.5 Inbox Widget — Part 2

  1. Arvind says:

    Hi Scott,
    Can this be Implemented in D2 4.2 ?

    Like

  2. Mitesh says:

    What all Focus event to be considered while adding external widget to D2-Config

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: