Sbest Practices

8/13/2019 Sbest Practices

1/36

Sign in (or register)

English

IBM

Technical topics Evaluation software Community Events

Search developerWorsSearch dev Su!mit

"rint this page E#mail this page $igg %ace!oo Twitter $elicious &ined In Stum!leupon developerWors Technical topics &otus Technical li!rary

Taking your Domino applications tothe WebThis article provides a framework for analyzing your Notes application inpreparation for redeploying it as a Web application and offers tips andtechniques for making your applications shine on the Web.Comments

$avid $e'ean(ddeeandeean*com), Partner, DeJeans & Clemens

02 January 2001

Also available in'apanese Table of contents

More and more+ !eing a ,otes developer has to do with the development tools you use+

rather than the client software your application runs in* The We! !rowser has taen a

place !eside the ,otes client+ and applications originally created for ,otes clients must

!e rewored for !rowsers*
http://www.ibm.com/developerworks/dwwi/DWAuthRouter?m=loginpage&lang=en&d=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2Fhttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#SELECTLANGhttp://www.ibm.com/http://www.ibm.com/developerworks/topics/http://www.ibm.com/developerworks/downloads/http://www.ibm.com/developerworks/community/index.htmlhttp://www.ibm.com/developerworks/events/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/http://digg.com/submit?phase=2&url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.facebook.com/sharer.php?u=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&t=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://twitter.com/?status=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F%20-%20Taking%20your%20Domino%20applications%20to%20the%20Webhttp://delicious.com/post?url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.linkedin.com/shareArticle?mini=true&url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.stumbleupon.com/submit?url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.ibm.com/developerworks/http://www.ibm.com/developerworks/topics/http://www.ibm.com/developerworks/lotus/http://www.ibm.com/developerworks/lotus/library/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#icommentshttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#authorN10019mailto:[email protected]?subject=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.ibm.com/developerworks/jp/lotus/iris_today/20010102_3.htmlhttp://www.ibm.com/developerworks/jp/lotus/iris_today/20010102_3.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#togglehttp://www.ibm.com/developerworks/http://www.ibm.com/developerworks/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#SELECTLANGhttp://www.ibm.com/http://www.ibm.com/developerworks/topics/http://www.ibm.com/developerworks/downloads/http://www.ibm.com/developerworks/community/index.htmlhttp://www.ibm.com/developerworks/events/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/http://digg.com/submit?phase=2&url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.facebook.com/sharer.php?u=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&t=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://twitter.com/?status=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F%20-%20Taking%20your%20Domino%20applications%20to%20the%20Webhttp://delicious.com/post?url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.linkedin.com/shareArticle?mini=true&url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.stumbleupon.com/submit?url=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F&title=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.ibm.com/developerworks/http://www.ibm.com/developerworks/topics/http://www.ibm.com/developerworks/lotus/http://www.ibm.com/developerworks/lotus/library/http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#icommentshttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#authorN10019mailto:[email protected]?subject=Taking%20your%20Domino%20applications%20to%20the%20Webhttp://www.ibm.com/developerworks/jp/lotus/iris_today/20010102_3.htmlhttp://www.ibm.com/developerworks/dwwi/DWAuthRouter?m=loginpage&lang=en&d=http%3A%2F%2Fwww.ibm.com%2Fdeveloperworks%2Flotus%2Flibrary%2Fls-appstoWeb%2F


2/36

-elease . of $omino $esigner has made it much easier to develop ,S% applications

that wor well on the We!* /nd !y now there0s a significant !ody of e1perience with the

new features and functions of -elease .#and with the strengths and weanesses of

!rowsers as a development target*

This article provides a framewor for analy2ing your ,otes application in preparation for

redeploying it as a We! application* It then e1amines the different elements of the

application and offers tips and techni3ues for maing your applications shine on the

We!*

This article assumes an in#depth understanding of designing applications using $omino

$esigner as well as nowledge of &otusScript and 'avaScript*

Understanding the differences

Moving a ,otes application to the We! is not a simple matter of adding some 4TM&code to forms and views* The division of la!or in a ,otes application#what the $omino

server does and what the ,otes client does#is very different from the architecture of a

!rowser#!ased application* This is !ecause the capa!ilities of a ,otes client are very

different from a We! !rowser+ and the protocols the !rowser and server use to

communicate are very different as well*

-elease . uses 'avaScript and 'ava to translate ,otes client functionality to the !rowser

with fuller fidelity+ so that We! users can interact with action !ars+ -ich Te1t+ views+ and

other ,otes features in familiar ways* But there is still no We! functionality e3uivalent to

the ,otes $ocument 5!ect Model ($5M) and -emote "rocedure Call (-"C) protocol*

/ ,otes client can send instructions to the server to perform a tas and receive !ac

results that are refreshed within the current open form or document* This ind of

interaction is none1istent !etween a !rowser and server* /ll a !rowser can do is send a

re3uest to a server+ and all a server can do is send a complete page to a !rowser*

&imitations of the We! !rowser and the !rowser6server architecture are the !asis for

