Xpages Velocizzare il porting delle tue applicazioni Notes su Web Change with your picture, add a 4pt border color 255,204...
Daniele Grillo <ul><li>Consulente Notes/Domino dalla R4.6/R5 orientato allo sviluppo applicativo Web 2.0 </li></ul><ul><li...
[agenda] <ul><li>Cosa sono le Xpages </li></ul><ul><li>Modello MVC </li></ul><ul><li>Componenti Base </li></ul><ul><li>Cus...
Cosa sono le Xpages <ul><li>Un componente Aggiuntivo Designer </li></ul><ul><li>Un Framework di sviluppo basato su compone...
Modello MVC <ul><li>E’ un concetto di programmazione </li></ul><ul><li>Significa Model View Control </li></ul><ul><li>Mode...
Componenti Base <ul><li>Core </li></ul><ul><li>Container </li></ul><ul><li>Custom </li></ul>
Componenti Core Nome Componente Binding Domino EditBox Text/Number Field Date Time Picker Date Time Field Label Computed T...
Componenti Container Nome Componente Binding Domino View Vista di Domino Repeater Vista o Collezione di dati (documenti, a...
Componente View <ul><li>Ha le funzioni 1:1 vista Domino ( checkbox, ordinamenti, valori) </li></ul><ul><li>E’ personalizza...
Componente View
Componente View – proprietà colonna <ul><li>Cosa visualizzare (Colonna statica o codice SSJS dinamico? Esempio: query JDBC...
Componente View – Proprietà avanzate <ul><li>CategorybyFilte r= EmbeddedView single category </li></ul><ul><li>queryOpenVi...
Componente View – Pager <ul><li>Il navigatore della vista (Avanti, Indietro..etc) che è possibile  </li></ul><ul><li>Scegl...
Componente Repeater <ul><li>Un componente (fantastico! N.d.r) che può scorrere i seguenti  </li></ul><ul><li>oggetti ( com...
Componente Repeater <ul><li>Se applicato ad una vista permette di essere  </li></ul><ul><li>completamente svincolato dal l...
Controllo repeater - esempio <ul><li>Il cliente (una PA) necessita di un report  </li></ul><ul><li>semplice che  permetta ...
Controllo repeater – Vista Notes
Controllo repeater…Xpages <ul><li>Il cliente desidera un report accessibile da Web  </li></ul><ul><li>più semplice e mi fo...
Controllo repeater – Report
Custom controls <ul><li>Controlli personalizzati, fanno cose, non devi </li></ul><ul><li>sapere come, perchè forniscono un...
Custom Controls pronti all’uso <ul><li>Su OpenNTF.org ce ne sono diversi a disposizione </li></ul><ul><li>Xpages Async Mul...
 
Esempio: Custom control – ToolTip <ul><li>Nel progetto Catalogo di Dominopoint  ho realizzato un  </li></ul><ul><li>custom...
Custom ToolTip Dojo  <ul><li>Il componente riceve  in Input : </li></ul><ul><li>il nome del componente Xpages sul quale vi...
Custom ToolTip Dojo – Parametri <ul><li>Definizione dei parametri in Input </li></ul>
Custom ToolTip Dojo – Risorsa Dojo <ul><li>Modulo Dojo nelle Risorse del Custom  </li></ul><ul><li>Control per agganciare ...
Custom ToolTip Dojo – Source Code <ul><li>Passaggio di parametri al custom control: </li></ul><ul><li>compositeData.propri...
Custom ToolTip Dojo – Parametri da Xpages
Custom Control – Design Definition <ul><li>Definisce il disegno sulla GUI del designer del Custom  </li></ul><ul><li>Contr...
Extensions Library <ul><li>Scaricabili OpenNTF </li></ul><ul><li>OneUi theme </li></ul><ul><li>Controlli Mobile </li></ul>...
Variabili di Scope <ul><li>Variabili contenitori suddivise in: </li></ul><ul><li>Application:  durano per tutta l’applicaz...
Esempio d’uso Varibili Scope <ul><li>D:  Voglio fare in modo che selezionando un valore  da un menù a Tendina...dinamicame...
Esempio d’uso Varibili Scope <ul><li>Combo Box che binda ad una  ViewScope.FilterView </li></ul>
Esempio d’uso Variabili Scope <ul><li>OnChange fa un refresh Ajax della vista sottostante </li></ul>
Esempio d’uso Variabili Scope
Esempio Variabili di Scope <ul><li>Nell’esempio appena citato viene fatta  </li></ul><ul><li>effettuata una  Ftsearch  par...
SSJS un nuovo linguaggio? <ul><li>Non stravolge  il modo di programmare Lotus, in quanto sono state messe a disposizione t...
SSJS un nuovo linguaggio? <ul><li>E’ il linguaggio utilizzato lato server-side dalla Xpages  </li></ul><ul><li>Racchiuge o...
Validazione <ul><li>componente nativo legato alla validazione della Xpages </li></ul><ul><li>Flag semplificiato per attiva...
Validazione <ul><li>Required field  per rendere obbligatorio un controllo </li></ul><ul><li>Required Field error Message  ...
Validazione <ul><li>Show error message for  per visualizzare il messagio in una specifica posizione della pagina </li></ul>
Validazione <ul><li>Per alcuni componenti (es: ComboBox) il Validator non  </li></ul><ul><li>è visibile nella GUI e va ges...
Debuggare Xpages - server <ul><li>Abilitare il flag: Display default error Page </li></ul>
Debugger – server side <ul><li>… Informa sull’oggetto e codice SSJS che ha generato errore… </li></ul>
Debugger – client side <ul><li>Utilizzare Firefox ed estensione Firebug! </li></ul>
Xpages – Debug Custom Control Prelevabile da OpenNTF.org gratuitamente, e permette di controllare le variabili di scope, l...
Strumento Outline <ul><li>Lo strumento  Outline è un salva-tempo nel nostro lavoro di manutenzione ed  </li></ul><ul><li>i...
XPiNC (Xpages Inside Notes Client) <ul><li>Lavori una sola volta e hai l’interfaccia Client </li></ul><ul><li>Supporta Le ...
Novità della 8.5.2 <ul><li>Drag&Drop controlli nel source code  </li></ul><ul><li>Oggetti Radio/CheckBox Group migliorati ...
Novità della 8.5.3 CD5 <ul><li>Dojo 1.5 </li></ul><ul><li>Aggregator CSS/JS [FANTASTICO! N.d.r] </li></ul><ul><li>Source C...
Documentazione online <ul><li>Blog ben fatto con tanti suggerimenti( http://xpagesblog.com/ ) </li></ul><ul><li>Wiki uffic...
<ul><li>Domande? </li></ul>
Grazie agli sponsor per aver reso possibile il DDive 2011! <ul><li>Main Sponsor </li></ul><ul><li>Premium Sponsor </li></u...
Upcoming SlideShare
Loading in...5
×

DDive11 - xpages

1,250

Published on

Xpages - uno strumento per rendere veloce il porting delle tue applicazioni NSF in formato Web 2.0

Published in: Technology, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,250
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
16
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

DDive11 - xpages

  1. 1. Xpages Velocizzare il porting delle tue applicazioni Notes su Web Change with your picture, add a 4pt border color 255,204,0 Cambia con la tua foto, aggiungi un bordo spesso 4pt colore 255,204,0 Please make sure that your slide deck renders fine in Lotus Symphony Per favore controlla che le tue slide si vedano bene con Lotus Symphony
  2. 2. Daniele Grillo <ul><li>Consulente Notes/Domino dalla R4.6/R5 orientato allo sviluppo applicativo Web 2.0 </li></ul><ul><li>12 anni di esperienza </li></ul><ul><li>Fondatore community Dominopoint nel 2004 </li></ul><ul><li>E-mail: daniele.grillo@gmail.com </li></ul><ul><li>Telefono: +39 392.29.45.549 </li></ul>
  3. 3. [agenda] <ul><li>Cosa sono le Xpages </li></ul><ul><li>Modello MVC </li></ul><ul><li>Componenti Base </li></ul><ul><li>Custom Controls </li></ul><ul><li>Variabili di scope </li></ul><ul><li>SSJS un nuovo linguaggio? </li></ul>Optional Speech agenda agenda della sessione opzionale <ul><li>Validazione </li></ul><ul><li>Debug </li></ul><ul><li>XPiNC </li></ul><ul><li>Novità 8.5.2 </li></ul><ul><li>Estensions Library </li></ul><ul><li>Novità 8.5.3 </li></ul><ul><li>Documentazione </li></ul>
  4. 4. Cosa sono le Xpages <ul><li>Un componente Aggiuntivo Designer </li></ul><ul><li>Un Framework di sviluppo basato su componenti </li></ul><ul><li>Tecnologia JSF (Java Server Faces) </li></ul><ul><li>Sfruttano il backend Domino </li></ul><ul><li>Una soluzione RAD di sviluppo Web </li></ul><ul><li>Estensione HTTP Domino </li></ul><ul><li>Nascono nella 8.5 (usale >=R8.5.1fp3) </li></ul>
  5. 5. Modello MVC <ul><li>E’ un concetto di programmazione </li></ul><ul><li>Significa Model View Control </li></ul><ul><li>Model = Dati ( Form di Notes) </li></ul><ul><li>View = Come vengono rappresentati (Xpages) </li></ul><ul><li>Control= Logica applicativa ( SSJS, JS) </li></ul><ul><li>Separa il disegno applicativo dai dati e dalla </li></ul><ul><li>logica di programmazione </li></ul>
  6. 6. Componenti Base <ul><li>Core </li></ul><ul><li>Container </li></ul><ul><li>Custom </li></ul>
  7. 7. Componenti Core 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 Group CheckBox Field RadioButton / RadioBox Group RadioButton Field Button Button Image RichText Field
  8. 8. Componenti Container Nome Componente Binding Domino View Vista di Domino Repeater Vista o Collezione di dati (documenti, array) Panel NotesDocument Table Tabella Tabbed Panel Tabella a Tab Section Sezione
  9. 9. Componente View <ul><li>Ha le funzioni 1:1 vista Domino ( checkbox, ordinamenti, valori) </li></ul><ul><li>E’ personalizzabile </li></ul><ul><li>Ha diverse proprietà per effettuare ricerche, filterbyCategory </li></ul><ul><li>Ha un pager di navigazione personalizzabile </li></ul><ul><li>Valore colonne programmabili dinamicamente </li></ul><ul><li>n.b. ora e’ anche possibile inserire @dblookup e immagini sulle colonne dinamicamente ! </li></ul>
  10. 10. Componente View
  11. 11. Componente View – proprietà colonna <ul><li>Cosa visualizzare (Colonna statica o codice SSJS dinamico? Esempio: query JDBC su MSSQL o @Dblookup verso altra vista etc…) </li></ul><ul><li>Come visualizzare ? (HTML, Testo) </li></ul><ul><li>Effettuare un Href su una specifica colonna </li></ul><ul><li>Abilitare CheckBox </li></ul><ul><li>Icona </li></ul><ul><li>Stilizzarla </li></ul><ul><li>Etc…. </li></ul>
  12. 12. Componente View – Proprietà avanzate <ul><li>CategorybyFilte r= EmbeddedView single category </li></ul><ul><li>queryOpenView = WebQueryOpen prima di servire la vista </li></ul><ul><li>postOpenView = dopo che la vista è stata servita </li></ul><ul><li>Search = effettua una FTSEARCH sulla vista </li></ul><ul><li>… .etc.etc… </li></ul>
  13. 13. Componente View – Pager <ul><li>Il navigatore della vista (Avanti, Indietro..etc) che è possibile </li></ul><ul><li>Scegliere/personalizzare e sul quale è possiible attivare il Partial Refresh </li></ul><ul><li>(Ajax Mode) per non ricaricare tutta la pagina. </li></ul>
  14. 14. Componente Repeater <ul><li>Un componente (fantastico! N.d.r) che può scorrere i seguenti </li></ul><ul><li>oggetti ( come un ciclo FOR) </li></ul><ul><li>Viste </li></ul><ul><li>Collezioni (Documents, Entry, o Altro) </li></ul><ul><li>Array (es. La risultante di una @dbcolumn) </li></ul><ul><li>Vettore (un elemento a dimensione dinamica ) </li></ul><ul><li>n.b. La variabile del repeater è case sensitive, e dobbiamo stare attenti a generare il codice HTML corretto in funzione del repeat </li></ul>
  15. 15. Componente Repeater <ul><li>Se applicato ad una vista permette di essere </li></ul><ul><li>completamente svincolato dal layout tabellare </li></ul><ul><li>della stessa e di servire l’output che </li></ul><ul><li>Desiderate. </li></ul><ul><li>Output più controllabile e meno rigido! </li></ul>
  16. 16. Controllo repeater - esempio <ul><li>Il cliente (una PA) necessita di un report </li></ul><ul><li>semplice che permetta di tenere sotto controllo </li></ul><ul><li>le spese degli Istituti controllati. </li></ul><ul><li>Creando una vista Notes classica questo è il </li></ul><ul><li>Risultato… </li></ul>
  17. 17. Controllo repeater – Vista Notes
  18. 18. Controllo repeater…Xpages <ul><li>Il cliente desidera un report accessibile da Web </li></ul><ul><li>più semplice e mi fornisce un ipotetico layout in </li></ul><ul><li>photoshop…. </li></ul><ul><li>… realizzo la sua richiesta con 4 controlli repeater annidati all’interno di una Xpages. </li></ul>
  19. 19. Controllo repeater – Report
  20. 20. Custom controls <ul><li>Controlli personalizzati, fanno cose, non devi </li></ul><ul><li>sapere come, perchè forniscono una interfaccia </li></ul><ul><li>(i parametri) con cui determini come si </li></ul><ul><li>comportano. </li></ul>
  21. 21. Custom Controls pronti all’uso <ul><li>Su OpenNTF.org ce ne sono diversi a disposizione </li></ul><ul><li>Xpages Async Multi File Uploader </li></ul><ul><li>Xpages Scrollpane </li></ul><ul><li>View Picklist </li></ul><ul><li>xProperties </li></ul><ul><li>Google Maps…etc… </li></ul><ul><li>http://xpages.info/XPagesHome.nsf/Contest.xsp </li></ul>
  22. 23. Esempio: Custom control – ToolTip <ul><li>Nel progetto Catalogo di Dominopoint ho realizzato un </li></ul><ul><li>custom controls che visualizza un Dojo Tooltip sul </li></ul><ul><li>componente Xpages che vuoi. </li></ul>
  23. 24. Custom ToolTip Dojo <ul><li>Il componente riceve in Input : </li></ul><ul><li>il nome del componente Xpages sul quale visualizzare TootTip </li></ul><ul><li>Stringa/Messaggio da visualizzare </li></ul><ul><li>Il componente implementa : </li></ul><ul><li>tooltip Dojo </li></ul>
  24. 25. Custom ToolTip Dojo – Parametri <ul><li>Definizione dei parametri in Input </li></ul>
  25. 26. Custom ToolTip Dojo – Risorsa Dojo <ul><li>Modulo Dojo nelle Risorse del Custom </li></ul><ul><li>Control per agganciare il widget ToolTip… </li></ul>
  26. 27. Custom ToolTip Dojo – Source Code <ul><li>Passaggio di parametri al custom control: </li></ul><ul><li>compositeData.propriety </li></ul>
  27. 28. Custom ToolTip Dojo – Parametri da Xpages
  28. 29. Custom Control – Design Definition <ul><li>Definisce il disegno sulla GUI del designer del Custom </li></ul><ul><li>Control </li></ul>
  29. 30. Extensions Library <ul><li>Scaricabili OpenNTF </li></ul><ul><li>OneUi theme </li></ul><ul><li>Controlli Mobile </li></ul><ul><li>Gestione Dialog </li></ul><ul><li>REST </li></ul><ul><li>Widget Dojo Form </li></ul><ul><li>Inotes controlli </li></ul><ul><li>Widget Dojo Layout </li></ul><ul><li>Name Picker …etc…. </li></ul>http://extlib.openntf.org/
  30. 31. Variabili di Scope <ul><li>Variabili contenitori suddivise in: </li></ul><ul><li>Application: durano per tutta l’applicazione </li></ul><ul><li>Session: durano per la sessione corrente </li></ul><ul><li>View: durano per la vista corrente ( pagina corrente) </li></ul><ul><li>Request: durano per l’ultima chiamata verso il server </li></ul>
  31. 32. Esempio d’uso Varibili Scope <ul><li>D: Voglio fare in modo che selezionando un valore da un menù a Tendina...dinamicamente venga ricalcolata la vista sottostante senza ricaricare la pagina come posso fare? </li></ul><ul><li>R: Utilizzando un core component ComboBox che binda alle variabili di scope e le proprietà avanzate del container component View </li></ul>
  32. 33. Esempio d’uso Varibili Scope <ul><li>Combo Box che binda ad una ViewScope.FilterView </li></ul>
  33. 34. Esempio d’uso Variabili Scope <ul><li>OnChange fa un refresh Ajax della vista sottostante </li></ul>
  34. 35. Esempio d’uso Variabili Scope
  35. 36. Esempio Variabili di Scope <ul><li>Nell’esempio appena citato viene fatta </li></ul><ul><li>effettuata una Ftsearch parametrica utilizzando </li></ul><ul><li>la proprietà della vista denominata Search. </li></ul><ul><li>Si potrebbe anche creare una vista categorizzata </li></ul><ul><li>per Business Partner ed utilizzare la proprietà </li></ul><ul><li>della Vista denominata CategoryFilter . </li></ul><ul><li>( Il funzionamento è identico alla single category di una embedded view in una Form ) </li></ul>
  36. 37. SSJS un nuovo linguaggio? <ul><li>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à! </li></ul><ul><li>Inoltre JSS da la possibilità di utilizzare estensioni Java per invocare librerie esterne (Itext, JDBC per relazionali etc…) </li></ul><ul><li>( </li></ul>
  37. 38. SSJS un nuovo linguaggio? <ul><li>E’ il linguaggio utilizzato lato server-side dalla Xpages </li></ul><ul><li>Racchiuge oltre 90% delle formulas </li></ul><ul><li>Semplice </li></ul><ul><li>Javascript Like </li></ul><ul><li>Performante </li></ul>
  38. 39. Validazione <ul><li>componente nativo legato alla validazione della Xpages </li></ul><ul><li>Flag semplificiato per attivazione validazione </li></ul><ul><li>Controllo Dinamico </li></ul><ul><li>Gestione del messaggio di errore </li></ul>
  39. 40. Validazione <ul><li>Required field per rendere obbligatorio un controllo </li></ul><ul><li>Required Field error Message rappresenta il messaggio di errore </li></ul>
  40. 41. Validazione <ul><li>Show error message for per visualizzare il messagio in una specifica posizione della pagina </li></ul>
  41. 42. Validazione <ul><li>Per alcuni componenti (es: ComboBox) il Validator non </li></ul><ul><li>è visibile nella GUI e va gestito dalle sezione All Proprierties </li></ul>
  42. 43. Debuggare Xpages - server <ul><li>Abilitare il flag: Display default error Page </li></ul>
  43. 44. Debugger – server side <ul><li>… Informa sull’oggetto e codice SSJS che ha generato errore… </li></ul>
  44. 45. Debugger – client side <ul><li>Utilizzare Firefox ed estensione Firebug! </li></ul>
  45. 46. Xpages – Debug Custom Control Prelevabile da OpenNTF.org gratuitamente, e permette di controllare le variabili di scope, la versione del browser… Attualmente alla release 2.0
  46. 47. Strumento Outline <ul><li>Lo strumento Outline è un salva-tempo nel nostro lavoro di manutenzione ed </li></ul><ul><li>inserimento di codice applicativo, poiché ci permette di capire la struttura e </li></ul><ul><li>la ramificazione degli elementi presenti nella pagina che stiamo creando </li></ul>
  47. 48. XPiNC (Xpages Inside Notes Client) <ul><li>Lavori una sola volta e hai l’interfaccia Client </li></ul><ul><li>Supporta Le Repliche (OFF-Line) </li></ul><ul><li>Dalla 8.5.2 è embeddato XUL Runner che </li></ul><ul><li>corrisponde a Firefox 3.6 </li></ul>
  48. 49. Novità della 8.5.2 <ul><li>Drag&Drop controlli nel source code </li></ul><ul><li>Oggetti Radio/CheckBox Group migliorati </li></ul><ul><li>ARIA Support </li></ul><ul><li>Agents with In-Memory documents </li></ul><ul><li>Java Agents in XPiNC </li></ul><ul><li>Ajax ( Partial refresh timeout + prevent filtering) </li></ul><ul><li>CkEditor </li></ul><ul><li>TagName ( computed text) </li></ul><ul><li>Dojo 1.4.3 </li></ul><ul><li>Type and Attribute Dojo </li></ul><ul><li>onClientLoad </li></ul><ul><li>SessionAsSigner e sessionAsSignerWithFullAccess </li></ul><ul><li>Extensions API </li></ul><ul><li>HeadTag </li></ul><ul><li>HTML5 ( Cache-Manifest , Base Resource) </li></ul><ul><li>Public Access Feature </li></ul><ul><li>OneUI v2 </li></ul><ul><li>Pager ( last page feature) </li></ul><ul><li>SCXD ( Single copy Xpages Design) </li></ul><ul><li>View ( startKey,MultiCategoria, LastPage) </li></ul><ul><li>XPiNC (Agent ,NewTab, Replica, OpenDesigner windows.close) </li></ul><ul><li>Performance migliorate SSJS </li></ul>
  49. 50. Novità della 8.5.3 CD5 <ul><li>Dojo 1.5 </li></ul><ul><li>Aggregator CSS/JS [FANTASTICO! N.d.r] </li></ul><ul><li>Source Control Enablement (SVN) </li></ul><ul><li>Nuovo Elemento di Design Java </li></ul><ul><li>Editor JS nuovo (release 3.4.2 WTP) </li></ul><ul><li>Ordinamento Full Text View Xpages </li></ul><ul><li>Opzione di Preload </li></ul>N.B. Soggetto a modifiche da parte di IBM in fase di rilascio della GOLD Release
  50. 51. Documentazione online <ul><li>Blog ben fatto con tanti suggerimenti( http://xpagesblog.com/ ) </li></ul><ul><li>Wiki ufficiale sul Designer ( http://www-10.lotus.com/ldd/ddwiki.nsf ) </li></ul><ul><li>Uno di OpenNTF ( http://www-10.lotus.com/ldd/heidloffblog.nsf/ ) </li></ul><ul><li>Blogger ( http://dominoextnd.blogspot.com/ ) </li></ul><ul><li>Blogger ( http://www.youatnotes.de/xpages ) </li></ul><ul><li>PlanetLotus ( http://www.planetlotus.org ) </li></ul><ul><li>RedBook ( http://www-10.lotus.com/ldd/ddwiki.nsf/dx/Master_Table_of_Contents_for_Building_Domino_Web_Applications_using_Domino_8.5.1 ) </li></ul><ul><li>molto altro lo troverete utilizzando Google ( c’è tanta documentazione) </li></ul>
  51. 52. <ul><li>Domande? </li></ul>
  52. 53. Grazie agli sponsor per aver reso possibile il DDive 2011! <ul><li>Main Sponsor </li></ul><ul><li>Premium Sponsor </li></ul><ul><li>Prime Sponsor </li></ul>Keep this as last slide Lascia questa come ultima slide
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×