#oldschool @formula to check for attachments

I have started at a new company and they didn’t have an XIC (XPages Information Center) so my XPages Knowledge db needed to be installed (a regular Notes db for quickly copying & pasting rich text, snippets, storing sample applications, multiple media files).

The database is a couple of years old so it needed some updates. One was to hide a “files section” from printing in case there are no files attached. I noticed embedded images start with an “ST” naming in the @attachments array (correct me if I am wrong).

Finally I came up with the following rule for a computed sub form:

files:=@AttachmentNames;
counter:=0;
REM{“check if files contains a point. embedded images do not contain them”};
@For(n := 1;n <= @Elements(files); n := n+1;
@If(
@Contains(files[n];”.”);
counter:=counter+1;
“”)
);
@If(@IsNewDoc;”Attachments”;counter!=0;”Attachments”;””)

LotusScript equivalent for @Command TextSetFontColor?

In an form I have an action button:

changetext

Unfortunately this TextSetFontColor command only allows these colors:

  1. Black
  2. Gray
  3. Red
  4. DarkRed
  5. Green
  6. DarkGreen
  7. Blue
  8. DarkBlue
  9. Magenta
  10. DarkMagenta
  11. Yellow
  12. Brown
  13. Cyan
  14. DarkCyan
  15. White

In the Help file it says:

Language cross-reference
NotesColor property of LotusScript NotesRichTextStyle class

Is there anyone who has written the LotuScript equivalent to change the color of selected text in a rich text field (with RGB value)?

Pagination on a View in the Notes client

A problem with Notes Views is that when they contain a lot of documents scrolling becomes inevitable. Even when you apply categorized columns it will become necessary that users click through the Views. An option would be that you just start typing and hopefully Notes will lead you to the nearest corresponding document.

When you apply categorized views the categories are displayed vertically below each other so for travelling users with smaller screens it will become tasly to open and close the categories just to see thse categories and corresponding documents displayed in a properly in the overview.

Maybe XPages in the Notes client will bring us some relief, but we are not there yet.

So how do we cope with the issue for the time being?

On the web it is common practice to have some sort of pagination on top / below lists of documents so you can navigate through the list without the need to scroll up and down or move you mouse across the screen. The pagination can be based on number of available pages or just available short cuts (example: the first letter of an available lastname). I myself have written some articles about pagination on this blog which you may check out yourself.

So this is all about the web, I adress this article to pagination in the Notes client.

The simplest way I found is to create a list of similar shortcuts, containing javascript, and render pass thru HTML in Notes. In this example I explain how I added pagination to a list (a Notes View) of persons. The thought is to show a list of persons form which their lastname start with a certain letter. What I needed to accomplish this:

  • A Form with an Embedded View. This View should be categorized by the first letter of the lastname @LowerCase(@Trim(Tx_LastName);1). SaveOptions are set to zero ofcourse.
  • The Embedded View has the ‘Show single category option’ in use.  As formula write the name of the Field that will acts as a temporary container (Tmp_LastName).
  • Add a Field named TmpLastName on top of the Embedded View. Make it editable. As default value give it the value “a” (you could check if this value is really available or not).
  • On top of the Form add the following JavaScript and CSS code:

<script language=”Javascript”>
var entryNumber = “”;
function showTab(lastName) {
entryNumber = lastName;
document.forms[0].LastName.value = entryNumber;
entryNumber = “”;
document.forms[0].set_field.click()
}
</script>

<style type=”text/css”>
font {
font-family: “Default Sans Serif”, sans-serif;
font-style: normal;
font-weight: normal;
font-size: 8pt;
color: black;
text-decoration: none;
text-align: left;
text-indent: 1ex;
}
A:link {color: blue; text-decoration: none}
A:visited {color: blue; text-decoration: none}
A:active {color: blue; text-decoration: none}
A:hover {color: blue; text-decoration: none}
</style>

  • As final step you need to add a computed text just above the Embedded View. Mark the text as passthru HTML. A Value enter:

varList:=@DbColumn( “”: “NoCache” ; “” : “” ; “PersViewCategorized” ; 1 );
tmpList:=@Implode(“<a href=\”javascript:showTab(‘” + varList + “‘)\”>” + varList+ “</a>” + ” | ” );
@LeftBack(tmpList;”|”)

Here we make a call to first column in the same Embedded View. Around each found category we wrap a JavaScript call which will put the value in the temporary field and finally we call the button to update the UI.

Here is a screendump that shows how it could look like:

paginationNotes

A problem discovered

Well everything  looked shiny untill I tried to load the Form in a Frameset. When pressing on one of the links I got the message:

paginationNotesMessage

Some work to do IBM….

Mimicing the preview-switch option

I thought I give this Thursday a ‘SnTT’ swing (what happened with that phenomena?).

My collegue Tomas can be sometime tough with progressive ideas, but this makes you just try that extra effort to make something in Notes a little bit better than expected.

When I asked him for ideas for a standard development template he liked the ideas to have multiple collapsible preview panes BUT he wanted the option for the user to switch in preview in bottom or preview on side, just like in the Notes 8 mail template.

previewbutton

Since we know that the mail is a composite application with it specific functionality a different approach to provide something similar in the ‘classic’ client.

Solution

The following image shows the frameset for my application:

main_frameset2