most of the pro!lems you must solve as you consider whether the functionality of your

application can !e delivered in a !rowser at all+ and if so+ how you might do it* Beyond

functionality+ there are other issues+ as well#performance of !oth the client and server+security and access+ and ease of use+ for e1ample*

Back to top

Getting ready to make the move
http://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#ibm-contenthttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#ibm-content


3/36

Before you can !egin reworing an application for the We!+ you need to e1amine what

you currently have and what you really need* There are three parts to completing a good

analysis of the application*

Re-evaluate basic assumptions

7our review of the application should !egin !y !eing as specific as possi!le a!out the

desired result+ and then wor its way !acwards* Start !y rethining the who#what#where

of your application in its new conte1t8

Who will the users of your application !e on the We!9 Will they !e

the same people who use it now in a ,otes client9 / completely new and

different set of users9 5r some of !oth9 Will the application run only on the

We!+ or will it serve a mi1 of We! and ,otes users9

What will !rowser users do with the application9 Will they need all

the functionality of the ,otes version or only part of it9 Will We!

deployment change the level of activity in the application+ with resulting

impact on server load9

Where will the We! users !e9 Will your application !e accessi!le on

a corporate intranet+ or is the goal to deliver it across the We! itself9 What

access levels will users need+ and are those appropriate for a We!

application9

Exercise the application

With the answers to these 3uestions in mind+ you can !egin to analy2e your application*

Start !y accessing your ,otes application in a !rowser* ,avigate through it as

completely as possi!le* Create and save new documents using the forms if you can*

&oo at the results and note errors* Then go !ac and compare the application in the two

maor !rowsers#e1ercise the application in the versions of Internet E1plorer and

,etscape ,avigator you would e1pect your users to use+ and note differences !etween

the two* $uring this hands#on evaluation+ you0ll !egin to spot pro!lems and issues as

well as discover some changes that will improve the application in general*

Review the application piece-by-piece

,ow you can !egin looing at the application piece#!y#functional#piece to see8

Whether the piece needs to wor on the We!

Whether it canwor on the We!

How it would wor on the We!


4/36

:eep those points in mind as you consider each category8

Forms

$oes each form loo accepta!le in the !rowser9 $o graphics display

properly+ fields and field la!els align9 /re there differences !etween the

!rowsers9 Could pro!lems !e solved !y creating separate forms orsu!forms for ,otes and We! users9 $o the forms contain &otusScript that

must !e replaced with 'avaScript for the !rowser9 /re e1isting agent

actions availa!le on the We!9 $o you need to rewrite !ac#end agents to

process 3uery strings or change them to scheduled agents9

Views

$oes each view wor on the We!9 $o all columns display9 Can you select

documents+ or do you need to provide additional code to create 4TM&

lins9 /re all the actions your application re3uires availa!le9 Data acquisition

Where does the data come from+ and how does it get into your

application9 Is it entered !y the users9 Is it drawn from other applications

or from !ac#end data sources9 Is it environmental data lie user names+

document I$s+ and server and data!ase names9

User interface and graphics

$oes the application0s user interface and graphic design meet user

e1pectations for a We! application9 $oes the application0s e1isting

navigation wor in a !rowser+ or do you need to add navigational choicesto compensate for the loss of ,otes client functionality9 $oes it need

anchors on the We! that it didn0t need in ,otes#a home page+ section

pages+ help pages9

Access and security issues

4ow will you !alance user access against system security9 Will your

application re3uire users to authenticate with the $omino server9 What

level of access will they re3uire9 If your application will run !oth in a ,otes

client and a !rowser+ does the security need to !e different for the differentclients9

If you0ve considered these 3uestions carefully+ you0ll have gone a long way toward

mapping out what needs to !e done to tae your ,otes application to the We!*

Back to top

Tips and techniques for forms


5/36

Trying out your forms in a !rowser may !e a frustrating e1perience at first+ !ecause you

are liely to see error messages rather than anything familiar* If that happens+ mae a

copy of the form and remove fields+ formulas+ and scripted events from it until the form

displays in the !rowser* Then !egin adding them !ac in+ checing to see that each one

wors in a !rowser and taing note of those that don0t*

There are many parts of a form that might not wor in a !rowser* %or e1ample+ ;/llow

