xPages & Beer meeting Presentation

Last wednesday I did a presentation called “Coding Java for xPage Developers” on the Dutch XPages & Beer event. It has been a while since my last presentation so I was a quite a bit nervous. Especially when during the presentation people started to ask questions I didn’t really prepared for. But I managed and got some very nice and positive feedback afterwards.

In the presentation I talked about the techniques that are discussed in one of the best books I’ve ever read: Clean Code: A Handbook of Agile Software Craftsmanship and last but not least a little about the new domino java api

The slides are in dutch/english. If you want a full English version just let me know:

Debugging made easier

This tip is for those people who are using the Debug Toolbar from Mark Leusink. One of the nice things about this toolbar is the embedded logging. You can use logging by means of calling methods on a managed bean ( dbar ) or in your java code you can use the methods info,error,debug or warn. Each method writes log line to the debug (or the log db ) with the corresponding level.

Because in my current project I use this way of logging a lot and because I’m a lazy programmer I started to use code templates. In the Eclipse client it   is possible to predefine certain lines of code which are added to your editor when you type a shortcut followed by the key combo ctrl space.  The most common is the following: syso. This will be translated to System.out.println(). Obviously typing syso and hitting ctrl+space is lots quicker than typing the full line of code.

So I defined 4 new templates. dInfo, dError, dBug, dWarn. The steps to create a new template are :

1) File -> Preferences and type templates in the search box and click on Java ->Editor->Templates

templates_1

2) Press the new Button.

templates_4

3) Fill in a name (dBug, dInfo,dError or dWarn ) and past the following code

templates_3

DebugToolbar.get().info(this.getClass().toString()+”: “);

This will get an instance of the DebugToolbar class and add an info message to the log which contains the current class we are working in. *

4) Click ok, Apply, Ok and see if it works

5) Type dInfo ( or any of the other templates you created ) and hit ctrl+space. The code should be auto completed with the content you have specified in the previous step.

I hope you like this little tip. It makes your life as a developer a little easier !

 

 

 

*keep in mind that the ‘this’ keyword  wont work when you use it in a static method..

 

CSS layouts

A quick post from me about layouts. If you are as lazy as I am and don’t want to use the application layout all the time but also dont want to burn up precious hours only finetuning CSS you could take a look at this page: http://layouts.ironmyers.com. It features a enormous amount of ready to use CSS layouts.

Easy to retrieve, easy to change. Have fun!

Enable autogrow feature of CKEditor

In a xPage project the customer asked us if the following would be possible: ” When the content of the richtext editor exceeds the height of the richtext editor we want to have it expanded” . And this is ofcourse possible!

The richtexteditor is based on the CKEDITOR plugin ( since 8.5.2 ). There is a plugin which does exactly that what the customer wanted. The Autogrow plugin. To enable it in your xpage you simple have to define it as an extraplugin using a dojo attribute. See the following line of code:

This way you can add extra plugins you want to load in the ckeditor. If you want to have multiple plugins being loaded you only need to separate the plugin names with a comma. I haven’t found out yet how to add plugin settings using this attribute. 🙁

update: I tested it today on 8.5.3 fp1 and 9 and both seem to work perfectly.

xPages and Beer 12-06-2013

Yesterday I attended a new edition of the xPages and Beer sessions. xPages and Beer is an initiative started by some very great xPages developers to share their knowledge for anyone who wants to attend.

The very first edition started with around ~10 people and yesterday a stunning crowd of 20! people where attending. It realy shows that gatherings like these are wanted by the community. During the session we saw three presentations done by different people

Peter Pennings – Ilionx : Mobile xPages.

During his presentation Peter talked about an application he  created for the newest blackberry. The idea behind the application was that it retrieved it’s data from ‘a’ source and saved it locally on the phone to update it the next the time the user wanted or came online ( if I understood correctly ). Althrough the application itself was not made with the mobile xPage controls (which I actually hoped to get some more information about ) the data is being retrieved using an call to a xAgent. This realy shows the power of xPages.

Thimo Jansen – Defrog: xe:ObjectData ( link )

The second, and for me personally the most interesting session, was about the use of the xe:Object data. xe:ObjectData were introduced in the extension library quit some time ago. xe:ObjectData is a new type of datasource. Instead of using a document or a view you can now use a Pojo as the model of your xpage. I’ve used them in the past but didn’t quit understand the need for them because sooner or later the data is saved to a notesdocument anyway. Now with the presentation from Thimo I’m eager to use them again in future projects!

Mark Leusing: Debugging / Debug toolbar (link)

During the last presentation Mark talked about his debug toolbar (which every xpage developer should be using.. !) and about java  / ssjs debugging in general. Now with the remote debugging capabilities  in Notes 9 and the debugtoolbar at hand there really shouldn’t be a reason for a developer to use print! ( so called poor man’s debugger ) statement anymore.

Many thanks to every one for organising this event and see you next time!

update: Added links to a presentation about debug toolbar and xe:objectdata

xPages and Java : Usage of 3th party packages and jsonsimple.

A small post from my side about 3th party packages. Be sure whenever you make us of an 3th party jar file:

  1. Check the license file
  2. Make use of libraries which are open source when possible.
  3. Make sure the libraries don’t have lots and lots of dependencies ( other 3th party libraries )

One example to think about is the creation of JSON. When generating JSON in xPages you can make use of the IBM package:  com.ibm.commons.util.io.json.JsonJavaFactory. In the context of xPages this seems a logical step. But what happens if you want to reuse created classes in xPages in other projects for instance a native desktop app?

You could face the problem that the package is not available or not compatible with the jvm you are using but your custom classes are. In the worst case scenario you need to rewrite your code because you are adding another library. Therefore you will end up with 2 versions of the same code and as we all know.. that could be a pain in the .. to maintain.

