Xpages, cosa ci sarà in questa nuova tecnologia

Xpages Cosa ci sarà in questa nuova tecnologia

Autore: Daniele Grillo

Professione: Domino Developer

domino point day2009

2

•Cosa sono le Xpages

•Da dove arrivano

•Componenti fondamentali

•Linguaggio di sviluppo ( Client Side / Server Side)

•Esempio Applicazione ( Catalog.nsf)

•Utilizzo in locale ( novità della 8.5.1)

•Suggerimenti

•Cosa ci aspetta per il futuro?

Agenda


Cosa sono le Xpages

• Un componente aggiuntivo di Lotus Designer

• Un framework di sviluppo basato su componenti ( come i più

comuni linguaggi visuali di programmazione)

• Tecnologia JSF ( java server faces)

• Sfruttano il back-end dei dati Lotus Domino (per ora...)

• Una soluzione Easy per lo sviluppo di applicazioni Web

• Estensione engine HTTP di Domino

• Nascono con la R 8.5 ( meglio usarle nella 8.5.1)

3


4

Xpages Dojo Dojo +


Modello MVC

Le Xpages utilizzano il concetto di Model View Control

• L’MVC è la separazione della base dati, dalla logica applicativa di

un’applicazione e dall’interfaccia .

• Impone al programmatore ( ed è un bene) a separare

nettamente la logica applicativa dall’interfaccia e i dati.

• E’ Più facile mantenere nel tempo l’applicazione

• E’ un concetto...

5


MVC a confronto

6

Model

Sono le Form di Notes

( per ora)

Model


( per ora)

View

Sono le Xpages

View

Sono le Xpages

Control Javascrip ( server-side + front side)

Control Javascrip ( server-side + front side)

XPAGES

Model


Model


View Sono le Form, Viste, Navigatori,

Frameset, Pages, Agent

View Sono le Form, Viste, Navigatori,

Frameset, Pages, Agent

Control

Lotusscript + @formulas

+Agenti

Control

Lotusscript + @formulas

+Agenti

DOMINO CLASSICO


Da dove arrivano

• Progetto IBM Workplace nato nel 2002 ed

abbandonato nel 2007

• Xpages sono la Lotus Component Designer

• Component Designer Runtime diventa XSP

Runtime

7


Da cosa sono composte

• Controlli ( Core, Container, Altri)

• Componenti ( blocchi di codice riutilizzabili,

concetto simile alle sub.form)

• Sorgente dati ( per ora Form di domino e

viste)

• Altro ( CSS, codice X/HTML aggiuntivo, JS)

8


I Controlli

9

Oggetti già pronti all’uso

che si inseriscono nella

Xpages con semplici

trascinamenti sulla

pagina ( drag&drop)


Controlli personalizzati

10

Rappresentano

blocchi applicativi

riusabili.

Esempio: Footer,

Header..etc..


Sorgente dati

11

Rappresenta la

sorgente dati alla

quale ci si collega

per gestire il

binding dei dati

dalla Xpages al

back-end.

Il bindig è l’associazione con la sorgente dati....non è

più “ovvia” la relazione FORM/CAMPO


Codice X/HTML nel sorgente XML

12


I TEMI

Meta fogli di stile che vengono applicati al

rendering delle xpages prima che vengano

applicati i fogli di stile delle stesse.

Prima ancora di essere mandato al browser viene

applicato il tema che può eseguire codice JSS

per decidere cosa servire...esempio in base

Browser utilizzato nell’header di una richiesta

13


14


Variabili Scope

Permettono finalmente di utilizzare variabili d’ambiente senza utilizzare campi,

documenti profilo o workaround vari (cookies etc..)

• SessionScope: variabili di sessione validi per ogni sessione istanziata da ogni

utente collegato ( vive all’apertura della sessione e muore alla chiusura)

• ApplicationScope variabile globale fin tanto che è aperta l’applicazione è

globale a qualunque sessione utente

• ViewScope variabile valida localmente nella componente View corrente

• RequestScope variabile che esiste per la pagina corrente

15


3 elementi...

• View Component

• Repeater Component

• Core Component

16


View Component

• Ha le funzioni 1:1 vista Domino ( checkbox,

ordinamenti, valori)

• E’ personalizzabile

• Ha diverse proprietà per effettuare ricerche,