values not in list; for eyword fields aren0t supported !y !rowsers* (There are

worarounds* %or e1ample+ the Iris Todayarticle ;We!ifying an e1isting ,otes

application+; includes an e1ample of how you can let a !rowser user add a eyword to a

multi#value field*)

Chec your application for functions and commands that don0t wor in a !rowser*

Those functions that don0t wor fall into three maor categories8

They wor only in the ,otes client interface* There are no !rowsercounterparts to $ialogBo1+ "iclist+ and "rompt+ for e1ample* /nd

several advanced mail#handling functions are uni3ue to the ,otes client+

such as MailSend and Is$ocBeingMailed*

The much simpler structure of We! views doesn0t support many

functions+ including $ocChildren+ $oc&evel+ $oc,um!er+

IsCategory+ or -esponses*

Many features associated with ,otes access+ preferences+ and the

worstation environment don0t carry over to a !rowser#Certificate+

Is/gentEna!led+ MailEncryptSaved"reference+ and


6/36

Internet E1plorer+ and still another for ,etscape ,avigator* There are many ways to do

this using multiple forms or su!forms+ selection formulas+ and hide#whens that identify

the user0s client and serve up the appropriate code for it*

In formulas+ you can use ClientType to identify the user0s client as ;,otes; or ;We!*; In

cases where you need to code around differences !etween the two maor !rowsers+ you

can use BrowserInfo to help you determine what the user is running*

The e1tent of the differences will affect your solution as well* 7ou may !e a!le to resolve

pro!lems with different versions of fields or formulas that are specific to the clients* If you

need to duplicate several fields+ you may find it easier to put them on su!forms+ or

create two versions of the same form* "erformance may !e a deciding factor8 computing

a single hide#when formula to display one of two forms is more efficient than computing

?@ hide#whens to display variant fields within a single form*

Hiding fields

If you can solve a pro!lem with two versions of a field formula+ one that wors in ,otes

and the other that wors on the We!+ then include !oth in the form and use the ;4ide

from ,otes64ide from We! !rowsers; selection in the %ield properties !o1 to display one

or the other8

Figure 1. Field hide properties

If you0re using the same form for !oth ,otes clients and !rowsers+ the ;4ide from

,otes64ide from We! !rowsers; attri!ute on an o!ect0s properties can !e very useful*

But don0t forget that hiddenhas a different meaning for each client* In ,otes+ hidden

fields are still present in the document and can !e used in scripted calculations* %ields

hidden from We! !rowsers+ on the other hand+ are cut out of the document !y $omino


7/36

!efore the page is served to the !rowser* The field contents are not availa!le to !e used

!y 'avaScript*

TipIf you want to mae fields invisi!le in a !rowser+ !ut eep their contents availa!le to

'avaScript+ don0t use the ;4ide from ,otes64ide from We! !rowsers; and don0t put

;typeAhidden; into the fields0 4TM& Body /ttri!utes o!ects* Mae sure that8

Their hide#when properties are set correctly for the ,otes client

;


8/36

from ,otes clients and the other from We! !rowsers*


9/36

/nother way to reduce the performance hit of opening a form when all you want to do is

to display a We! page is to put all the 4TM& code for the page into a field named 4TM&*

When $omino finds an 4TM& field on a form+ it sends the contents to the !rowser

without performing form checing or calculations* 7ou can also use 4TM& fields to get

large volumes of 4TM& into $omino data!ases*


10/36

Figure $. Form security properties

There are four reserved form names that can !e used to create customi2ed error

messages for !rowser users8 FF-eturn/uthentication%ailure+ F

F-eturn/uthori2ation%ailure+ FF-eturn$ocument$eleted+ and FF-eturneneralError*

%or more a!out these fields and how to use them+ see ;$isplaying a customi2ed error

message; in $omino . $esigner 4elp*

Agents and actions

"art of the process of architecting your application is deciding what needs to !e done !y'avaScript in the !rowser and what must !e done !y agents on the server* 5n the server

side+ you can run agents from We!Guery5pen and We!GuerySave events* /gents can

!e run from the We! !y Command(=Tools-unMacro>) or


11/36

This option can provide more security+ !ecause when a We! user tries to run an agent

with this property set+ $omino prompts the user for name and password and checs this

against the invoer0s rights in the data!ase /C&*

7ou can reference a


12/36

Set the /ction properties for each of the actions that should appear on the action !ar so

that they are included in the !ar in the proper order+ and if you want+ so that they havean icon8

Figure '. Action properties

With the applet+ We! users can see the same action icons that appear in the ,otes

client* They can scroll across the action !ar if it is wider than the screen* /ctions that

have drop#down menus in ,otes appear as a second row of smaller !uttons when the

user clics the main action*

Back to top


13/36

Tips and techniques for views

The default display of a view in a !rowser is functional+ !ut not very e1citing+ as this

e1ample shows8

Figure (. Default )iew in a *rowser

$omino renders the maor features of the view faithfully*


14/36

The page lets you add te1t and graphics+ and even a !acground image file* The generic

navigation graphics and lins are gone+ as well+ and you can replace them with your

own+ or put the page in a frameset and pair it with a navigator or an outline to provide

navigation*

The view displayed a!ove has !een further customi2ed* The twisties#those graphics that

indicate a category can !e e1panded or collapsed#have !een removed+ and the contents

of the right#hand column have !een made into hyperlins !y selecting ;Show values in

this column as lins; on the /dvanced ta! of the Column properties !o18

Figure ,. Ad)anced column properties

7ou can change the color of the twisties+ or mae them disappear completely fromindividual em!edded views !y writing a 'avaScript function called ;imagereplace; into

the form that carries the em!edded view* To recolor the twisties+ create two I% files+

5"E,*gif and C&5SE*gif+ and save them in your application as Image -esources* Copy

the 'avaScript for the imagereplace function into the 'S 4eader o!ect8function ima#ereplace()

$


