Category Archives: Programming

Using “Edit With DXL” Can Save You Hours

Published by:

As much as the world has moved on from Notes to a greater or lesser degree, there are some companies who retain systems that run on one or more Notes applications. This has always been part of Notes’ brilliance – the ability to have an application up and running year after year with little maintenance.

Recently, I was approached to do a little maintenance on an existing Notes application. An application that has been running for nearly 20 years.

The Brief

Add a data entry screen to an existing IBM Notes application that would recreate a tick box matrix originally done in Excel. The existing excel form consisted of ~150 rows and 14 columns, 12 of which were clickable.

Excel Tick Matrix

  • Each action should allow the text of that action to be edited by an admin user.
  • Each row should be capable of being configured to run as either a radio button (single value) or a checkbox (multi-value).
  • Each clickable area MUST sit in it’s own table cell.

Problems

XPages weren’t an option as some of the clients are Basic rather than Standard. It had to be a form.

150 rows multiplied by 12 clickable areas means 1800 clickable items. Throw in the radio/checkbox option and we are up to 3600 fields just for the clickable areas alone!

The Solution

I won’t go into the whole solution – it’s a bit long winded – but, I’ll give you enough background to see why I chose DXL editing.

The solution I came up with is effective albeit very old school: action hotspots on pictures with hide when formulae. The on click event of the “tick” hotspot would populate a hidden field with a value which would then show or hide the tick as appropriate. All very good once the logic was worked out. It was shown to the client and they were delighted. Smiles.

Now, came the labour intensive part: repeat this for the other 149 rows. A simple copy and paste of the row would result in 125 changes to various formulae per row: 18,265 individual text changes, not including clicking. Grrh!

The Pareto Principle is very much in effect in Domino Designer, and it was definitely one of the 80% of underused items that helped me on this occasion: Edit with DXL. It’s accessed by right-clicking on the element you want to edit and choosing “Edit With DXL”.

Edit With DXL Menu Entry

This option allows you to directly edit a design element in Domino XML (DXL). In my case, this showed a text representation of the binary form. From here I could copy and paste the line that I needed and manipulate the text easily with find and replace. The whole exercise was now reduced from a large amount of time to around 40 minutes.

Gotchas

Be careful when dealing with Paragraphs in DXL. It seems as though each paragraph looks for a element that describes various features (in my case the hide when formulae). They are linked by the id attribute of the pardef element. The code below shows a paragraph definition on lines 2 and 3. The id of the definition is 8. It defines that the paragraphs using the definition should be hidden when “AMS” doesn’t appear in the ResponsibleTeam field. The paragraph that is hidden starts on line 12 and is linked by specifying the id as 8: .

<tablecell valign='center'>
	<pardef
		id='8'
		align='center'
		keepwithnext='true'
		keeptogether='true'
	>
		<code event='hidewhen'>
			<formula>!@IsMember("AMS"; ResponsibleTeam)</formula>
		</code>
	</pardef>
	<par def='8'>
		<actionhotspot hotspotstyle='none'>
			<code event='click'>
				<formula>actionCode := "AMS";

					@If(ActionFieldType = "Radio"; @SetField("ResponsibleTeam";"");
					@SetField("ResponsibleTeam"; @Trim(@Replace(ResponsibleTeam;
					actionCode; ""))));
					@Command([ViewRefreshFields])
				</formula>
			</code>
			<picture
				width='32px'
				height='32px'
			>
				<imageref name='tick.png' />
			</picture>
		</actionhotspot>
	</par>	
</tablecell>

Runtime Optimisation of resources breaks CSS – XPages

Published by:

Recently, I had a need to specify style sheets for different media types: one for All media types (i.e. media=””) and a one with print specific styles (i.e. media=”print”). By definition style sheets cascade so, for my purposes I needed to place the print style sheet after the all style sheets.

<?xml version="1.0" encoding="UTF-8"?>
<xp:view
	xmlns:xp="http://www.ibm.com/xsp/core">
	<xp:this.resources>
		<xp:styleSheet
			href="/all.css"></xp:styleSheet>
		<xp:styleSheet
			href="/grid.css"></xp:styleSheet>
		<xp:styleSheet
			href="/quirks.css"></xp:styleSheet>
		<xp:styleSheet
			href="/overrides.css"></xp:styleSheet>
		<xp:styleSheet
			media="print"
			href="/print-only.css"></xp:styleSheet>
	</xp:this.resources>
</xp:view>

All I needed to do was to apply the template to the application on the test server, quickly test it and then deploy it – or so I thought.

When I looked at the code in Firebug, I saw that the print-only.css style sheet was listed before the runtime optimised all style sheets, thus breaking the cascade as I had defined it.

<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/print-only.css" media="print">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/xsp/.ibmmodres/.css/all.css&amp;grid.css&amp;quirks.css&amp;overrides.css">
</head>

After a bit of investigation, it seems that the runtime optimisation of style sheets was paying attention to the media value and rightly excluding the print-only style sheet from the aggregated style sheets. This had caused the link for the optimised style sheets to be written after the print-only style sheet.

The Solution.

In my case, only one of the style sheets included in the optimised sheets had styles that were overruled by the print-only style sheet so, for that sheet I specified the media value as “all” and rebuilt the application and all was well.

This xpage snippet

<xp:styleSheet
			href="/quirks.css"></xp:styleSheet>
		<xp:styleSheet
			media="all"
			href="/overrides.css"></xp:styleSheet>
		<xp:styleSheet
			media="print"
			href="/print-only.css">

gives

<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/overrides.css" media="all">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/print-only.css" media="print">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/xsp/.ibmmodres/.css/all.css&amp;grid.css&amp;quirks.css">
</head>

Whilst this is a solution, it does mean that I now have three http requests for style sheets where fewer would be better. I then went a little further and thought that if I specified media=”all” for all of the other style sheets, the optimisation would aggregate all of the “all” sheets together as one, but this doesn’t seem to be the case. When I did that, I got:

<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/all.css" media="all">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/grid.css" media="all">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/quirks.css" media="all">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/overrides.css" media="all">
<link rel="stylesheet" type="text/css" href="/RobsWorldDemo.nsf/print-only.css" media="print">
</head>

This effectively means that if a media type is specified, then that style sheet is excluded from runtime optimisation. If anyone can explain more on this, I would be happy to hear from you.