You are on page 1of 28

®

A Closer Look at XPages in IBM Lotus Domino


Designer 8.5

Ray Chan
Advisory I/T Specialist
Lotus, IBM Software Group

© 2008 IBM Corporation


IBM Software Group | Lotus software

Agenda

 XPage overview
 From palette to properties: Controls, Ajax & Localization
 Look and feel: CSS & Themes
 Where's the logic? Events, simple actions, JavaScript and more
 Measure twice,IBM Software
cut once: Group
Custom | Lotus
controls
 It's a wrap software

2
IBM Software Group | Lotus software

XPages – A Big Leap Forward


 Visual Web page construction
– Advanced U/I controls
– Drag and drop development

 Instant Application Development


– XML markup withIBM
sourceSoftware Group | Lotus
– Full control of HTML
software
– Business logic using JavaScript
– Presentation using CSS
– Skinning using themes
 Leverages existing NSF assets
– Web agents, formulas, security,...

3
IBM Software Group | Lotus software

XPages – What is it?


 A new Domino design element
 A runtime designed to generate modern Web applications
 Pure XML markup, defining:
– Controls, data sources, business logic, custom controls

 Solves age-old limitations expressed by the Domino community


IBM Software Group | Lotus
– UI/Data separation, HTML generation control, server state, localization,
extensibility … software
– Capable of targeting multiple clients

 Highly extensible runtime and design time


 Standards-based technology: JSF
 Full integrated into Domino Designer 8.5
– Visual Design Page, Source Page, Control Palette, Outline View etc

4
IBM Software Group | Lotus software

XPage Prerequisites

 Installation and configuration


– XPage runtime is installed by default
– If doing custom install, make sure its checked
– HTTP task must be running
 Skills IBM Software Group | Lotus software
– Knowledge of Domino object model
– HTML, CSS, XML and JavaScript are very beneficial but you can
built an application without them
– Question = Do I need to learn Java?
– Answer = NO!

5
IBM Software Group | Lotus software

XPage Security

 XPages use agent security model.


 Settings for Xpage application access
– XPage signer must have explicit
access to server or select users
listed in all trusted directories.
IBM Software
– Other settings which likely Group | Lotus software
require XPage design element
signature to be added

 XPage Web user access


– Standard Domino Web authentication applies

See Xpage User Guide: Designing with XPages \ Creating XPages \ Signing XPages

6
IBM Software Group | Lotus software

Agenda

 XPage overview
 From palette to properties: Controls, Ajax & Localization
 Look and feel: CSS & Themes
 Where's the logic? Events, simple actions, JavaScript and more
 Measure twice,IBM Software
cut once: Group
Custom | Lotus
controls
 It's a wrap software

7
IBM Software Group | Lotus software Controls
palette
XPages in Domino Designer 8.5

XPage
design
element

IBM Software Group | Lotus


software
Optional source
mode
Scripting & Simple
Actions

Custom Controls
palette

Outline Property
sheets 8
IBM Software Group | Lotus software

XPage Controls
 Extensive palette of pre-built controls
– All the basic controls and containers
expected for developing Web 2.0 apps
 Two categories of controls
– Core – single entities used in XPage or custom control
IBM Software Group | Lotus software
– Container – more complex and contain other controls
 Extensible palette of controls
– Custom controls
– More on that later...

9
IBM Software Group | Lotus software

XPage in 5 min Demo

IBM Software Group | Lotus software


IBM Software Group | Lotus software

Built-In AJAX Support

 AJAX partial page refresh


– Available on any event
– Pre-built on View Pager
 AJAX Typeahead
– Add behavior to any edit control
IBM Software Group | Lotus
– Content can be returned through a simple
software
formula in the page
• No need to write a separate service
 Dojo is provided as the client side library
– Will share some common controls with the
“classic” Web applications

11
IBM Software Group | Lotus software

Partial Update Demo

IBM Software Group | Lotus software


IBM Software Group | Lotus software

CSS Support

 All look and feel is driven by CSS


– Enforce consistency between applications
– Help solving accessibility issues (Section 508 compliant)
 XPages feature global references to CSS files

