Indice <ul><li>Preparare l'ambiente </li></ul><ul><li>Creiamo la nostra prima page </li></ul><ul><li>Creiamo un componente...
 
Preparare l'ambiente <ul><li>Software utilizzato: </li></ul><ul><ul><li>JDK 1.6 (mustang) </li></ul></ul><ul><ul><li>Servl...
Preparare l'ambiente <ul><li>Prima di cominciare installiamo nel repository (locale) di maven tre jar previa scaricati: </...
Preparare l'ambiente <ul><li>Ok, apriamo eclipse creiamo il nostro maven2 project “jukeweb” </li></ul><ul><ul><li>File -> ...
Preparare l'ambiente <ul><li>Create project: </li></ul>
Preparare l'ambiente <ul><li>Configure project: </li></ul>
Preparare l'ambiente <ul><li>Creato il progetto aggiungiamo le dipendenze: </li></ul>< dependencies > < dependency > < gro...
Preparare l'ambiente <ul><li>Ora dovremmo avere tutte le librerie necessarie. </li></ul><ul><li>Non ci resta che creare e ...
 
Creiamo la nostra prima page <ul><li>Start.java: </li></ul>
Creiamo la nostra prima page <ul><li>Start.tml: </li></ul>
Creiamo la nostra prima page <ul><li>Start.tml: </li></ul>
Creiamo la nostra prima page <ul><li>La sintassi ${[ prefix :] expression [. nestedExpr ] } è detta Expansions. </li></ul>...
Creiamo la nostra prima page <ul><li>Bene, è giunto il momento di lanciare per la prima volta l'applicazione: </li></ul>
Creiamo la nostra prima page <ul><li>Configuriamo jetty: </li></ul>
Creiamo la nostra prima page <ul><li>Configuriamo e lanciamo jetty: </li></ul>
Creiamo la nostra prima page <ul><li>Infine digitiamo l'url sul browser: </li></ul><ul><ul><li>http://localhost:8080/jukew...
 
Creiamo un componente.. <ul><li>Prima di proseguire occorre includere nel progetto (in src/main/webapp/) alcune risorse di...
Creiamo un componente.. <ul><li>Come già detto le component classes e i component templates si devono trovare in qualunque...
Creiamo un componente.. <ul><li>Border.java (versione 1) </li></ul>
Creiamo un componente.. <ul><li>Border.tml (versione 1) </li></ul>
Creiamo un componente.. <ul><li>Border.tml (versione 1) </li></ul>
Creiamo un componente.. <ul><li>Border.tml (versione 1) </li></ul>
Creiamo un componente.. <ul><li>Adeguiamo quindi il template Start.tml </li></ul>
Creiamo un componente.. <ul><li>http://localhost:8080/jukeweb/ </li></ul>
Creiamo un componente.. <ul><li>Ok, ora dovremmo avere acquisito un po' di confidenza col codice, ma il tutto è ancora sta...
Creiamo un componente.. <ul><li>Un parametro di un componente altro non è che un'attributo d'istanza opportunamente annota...
Creiamo un componente.. <ul><li>Border.java (versione 2)  </li></ul>
Creiamo un componente.. <ul><li>Border.java (versione 2)  </li></ul>
Creiamo un componente.. <ul><li>Border.java (versione 2)  </li></ul>
Creiamo un componente.. <ul><li>Adeguiamo quindi il template Start.tml </li></ul>
Creiamo un componente.. <ul><li>http://localhost:8080/jukeweb/ </li></ul>
Creiamo un componente.. <ul><li>Gli Assets  </li></ul><ul><ul><li>sono il meccanismo offerto da Tapestry per riferirsi a r...
Creiamo un componente.. <ul><li>Creiamo quindi ora in Border.java i riferimenti agli stylesheets, ai files javascript e al...
Creiamo un componente.. <ul><li>(continua) </li></ul><ul><ul><li>Annotare ciascuna delle variabili con org.apache.tapestry...
Creiamo un componente.. <ul><li>Aggiungiamo a Border.java </li></ul>
Creiamo un componente.. <ul><li>(...continua) </li></ul>
Creiamo un componente.. <ul><li>Aggiungiamo i metodi getter e modifichiamo il template </li></ul>
Creiamo un componente.. <ul><li>Dopo aver salvato ed eseguito diamo uno sguardo al codice risultante </li></ul>
Creiamo un componente.. <ul><li>Creiamo un componente per il menù. Menu.java </li></ul>
Creiamo un componente.. <ul><li>Creiamo un componente per il menù. Menu.java </li></ul>
Creiamo un componente.. <ul><li>E il template Menu.tml </li></ul>
Creiamo un componente.. <ul><li>E il template Menu.tml </li></ul>
 
