jQuery Mobile 1.3 Panel Widget XPages demo (for download)

The last couple of days I have been ‘playing’ with jQuery Mobile and mostly with the panel widget.

I have made some kind of starter-kit (NSF) to build a great XPages app for tablets/smartphones. I have setup a subset of custom controls which accept properties. A simple form in Notes you can use to setup navigation for header, footer and a vertical menu.

You can download the (zipped) NSF on Dropbox.

Below you can see a sample result:

Please let me know if you experience any problems or if you have suggestions for improvement. Happy coding!

My second OpenNTF project

Today I have posted my second project on OpenNTF (@Vince: now I may rest for the next 5 years?). It is an application that I have posted before on this blog but now I made the time available to make some minor modifications and upload it to OpenNTF so it will probably be shared a bit more.

Another reason for starting the project on OpenNTF was that I received a question if the database could be shown in a presentation about design option in Lotus Notes.

About the project

This application can be used as the default template for new development projects for the Lotus Notes client.

The database is intended for Notes 7 / 8 audiences using the Notes Basic Client (no support for composite application). With a minimum of graphical elements (images) the database looks similar in both client versions.

The template is kept clean at a minimum BUT provides a simple, flexible, attractive framework to distribute your Forms and Views with/in.

The template provides 2 sample forms that demonstrate several layout options you can use:

– 1 or 2 column layout
– labels and input fields besides or below each other.

The example forms try to re-use design principles that can be found throughout the PIM applications in Notes 8.

Some thoughts

I like the concept of composite applications and the Java views in the PIM applications. However I can imagine that these techniques are not widespread in a lot or organizations (both with developers and with supporting Notes client installations).

So I assume the usage of old-fashioned frames in Notes client oriented will be common practice for a while, also because it gets a lot of things done in a short development time , even when it has its limitations.

Another thing what I have not seen is branding in composite applications. I would like to see some good examples about the options here, so I would be thankful if you could share me some samples / screenshots.

With XPages support in the 8.5.1 Notes client I wonder how far I will actually come, using Java views and so?…

First project on OpenNTF – Bildr

There is a natural discussion going around about the OpenSource community for Lotus Notes Domino.

I have spreaded out my opinions about the state of OpenNTF (read: you could summarize it as: great job what the IBM-ers done so far, although I would have expected something more resources from their company) several times.

Nevertheless I am thankful to the people who have contributed code on OpenNTF and from I have learned quiet a lot.

I guess the best way to show my gratitude and my opinion or reaction on the discussion on OpenSource for Notes/Domino would be by uploading some of my past work as a project.  Dare to share.

Since this is my first release ever on OpenNTF I hope I have selected all the correct options etcetera. Just uploading the information I believe the tool to manage projects on OpenNTF can use a revision too. Especially more ‘collaborative’ applications are difficult to place under the correct category.

Anyway, my project is called Bildr, an application which allows an easy way to upload, resize multiple photos at once. The photos can be navigated via several options in the browser. Visitors can leave comments on photos.

The application is pretty much ‘domino development in the pre-xpages days’ spiced up with some MooTools and Lightbox stuff. I guess the next logical step for the application will be to XPage enable it.

Hopefully this action will lead to a continuous sharing of applications on OpenNTF. Have a nice weekend!

Excel to export update

I received some mails that database for the Export function was locally encrypted. This should be solved here. My apologies…

Personally I would spend more time now on an integration between Lotus Notes and Lotus Symphony using the Developer Toolkit available here.

Symphony

 

Ps. The application uses TED, The Table EDitor written by Tomas Ekström.

Application support – Which tool do you use?

My (new) boss has great faith in me so he has made me responsible (yippie) for one of our key LN applications for communicating withing the organisation (an application for publishing documents on our intranet).

Since I am new & fresh & (still) eager in the organisation I am looking for an application that can support me in this task. Mainly the application should be able to store communication (emails), documentation (with or without attachments) and maybe a FAQ section.

No fancy stuff, please just an application for the Notes client.

My search on OpenNTF did not give me an answer in my quest. Therefor my question to you:

