Latest Headlines
22

Creating PDF in WaveMaker using JasperReports

*** Note from the Editor(Joerg) ***
This is the first of (hopefully) lots of articles written by vcoportal’s very own student intern, Tobias.
Not to get him too bored :twisted: , his task was to cover multiple topics in one article:

  • How to create PDF-files in WaveMaker, using JasperReports
  • How to “import” a WaveMaker JavaService into Eclipse
  • How to use the iReport Designer to create report templates
  • How to show the resulting PDF as preview in Web-UI

At the end of the Article you will find the exported WaveMaker project to download and referencing links to the external libraries, so that you can reproduce and expand the examples…

As usual, any comments are very welcome! (Just remember: It’s our intern’s first article, so please don’t be too rude  8-) )
***Here we go***

Preparations

Create a new project in WaveMaker without using any template

Now you have to do some small changes in your project’s folder

Go to …projects\yourProjectName\webroot and create a folder called “printtemp” (in which the created pdf-files will be stored)

Go to …\projects\yourProjectName\lib and put the following jar-files in there (see the origins in the References below)

Open up WaveMaker and create a new Java Service                   

Now you should see the Java code which was automatically created by WaveMaker. I deleted the comments and the sample method.

Go to your canvas and add a button, a text editor and an iFrame. Arrange those widgets just as you like.

Import WaveMaker JavaService to Eclipse

Time to do some programming… Open Eclipse and create a new Java Project. The Project’s name has to be the same one as you have used for your WaveMaker project. In addition, you have to choose your WaveMaker project’s directory as the location:                                                            

In order to avoid later errors inside your code (or at least: Eclipse not to find some classes of the WaveMaker core), you have to add an additional library to your Java project:

Right-click on your project folder which is shown in the upper-left corner inside your package explorer and choose “Properties”

Choose the property “Java Build Path” and the tab “Libraries”. Now you can add external JAR’s                  

You have to navigate to WaveMaker’s installation directory, which’s subfolder \launcher\lib contains “servlet-api-2.5.jar”

If everything was done right, the package explorer should show your WaveMaker project’s directories.

Now you can open the java file and type your code (or ours ;) )

Please notice: You are now accessing the jave file both with Eclipse AND WaveMaker. After you made changes on the code, you have to press the refresh button and save it.

Create the PDF-File using JasperReports

Please notice that the fileName in line 63 has to be the name of the jasper template we will create. To keep the example easy, we also hardcode the relative subpath in which the pdf-files are created (here: “printtemp”), remember that this has to exist in your WaveMaker project’s webapp-root (see above).

package com.vcoportal;

import com.wavemaker.runtime.RuntimeAccess;

import java.util.Collection;
import java.util.HashMap;
import java.util.Map;
import java.util.Vector;
import java.net.URL;
import java.io.*;
import net.sf.jasperreports.engine.JRExporterParameter;
import net.sf.jasperreports.engine.JasperFillManager;
import net.sf.jasperreports.engine.JasperPrint;
import net.sf.jasperreports.engine.JasperReport;
import net.sf.jasperreports.engine.data.JRBeanCollectionDataSource;
import net.sf.jasperreports.engine.export.JRPdfExporter;
import net.sf.jasperreports.engine.util.JRLoader;

public class ReportGenerator extends com.wavemaker.runtime.javaservice.JavaServiceSuperClass
{

public ReportGenerator() {
super(INFO);
}

// some attributes holding the data
private String titleText;
private String subTitle;

// getters & setters
public String getTitleText() {
return this.titleText;
}

public String getSubTitle() {
return this.subTitle;
}

public void setTitleText(String ttext) {
this.titleText = ttext;
}

public void setSubTitle(String stitle) {
this.subTitle = stitle;
}

// a static method that initializes, stores and returns our data
public static Collection<ReportGenerator> getData() {

Vector<ReportGenerator> theData = new Vector<ReportGenerator>();

ReportGenerator myReportGen = new ReportGenerator();
myReportGen.setTitleText("Hello World!");
myReportGen.setSubTitle("This is a subtitle!");
theData.add(myReportGen);

return theData;
}

// this is where the magic happens...
public String printReport() {

String fileName = "report.jasper";
String typeDocument = "PDF";
URL fileUrl = this.getClass().getResource(fileName);
Map<String, Object> parameters = new HashMap<String, Object>();
parameters.put("just", new String("testing"));

JRBeanCollectionDataSource ds = new JRBeanCollectionDataSource(this.getData());

try {
JasperReport report = (JasperReport) JRLoader.loadObject(fileUrl);
JasperPrint jasperPrint = JasperFillManager.fillReport(report, parameters, ds);

String pathWR = RuntimeAccess.getInstance().getSession().getServletContext().getRealPath("/printtemp/");
File tempDir = new File(pathWR);
String tempFileName = new String();

if (typeDocument.equals("PDF")) {
File tempFile = File.createTempFile("tempReport", ".pdf", tempDir);
tempFile.deleteOnExit();
tempFileName = tempFile.getName();

JRPdfExporter exporter = new JRPdfExporter();
exporter.setParameter(JRExporterParameter.JASPER_PRINT, jasperPrint);
exporter.setParameter(JRExporterParameter.OUTPUT_FILE_NAME, tempDir + "/" + tempFileName);

exporter.exportReport();
}

return "printtemp/" + tempFileName;

} catch (Exception e) {
log(ERROR, "Error in printReport(): " + e);
return "";
}
}
}

Now we create a very basic jasper template:

Open Jaspersoft iReport Designer, create a new File and open it