Il componente login <ul><li>Passiamo ora a creare un componente che gestisca le operazioni di login/logout </li></ul><ul><...
Il componente login <ul><li>Login.java </li></ul>
Il componente login <ul><li>Login.java </li></ul>
Il componente login <ul><li>Login.java </li></ul>
Il componente login <ul><li>(... continua) </li></ul>
Il componente login <ul><li>(... continua) </li></ul>
Il componente login <ul><li>(... continua) </li></ul>
Il componente login <ul><li>(... continua) </li></ul>
Il componente login <ul><li>Login.tml </li></ul>
Il componente login <ul><li>Login.tml </li></ul>
Il componente login <ul><li>Login.tml </li></ul>
Il componente login <ul><li>Login.tml </li></ul>
Il componente login <ul><li>(..continua) </li></ul>
Il componente login <ul><li>(..continua) </li></ul>
Il componente login <ul><li>(..continua) </li></ul>
Il componente login <ul><li>E' giunto il momento di integrare spring e il backend per comunicare con il database </li></ul...
Il componente login <ul><li>Secondo, aggiungere al web.xml: </li></ul><ul><ul><li>Il listener di spring che si vuole usare...
Il componente login <ul><li>Importiamo nel path opportuno i due files di configurazione di spring </li></ul><ul><li>Modifi...
Il componente login <ul><li>Importiamo nel path opportuno i due files di configurazione di spring </li></ul><ul><li>Modifi...
Il componente login <ul><li>Per conservare lo stato dell'utente creiamo una classe UserState nel package  </li></ul><ul><u...
Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per acceder...
Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per acceder...
Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per acceder...
Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per acceder...
Il componente login <ul><li>Modifichiamo i metodi login e logout in Login.java </li></ul>
Il componente login <ul><li>Ora con il tapestry component If facciamo in modo che nel template Login.tml venga mostrato il...
Il componente login <ul><li>Il Login.tml diventa quindi: </li></ul>
Il componente login <ul><li>Adesso, per verificare quanto realizzato inseriamo un utente di prova sul db </li></ul>
Il componente login <ul><li>Login: </li></ul>
Il componente login <ul><li>Login: </li></ul>
 
La pagina d'iscrizione utente <ul><li>Veniamo ora a esaminare un componente molto potente, il beanEditForm. </li></ul>
La pagina d'iscrizione utente <ul><li>Il beanEditForm: </li></ul><ul><ul><li>Accetta i seguenti parametri: </li></ul></ul>...
La pagina d'iscrizione utente <ul><li>Il beanEditForm: </li></ul><ul><ul><li>mappa </li></ul></ul><ul><ul><ul><li>Boolean ...
La pagina d'iscrizione utente <ul><li>Il beanEditForm: </li></ul><ul><ul><li>mappa </li></ul></ul><ul><ul><ul><li>Boolean ...
La pagina d'iscrizione utente <ul><li>Aggiungiamo il package account all'interno della root delle page component classes e...
La pagina d'iscrizione utente <ul><li>Aggiungiamo il package account all'interno della root delle page component classes e...
La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
La pagina d'iscrizione utente <ul><li>http://localhost:8080/jukeweb/account/create </li></ul>
La pagina d'iscrizione utente <ul><li>Come forse avrete notato la url non è come ci si aspetterebbe /account/createaccount...
La pagina d'iscrizione utente <ul><li>Login.tml </li></ul>
La pagina d'iscrizione utente <ul><li>CreateAccount.java </li></ul>
La pagina d'iscrizione utente <ul><li>CreateAccount.java </li></ul>
La pagina d'iscrizione utente <ul><li>CreateAccount.java </li></ul>
 