“which tool do you use for giving support on LN applications?”

Navigation-menu from view (XML Transformation)

In a previous writing I explained how you can create a navigation-menu that collects it’s information straight from a Notes View.

 

Using the ?ReadViewEntries URL command Notes outputs the view data in XML form which can be the source of a transformation to HTML using the XSLTProcessor in your browser.

When the project became actual again I found some time to improve it’s functionality, since it was not working 100% in Firefox. So here is an example available for downloading.

Here is short summary of the example’s features:

• the navigator collects it’s source data from a Notes view using the ReadViewEntries command
• when navigating through the menu for each subcategory (via the + and – icons) a new AJAX request is done to collect the information withing that (sub)category (so the amount of data is being divided into smaller parts)
• the information is being transformed into HTML via the build XSLTransformator of the browser
• when clicking on (sub)category a collection of responding documents is collected and presented in another frame
• the navigator also contains document links which will load the document info in the right frame when clicked
• documents can be grouped under whatever structure in the View

Very nice, I did not manage to solve 1 thing yet: if a (sub)category contains subcategories AND documents, the documents are being displayed FIRST. I rather would display the subcategories first and then the documents. Maybe you can help me with that one?

Documentation, right! How and where?

Documentation is something we would (like to) do if there would be time calculated for it in every project. But in a lot of development projects the customer is not interested to pay for something he/she is not going to read at all so where to ‘store’ the application logic?

To my opinion it can help to use the IBM like approach in delivering brief documention in their templates, just like Rocky Oliver talked in his session ‘Creating Maintainable IBM Lotus Notes and Domino Applications – Writing Readable Code’ at Lotusphere 2007.

How do you deliver your documentation?

A sample of above can be found here.

Language support in DB

While waiting on the next plane I write this little posting about a simple technique used in the very nice !!Help!! application available on OpenNTF which give a basic support for different languages support across an application.

Actually I was looking at a more advanced solution using Yahoos Translator utily, but time made me decide to the most easy/quickest approach making the most benefit of Domino functions itself.

While my main focus is development for the web the technique can still be easily used across forms. Here is how it works:

• In Notes documents you define the values for each language you want to suppport, mostly these values are grouped by the design element you use them in or the specific type of element they present (field labels, action buttons… things like that)

• On the design element itself you make a connection to the preferred language selected by the user, in my example it is a normal document that is being treated like a ‘profile document’:

• Add lookup fields for each ‘language’ document you have created:

• On the place in the design element where you want to show/use the related value you strip the results and return the result:

That’s it! But… wait. This does not work for buttons on a form because Domino allows not a computed value/label for it.

JSON to the rescue!

The most easiest way to get the values in an array I thought was transforming them in a JSON format wia basic @Functions:

With this array I easily approach all my <input> type buttons via Prototype and replace their values with the value defined in the array:

A downloadable working example can be found here. I wonder which language support systems you are using?

Scriptaculous autocompleter in Domino form

This post describes briefly an implementation of Scriptaculous’ Ajax.Autocompleter class.

It uses an AJAX request using a Page element for an @DBLookup I believe first mentioned at Lotusphere 2007 by Jack Rattcliff and later (?) by Jake Howlett in his http://www.codestore.net/store.nsf/unid/BLOG-20060221 and perfectionized (?) by my collegue Tomas.

Scriptaculous autocompleter needs an unordered list in return. For instance this list might be returned after the user typed the letter “y”:

<ul>
    <li>your mom</li>
    <li>yodel</li>
</ul>

Some examples use an agent to return the unordered list, others describe using a page.

The demo allows you to fill in multiple fields after clicking on one of the presented suggestions by splitting the responseText:

In demo-mode it would look something like this:

For downloading a working example click here.

Download Pagination example

I received a couple of mails saying that the link to Bob Obringers article on his ‘ultimate view navigator’ is dead and if I could send a copy of the example.

I have uploaded a working example > here < including an example for a flat view and an example for a categorized view. In the flat view I have included Prototype’s AJAX request handler, the categorized view still uses Bob’s approach. Good luck!

Updated: the application had local encryption enabled…