filterbyCategory

• Ha un pager di navigazione personalizzabile

• Valore colonne programmabili dinamicamente

17


View Component

18


Repeater Component

Un componente (fantastico! N.d.r) che può scorrere i seguenti

oggetti ( come un ciclo FOR)

• Viste

• DocumentCollection

• Array (es. La risultante di una @dbcolumn)

• Vettore (un elemento a dimensione dinamica )

n.b. La variabile del repeater è case sensitive, e dobbiamo stare

attenti a generare il codice HTML corretto in funzione del repeat

19


Repeater Component

20


Core Component

21

Nome Componente Binding Domino

EditBox Text/Number Field

Date Time Picker Date Time Field

Label Computed Text

RichText RichText Field

File Upload RichText Filed

File Download RichText Field

ListBox ListBox Field

CheckBox CheckBox Field

RadioButton RadioButton Field

Button Button


Core Component

22


Come agire sui controlli...

23

In tutte le proprietà di un componente programmabili ( se appare un rombo azzurro a

fianco della proprietà allora è possibile manipolare la stessa) è possibile agire con JSS

(javascript server side) per manipolare per esempio:

• Visibilità

• Default Value

• URL ( componente link o immagine)

• e tutte le proprietà programmabili


JSS ( javascript server side)

Non stravolge il modo di programmare Lotus, in quanto sono state messe a

disposizione tutte le classi Domino (identiche a quelle LotusScript) e oltre il

90% delle @formulas con la stessa nomenclatura di metodi e proprietà!

Inoltre JSS da la possibilità di utilizzare estensioni Java

(Esempio: John Mackey ha utilizzato la libreria JDBC per mettere insieme DB

relazionali insieme ai dati Domino sulla stessa pagina)

24


Demo – catalog.nsf

Obiettivo: Un catalogo delle applicazioni alimentato dai BP

accreditati consultabile dagli utenti web

Ruolo BP: Avere un pannello di controllo per inserire nuove

applicazioni

Ruolo Utente: Accesso anomimo che sfoglia le applicazioni per

categoria o per data

25


26


Demo Live!

Link Applicazione

27


Da cosa è composta

28

Lato Domino ( back-End)

- FormBP

- Form Applicazione

- Form Configurazione

Lato Xpages ( front-End)

- HomePage

- ApplicationByCategory

- BusinessPartner

- Application


29

BP type

CodeBP [text]

NameBP [text]

AddressBP [text]

CapBP [text]

CityBP [text]

ReferenceB

P

[text]

URL Web

Site

[text]

LogoBP [richtext]

Username [names]

Application type

CodeBP [text]

ApplicationDate [date/time]

ApplicationName [text]

ApplicationCategory [listbox]

ApplicationDescription [richtext]

ApplicationLogo [richtext]

ApplicationScrenShot [richtext]

ApplicationBrochure [richtext]

1:n

Ogni Bp registrato potrà inserire N applicazioni nel sistema

Pagina di partenza + layout

30

4 Custom Control collegati:

BannerDojo

MenuBar

ViewHomePage

FooterApplication

4 Custom Control collegati:

BannerDojo

MenuBar

ViewHomePage

FooterApplication

<div id="content">

<div id="header">

</div> 

<div id="menu">

</div> 

<div id="wrapper">

<div id="menusx">

MENU ACTION

</div> 

<div id="centerbody">

BODY OUTPUT

</div> 

</div> 

<div id="footer">

FOOTER

</div> 

</div> 

Template html


31


32

Output

Xpages

Output

Xpages

Code Source Code Source


InitApplication ( Homepage.xsp)

33


Login Dojo ( Controllo)

34


35


36


Come funziona Ajax login...

Esempio proposto da Jake Howlett blogger di CodeStore e codice

scritto da Declan Lynch nel suo tutorial delle Xpages.

Utilizza la dijit.Dialog di Dojo per la finestra di inserimento delle

credenziali

Effettua una chiama xhr.Post di Dojo ( ajax posting) per inviare le

credenziali

37


38


Layer nascosto into source code...

39

<div dojoType="dijit.Dialog" id="loginDialog" title="Effettuare il login"

execute="dominoLogin(arguments[0]);" style="display:none">

<table>

<tr>

<td>

<label for="username">Username:</label>

</td>