L'upload di un file <ul><li>Tapestry incapsula il componente e i servizi, necessari per effettuare l'upload, in un modulo ...
L'upload di un file <ul><li>Creiamo una class page track/CreateTrack.java </li></ul>
L'upload di un file <ul><li>Quindi il template track/CreateTrack.tml </li></ul>
L'upload di un file <ul><li>Una volta caricato il file dobbiamo inserire i dati ad essa relativi </li></ul><ul><li>Modific...
L'upload di un file <ul><li>Una volta caricato il file dobbiamo inserire i dati ad essa relativi </li></ul><ul><li>Modific...
L'upload di un file <ul><li>Una volta caricato il file dobbiamo inserire i dati ad essa relativi </li></ul><ul><li>Modific...
L'upload di un file <ul><li>Aggiungiamo un attributo Track con i relativi accessor, per editare le informazioni. </li></ul>
L'upload di un file <ul><li>Occorre anche definire un attributo StylesEnum </li></ul><ul><li>Essendo una enum, il beanEdit...
L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata <...
L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata <...
L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata <...
L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata <...
L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata <...
L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il tra...
L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il tra...
L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il tra...
L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il tra...
 
Realizziamo il jukebox <ul><li>Bene, siamo giunti all'ultimo elemento dell'applicazione </li></ul><ul><li>Nel realizzarlo ...
Realizziamo il jukebox <ul><li>Bene, siamo giunti all'ultimo elemento dell'applicazione </li></ul><ul><li>Nel realizzarlo ...
Realizziamo il jukebox <ul><li>Bene, siamo giunti all'ultimo elemento dell'applicazione </li></ul><ul><li>Nel realizzarlo ...
Realizziamo il jukebox <ul><li>Modifichiamo quindi la Start page, e aggiungiamole gli attributi </li></ul>
Realizziamo il jukebox <ul><li>Modifichiamo quindi la Start page, e aggiungiamole gli attributi </li></ul>
Realizziamo il jukebox <ul><li>Infine faccio in modo che quando la pagina viene inizializzata, carichi dal database le tra...
Realizziamo il jukebox <ul><li>Infine faccio in modo che quando la pagina viene inizializzata, carichi dal database le tra...
Realizziamo il jukebox <ul><li>Quindi inseriamo il component grid nel template </li></ul>
Realizziamo il jukebox <ul><li>Riordiniamo gli attributi </li></ul>
Realizziamo il jukebox <ul><li>Aggiungiamo la paginazione </li></ul>
Realizziamo il jukebox <ul><li>Gestiamo il rating con un componente specifico </li></ul>
Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
Realizziamo il jukebox <ul><li>Infine sovrascriviamo la fileNameCell </li></ul>
Realizziamo il jukebox <ul><li>Infine sovrascriviamo la fileNameCell </li></ul>
Realizziamo il jukebox <ul><li>Infine sovrascriviamo la fileNameCell </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
Realizziamo il jukebox <ul><li>La stream page TrackStream.java </li></ul>
Realizziamo il jukebox <ul><li>La stream page TrackStream.java </li></ul>
Realizziamo il jukebox <ul><li>http://localhost:8080/jukeweb/ </li></ul>
 
Ringraziamenti <ul><li>Un ringraziamento va a tutti coloro che con il loro impegno e disponibilità hanno permesso la reali...
Tapestry5 in action <ul><li>FINE </li></ul><ul><li>Marco Pugliese </li></ul><ul><li>[email_address] </li></ul>
Upcoming SlideShare
Loading in …5
×

04 Tapestry5 In Action Pratica

3,408 views
3,356 views

Published on

tapestry 5 in azione

Published in: Technology, Lifestyle
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
3,408
On SlideShare
0
From Embeds
0
Number of Embeds
32
Actions
Shares
0
Downloads
54
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

