All about Lotus Domino Development (AaLDD)

XML data binding

Posted in Show N Tell Thursday, XML, lotus Domino, sntt by quintessens on May 8th, 2008

According to Wikipedia refers XML data binding to the process of representing the information in an XML document as an object in computer memory. This allows applications to access the data in the XML from the object rather than using the DOM to retrieve the data from a direct representation of the XML itself.

In other words you could tie HTML tables to Notes data and navigate through it without reloading the page.

For this SNTT demo I needed:

  • a form to create Book documents with
  • a view to present the books documents as XML
  • a page on which I define an HTML table and connect the table to the XML view in order to give it content
  • (a $$ViewTemplate for the Xml view)

First step:

  • Create your Notes form with some fields. I choose Title, Author, ISBN and Price.
  • Create a set of documents with this form.

Next:

  • Create a view that presents the ‘Books’ documents as XML data.
  • On the fifth tab under ‘Web access’ d not forget to set the option ‘Treat view contents as HTML’
  • The view must start with an opener and closing tag for each document
  • For each column you define sub child elements

xml view

  • Setup a $$ViewTemplate for this View in order to be able to add a root element:

$$ViewTemplate form

Reminder: do not forget to set the content-type for this Form as HTML.

Continue:

  • Create a Form/Page that will hold the HTML Table.
  • Add the following HTML on it:

HTML for table

As you can see the Table is linked to a datasource, in this case the View books.xml. Each TD in the TBody part is linked to a datafield. In this setup the datapagesize is set to 5, meaning 5 documents at a time will be displayed.

Some extras

By giving the table an ID (xmlTBL) you can add functions to navigate through the table such as:

  • previous / next set of documents
  • first / last set of documents

navigation buttons

I bet you can imagine some much better pagination examples.

At the end your ‘bookstore’ will look like this:

how the local bookstore looks like

I have included a working example here.

Pure CSS Data Chart

Posted in CSS, Show N Tell Thursday, lotus Domino, sntt by quintessens on May 2nd, 2008

Okej, one day too late for SNTT, but some people are also allowed to post SNTT’s already on Wednesdays it seems…

Alen Grakalic wrote a nice article about using pure CSS as data charts. Basically via CSS Alen presents pure data in a graphical way.

Here is how it could look like:

css chart

(almost weekend? or those pills do work?!)

The screen capture is information from a Domino View embedded on a page and transformed with some CSS. Nice? I guess this is a very cheap way of creating more dashboard alike solutions…

Anyway, for those who are curious here is a downloadable working example. Have a nice weekend!

Tagged with:

Introduction Dojo Toolkit & IBM Lotus Domino

Posted in AJAX, Dojo, JavaScript, lotus Domino by quintessens on April 21st, 2008

Currently I am collecting all sorts of information about implementing the DOJO Toolkit in Lotus Domino applications. Basically for preparing myself for a upcoming project to ‘pimp’ an existing web-application using this JS Framework.

Untill now I have been only working with Prototype and Scriptaculous (which I like a lot) but since IBM’s horizon also shines more and more Dojo I am really curious in DOJO’s capabilities. Especially since documentation seems to be getting better and better.

I have found a good presentation about implementing the Dojo Toolkit in Lotus Domino applications on Slideshare. You can find the presentation here.

Introduction Dojo Toolkit & IBM Lotus Domino - presentation

It seems that more and more Notes related people find the time and effort in uploading their presentations on this site, which is ofcourse a very good thing! (HINT)

Tagged with: ,

Perfect pagination style using CSS

Posted in JavaScript, LotusScript, lotus Domino by quintessens on April 20th, 2008

One of the blogs I often read is the one from Antonio Lupetti who is a Web developer, not a Notes developer. Especially his article about pagination caught my attention since it remembered me about the idea to rewrite Bob Obringers ‘ultimate view navigator’.

Bob uses in his approach for the pagination a table to display the page numbers where a list should be more suitable.

As the image below shows with Antonio’s approach it is pretty easy to make the pagination more compatible with examples seen on other well known sites. Here is a Flickr alike pagination for a Domino view:

Flickr alike domino view pagination

Anything new under the sun? Not really, but for the ‘purists’ under us more esthetic solution.

Ofcourse a working example can be found here.

Build - Improve - Extend

Posted in development, lotus Domino, lotus notes by quintessens on March 5th, 2008

the view

Dive deep into the significant changes to development that Notes and Domino 8 brings. This seminar is guaranteed to shorten your learning curve through detailed explanations, live demos, practical examples, and working code to quickly get you up and running with ND8 development.