IBM Software Group | Lotus software

 Style classes and inline styles can be applied per control

13
IBM Software Group | Lotus software

CSS Skinning — Themes

 Allows an application to pick up a look and feel without touching the actual
application code
– Default styles are applied to controls without any explicit style set per
control – every property can be set
– Skinning can be disabled per application/control
IBMbetween
– Association Software
controlGroup | Lotus
done through software
a “Theme”

– Defined at different levels: server or application


• Stored in a shared database
– Easily customizable by a developer and/or an administrator
14
IBM Software Group | Lotus software

Switch from this

IBM Software Group | Lotus software


IBM Software Group | Lotus software

To This... In seconds, the flexibility and agility of “Themes”

IBM Software Group | Lotus software


IBM Software Group | Lotus software

Apply Theme Demo

IBM Software Group | Lotus software


IBM Software Group | Lotus software

Application Properties

 XPages tab
Localization
GZip support

IBM Software Group | Lotus software

18
IBM Software Group | Lotus software

Localization Demo

IBM Software Group | Lotus


software
IBM Software Group | Lotus software

Agenda

 XPage overview
 From palette to properties: Controls, Ajax & Localization
 Look and feel: CSS & Themes
 Where's the logic? Events, simple actions, JavaScript and more
 Measure twice,IBM Software
cut once: Group
Custom | Lotus
controls
 It's a wrap software

20
IBM Software Group | Lotus software

Supported Languages
 JavaScript
– On the Client
– On the Server
• Access to back-end classes, @function support
• Global objects
• Extended API for i18n, XPages data...

IBM Software Group | Lotus
Server Side state: application scope, session scope & request scope
 Simple Actions software
 Java
– Adding a Java class/library to an NSF
– JavaScript/Java bridge
– JSF managed beans – Using EL

21
IBM Software Group | Lotus software

XPages Events Model


 XPages events
– Page events
– Control Events
– Data sources events
– Computed Properties – Data binding
IBM Software Group | Lotus
software
 Server side JavaScript Libraries

 Validating data
– Validation can occur on the client and on the server
– The predefined validators
– Creating custom validators
22
IBM Software Group | Lotus software

Leveraging Existing Business Logic

 Forms
– Default Values
– Validation Formulas

 Views IBM Software Group | Lotus


– The query engine software

 Agents
– Calling an agent (LotusScript)

23
IBM Software Group | Lotus software

Custom Controls

 Made by assembling existing controls


 Behave exactly as native controls
 Appear in the Control palette
 Define their own set of properties
IBM Software
– Hierarchical properties, Group
with custom | Lotus
editors
– Editable areas software
 Can be used
– As reusable UI assets (ex: an address control, a toolbar...)
– As a way to share some layout (ex: common page layout)
 Can be shared through templates (NTF) as any other design
element

24
IBM Software Group | Lotus software

Agenda

 XPage overview
 From palette to properties: Controls, Ajax & Localization
 Look and feel: CSS & Themes
 Where's the logic? Events, simple actions, JavaScript and more
 Measure twice,IBM Software
cut once: Group
Custom | Lotus
controls
 It's a wrap software

25
IBM Software Group | Lotus software

XPage - Help

 Accessed from menu

 Two reference guides

IBM Software Group |F1Lotus


for software
context
sensitive
help

26
IBM Software Group | Lotus software

Resources
 New XPage Tutorial
 Use instead of one in public
betas kits
 Will ship with Designer
 Learning objectives
 Set up and view an application
containing XPage elements
 Create an XPage
 Add controls to an XPage
 Bind data to an Xpage
 Add navigation to an Xpage Download new XPage Tutorial here
 Create a custom control
 Use advanced binding and scripting
 No need for server – use Designer preview in Web browser

* 27
IBM Software Group | Lotus software

Resources Continued

 Discussion 8.5
– Coming soon to Lotus Greehouse
– https://greenhouse.lotus.com
 XPages articles and examples
IBM Software Group | Lotus
– http://www.thenorth.com/northern.nsf/html/XpagesArticle
– http://www.jmackey.net/ software
– http://www.lotus911.com/nathan/escape.nsf/d6plinks/NTFN-
7FRG79

28