04 Tapestry5 In Action Pratica

  1. 2. Indice <ul><li>Preparare l'ambiente </li></ul><ul><li>Creiamo la nostra prima page </li></ul><ul><li>Creiamo un componente per gestire il layout </li></ul><ul><li>Creiamo un componente per il login/logout </li></ul><ul><li>La pagina di iscrizione utente </li></ul><ul><li>L'upload di un file </li></ul><ul><li>Realizziamo il jukebox </li></ul>
  2. 4. Preparare l'ambiente <ul><li>Software utilizzato: </li></ul><ul><ul><li>JDK 1.6 (mustang) </li></ul></ul><ul><ul><li>Servlet specification 2.4 </li></ul></ul><ul><ul><li>Maven2 </li></ul></ul><ul><ul><li>Eclipse 3.2 </li></ul></ul><ul><ul><ul><li>Maven2 plugin </li></ul></ul></ul><ul><ul><ul><li>Jetty launcher 1.4.1 </li></ul></ul></ul><ul><ul><li>Jetty 4.2.27 </li></ul></ul><ul><ul><li>Mysql Server 5.0 </li></ul></ul>
  3. 5. Preparare l'ambiente <ul><li>Prima di cominciare installiamo nel repository (locale) di maven tre jar previa scaricati: </li></ul><ul><ul><li>jukemodel-1.0.0.jar (allegato alla presentazione) </li></ul></ul><ul><ul><li>jid3lib-0.5.4.jar, JLayer(mp3 util, reperibili qui e qui ) </li></ul></ul><ul><ul><li>jta-1.0.1B.jar (java transaction api, reperibile qui ) </li></ul></ul>
  4. 6. Preparare l'ambiente <ul><li>Ok, apriamo eclipse creiamo il nostro maven2 project “jukeweb” </li></ul><ul><ul><li>File -> new -> project </li></ul></ul><ul><ul><ul><li>Maven2 -> Maven2 project </li></ul></ul></ul>
  5. 7. Preparare l'ambiente <ul><li>Create project: </li></ul>
  6. 8. Preparare l'ambiente <ul><li>Configure project: </li></ul>
  7. 9. Preparare l'ambiente <ul><li>Creato il progetto aggiungiamo le dipendenze: </li></ul>< dependencies > < dependency > < groupId > jukemodel </ groupId > < artifactId > jukemodel </ artifactId > < version > 1.0.0 </ version > </ dependency > < dependency > < groupId > org.apache.tapestry </ groupId > < artifactId > tapestry-spring </ artifactId > < version > 5.0.6 </ version > </ dependency > < dependency > < groupId > org.springframework </ groupId > < artifactId > spring-web </ artifactId > < version > 2.0.2 </ version > </ dependency > < dependencies >
  8. 10. Preparare l'ambiente <ul><li>Ora dovremmo avere tutte le librerie necessarie. </li></ul><ul><li>Non ci resta che creare e configurare il web.xml </li></ul>
  9. 12. Creiamo la nostra prima page <ul><li>Start.java: </li></ul>
  10. 13. Creiamo la nostra prima page <ul><li>Start.tml: </li></ul>
  11. 14. Creiamo la nostra prima page <ul><li>Start.tml: </li></ul>
  12. 15. Creiamo la nostra prima page <ul><li>La sintassi ${[ prefix :] expression [. nestedExpr ] } è detta Expansions. </li></ul><ul><li>In un' expansions: </li></ul><ul><ul><li>L'espressione passata viene interpretata secondo le regole di binding </li></ul></ul><ul><ul><li>La regola da usare viene selezionata con un prefisso </li></ul></ul><ul><ul><ul><li>prop (default) </li></ul></ul></ul><ul><ul><ul><li>literal </li></ul></ul></ul><ul><ul><ul><li>message </li></ul></ul></ul>
  13. 16. Creiamo la nostra prima page <ul><li>Bene, è giunto il momento di lanciare per la prima volta l'applicazione: </li></ul>
  14. 17. Creiamo la nostra prima page <ul><li>Configuriamo jetty: </li></ul>
  15. 18. Creiamo la nostra prima page <ul><li>Configuriamo e lanciamo jetty: </li></ul>
  16. 19. Creiamo la nostra prima page <ul><li>Infine digitiamo l'url sul browser: </li></ul><ul><ul><li>http://localhost:8080/jukeweb/ </li></ul></ul>
  17. 21. Creiamo un componente.. <ul><li>Prima di proseguire occorre includere nel progetto (in src/main/webapp/) alcune risorse disponibili come allegati alla presentazione: </li></ul><ul><ul><li>Stylesheets </li></ul></ul><ul><ul><li>Immagini </li></ul></ul><ul><ul><li>Un flash mp3 player </li></ul></ul><ul><li>E in src/main/resources/ </li></ul><ul><ul><li>Javascript files </li></ul></ul>
  18. 22. Creiamo un componente.. <ul><li>Come già detto le component classes e i component templates si devono trovare in qualunque sub-package di </li></ul><ul><ul><li>tapestry.app-package /components </li></ul></ul><ul><li>Creiamo quindi un componente che ci consenta di “centralizzare” la gestione del layout delle pagine </li></ul>
  19. 23. Creiamo un componente.. <ul><li>Border.java (versione 1) </li></ul>
  20. 24. Creiamo un componente.. <ul><li>Border.tml (versione 1) </li></ul>
  21. 25. Creiamo un componente.. <ul><li>Border.tml (versione 1) </li></ul>
  22. 26. Creiamo un componente.. <ul><li>Border.tml (versione 1) </li></ul>
  23. 27. Creiamo un componente.. <ul><li>Adeguiamo quindi il template Start.tml </li></ul>
  24. 28. Creiamo un componente.. <ul><li>http://localhost:8080/jukeweb/ </li></ul>
  25. 29. Creiamo un componente.. <ul><li>Ok, ora dovremmo avere acquisito un po' di confidenza col codice, ma il tutto è ancora statico </li></ul><ul><li>Prima di tutto vediamo come fare a passare al Border i titoli per la finestra e per la pagina. </li></ul>
  26. 30. Creiamo un componente.. <ul><li>Un parametro di un componente altro non è che un'attributo d'istanza opportunamente annotato (@Parameter) e corredato dei metodi accessor. </li></ul>
  27. 31. Creiamo un componente.. <ul><li>Border.java (versione 2) </li></ul>
  28. 32. Creiamo un componente.. <ul><li>Border.java (versione 2) </li></ul>
  29. 33. Creiamo un componente.. <ul><li>Border.java (versione 2) </li></ul>
  30. 34. Creiamo un componente.. <ul><li>Adeguiamo quindi il template Start.tml </li></ul>
  31. 35. Creiamo un componente.. <ul><li>http://localhost:8080/jukeweb/ </li></ul>
  32. 36. Creiamo un componente.. <ul><li>Gli Assets </li></ul><ul><ul><li>sono il meccanismo offerto da Tapestry per riferirsi a risorse statiche </li></ul></ul><ul><ul><li>Consentono di accedere a risorse presenti nel classpath (default) o nel context root della web application </li></ul></ul>
  33. 37. Creiamo un componente.. <ul><li>Creiamo quindi ora in Border.java i riferimenti agli stylesheets, ai files javascript e al mp3 flash player </li></ul><ul><li>Per farlo dobbiamo </li></ul><ul><ul><li>Dichiarare per ciascuna risorsa che vogliamo linkare una variabile d'istanza di tipo org.apache.tapestry.Asset e il corrispondente metodo getter (il setter non occorre in quanto la risorsa è in sola lettura) </li></ul></ul>
  34. 38. Creiamo un componente.. <ul><li>(continua) </li></ul><ul><ul><li>Annotare ciascuna delle variabili con org.apache.tapestry.ioc.annotations.Inject </li></ul></ul><ul><ul><li>Annotare ciascuna delle variabili con org.apache.tapestry.annotations.Path (@Path(“context|classpath: path/risorsa.ext ”)) </li></ul></ul>
  35. 39. Creiamo un componente.. <ul><li>Aggiungiamo a Border.java </li></ul>
  36. 40. Creiamo un componente.. <ul><li>(...continua) </li></ul>
  37. 41. Creiamo un componente.. <ul><li>Aggiungiamo i metodi getter e modifichiamo il template </li></ul>
  38. 42. Creiamo un componente.. <ul><li>Dopo aver salvato ed eseguito diamo uno sguardo al codice risultante </li></ul>
  39. 43. Creiamo un componente.. <ul><li>Creiamo un componente per il menù. Menu.java </li></ul>
  40. 44. Creiamo un componente.. <ul><li>Creiamo un componente per il menù. Menu.java </li></ul>
  41. 45. Creiamo un componente.. <ul><li>E il template Menu.tml </li></ul>
  42. 46. Creiamo un componente.. <ul><li>E il template Menu.tml </li></ul>
  43. 48. Il componente login <ul><li>Passiamo ora a creare un componente che gestisca le operazioni di login/logout </li></ul><ul><li>Al componente spettano la responsabilità di: </li></ul><ul><ul><li>esporre le operazioni opportune </li></ul></ul><ul><ul><li>Conoscere e gestire il comportamento dell'applicazione al momento del login/logout </li></ul></ul>
  44. 49. Il componente login <ul><li>Login.java </li></ul>
  45. 50. Il componente login <ul><li>Login.java </li></ul>
  46. 51. Il componente login <ul><li>Login.java </li></ul>
  47. 52. Il componente login <ul><li>(... continua) </li></ul>
  48. 53. Il componente login <ul><li>(... continua) </li></ul>
  49. 54. Il componente login <ul><li>(... continua) </li></ul>
  50. 55. Il componente login <ul><li>(... continua) </li></ul>
  51. 56. Il componente login <ul><li>Login.tml </li></ul>
  52. 57. Il componente login <ul><li>Login.tml </li></ul>
  53. 58. Il componente login <ul><li>Login.tml </li></ul>
  54. 59. Il componente login <ul><li>Login.tml </li></ul>
  55. 60. Il componente login <ul><li>(..continua) </li></ul>
  56. 61. Il componente login <ul><li>(..continua) </li></ul>
  57. 62. Il componente login <ul><li>(..continua) </li></ul>
  58. 63. Il componente login <ul><li>E' giunto il momento di integrare spring e il backend per comunicare con il database </li></ul><ul><li>Primo, modificare il filter nel web.xml </li></ul>
  59. 64. Il componente login <ul><li>Secondo, aggiungere al web.xml: </li></ul><ul><ul><li>Il listener di spring che si vuole usare </li></ul></ul><ul><ul><li>Il context-param che punta ai files di configurazione </li></ul></ul>
  60. 65. Il componente login <ul><li>Importiamo nel path opportuno i due files di configurazione di spring </li></ul><ul><li>Modifichiamo i dati per la connessione nel file hibernate-config.xml </li></ul>
  61. 66. Il componente login <ul><li>Importiamo nel path opportuno i due files di configurazione di spring </li></ul><ul><li>Modifichiamo i dati per la connessione nel file hibernate-config.xml </li></ul>
  62. 67. Il componente login <ul><li>Per conservare lo stato dell'utente creiamo una classe UserState nel package </li></ul><ul><ul><li>tapestry.app-package /state </li></ul></ul>
  63. 68. Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per accedere allo state object in Login.java </li></ul>
  64. 69. Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per accedere allo state object in Login.java </li></ul>
  65. 70. Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per accedere allo state object in Login.java </li></ul>
  66. 71. Il componente login <ul><li>Aggiungiamo i riferimenti allo state object e allo userService, e il metodo getter per accedere allo state object in Login.java </li></ul>
  67. 72. Il componente login <ul><li>Modifichiamo i metodi login e logout in Login.java </li></ul>
  68. 73. Il componente login <ul><li>Ora con il tapestry component If facciamo in modo che nel template Login.tml venga mostrato il form di login solo se non ci si è loggati e l'inverso per il comando di logout. </li></ul><ul><li>L'If component ha la seguente forma: </li></ul>
  69. 74. Il componente login <ul><li>Il Login.tml diventa quindi: </li></ul>
  70. 75. Il componente login <ul><li>Adesso, per verificare quanto realizzato inseriamo un utente di prova sul db </li></ul>
  71. 76. Il componente login <ul><li>Login: </li></ul>
  72. 77. Il componente login <ul><li>Login: </li></ul>
  73. 79. La pagina d'iscrizione utente <ul><li>Veniamo ora a esaminare un componente molto potente, il beanEditForm. </li></ul>
  74. 80. La pagina d'iscrizione utente <ul><li>Il beanEditForm: </li></ul><ul><ul><li>Accetta i seguenti parametri: </li></ul></ul><ul><ul><ul><li>object : l'oggetto che si vuole editare </li></ul></ul></ul><ul><ul><ul><li>remove : una lista di nomi di attributi dell'oggetto da editare, di cui si vuol inibire il rendering </li></ul></ul></ul><ul><ul><ul><li>submitLabel : l'etichetta del submit button del form </li></ul></ul></ul><ul><ul><ul><li>model : un'istanza di org.apache.tapestry.beaneditor.BeanModel </li></ul></ul></ul><ul><ul><ul><li>reorder : una lista di nomi di attributi nell'ordine desiderato </li></ul></ul></ul><ul><ul><ul><li>clientValidation : true|false </li></ul></ul></ul>
  75. 81. La pagina d'iscrizione utente <ul><li>Il beanEditForm: </li></ul><ul><ul><li>mappa </li></ul></ul><ul><ul><ul><li>Boolean con checkbox </li></ul></ul></ul><ul><ul><ul><li>java.util.Date con DateField </li></ul></ul></ul><ul><ul><ul><li>Enum con select </li></ul></ul></ul><ul><ul><ul><li>String e Number con textField </li></ul></ul></ul>
  76. 82. La pagina d'iscrizione utente <ul><li>Il beanEditForm: </li></ul><ul><ul><li>mappa </li></ul></ul><ul><ul><ul><li>Boolean con checkbox </li></ul></ul></ul><ul><ul><ul><li>java.util.Date con DateField </li></ul></ul></ul><ul><ul><ul><li>Enum con select </li></ul></ul></ul><ul><ul><ul><li>Tipi primitivi, wrapper e String con textField </li></ul></ul></ul><ul><ul><li>Può essere ulteriormente configurato annotando opportunamente l'oggetto che gli si passa. </li></ul></ul>
  77. 83. La pagina d'iscrizione utente <ul><li>Aggiungiamo il package account all'interno della root delle page component classes e creaiamo la classe CreateAccount.java </li></ul>
  78. 84. La pagina d'iscrizione utente <ul><li>Aggiungiamo il package account all'interno della root delle page component classes e creaiamo la classe CreateAccount.java </li></ul>
  79. 85. La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
  80. 86. La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
  81. 87. La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
  82. 88. La pagina d'iscrizione utente <ul><li>...e il template. </li></ul>
  83. 89. La pagina d'iscrizione utente <ul><li>http://localhost:8080/jukeweb/account/create </li></ul>
  84. 90. La pagina d'iscrizione utente <ul><li>Come forse avrete notato la url non è come ci si aspetterebbe /account/createaccount, bensì /account/create. In sostanza tapestry ignora la ripetizione di account, questo consente di avere url più pulite . </li></ul><ul><li>Resta da realizzare un link per accedere alla pagina di iscrizione, e aggiungere un riferimento al servizio verso il db nella classe della pagina per salvare l'utente creato. </li></ul>
  85. 91. La pagina d'iscrizione utente <ul><li>Login.tml </li></ul>
  86. 92. La pagina d'iscrizione utente <ul><li>CreateAccount.java </li></ul>
  87. 93. La pagina d'iscrizione utente <ul><li>CreateAccount.java </li></ul>
  88. 94. La pagina d'iscrizione utente <ul><li>CreateAccount.java </li></ul>
  89. 96. L'upload di un file <ul><li>Tapestry incapsula il componente e i servizi, necessari per effettuare l'upload, in un modulo a parte tapestry-upload.jar </li></ul><ul><li>Quindi aggiungiamo la dipendenza corrispondente nel pom.xml </li></ul>
  90. 97. L'upload di un file <ul><li>Creiamo una class page track/CreateTrack.java </li></ul>
  91. 98. L'upload di un file <ul><li>Quindi il template track/CreateTrack.tml </li></ul>
  92. 99. L'upload di un file <ul><li>Una volta caricato il file dobbiamo inserire i dati ad essa relativi </li></ul><ul><li>Modifichiamo il metodo upload come segue </li></ul>
  93. 100. L'upload di un file <ul><li>Una volta caricato il file dobbiamo inserire i dati ad essa relativi </li></ul><ul><li>Modifichiamo il metodo upload come segue </li></ul>
  94. 101. L'upload di un file <ul><li>Una volta caricato il file dobbiamo inserire i dati ad essa relativi </li></ul><ul><li>Modifichiamo il metodo upload come segue </li></ul>
  95. 102. L'upload di un file <ul><li>Aggiungiamo un attributo Track con i relativi accessor, per editare le informazioni. </li></ul>
  96. 103. L'upload di un file <ul><li>Occorre anche definire un attributo StylesEnum </li></ul><ul><li>Essendo una enum, il beanEditForm la gestirà con una select. </li></ul>
  97. 104. L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata </li></ul>
  98. 105. L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata </li></ul>
  99. 106. L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata </li></ul>
  100. 107. L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata </li></ul>
  101. 108. L'upload di un file <ul><li>Infine ci servono i riferimenti allo stateObject e al servizio per salvare la traccia creata </li></ul>
  102. 109. L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il track form. </li></ul>
  103. 110. L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il track form. </li></ul>
  104. 111. L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il track form. </li></ul>
  105. 112. L'upload di un file <ul><li>Infine dobbiiamo modificare il template, in modo da mostrare prima l'upload form, e poi il track form. </li></ul>
  106. 114. Realizziamo il jukebox <ul><li>Bene, siamo giunti all'ultimo elemento dell'applicazione </li></ul><ul><li>Nel realizzarlo vedremo </li></ul><ul><ul><li>come untilizzare il grid component </li></ul></ul>
  107. 115. Realizziamo il jukebox <ul><li>Bene, siamo giunti all'ultimo elemento dell'applicazione </li></ul><ul><li>Nel realizzarlo vedremo </li></ul><ul><ul><li>come untilizzare il grid component </li></ul></ul><ul><ul><li>come realizzare un componente che scrive direttamente sull'output (privo di template) </li></ul></ul>
  108. 116. Realizziamo il jukebox <ul><li>Bene, siamo giunti all'ultimo elemento dell'applicazione </li></ul><ul><li>Nel realizzarlo vedremo </li></ul><ul><ul><li>come untilizzare il grid component </li></ul></ul><ul><ul><li>come realizzare un componente che scrive direttamente sull'output (privo di template) </li></ul></ul><ul><ul><li>come ottenere uno stream verso una risorsa tramite Tapestry </li></ul></ul>
  109. 117. Realizziamo il jukebox <ul><li>Modifichiamo quindi la Start page, e aggiungiamole gli attributi </li></ul>
  110. 118. Realizziamo il jukebox <ul><li>Modifichiamo quindi la Start page, e aggiungiamole gli attributi </li></ul>
  111. 119. Realizziamo il jukebox <ul><li>Infine faccio in modo che quando la pagina viene inizializzata, carichi dal database le tracce. </li></ul>
  112. 120. Realizziamo il jukebox <ul><li>Infine faccio in modo che quando la pagina viene inizializzata, carichi dal database le tracce. </li></ul>
  113. 121. Realizziamo il jukebox <ul><li>Quindi inseriamo il component grid nel template </li></ul>
  114. 122. Realizziamo il jukebox <ul><li>Riordiniamo gli attributi </li></ul>
  115. 123. Realizziamo il jukebox <ul><li>Aggiungiamo la paginazione </li></ul>
  116. 124. Realizziamo il jukebox <ul><li>Gestiamo il rating con un componente specifico </li></ul>
  117. 125. Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
  118. 126. Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
  119. 127. Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
  120. 128. Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
  121. 129. Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
  122. 130. Realizziamo il jukebox <ul><li>Il componente Rating.java </li></ul>
  123. 131. Realizziamo il jukebox <ul><li>Infine sovrascriviamo la fileNameCell </li></ul>
  124. 132. Realizziamo il jukebox <ul><li>Infine sovrascriviamo la fileNameCell </li></ul>
  125. 133. Realizziamo il jukebox <ul><li>Infine sovrascriviamo la fileNameCell </li></ul>
  126. 134. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  127. 135. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  128. 136. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  129. 137. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  130. 138. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  131. 139. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  132. 140. Realizziamo il jukebox <ul><li>Il component Player.java </li></ul>
  133. 141. Realizziamo il jukebox <ul><li>La stream page TrackStream.java </li></ul>
  134. 142. Realizziamo il jukebox <ul><li>La stream page TrackStream.java </li></ul>
  135. 143. Realizziamo il jukebox <ul><li>http://localhost:8080/jukeweb/ </li></ul>
  136. 145. Ringraziamenti <ul><li>Un ringraziamento va a tutti coloro che con il loro impegno e disponibilità hanno permesso la realizzazione del Javaday </li></ul><ul><li>Naturalmente agli sponsor </li></ul><ul><li>E in particolare a Mara Marzocchi, Java Italian Portal webmaster, per l'incoraggiamento, il sostegno e la disponibilità (ma anche i consigli, le proposte e le idee). </li></ul>
  137. 146. Tapestry5 in action <ul><li>FINE </li></ul><ul><li>Marco Pugliese </li></ul><ul><li>[email_address] </li></ul>

×