15/36

for( i=% i


16/36

$esigner+ open the page in which the view is em!edded+ and then edit the Em!edded

iew properties8

Figure 11. m*edded )iew properties

The view applet supports multiple document selection* This allows you to move

applications to the We! that re3uire users to select a group of documents for processing

!y an agent* If you em!ed a view in a page+ you can create hotspots or !uttons that

su!mit the list of selected document I$s for processing !y an agent on the server* The

programming re3uired to do this depends on &iveConnect+ a capa!ility !uilt into Internet

E1plorer+ ,etscape ,avigator+ and the ,otes client* &iveConnect allows 'avaScript to

interact with components+ such as 'ava applets+ that are written in other languages* The

view applet+ lie the other $omino 'ava applets+ has an /"I that can !e addressed !y

'avaScript in your application*

(There are 4TM& solutions to selecting multiple documents+ too* See the Iris

Todayarticle ;Com!ining forms and views for friendlier We! applications ("art H); for an

ingenious implementation of chec!o1es or list !o1es in views*)

Create an action bar

If your application uses cascading menus for actions+ you0ll want to ena!le the action !ar

applet in the We! view or page* This applet puts your application0s actions into a row of

!uttons across the top of the 4TM& page+ as shown in the screen !elow* If there are

su!menus of actions+ the applet displays them as a row of smaller !uttons when a top#

level choice is cliced* See the/gents and actionssection under ;Tips and techni3ues

for forms; a!ove for more a!out ena!ling the action !ar applet*

Figure 1!. Action *uttons in a )iew
http://www.ibm.com/developerworks/lotus/library/ls-Combining_forms_and_views_Part2/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#Agents%20and%20actionshttp://www.ibm.com/developerworks/lotus/library/ls-Combining_forms_and_views_Part2/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-appstoWeb/#Agents%20and%20actions


17/36

Back to top

Tips and techniques for data acquisition

We! !rowsers impose limitations on all !ut the most !asic ind of fill#in#the#!lan data

collection from users* $ata types are restricted+ and things that ,otes developers and

users tae for granted+ lie -ich Te1t and file uploads+ re3uire much more attention*

-elease . adds many new features to mae data ac3uisition in a !rowser wor more lie

a ,otes client* If you have a -ich Te1t field in a form+ you can specify that when that

form is edited from the We!+ a 'ava editor applet !e called to support some of the

familiar -ich Te1t formatting conventions*

To ena!le a field for the 'ava editor applet+ set its We! /ccess property to ;$isplay


18/36

Many of the things ,otes users use -ich Te1t fields for+ lie pasting in graphics or

uploading files+ are not supported !y the applet#there is a separate file upload control

you must include in your form if that0s something you want to allow users to do* To insert

a file upload control into a form+ choose Create # Em!edded Element # %ile


19/36

,otes forms+ in contrast+ are much more fle1i!le and allow for intermediate results* 7our

application may use an $!&ooup formula to let the user choose a value from a list+

then use that value in other computations in the open form* This is not possi!le in a We!

!rowser* 7ou can appro1imate the same result !y having the user select the document

containing the value+ and then passing this document I$ to a server agent that loos up

the value+ performs the computations+ and writes a new 4TM& page+ which is sent to the

user*

CGI variables

,otes maes a great deal of environmental data easily availa!le to the developer* If you

want to identify the user you include


20/36

Tips and techniques for the user interface andgraphics

/s you move your application from the ,otes environment to the We!+ you will face two

challenges in the user interface design* 5n the one hand+ the !rowser0s lac of

counterparts for many ,otes features and functions may force you to lower your

e1pectations for ease of use+ if not actual reduced functionality* But on the other hand+

you have to meet We! users0 e1pectations for graphical design and visual impact if you

want your application to !e taen seriously* This will pro!a!ly re3uire wor on your

application0s graphics and navigation+ in particular*

The good news is that -elease . supports most of the advanced features of current

!rowsers+ so the more 4TM& and 'avaScript you now+ the more We!#lie your

application can !e* If you0ve !een impressed !y We! sites with layered interfaces !uilton $ynamic 4TM&+ for e1ample+ see the Iris Todayarticle ;Teach $omino ,ew We!

Trics with $4TM&;+ which shows you how to use $4TM& to create a layered interface

in a $omino application*

But you aren0t re3uired to now $4TM& to turn a ,otes application into a good We!

application* 7ou ust have to master some !asics and use them intelligently#and tae

advantage of -elease .0s a!ility to provide some visual appeal*

Use tables to control placement

Ta!les are the !est way to control the placement of elements in a We! page* If you have

any e1perience with 4TM&+ you0ll appreciate the pro!lems of getting elements such as

fields+ te1t+ and graphics to line up properly* "art of translating your application to a

!rowser will pro!a!ly involve putting these elements into ta!les on your forms to mae

alignment simpler*

5ne pro!lem with using ta!les to control page layout occurs if you place large -ich Te1t

fields in ta!le cells that are deeper than a single printed page* If you print the We! page+

cell content is truncated at the end of the first page* 5ne solution is to create a separate