Copenhagen, DK April 9 - 11

I just received green light to register myself for this event. See you there? Looking forward!

Displaying documents in a View in a ‘Thumbnail Gallery’ format

Posted in JavaScript, Prototype, Show N Tell Thursday, lotus Domino, sntt by quintessens on January 24th, 2008

Showing document information in the normal ‘vertical’ way can sometimes be pretty boring. It also requires a lot of space especially when images as part of the information becomes involved.

On the WWW a lot of examples can be found how to create a ‘CSS Image Gallery

But you will see when images have different sizes and their caption text underneath will differ the result will be quickly dis-satisfying:

css gallery example

Ofcourse you can set the same height and width on the images. But what for the caption text?

With a little bit of DOM scripting using Prototype you can simply rebuild your screen and show the view in a table format. Add the following code to the JS onLoad event:

//ALL DOCUMENT INFORMATION (ROW) IS DISPLAYED IN A DIV WITH CLASS THUMBNAIL:
varThumbs = $$(’div.thumbnail’);
varThumbs.each(Element.hide);
//NUMBER OF COLUMNS:
var numberDocs = 3
var varRowCounter = 1
var varTable=”";
if (varThumbs.length > 0) {
 varTable+=”<table border=0>”;
 varTable+=”<tr>”;
 for (i=0; i< varThumbs.length; i++) {
  //FYI (5 % 5) =>  5 Mod 5 returns 0
  if (varRowCounter % numberDocs == 0){
   varTable+=”<td valign=\”top\” onmouseover=\”style.backgroundColor=’#F4F4F4′;\” onmouseout=\”style.backgroundColor=’#FFF’;\”>” + varThumbs[i].innerHTML + “</td></tr><tr>”
   varRowCounter=1
  }  
  else{
   varTable+=”<td valign=\”top\” onmouseover=\”style.backgroundColor=’#F4F4F4′;\” onmouseout=\”style.backgroundColor=’#FFF’;\”>” + varThumbs[i].innerHTML + “</td>”
   varRowCounter+=1
  }  
 }
 varTable+=”</tr>”;
 varTable+=”</table>”;
}
$(’viewbody’).replace(varTable)

‘viewbody’ is the DIV where the $$ViewBody field is nested.

Levels in Notes Domino Development

Posted in lotus Domino, lotus notes by quintessens on December 7th, 2007

I am currently writing some documents including simple tests/code examples that should help our (Domino) developers in grading their levels of experience.

Searching on the web I found some documents that describe different levels on different technical areas’ (mostly used for grading web developers) like:

When it concerns Notes/Domino related levels, what different areas would you specify?

  • @Formula/@Functions
  • LotusScript
  • JAVA
  • XML/DXL
  • Agents
  • ACL/Security
  • Events (Forms and Views)
  • Web Services

I am just curious what areas of expertise within Lotus Notes/Domino (from a developer point of view) you think are worth defining and grading into levels?

Thank you!

Pagination - Examples and good practices

Posted in Applications, lotus Domino by quintessens on November 19th, 2007

Structure and hierarchy reduce complexity and improve readability. The more organized your articles or web-sites are, the easier it is for users to follow your arguments and get the message you are trying to deliver. On the Web this can be done in a variety of ways.In body copy headlines and enumerations are usually used to present the information as logically separated data chunks. An alternative solution is pagination, a mechanism which provides users with additional navigation options for browsing through single parts of the given article. Parts of the article are usually referred to by numbers, hints, arrows as well as “previous” and “next”-buttons.

Search engines almost always use pagination; newspapers tend to make use of it for navigation through the parts of rather large articles. And there are situations when pagination is also necessary for weblogs. Additional navigation can simplify the access to some site pages — e.g. make it easier for users to browse through the archives of the site.

In most cases pagination is better than traditional “previous - next” navigation as it offers visitors a more quick and convenient navigation through the site. It’s not a must, but a useful nice-to-have-feature.

The above article on Smashing Magazine shows that in my working example there are enough points for improvement:

example

for example:

example

example 2

Language support in DB

Posted in @Formula, JSON, JavaScript, Prototype, Sandbox, lotus Domino by quintessens on November 2nd, 2007

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.

here is how it looks like

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)

language notes documents

  • 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’:

language support on form

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

language field lookups

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

showing the value(s)

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:

@functions presing JSON array

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

transforming the buttons

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

Download Pagination example

Posted in AJAX, JavaScript, Prototype, Sandbox, lotus Domino by quintessens on October 28th, 2007

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!

page navigation example

Updated: the application had local encryption enabled…