For your report, you have to choose the same filename as in your java code. The location has to be the directory of your WaveMaker project’s Java-Service

Now you can add a new field to your template by right-clicking the property “field”. Fields are placeholders for the data we want the PDF to contain

On the lower-right part of the interface you can change the field’s properties. The name has to match the attribute’s name in your code. In my case that’s titleText and subTitle
The field class property has to match the used data type of your attribute.

When you drag your field from the Report Inspector on the left onto your template, a dialog will appear. Just hit OK.

Now you can select your field by clicking on it and change its properties

Create a second field for the attribute “subTitle” and your template could look just as spectacular as this…

By pressing the Preview-Button your template will be compiled and the .jasper-file will be created

Wire the JavaService to the Web-UI

Ok, just a few steps left to do…

Bring up WaveMaker again and create a new Service Variable that will use our Java Service

Remember the Button? It will call the Service Variable

The text editor will show the path and filename of the created PDF. So you can check the option “readonly” and bind its dataValue to the result of the Service Variable

You have to do bind the iFrame’s source to the result of the Service Variable too

And finally, it should look like this…

Cleaning up

In this example every time some user hits the button a new pdf-file will be created. This might not be a good idea for a real project (even if the files are “marked” as temp-files in the JavaVM and will be deleted when this closes, not good for a running-forever web-application). So you might include another method in the JavaService that deletes the report (e.g. after printing, or a certain timeframe) not to fill up the printemp-directory…


public void deleteTempPrintFile(String filename) {
//delete temp pdf
if (filename != null) {
try {
      File toDelete = new File(filename);
toDelete.delete();
}
  catch (Exception e) {
log(ERROR, "Error in deleteTempPrintFile(): " + e);
}

}

References

Download

Exported from WaveMaker 6.4.6

PDF-Creation with JasperReports
PDF-Creation with JasperReports
ExampleReport.1.Alpha1.zip
13.6 MiB
Details...
jar-files
jar-files
jar-files.zip
13.4 MiB
Details...
9

LittleCMDB (An Orchestrator and WaveMaker project) – Part 5

Table of Content

In Part1 we start with the SQL DB Plugin and create the required database for our need.

In Part2 we start with the development of our Workflow. We will start with a few elements.

In Part3 we  finish the  collection of the VM information.

In Part4 we insert our data into the database and test our created workflow

In Part5 we create our webview to get a look on our Data in the SQL Database

In Part6 we will make our Workflow smarter to update the DB with actual VM information

In Part7 problems with vAPP located virtual machines are fixed

Part5

After we have finished our Workflow, it is time to start with WaveMaker.

WaveMaker is Part of VMware. WaveMaker is a WYSIWYG Editor based on JavaScript & open source Web 2.0 standards

With WaveMaker, we will create a Website for a view of our database data. In this post, we will keep it simple and only generate the view. In a later post we will integrate the Website with the Orchestrator so that changes, which will be done, are played back to the Orchestrator and the vCenter Server. To start with WaveMaker, you need the WaveMaker Software. First of all, we have to get WaveMaker. You become WaveMaker on their Website http://www.wavemaker.com there you can click on “Download”

”"

There you can get the install package for your OS.

”"

I use the Windows Version. The installation is easy. Just start the installation and the rest will done with the wizard.

After we are finished with the installation (don’t forget to install additional packages WaveMaker request!). We can start it.

”"

For this view, you can start a new project, or start with the project I created here: http://www.vcoportal.de/2012/05/howto-setup-ldap-authentication-for-wavemaker-part-1/

I will use my created project…you are free to do so or to start from scratch…..to use my project you have to download the package and unzip in in your WaveMaker “Project Folder” in My case that is C:\WaveMaker\projects Just insert the vCO_WM_LDAP folder and start WaveMaker. Then you are able to start from this point by clicking on “Open Project”.

”"

When you have installed the newest WaveMaker Software you become an Upgrade Message for the package. That’s okay the project was created with an earlier version of WaveMaker….so go on…..

To save the download package I will clone and rename the project. For that go to “File” and “Copy current project”

”"

Enter the new project name, in my case “LittleCMDB” and confirm the copy.

”"

When the clone is ready close the current project.

”"

And open the “LittleCMDB” project.

”"

Before we can start with the development of our website, we have to create a “View” in our db. It is also possible to create the view in WaveMaker, but them we are not able to export the view back into the db. Here is a link witch explains how to create a LiveView in WaveMaker: http://dev.wavemaker.com/wiki/bin/wmdoc_6.4/Database#HViewsInWaveMaker

I will create my LiveView in my database. For that, I will start my Management Studio.

”"

After the authentication, I drill down to my DB and there to the Views Folder.

”"

With a “right click” there I can create a New View with fits my need.

”"

In the opening windows select all tables you created in our DB. In my case that are “VM_Datastore”, “VM_Host”, “VM_Info” and “VM_Network”.

”"

Know we have our Tables in the created view. Till know, there are no values chosen.

”"

We will do so, by clicking the values we want integrated in our view.

I choose:

  • VMName
  • CPUConfig
  • MemConfig
  • Cluster
  • Host
  • ResourcePool
  • Folder
  • DiskSize
  • Datastore
  • Network
  • IPAddress

After we have chosen the values, you can save the view

”"

Give a Name for the view, I chose “MyView” as name.

”"

After that, we are finished with the SQL DB.

Now we can start with the development of our website. First, we want to change the name for the Headline. Just click on the Headline and then change the text in the caption field to the right.

”"

I change the name to Little CMDB. Then we go to the Model Tab and click on it.