form for printing the document without ta!les and giving the user a !utton in the ta!le to

switch to the form without ta!les*

TipBe careful a!out moving !ac and forth !etween versions of $omino $esigner*

5nce you have edited a form containing a ta!le in -. $esigner+ don0t re#edit it in an

earlier $esigner version or the ta!le can !e corrupted*

Validate user input data
http://www.ibm.com/developerworks/lotus/library/ls-dhtml/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-dhtml/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-dhtml/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-dhtml/index.html


21/36

If your application does sophisticated input validation using &otusScript+ much of it can

pro!a!ly !e transformed into 'avaScript to wor in a !rowser as long as it uses data

already in the document* If validation depends on e1ternal data#looups into other

documents or data!ases+ or the ac3uisition of document


22/36

If any of the data fields is empty+ its chec field is assigned an error message* /

temporary varia!le+ ,o"ro!lems+ aggregates the chec fields* If there are no empty

fields+ ,o"ro!lems has no length and the $o command saves the file and closes the

window* If any field is empty+ the $o instead e1ecutes the

Command(=iew-efresh%ields>) condition+ which maes the error messages visi!le8Figure 1'. Validation error message

This minimal validation lacs the elegance of scripting solutions that allow you to place

focus on the field that lacs input+ !ut it does allow you to serve the needs of the users

for feed!ac#and yields !etter+ more complete data with little effort on your part*

Graphics improvements in R5

-elease . maes maor improvements in the handling of graphics* 5ne of the most

important is native support for the two most widely used We! file formats+ '" and I%+

as Image -esources* When you import a file into a $omino -. application+ it is stored in

its format rather than converted to a proprietary format (which is what happened in

previous versions)* 7ou no longer need to worry a!out color palettes and une1pected

color shifts* 4owever+ this doesn0t wor if you paste the image+ only if you import it* %or

more information on graphics+ see the Iris Todayarticle ;The raphic Truth a!out

,otes;*

The image resource is a great improvement for managing graphics within your

application*


23/36

The image resource is a good e1ample of an easy way to use -elease . to mae your

application more We!#lie* $omino can automatically turn properly prepared image

resource files into rollover !uttons that change state when you mouse over them*


24/36

($omino does this automatically for image resources*) 7ou can also mae your

application more user#friendly !y adding alternate te1t that appears when an image can0t

or won0t !e displayed* In 4TM&+ write it into the image tag8""

%or image resources+ add te1t in the /lternate Te1t field on the Information ta! of the"icture properties !o1*

Navigation

We! applications typically need more ela!orate navigation !uilt into them than ,otes

applications !ecause !rowsers lac the !uilt#in navigation provided !y the ,otes menus*

-elease . adds several features that you can use*

The pro!lem with any We! application is that you need to separate its navigation as

much as possi!le from individual documents so that when its navigational structure

changes+ as it inevita!ly will+ the changes can !e made !y modifying as few documents

as possi!le* 5n pure 4TT" servers+ this can !e done with server#side includes or */S"

pages to com!ine a panel of navigational lins into documents as they are served to

users* In a $omino application+ a su!form can often perform the same role* 5r you may

em!ed an outline in a page or form*

5utlines are a new -elease . feature that you can use to create fle1i!le+ high#level

navigation across the areas of an application or a We! site* 5utline entries can !e

programmed with commands such as hide#whens so that a single outline can appear

differently in different areas of the application* /n outline0s appearance can also !e

tailored in each instance of its use* / 'ava applet is availa!le to mae outlines wor in a

!rowser as they do in a ,otes client* %or more information+ see the Iris Todayarticle+

;$omino $esigner -.8 The 5utline $esigner;*

Frames

%ramesets are often used to place a navigation pane ne1t to content* $omino $esigner

-. maes framesets easier to create with a graphical frameset designer* 7ou can si2e

your frames !y dragging them+ or set frame attri!utes such as si2e+ scrolling+ !order

colors and width+ and frame spacing in the %rame properties !o1*7ou can specify the contents of each frame in advance+ or have it computed when the

frameset is opened* The following %rame properties !o1 shows part of a formula that

computes the name of the navigator to display in the frame* %ormulas can control frame

content !ased on client type or CI varia!les including user name+ so you can write a

display formula !ased on user roles*

Figure 1,. Frame properties
http://www.ibm.com/developerworks/lotus/library/ls-The_Outline_Designer/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-The_Outline_Designer/index.html


25/36

7ou can set a frameset to launch automatically when a data!ase+ form+ or page opens*

%or more on framesets+ see the Iris Todayarticle ;$omino $esigner -.8 %ramesets;*

%ramesets and navigators are an easy way to develop consistent navigation for a site+

!ut remem!er that users often find framesets confusing !ecause it is often hard to

reverse direction and navigate !ac along a path you have followed in a frameset*


26/36

If your application is aimed at giving We! users read#only access to information+ it can

wor well with /nonymous access set to -eader* 'ust remem!er that this may limit

users0 a!ility not only to create+ edit+ and delete documents+ !ut to run agents that

create+ edit+ and delete documents*