So in frame ‘main’ I have a frameset. By default the frameset is the one that contains a preview on the bottom. This frameset is called ‘$fs-notes-documents-vr’ (vr for vertical). I have a second frameset that is called ‘$fs-notes-documents-hr’ (hr vor horizontal) that will be displayed in frame ‘main’ when the user chooses for a preview on side.

In my horizontal menu (alternative menu) I have added 2 action buttons:

  • Preview on Bottom.

@SetTargetFrame(“Main”);
@Command( [OpenFrameset] ; “$fs-notes-documents-vr” );
@Environment(“AppCode-AppPreview”;”$fs-notes-documents-vr”)

  • Preview on Side.

@SetTargetFrame(“Main”);
@Command( [OpenFrameset] ; “$fs-notes-documents-hr” );
@Environment(“AppCode-AppPreview”;”$fs-notes-documents-hr”)

These actions will place the appropiate frameset in frame ‘main’ and set an environment variable. This variable is being read when the ‘default’ frameset (the frameset that contains frame ‘main’) is being used when opening the application.

For frame ‘main’ I have as computed value:

varFrSetDefault:=@Environment( “AppCode-AppPreview” );
@If ( varFrmSetDefault = “” ; “$fs-notes-documents-vr” ; varFrmSetDefault)

So if the user has used the application before and has set a preview preference the next time the user comes in the application the ‘prefered’ frameset / preview option is being used!

Too bad there is no option to read which design element is currently used in a frame (like in a @GetTargetFrame). In that way I would have been able to re-open the currently opened view / folder (okej I could use another environment variable for that).

Implementing Smoothgallery into a Domino application

It was a while since I opened my Designer client for developing a new project due to other responsibilities. At this time I am prototyping a basic Notes application where users can upload images via the Notes client and browse through them via a Web browser.

So what is the status? Well in a couple of days I have come pretty far:

 

  • a project name for the application (you have to start with something)
  • upload (of multiple ) images via the Notes client and automatically creating thumbnails – checked
  • a nice interface for the Notes client – checked
  • an attractive layout for the Web client – checked
  • a lightbox function for display the high resolution images with a faded application in the background – checked
  • different ways to navigate trhough the application (by categorie, tags, by author, archive, calendar) – checked
  • additional features as RSS, simple search, option to leave comments – checked
  • login function so a user can easily see his/hers contributions – checked

 

In the startpage I have the following features:

 

  • a sliding gallery based upon Smoothgallery more about this later 
  • overview of the last 3 added pictures
  • an overview of the last 3 comments
  • an archive overview
  • a section with some contact information

 

Well I still have something left in my wishlist:

  • XPaginate (is that correct?) the application ofcourse haha
  • add an option to send email to people with a link of the image
  • upload functionality from the Web client
  • improve the search functionality (at this point it searches a view)
  • … some more spice probably

Smoothgallery

Well this post is about the Smoothgallery which was really easy to implement. The gallery has the follwoing functions:

  • a (main) slider for showing medium sized images, with previous and next image function
  • a slider for showing thumbnails, this slider has a mouse-over sliding function
  • some text / description that will be displayed as a layer on top of the current image in the (main) slider

Let me start by showing you some end-result, here is an image of the gallery as it will be presented by default. I marked the 3 sections described above:

 

gallery image
gallery image

 

So how did I get this to work?

Start coping the files under the directories CSS, Images and Scripts in the download to your Shared Resources \ Files section. The gallery uses the  MooTools JS Framework.

To get the files loaded add the following references in your HTML Head Content:

 

html head section
html head section

Add also the following JS function somewhere on your form:

 

JS Function
JS Function

And drop the follwoing code where you want to have the gallery displayed:

 

gallery position
gallery position

The Computed Text is a @DbColumn to a view:

@Implode(@DbColumn(“”:””;””:””;”$v-pixsmoothgallery”;1))

On the view we say we want to have its content to be displayed as HTML and the view has only one column with the following code:

 

formula in column
formula in column

(My upload agent creates 3 kind of images for each upload: 1) the original size 2) a medium size 3) a thumbnail size. You can forget the firstline here in the code)

Is that’s it? Yeah! In practically half an hour job I had the complete gallery up and running.

Here are some screendumps of the app:

bildr06

bildr07

bildr08

Just let me know if you are interested in more code-drops…

Framesets (recap)

Earlier I wrote that the setup of Framesets in an application for the Notes client was bugging me. It seemed that one Frame that is being used as a preview pane (using the URL parameter) is ‘consuming’ all the actions made in other Frames.

That is, when using @Formula. When using LotusScript I do not have the problem.

Example 1 – @Formula code in ‘Go’ button in ‘Header':

myChoice:= Tx_MenuOptions;
@If( myChoice= “Welcome page”;
 @Do(
  @SetTargetFrame(“Main”);
  @Command([OpenPage]; “Welcome”)
 );
)

This will causes an empty variable ‘myChoice’, since the value from dropdownlist Tx_MenuOptions will be returned as empty (or cannot be read?)  :-?

Example 2 – LotusScript code in ‘Go’ button in ‘Header':

 Dim myChoice As String 
 myChoice = uidoc.FieldGetText( “Tx_MenuOptions” )
 
 Select Case myChoice
 Case “Welcome page” :
  Call ws.SetTargetFrame(“Main”)
  Call ws.OpenPage(“Welcome”)

This code will read the field Tx_MenuOptions!

frameset in Notes

Does anyone has an explaination?