In this case you could make use of the org.json.simple package. This package is opensource and makes use of the apache licens. So go fetch a copy of this great json library and start working with it!

Serving media files to iPad/iPhone on Domino part 1

 

“We want a video library application” they said

“No problem, can be done” I said

“Bad iPad” I screamed!

the lines above are a  little summary of what happened the last few days. At the office  I’m building  a web application which is used to serve Video files. Everything worked fine except for iPhone and iPad devices. I needed to get it working. At first I thought it was a simple encoding issue. So I grabbed my MediaInfo installation, checked the codec information on the mp4 file(s) and spotted that the wrong baseline was used. It was 4 and according to the official apple sources the baseline level needs to be 3.0 (source). So I re-encoded the file and uploaded the new version. I fired up the iPad and noted that the file still didn’t work. Ah! Maybe it was browser caching . So I renamed the file, uploaded it and again.. nothing. On all devices/browser it worked (ie 9, firefox, chrome, safari on windows, my android phone..) except for the freaking iPad!

So being out of options the only thing I could do was head over to stackoverflow and ask my question there. And so I did. Here I present to you a possible solution:

The server needs to support byte-range requests for the mobile Safari ( which is installed on iOs devices ) to be able to play video files using HTML 5.  Byte-range requests? What are byte-range requests I here you think. Actually its fairly easy to explain.

A byte range request is actually nothing more then sending only a little part of the complete file to the client (more). To be able to support this feature a server must react on the range request header and send the Accept-Ranges header accordingly. Because I didn’t know of this requirement I was really puzzled to why the file played correctly on my local Apache install and not on my domino server. To make it even more exciting I tested the following situations

Description Result
File resource Correct
File resource in domino/html Correct
File attachment on document Fail!

As you can see for some reason when serving attachments to the browser the correct headers are not send to the browser. I tried to add them by website rules but of course this failed. Since the system needs to support it as well. So I checked back my question on Stackoverflow to see if there where new additions. And Sven added a little code resource to his answer which actually does exactly that what I wanted.

The code example uses a servlet to serve the file using the range headers if it was requested or the full file if not. I’ve adapted the code and changed it a bit so it is usable for the domino server ( see part 2 for the full code example and explanation ). When you call the code in a beforerenderresponse event with the following line

it will serve the correct file with byte-range support! How cool is that!

In the next Part I will explain to you which code I used and will show you what I changed to get it working for Domino/XPages

Don’t forget the milliseconds. A post about dates and Datetime comparison

During my work I find working with date and time objects one of the most challenging things. I just spent a few hours finding out that when you retrieve date from a view column the millisecond part of the date is actually not set at all.

In my current project I’m using a date control to set the date of a certain object. After processing I save this data into notesdocument. I noticed when I switched dates ( using a GregorianCalendar ) and retrieved data from the view the documents didn’t turn up on the screen. After some investigation I found out that when using the date-time control for some reason the date is saved but the milliseconds part of the date is not saved at all. This can lead to some frustation.

Let’s show you a little example

Lets say we have the following code

 

 

At first glance you might think that the lineDate.getTime and the startDate.getTime() would return the same integer if they point to the same date f.i. 31/12/2012 but in fact they wont..

In my particular case. The lineDate.getTime() returned 1356994800000 and startDate.getTime()  returned 1356994800640. As you can see a difference of 640 milliseconds. This is caused by my first call to the GregorianCalendar.getInstance(). It creates a new calendar instance with the date set to the current date /time. So at a specific point in time there are 640 milliseconds at the end.

When you now compare these two methods and use the system.out.println(linedate) directive you will see something like Mon Dec 31 00:00:00 CET 2012 which is the string representation of that date. Which is the same as system.out.println(startDate). But it wont show you the milliseconds! It took me a little while to realize the millisecond part could be different.

If you know this fact you can work around it by adding 1 line to the above example:

 

I hope this blogpost helps someone in the future when working with dates in xPages/Java.

Responsive webdesign and xPages

As a xpage developer I also need to do some styling from time to time. This isnt a big issue ofcourse unless you need to create an app which is also suitable for mobile devices. Now with the mobile controls at hand it isn’t a big problem developing a mobile website but what if you want to create a website which should look good on mobile and desktop devices and you don’t want to build a mobile and a desktop version of your app?

Here is where responsive webdesign comes in. I’m just learning this myself ( since I’m not a great UI guy.. ) and I already like it. In it’s simplest form all it comes down to is just to add some extra lines to your css files..

Lets say you use the oneui template and you want to hide certain parts when you are viewing the page on an Iphone. You only need to add the following line to the css:

 

As you can see the right sidebar is not displayed when the size of the screen is les or equal to 320px width. In this very simple way you can add your responsive design to the oneui template without having to create a complete new website for mobile. Unless functionality commands it ofcourse 😉

A little xPage optimization

When you are developing an application there is a time when performance comes to play. This can be either in the beginning of the project due to certain requirements or after some time developing you’ll notice your application does not performance as well as you thought it would. This post will give you a few tips on how you can increase performance without having to rewrite a great deal of your code.

Because I learn new things myself every project I will update the blog once in a while to reflect the newest findings

Retrieve data from the current component within a event handler:

This is a very easy one but will eventually lead to a bit more performance. Whenever you want to retrieve data from the current component within a SSJS event handler you should retrieve it directly using the following line:

The ‘this’ is a pointer to the current eventhandler. And as you can see this event handler does have a parent property. This parent property is a pointer to the current component where this eventhandler is bound to. It will be faster then

It will be faster because the getComponent() method has to ‘search’ for the component you are looking for where the getParent() method is a pointer to the component directly.