If you would lie to limit users to one level of access from the We!+ while allowing them

their customary access from a ,otes client+ you can use the ;Ma1imum Internet name J

password; setting on the /dvanced ta! of the /C&* It0s a drop#down list+ as shown in the

screen !elow8

Figure !-. A"# Ad)anced settings

If you set the access level for your application to -eader here+ for e1ample+ all We!users will !e restricted to -eader access+ even though they might have /uthor or Editor

access when they access the application from a ,otes client*

For maximum security, use Readers fields

The !est way to restrict access to documents in your application is to place restrictions

in the form that creates the documents* 7ou can do this in two ways#!y editing the

settings on the Security ta! of the %orm properties !o1+ or !y placing a -eaders field on

the form itself* Enter the names of individuals+ groups+ and roles that should !e a!le to

see the documents+ and no!ody else will !e a!le to open the documents or even see

them listed in views*

The choice of whether to use property settings or fields is up to you* Both have

advantages* alues entered in a -eaders field are com!ined with the properties list* It is

easier to use the properties setting as you create or edit the form+ !ecause the selection

dialog !o1 does a looup in the $omino $irectory* If you use a -eaders field+ you can


27/36

compute its value when the document is created+ and use $omino administration to

modify or update some or all of the -eaders fields in a data!ase at once*

/nother option is to limit what0s displayed in the views in your application* This wors

only with em!edded viewsK you can restrict the displayed contents of the view to a single

category !y opening the page or form that holds the em!edded view in $esigner and

selecting ;Show single category; on the 5!ects ta! of the "rogrammers pane+ as this

screen detail shows8

Figure !1. 2*3ect pane

Then in the Script area of the "rogrammers pane+ enter the name of the category or

write a selection formula that evaluates to a category name* 7ou can use this techni3ue

to display documents only to their authors or only to mem!ers of specified groups* %or

e1ample+ the following formula displays the appropriate category to users who are

mem!ers of one of four groups#/dmin+ Sales+ 4-+ or IS8@If(@7ontains(@Hser5oles"2dmin")"2dmin"

@If(@7ontains(@Hser5oles"!ales")"!ales"

@If(@7ontains(@Hser5oles"5")"5"

@If(@7ontains(@Hser5oles"I!")"I!"

""))))

5ne final fillip8 if the formula evaluates to an asteris+ all categories are displayed* Thismeans that you can show the entire view to some users and restrict it for others+ or !y

using ClientType+ you can create a view that will display only a single category in a

!rowser+ !ut its entire contents in a ,otes client8@If(@7lientType = "Ae?""Newsflash""J")

Back to top


28/36

Help is at hand

Most of the challenges you face in converting ,otes applications to We! applications

involve finding ways to mae things ,otes does wor in a !rowser* If you0re a ,otes

developer who0s ust !eginning to wor on applications for the We!+ places to start

looing for answers are close at hand8

The $omino . $esigner 4elpis a great source+ not only of

information !ut of e1amples that can show you how things are done*

7ou can chec out the Iris Sand!o1+ a li!rary of downloada!le

applications and code samples on ,otes*net*

$on0t forget the ,otes6$omino old -elease %orumon ,otes*net*

Many of the tips and ideas in this article first appeared there* enerally+ if

you can0t find the answer in the forum+ all you have to do is as the

3uestion*

/nd Iris Todayhas a num!er of relevant articlesK chec out the

archives or perform a full#te1t search for the topic that interests you* If

you0re ust moving to -elease . from a previous version of ,otes+ $omino

$esigner -. Technical 5verviewand $omino -. Technical 5verview+ and

the articles they are lined to+ are good places to start*

%or more on -. !est practices+ you can download the &otus ,otes

and $omino /pplication $evelopment Best "ractices uide*

This article+ along with these resources+ should tae you a long way toward the

successful migration of your ,otes application to the We!*

Resources &otus ,otes and $omino /pplication $evelopment Best "ractices

uide

We!ifying an e1isting ,otes application