<td>

<input dojoType="dijit.form.TextBox" type="text" name="username"

id="username" />

</td>

</tr>

<tr>

<td>

<label for="password">Password:</label>

</td>

<td>

<input dojoType="dijit.form.TextBox" type="password" name="password"

id="password" />

</td>

</tr>

<tr>

<td colspan="2" align="center">

<input dojoType="dijit.form.TextBox" type="hidden" name="RedirectTo"

id="RedirectTo" value="/icons/view.gif" />

<button dojoType="dijit.form.Button" type="submit"> OK</button>

</td>

</tr>

</table>

</div>

<div dojoType="dijit.Dialog" id="loginDialog" title="Effettuare il login"

execute="dominoLogin(arguments[0]);" style="display:none">

<table>

<tr>

<td>

<label for="username">Username:</label>

</td>

<td>

<input dojoType="dijit.form.TextBox" type="text" name="username"

id="username" />

</td>

</tr>

<tr>

<td>

<label for="password">Password:</label>

</td>

<td>

<input dojoType="dijit.form.TextBox" type="password" name="password"

id="password" />

</td>

</tr>

<tr>

<td colspan="2" align="center">

<input dojoType="dijit.form.TextBox" type="hidden" name="RedirectTo"

id="RedirectTo" value="/icons/view.gif" />

<button dojoType="dijit.form.Button" type="submit"> OK</button>

</td>

</tr>

</table>

</div>


40

var a="<a

href=\"javascript:dijit.byId(\'lo

ginDialog\').show()\">Log in

Ajax</a>";

return a;

var a="<a

href=\"javascript:dijit.byId(\'lo

ginDialog\').show()\">Log in

Ajax</a>";

return a;


Colonna dinamica in una vista

41

Il logo e le informazioni del BP di una particolare

applicazione viene tirato su dinamicamente

eseguendo codice JSS di esempio


Codice colonna

42


43

Proprietà

CategoryFilt

er

Proprietà

CategoryFilt

er

ViewScope ViewScope


Validare i campi

44

E’ tutto più facile con i componenti


Debug applicazione...

45

Per avere un debugger verboso e non il classico errore 500 ...


Novità con la 8.5.1

• Migliorate le performance!

• Xpages eseguibili dal client Notes ( Xul Runner

embeddato basata sull’engine Firefox 1.5)

• SSO credenziali nel client

• Editor JSS migliorato

• Maggior stabilità ( nessun crash nello sviluppo

applicativo!)

• Dojo 1.3.2

46


Gzipping Html

47

Tramite Proprierties dell’applicazione


Vantaggi Xpages

• Possibilità di “relazionare” in unica pagina dati proveniente da diverse

sorgenti dati

• Utilizzare le variabili Scopes

• Utilizzare @formulas ( Sintassi Javascript)

• Utilizzare tutte le classi Domino ( JS )

• Richiamare le classi Java

• Supporto Cross-browser ( grazie a Dojo)

• Utilizzare widget dojo non implementati dai componenti esistenti

• Temi

• Inserire codice HTML nel Sorgente XML

48


Svantaggi Xpages

• Il packaging di Dojo (meno request=performance migliori)

• La libertà di controllare l’output dei controlli ( Output SEO

compliance)

• Performance Java vs Agenti LS ( nella 8.5.1 è migliorato molto)

• Il motore lato client è due generazioni indietro rispetto a

quello Web ( Firefox 1.5)

• Widget di Notes usano IE ( se devo fare una Xpages che sia

usata come Widget devo far fronte a IE)

49


Cosa ci sarà nelle Rnext?

• Binding diretto con Database relazionali

• Come annunciato a Lotussphere ’09 supporto

per Mobile Blackberry ( firmware 5.x)

• Miglioramento di Dojo Package?

• Miglioramento perfomance

50


Documentazione...

http://www.qtzar.com/blogs/qtzar.nsf/htdocs/LearningXPages.htm

http://xpagesblog.com/

http://www-10.lotus.com/ldd/ddwiki.nsf

http://www.jmackey.net/

http://www.planetlotus.org ( cercate Xpages)

51


Platinum Sponsor

Gold Sponsor

Xpages, cosa ci sarà in questa nuova tecnologia

Technology

Transcript of Xpages, cosa ci sarà in questa nuova tecnologia