We are going to create a web application using the frevvo Data API, which will fetch submissions from the frevvo database and create an HTML report based on those submissions. We will use the Leave Approval Workflow as an example (download it here.) Using this workflow an Employee will file a vacation request, which will be approved by his Manager. This workflow generates a submission XML like this one:
<p0:form xmlns:p0="http://www.frevvo.com/schemas/_gJamE-62EeCXN_lW5l3omQ" name="LeaveApproval"> <Message7>Leave Approval</Message7> <Employee> <EId>emp</EId> <MId>mgr</MId> <EFullName>femp lemp</EFullName> <EEmail>emp@frevvo.com</EEmail> </Employee> <LeaveRequest> <StartDate>2012-09-17</StartDate> <NumberOfDays>2</NumberOfDays> <TypeOfLeave>Annual</TypeOfLeave> <Comments>test</Comments> </LeaveRequest> <ManagerApproval> <MFullName>fmgr lmgr</MFullName> <MEmail>mgr@frevvo.com</MEmail> <IApproveThisVacationRequest>Denied</IApproveThisVacationRequest> <Comments>rejected.</Comments> </ManagerApproval> </p0:form> |
In this tutorial, we will get all the submission XMLs for this workflow from the frevvo submission database. Then we will parse the submission XMLs to extract the required data (StartDate, NumberOfDays, TypeOfLeave, and IApproveThisVacationRequest fields) for a particular Employee and display this data as a vacation report for that Employee on an HTML page.
Please see the submission-report-tutorial.war file* of the web application that we are going to create. *Follow this documentation to update Client Libraries as needed.
On line number 20, change
service.login ("designer@tutorial", "qa"); |
to
service.login ("<your-designer-user>@<your-tenant>", "<designer-user-password>"); |
Browse http://localhost:8082/submission-report-tutorial/showReport.jsp?username=demoemployee. You should see the this submission in the employee's Vacation Report.
Note the '''username=''' parameter that is appended to this URL. This shows submissions for a specific employee. Replace 'demoemployee' with any valid user Id. |
First, you will need to create this directory structure in your <frevvo-install-dir>\frevvo\tomcat\webapps folder:
<frevvo-install-dir>\frevvo\tomcat\webapps |_submission-report-tutorial |_WEB-INF |_lib |
Create a new web.xml file in <frevvo-install-dir>\frevvo\tomcat\webapps\submission-report-tutorial\WEB-INF directory, with following content in it. This will define our application as a web application.
<?xml version="1.0" encoding="ISO-8859-1"?> <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd"> <web-app> </web-app> |
Create the JSP pages which call the frevvo API as explained in this documentation. Create a showReport.jsp file in <frevvo-install-dir>\frevvo\tomcat\webapps\submission-report-tutorial directory with following in it:
<%@ page import="java.lang.*,java.util.*,com.frevvo.forms.client.*,com.frevvo.forms.client.util.*,com.google.gdata.data.Link,java.io.InputStream,com.google.gdata.client.Service.GDataRequest,java.io.IOException,javax.xml.parsers.*,org.xml.sax.*,org.xml.sax.helpers.DefaultHandler,com.google.gdata.util.ServiceException"
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Vacation Report</title>
</head>
<body id="page-submissions">
<%
//Get the frevvo Forms service
FormsService service = (FormsService) session.getAttribute ( "frevvo.forms.service" );
if (service != null) {
service.logout();
session.removeAttribute ("frevvo.forms.service");
} else {
service = new FormsService("http", "localhost", 8082, null);
}
service.login ("designer@tutorial", "password");
session.setAttribute ("frevvo.forms.service", service);
String uId = request.getParameter("username"); //Get the value of username paramter in the request URL
if ((uId == null) || (uId.length() == 0)) {
uId = "dummy"; //Use a dummy user if username is not specified in the request URL.
}
%> |
|
Remember to change
service.login ("designer@tutorial", "qa"); |
to
service.login ("<your-designer-user>@<your-tenant>", "<designer-user-password>"); |
Now that we have the frevvo service session, we will get the submission feed of our workflow. Add the following lines to the showReport.jsp file before the closing tag (%>):
//Get the Submission Feed
SubmissionQuery q = new SubmissionQuery(service.getFeedURL(SubmissionFeed.class));
String ftId = "_gJZX8O62EeCXN_lW5l3omQ"; //This is the formTypeId of our workflow.
q.setFilter("$formTypeId eq " + ftId);
q.setOrderby("$updated"); //Order the submissions by Date
SubmissionFeed sFeed = service.getFeed(q, SubmissionFeed.class);
int totalLeaves = 0; //Counter for total number of leaves taken by the employee. |
|
Add the HTML to create our vacation reports table structure:
<div id="bd">
<div id="workarea">
<h2>Vacation Report
</h2>
<table border="1" cellpadding="6" cellspacing="0" width="50%">
<thead>
<tr>
<td><b>Start Date</b></td>
<td><b>Number Of Days</b></td>
<td><b>Type Of Leave</b></td>
<td><b>Approved/Denied</b></td>
</tr>
</thead>
<tbody> |
Now to display the leave records under this table, we will get all the submission records from the SubmissionFeed. Then we get the Submission XML for all the submissions and parse it to get the relevant data from each submission. Add the following in your showReport.jsp file:
<%
//Loop over all the submissions
for (SubmissionEntry entry : sFeed.getEntries()) {
if(entry.getState().equalsIgnoreCase("SUBMITTED")) { //Consider only those submissions which are in Completed, that is in Submitted state
//Get the submission XML
Link dLink = (Link) entry.getDocumentLinks("text/xml").get(0);
String linkRef = dLink != null ? dLink.getHref() : "";
GDataRequest request1 = service.createLinkQueryRequest(dLink);
request1.execute();
InputStream responseStream = request1.getResponseStream();
try {
// Parse the submission XML (using the XMLContentHandler class which has SAX Parser configurations)
XMLContentHandler xch = new XMLContentHandler();;
xch.parse(responseStream);
Map<String, String> submittedControlMap = xch.getParams();
if((submittedControlMap.get("EId").equals(uId)) && (submittedControlMap.get("StartDate").contains(Integer.toString(Calendar.getInstance().get(Calendar.YEAR))))) { //Get only current year's submissions and for only a particular employee
if(submittedControlMap.get("IApproveThisVacationRequest").equals("Approved")) //Check if the Leave was approved or not
totalLeaves = totalLeaves + Integer.parseInt(submittedControlMap.get("NumberOfDays"));
%> |
|
Once the submission passes all criteria we need to print it in our HTML. For that, we add these lines. (Note the character sequences <%= and %> which enclose Java expressions, which are evaluated at run time.)
<tr>
<%-- Print the extracted data --%>
<td><%= submittedControlMap.get("StartDate") %></td>
<td><%= submittedControlMap.get("NumberOfDays") %></td>
<td><%= submittedControlMap.get("TypeOfLeave") %></td>
<td><%= submittedControlMap.get("IApproveThisVacationRequest") %></td>
</tr>
<%
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
%>
<tr>
<td colspan="4"><b>Total Leaves Taken: <%= totalLeaves %> </b></td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html> |