Com!ining forms and views for friendlier We! applications ("art H)

Teach $omino ,ew We! Trics with $4TM&

The raphic Truth a!out ,otes

$omino $esigner -.8 The 5utline $esigner

$omino $esigner -.8 %ramesets

$omino $esigner -. Technical 5verview

$omino -. Technical 5verview
http://www-10.lotus.com/ldd/notesua.nsf/find/designerhttp://www.lotus.com/ldd/sandbox.nsfhttp://www-10.lotus.com/ldd/46dom.nsf?OpenDatabasehttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Technical_Overview/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Technical_Overview/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Domino_R5_Technical_Overview/index.htmlhttp://www.lotus.com/bpghttp://www.lotus.com/bpghttp://www.lotus.com/bpghttp://www.lotus.com/bpghttp://www.ibm.com/developerworks/lotus/library/ls-Webifying_Notes_applications/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Combining_forms_and_views_Part2/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-dhtml/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Graphic_Truth/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-The_Outline_Designer/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Framesets/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Technical_Overview/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Domino_R5_Technical_Overview/index.htmlhttp://www-10.lotus.com/ldd/notesua.nsf/find/designerhttp://www.lotus.com/ldd/sandbox.nsfhttp://www-10.lotus.com/ldd/46dom.nsf?OpenDatabasehttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Technical_Overview/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Technical_Overview/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Domino_R5_Technical_Overview/index.htmlhttp://www.lotus.com/bpghttp://www.lotus.com/bpghttp://www.lotus.com/bpghttp://www.lotus.com/bpghttp://www.ibm.com/developerworks/lotus/library/ls-Webifying_Notes_applications/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Combining_forms_and_views_Part2/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-dhtml/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Graphic_Truth/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-The_Outline_Designer/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Framesets/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Designer_R5_Technical_Overview/index.htmlhttp://www.ibm.com/developerworks/lotus/library/ls-Domino_R5_Technical_Overview/index.html


29/36

Using 4T5# on a page6 form6 or su*form

There are a num!er of ways you can include 4TM& on a page+ form+ or su!form when you are designing* If you have e1isting 4TM& or you prefer touse 4TM& instead of the formatting tools IBML&otusL$ominoL$esigner offers+ you have the following options8

Convert a page+ form+ or su!form (or sections of the page+ form+ or su!form) to 4TM& and use the 4TM& editor to change the 4TM&*

Import 4TM&+ thus using the source of an e1isting We! page or form as the !ase of a new page or form* $esigner renders the imported

4TM& on the page+ form+ or su!form already translated from 4TM&*

"aste 4TM& directly on a page+ form+ or su!form* The 4TM& stays in 4TM& format*

Enter 4TM& directly on a page+ form+ or su!form* The 4TM& stays in 4TM& format*

To con)ert pages6 forms6 or su*forms into 4T5#

7ou can convert some or all of the contents of a page+ form+ or su!form into 4TM& source code and then use the 4TM& editor to mae changes to the4TM& source code*

* 5pen a page+ form+ or su!form in $esigner*H* Select the contents of the page+ form+ or su!form that you want to convert to 4TM&*?* Choose Edit # Convert to 4TM&* The selected contents are converted into 4TM& source code*

Because not everything in ,otes has an e1act e3uivalent in 4TM&+ the conversion to 4TM& is an appro1imation* 7ou should alwayschec your conversion results*

If you mistaenly convert something to 4TM&+ choose Edit #


30/36

O* /t the Info ta!+ chec ;-ender pass through 4TM& in ,otes*;

When you chec ;-ender pass through 4TM& in ,otes+; IBML&otusL$ominoLpasses all data on the page+ form+ or su!form directly to the !rowser*$omino ignores em!edded navigators and folders and any em!edded views that don0t have ;-ender pass through 4TM& in ,otes; selected*

To include some 4T5# on a page6 form6 or su*form

If you do not want the entire page+ form+ or su!form treated as 4TM&+ you can include some 4TM& on the page+ form+ or su!form and mar this te1tas 4TM&* $esigner serves it correctly to the !rowser*

* Enter or paste 4TM& on the page+ form+ or su!form*H* Select the te1t and choose Te1t # "ass#Thru 4TM&*

7ote "ages+ forms+ or su!forms containing pass#thru 4TM& may display differently in the ,otes client than on a !rowser* %or e1ample+ if you createnested ta!les !y using pass#thru 4TM&+ the ta!le may contain more white space when displayed in the ,otes client than when displayed in a !rowser*

8lanning a traditional 7otes and /e* application

If you are planning an application that users will access via an IBML&otusL,otesLclient or via a We! !rowser+ you will need to do some design worto tailor your application for each platform* %or e1ample+ a navigation structure that is suited for a ,otes client application may not !e the !est choicefor a We! application* When you design an application for !oth ,otes and We!+ a!out R. of your design will !e suita!le for !oth clients+ and theremaining . will re3uire some modification* 4ere are some issues to consider when planning an application for ,otes and We! users8

Understanding the differences

The division of la!or in a ,otes application ## what the IBML&otusL$ominoLserver does and what the ,otes client does ## is very different from thearchitecture of a !rowser#!ased application* This is !ecause the capa!ilities of a ,otes client are very different from a We! !rowser+ and the protocolsthe !rowser and server use to communicate are very different as well*

$omino uses Sun Microsystems 'avaNand 'avaScriptNto translate ,otes client functionality to the !rowser with fuller fidelity+ so that We! users caninteract with action !ars+ rich te1t+ views+ and other ,otes features in familiar ways* But there is no We! functionality e3uivalent to the ,otes$ocument 5!ect Model ($5M) and -emote "rocedure Call (-"C) protocol* / ,otes client can send instructions to the server to perform a tas andreceive !ac results that are refreshed within the current open form or document* This ind of interaction is none1istent !etween a !rowser andserver* /ll a !rowser can do is send a re3uest to a server+ and all a server can do is send a complete page to a !rowser*

&imitations of the We! !rowser and the !rowser6server architecture are the !asis for most of the pro!lems you must solve as you consider how toserve one application to ,otes client and We! !rowser users*

Tips for designing /e* applications

