Copyright © 2007, Zend Technologies Inc.

Zend_Dojo: l'integrazione della libreria Dojo nello Zend Frameworkby Enrico ZimuelSenior Consultant - Zend Technologies

Email: enrico.z@zend.comBlog: http://www.zimuel.it/blog

Sommario

• Che cos'è lo Zend Framework (ZF)?

• Che cos'è Dojo?

• L'architettura di Dojo

• Configurare l'ambiente Dojo in ZF: il view helper dojo()

• Utilizzo dei widgets Dijit nello Zend_View

• Form 2.0 con Zend_Form e Dojo

| May 15, 2009

Name of this section | 3

Zend Framework

• Framework PHP open source Semplicità di utilizzo Architettura flessibile Funzionalità Web 2.0

• Web services• Ajax (integrazione Dojo, Adobe Flex)

Codice di qualità (testato con PHPUnit)

• Scritto in PHP 5, Object Oriented, MVC

• Versione 1.8.1, download ed info: http://framework.zend.com/

| May 15, 2009

| 4

Dojo

• Dojo è una libreria JavaScript open source per la realizzazione di Rich Internet Applications (RIA)

• Caratteristiche principali: performance; affidabilità; ampia disponibilità funzioni:

manipolazione DOM, animazioni, Ajax, gestione Eventi e normalizzazione keyboard

Supporto multi-browser (Firefox, IE, Safari, Opera, etc)

internazionalizzazione (i18n) e accessibilità (a11y)

http://dojotoolkit.org/

| May 15, 2009

| 5

Dojo: curiosità

• Dōjō, è un termine giapponese che significa etimologicamente luogo (jō) dove si segue la via (dō)

道場

| May 15, 2009

| 6

L'architettura di Dojo

Libreria di base < 30 Kb

| May 15, 2009

| 7

Dojo: esempi

http://demos.dojotoolkit.org

| May 15, 2009

| 8

Zend Framework e Dojo

• Disponibile a partire dalla versione 1.6 dello Zend Framework

• Dojo view helper per la gestione dell'ambiente Dojo

• View helpers di tipo Dijit per la creazione di form ed elementi

• Gestione delle strutture dojo.data con la classe Zend_Dojo_Data

• JSON-RPC implementazione server

| May 15, 2009

| 9

Supporto Dijit

• Supporto della maggior parte dei componenti dijits (Dojo widgets)

• Utilizzo di view helpers per il rendering dei dijits I dijits sono generati automaticamente (default) Possibilità di specificare lo stile di generazione

• Form decorators per i layout ed i form dijits Utilizzo di layout dijit decorators specifici per

forms, sub forms e gruppi di visualizzazione

• Gestione degli elementi di un form dijits Mappatura con i dijit view helpers

| May 15, 2009

| 10

Classic web application model (sync)

| May 15, 2009

| 11

Ajax (async)

| May 15, 2009

| 12

dojo.data Payload

• dojo.data è una struttura dati utilizzata dai componenti Dojo

• Zend_Dojo_Data gestisce la generazione di strutture dati compatibili con dojo.data

• Possibilità di gestire ogni oggetto (arrays, Iterators, etc.) tramite un identificatore utilizzato poi per la creazione di una struttura JSON (JavaScript Object Notation).

• JSON è un formato adatto per lo scambio dei dati in applicazioni client-server

| May 15, 2009

| 13

Esempio di struttura dati in JSON

{ "type": "menu", "value": "File", "items": [ {"value": "New", "action": "CreateNewDoc"}, {"value": "Open", "action": "OpenDoc"}, {"value": "Close", "action": "CloseDoc"} ]}

• Formato: { “etichetta” : “valore” }

| May 15, 2009

| 14

Supporto JSON-RPC

• JSON-RPC è un protocollo di Remote Procedure Call che utilizza JSON per la serializzazione dei messaggi

• Lo schema JSON specifica il Service Mapping Description (SMD) per la definizione dei metodi disponibili

• Zend_Json_Server implementa un server di tipo JSON-RPC con il supporto SMD

• Utilizzato principalmente nello sviluppo di applicazioni client “pesanti” dove il codice client è incluso in una View del modello MVC

| May 15, 2009

| 15

dojo() View Helper

• Impostazione dell'ambiente dojo $view->addHelperPath('Zend/Dojo/View/Helper/',

'Zend_Dojo_View_Helper');

• Percorso delle librerie javascript (CDN o locale) $view->dojo()->setLocalPath('...')

• Impostazione dei paths per I moduli personalizzati $view->dojo()->registerModulePath('...')

• Impostazione del dojo.require per l'inclusione arbitraria di moduli dojo $view->dojo()->requireModule('...')

• Impostazione dell'evento onLoad

| May 15, 2009

| 16

dojo() View Helper - temi

• Dojo consente la creazione di temi personalizzati per i dijits (widgets). $view->dojo()->

addStylesheetModule('dijit.themes.tundra');

• Il path del tema è ricostruito sostituendo al '.' il separatore di directory ed utilizzando l'ultimo valore come nome del file .CSS.

• dijit.themes.tundra -> dijit/themes/tundra/tundra.css

• Quando si utilizza un tema è necessario impostarlo nel file HTML, il metodo più sicuro è includerlo nel body: <body class=”tundra”>

| May 15, 2009

| 17

Dijit-Specific View Helpers

• “Dijit è un sistema di elementi grafici (widget) sviluppato sulla base di dojo” (manuale Dojo)

• Zend Framework fornisce un insieme di view helper per l'utilizzo di dijit, essi si suddividono in tre categorie:

Layout Containers Form Dijit Form Elements

| May 15, 2009

| 18

• Ogni dojo.require effettua una richiesta al server per il download del relativo file javascript

• Se sono presenti più dijits si avranno numerose richieste al server con evidenti rallentamenti!!!

• In Dojo c'è la possibilità di creare custom builds tramite le utils fornite con la libreria

• I file vengono raggruppati in layers (un singolo file JS).

Using Layers (custom builds)

| May 15, 2009

| 19

Zend_Dojo: esempio

| May 15, 2009

| 20

• Matthew A.Russell “Dojo, the definitive guide” O'Reilly (2008)

• Rawld Gill, Craig Riecke, Alex Russell “Mastering Dojo. JavaScript and Ajax Tools for Great Web Experiences” The Pragmatic Bookshelf (2008)

• Frank Zammetti “Practical Dojo Projects” Apress (2008)

• Peter Svensson “Learning Dojo” Packt Publishing (2008)

Riferimenti

Grazie!

Per maggiori info: http://www.zend.com