$ata!ases viewed from a We! !rowser may loo somewhat different than they do when viewed from the IBM L&otusL,otesLclient* Browsers renderdesign elements with slight differences* Be sure to preview your data!ase through each !rowser that will access it so that you can mae adustmentsto your design* /lso+ for data!ases that will !e accessed through We! !rowsers+ it is !est to8

Mae sure the data!ase is in the IBML&otusL$ominoL$ata directory or a su!directory of the $ata directory*

/dd formactions*such as Create+ Edit+ and Save*

%or more information+ see ;/ctions; in the chapter ;/utomation in /pplications; later in this !oo*

/void usingfeaturesthat aren0t supported in We! /pplications*

-efer to the appendi1 ;%eatures to /void


31/36

Chec the /ccess Control &ist (/C&) setting to mae sure it allows appropriateaccess for Internet users*

%or more information+ see ;Setting up data!ase access for Internet users*;

"revent users from accessing forms and views in a We! application !y selecting the data!ase property;$on0t allow


32/36

Domino field properties that are not supported onthe /e*

/void using the following field features in a We! application*

Notes/FX fields Comments

Field Info properties

2ompute )fter Validation

&ive this field default focus

Control properties

$ptions Displa- entr- helper button is not supported.

Advanced properties

"elp description

0nable encr-ption for this field Web users cannot read data in encr-pted fields.

Sign if mailed or saved in section

Names fields/Control properties

2hoices !for 3ames fields# 4(se )ddress dialog for choices,4 4(se )ccess

2ontrol ist for choices,4 and 4(se View dialog for

choices4 are not supported. Web user access to

databases is based on the authenticated name.

Check o! fields

2hec5 box selection order For some browsers, the order of the data returned

from multiple selections in a chec5box ma- be

different from the selection order. The data itself

remains the same, but the order returned is

different.

"ich te!t lite fields

'ich text lite fields 'ich text lite fields are not available on the Web.

(se rich text fields.

9elated topics

Domino form properties that are not supported onthe /e*

/void using the following form features in a We! application*


33/36

Form Info properties Comments

Versioning

)non-mous forms

+erge replication conflicts

Store form in document 0dit

mode

'ead mode is supported, but do not use for

documents that need to be created or edited on the

Web.

Disable field exchange

)utomaticall- refresh fields

#efaults properties

$n 2reate% nherit entire selected

document into rich text field 4asin54 and 4as 2ollapsible rich

text4

4nherit entire selected document into rich text field

4as rich text4 is supported. The documents mustreside in the same database and the database

propert-, 4Web )ccess% (se 6avaScript when

generating pages4 must be selected.

$n $pen% Show context pane

Security properties

Default encr-ption 5e-s 3ot applicable to Web.

Disable printing1

forwarding1cop-ing to clipboard

Form elements

a-out regions (se tables to align form components instead.

Popup hotspots

)ctive7 components, $0, and

$27 ob8ects

3ot supported on +acintosh, (37, and $S19

platforms. Supported for displa- on Windows 3T

and Windows :; platforms, but users can


34/36

Feature Comments

PassThru "T+

View Info properties

2alendar views 2alendar views are not supported. The "T+2alendar view will be generated even if view

applet is selected.

Options properties

$n 'efresh 3one of the 4on refresh4 options are supported.

Style properties

(nread rows color

*eveled headings

ines per heading

Shrin5 rows to content

'ow spacing

Advanced properties

'efresh index

Discard index

(nread mar5s

For $D*2 )ccess

)ctive in5

(nvisited in5

Visited in5

'estrict initial index build to

designer or manager

Font properties The available fonts are limited to a subset of fonts

supported b- 6ava.

$itle properties

Font The available fonts are limited to a subset of fonts

supported b- 6ava.

Advanced properties


35/36

Show values in this column as

lin5s

9elated topics

Domino hori:ontal rule properties that are notsupported on the /e*

/void using color rules in a We! application* radient color is not supported on the We!*

Domino ta*le properties that are not supported onthe /e*

/void using the following ta!le features in a We! application*

$ale %ayout properties 2omments

2olumn spacing This propert- is not supported in Web applications,

but ma- affect the Width propert- of a cell, which

is supported on the Web.

+inimum height

'ow spacing

Table Width 4Same as window4 setting is ignored in a Web

application.

Cell &orders properties

2olor 2olor settings for cell borders are not supported on

the Web

2ell *order St-le The st-le options, 'idge and &roove, are not

supported on the Web.

2ell *order Thic5ness *order thic5ness settings greater than > are not

supported.

$ale/Cell &ack'round

properties

St-le Solid is the onl- color option supported on theWeb. &radients will appear as the first color.

$ale &orders properties

*order st-le Determined b- individual cell borders.

*order color The table color is used.


36/36

*order effects Width is not supported.

Thic5ness

$ale (ar'ins properties

eft

'ight

Table wrap

2ompatibilit-

$ale "ows properties

Show onl- one row at a time 4Switch rows ever- n milliseconds4 and

4transitions4 are not supported.

9elated topics

Documents

Sbest Practices