Tutti gli articoli di admin

TUTORIAL SENCHA GXT 2 – GESTIRE IL TOOLTIP IN UN GRID

Nell’articolo di oggi vedremo come integrare un tooltip in una datagrid sencha.  Nel fare questa attività ho avuto qualche rimpianto per la semplicità di utilizzo di Flex, che permette di definire in modo semplice (tramite una sola properties) Il tooltip da far apparire per una determinata colonna.

Con Sencha la cosa non è così intuitiva, probabilmente esiste un modo molto semplice, ma non ho trovato una soluzione che mi soddisfacesse a pieno.  La soluzione che vi presento permette di definire un tooltip su un datagrid ed è provata e testata su gxt 3.1.0 e gwt 2.6.1.

La classe grid presenta una properties tooltip, ma essa riceve una string come argomento, pertanto si presta solo per tooltip statici, mentre la mia esigenza è quella di un tooltip funzione della riga selezionata e ancora meglio della cella selezionata.

Per soddisfare la necessità ho dovuto gestire gli eventi dell’oggetto, avrei sperato in una property della row ma le mie ricerche non hanno avuto esito positivo.

Pertanto considerando di avere a che fare con un oggetto Grid della classe com.sencha.gxt.widget.core.client.grid.Grid possiamo definire un handler sul mouse hover in questo modo:

Tramite tale approccio riusciremo a vedere il tooltip al passare del mouse, un tooltip funzione del model associato al grid.

Nei miei piano avrei v oluto anche gestire la comparsa e scomparsa del tooltip in funzione della colonna, ma i comandi relativi non hanno avuto l’effetto desiderato.

In questo caso direi meglio questo che niente. Alla prossima

 

ANDROID TUTORIAL – 6 – VALIDARE UN FORM

Dopo aver integrato il database oggi realizziamo il form per l’inserimento dei dati e agganciamo ad esso una funzione di validazione, che evidenzi i campi obbligatori.

Prevediamo tre campi obbligatori:

  • name
  • city
  • address

Questi 3 campi vengono definiti come EditText

L’attributo inputType impone il controllo sul formato del campo. Al salvataggio del form il sistema invoca la funzione di validazione che verificherà se il campo è valorizzato o no tramite la routine

Qualora il controllo fallisse la classe  EditText mette a disposizione il metodo setErrorr che consente di abilitare il messaggio di errore attivo sul singolo campo, come si può vedere in foto

mandatory

ANDROID TUTORIAL – 5 – INTEGRARE UN DATABASE

In Android molte applicazioni necessitano di un database per conservare le informazioni per un uso successivo. Realizzeremo insieme un crud, ovvero un app che consente le tipiche operazioni di gestione di una entità:
creazione, ricerca, aggionrnamento e cancellazione.
Il database di riferimento è SQLite, il package offerto da android è android.database.sqlite.

Per poter accedere al nostro database occorre estendere la classe SQLiteOpenHelper, che prevede l’implementazione dei metodi creazione del database.

Il costruttore prevede la creazione di un database con una determinata versione e sono previsti i metodi che verranno lanciati alla creazione del database e/o al suo aggiornamento., All’interno dei metodi è possibile lanciare degli script sql per aggiornare il database.

A questo punto dobbiamo definire la classe per la gestione della nostra tabella, tale classe implementa l’interfaccia BaseColumns, che prevede la presenza di una primary key _ID (tale approccio non è obbligatorio, ma è consigliato da Google per uno sviluppo più armonico)

Nel nostro caso prevediamo una classe così fatta

Non resta che definire la classe DAO responsabile dei metodi di lettura e scrittura sul nostro db

Dall’analisi della classe si vede come la classe Helper permetta di accedere al database in lettura e/o scrittura tramite i metodi

Ottenuta l’istanza del database la classe mette a disposizione dei metodi per la gestione dei dati, che permettono di eseguire del codice sql oppure tramite l’uso di classi container, tipo ContentValues, che consentono l’interazione con il database anche con una limitata conoscenza di sql.

Buona sperimentazione.

VUFIND – Tutorial 9 – Gestione di nuovi campi

L’articolo illustra come aggiungere dei nuovi campi al livello di presentazione di un libro. La gestione di un nuovo campo si articola nelle seguenti fasi:

  • estensione del record driver
  • estensione del tema relativo

Il record driver è la classe php responsabile di recuperare il dato esposta da Solr. Nella configurazione standard occorre aggiungere i metodi di get alla classe SolrDefault, tale operazione è sufficiente se il campo è già disponibile in Solr, altrimenti deve essere aggiunto modificando lo schema opportunamente, come illustrato in un articolo precedente.

Ipotizzando di gestire un campo di nome abstract modificheremo la classe SolrDefault aggiungendo il metodo

A questo punto il metodo è invocabile nel tema, quindi modifichiamo il file core.phtml aggiungendo l’invocazione del metodo

E’ possibile modificare la presentazione aggiungendo anche un tab nella sezione a scheda. Per fare questo occorre agire sul file di configurazione del modulo VUFIND nella sezione recorddriver_tabs e definire un nuovo tab

LA configurazione si conclude con la creazione di un controller in RecordTab del modulo VuFind e la vista altreInfo.phtml relativa nel tema configurato.

Se abbiamo operato bene otterremo questo effetto

recorddriver

 

 

VUFIND – Tutorial 8 – Creazione di un modulo

L’articolo illustra la creazione di un modulo in VUFIND e la sua integrazione, in particolare vedremo la creazione di un modulo per la lettura delle news.

Il modulo ha una struttura ben definita, è una directory all’interno della cartella module e presenta la seguente alberatura

Il file Module.pho definisce il modulo e ha un contenuto di questo

Come si può notare il modulo recupera la configurazione dal file module.config.php presente nella directory config. Definiamo nel file il nostro controller tramite la sintassi:

A questo punto implementiamo il controller  e la relativa action

e la view relativa ad ogni action all’interno del nostro tema nel percorso

\vufind\themes\<nomeTema>\templates\<nomeModulo>

nel nostro caso definiamo i file test.phtml e home.phtml

Non resta che dichiarare il modulo nel file application.config.ini

A questo punto è possibile verificare la correttezza delle operazioni chiamando l’url

Infine possiamo definire il nostro modulo come la homepage agendo sul file config.ini agendo sul parametro

In tal modo invocando la home VUFIND chiamerà la action home del modulo scelto

VUFIND – Tutorial 7 – Creazione di un controller

Nell’articolo di oggi illustro la procedura per aggiungere un controller al modulo VUFIND.  Per controller si intende la classe responsabile di interpretare la richiesta e caricare la pagina di presentazione dati (VIEW).

Occorre creare la classe all’interno del package di VUFIND

I controller sono classi php che estendono la classe “AbstractBase”, i cui metodi con suffisso Action individuano le action esposta dal controller.

Consideriamo la classe TestController.php contenente il seguente codice:

Tale controller va configurato nel file di configurazione centrale del modulo VUFIND disponibile al path

Tale configurazione prevede la definizione di un alias nela sezione invokables del file

e la definizione della “Route”, che individua la action da invocare agendo sulla sezione delle rotte statiche

Il metodo testAction prevede la presenza di una view che si chiami come la action, nel nostro caso test.phtml, presente all’interno del nostro tema all’interno di una directory pari al nome del controller

“themes/<tema>/templates/test/test.phtml

Il cui contenuto è

E’ possibile verificare la correttezza di quanto fatto invocando l’url

http://localhost/vufind/test/test

VUFIND – Tutorial 6 – Personalizzare il tema

Dopo aver creato le istanze multiple di VUFIND adesso è il momento di renderle graficamente diverse. Per far ciò occorre generare un nuovo tema e richiamarlo dalla nuova istanza.

Cosa è una tema ? Un tema è l’insieme dei template e dei css responsabili dell’aspetto grafico di una istanza. Si presentano come directory sotto la cartella themes della directory di installazione di VUFIND.

Ogni tema ha una struttura dati prestabilita, presenta la seguente struttura dati:

  • una cartella css contenente tutti i file css usati
  • una cartella images contenente tutti le immagini usate
  • una cartella js contenente tutti i file javascript necesessari
  • una cartella templates contenente tutti i file php template responsabili della renderizzazione delle pagine
  • un file theme.config.php che gestisce la configurazione del tema

VUFIND mette a disposizione alcuni temi già configurati e mette a disposizione un meccanismo di ereditarietà che ci permette di creare agevolmente nuovi temi con il minimo sforzo.

Nell’articolo precedente abbiamo creato due istanze VUFIND, site1 e site2, entrambi che utilizzano lo stesso tema.

Creiamo un nuovo tema site1 da agganciare alla prima istanza. Per far ciò è sufficiente creare una cartella site1 all’interno della cartella themes contenente solo il file di configurazione theme.config.php. Tale file va modificato per indicare il tema da cui ereditare le caratteristiche, nell’esempio che segue sto ereditando da blueprint.

e modifichiamo il file config.ini dell’istanza site1 per agganciare il nuovo tema tramite il comando

Lanciando la prima istanza non noteremo differenze, questo perchè il tema site1 eredita blueprint.

site1

Adesso introduciamo delle modifiche all’aspetto grafico. Creiamo all’interno del nostro tema la cartella css e la cartella images dove inserire il file style.css e il nuovo logo. All’interno del file css modifichiamo il tipo searchHomeForm in questo modo

e aggiungiamo il nuovo logo, ottenendo questo effetto

site1Modificato

A questo punto possiamo modificare il template grafico, in particolare modifichiamo il footer per rimuovere una sezione. Per fare questo creiamo la cartella templates all’interno del nostro tema e copiamo il file footer.phtml dal tema blueprint. Modifichiamo il file rimuovendo una parte del footer

 e ottenendo l’effetto grafico seguente

site1Modificato2

VUFIND – Tutorial 5 – Gestione di istanze multiple

Nell’articolo di oggi vediamo come poter gestire istanze multiple di VUFIND e quali sono le soluzioni messe a disposizione dal sistema stesso. Tale necessità può nascere nel momento in cui si desidera dare accesso al sistema a utenti differenti con layout differenti. La casistica più semplice è quella in cui VUFIND presenta istanze differenti, ma un unico database e un unico Solr, ovviamente casistiche più complesse prevedono la presenza di un database per ogni istanza e un Solr per ogni istanza.

Analizziamo il caso più semplice: la creazione di più istanze con database e Solr condivisi.

Per creare più istanze occorre utilizzare il comando

Ipotizziamo di creare due istanze, site1 e site2, scegliendo l’opzione Directory-Based.

A fine processo includiamo i due file di configurazione

Se ci limitassimo a fare questo soltanto il secondo sito sarebbe correttamente funzionante, perchè la definizione dell’alias all’interno del file crea un comportamento anomalo sul primo sito.

Per risolvere questa anomalia è sufficiente creare un link simbolico alla cartella public tramite il comando

e modificare il file c:/vufind/site1/httpd-vufind.conf in questo modo

Se volete usare una istanza diversa di MySql agite sul file config.ini alla sezione

In tal modo separate la gestione delle utenze tra le varie istanze.

Se volete gestire una istanza diversa di solr agite sulla  sezione

In tal modo ogni istanza di VUFIND vedrà un set di dati differente.

VUFIND – Tutorial 4 – Integrare Google Book Services e Wikipedia

VUFIND consente di integrare i servizi Google Book e Wikipedia per migliorare l’esperienza utente.

Tramite Google Book è possibile recuperare la cover di un libro a partire dall’ISBN associato.

Per abilitare il recupero delle cover page dal libro occorre intervenire sul file config.ini e abilitare la direttiva

Tramite tale direttiva VUFIND recupererà le cover dei libri invocando il servizio esposto da Google Book e ciò verrà fatto in automatico per tutti i libri che presentano il tag ISBN valorizzzato.

Per abilitare l’integrazione con Wikipedia occorre intervenire sul file di configurazione config.ini e abilitare la direttiva

Tramite tale direttiva il sistema consentirà di caricare la pagina dedicata all’autore su wikipedia. Tale funzione è attiva nella pagina dedicata all’autore all’interno del sistema VUFIND.

VUFIND – Tutorial 3 – Importare Record

Nell’articolo di oggi vedremo come popolare la base dati di VUFIND. VUFIND presenta delle utility per il caricamento dati, che si interfacciano con Solr per la creazione del nostro catalogo.

Sono presenti due modalità di caricamenti: tramite file in formato MARC21 oppure tramite file xml con un foglio xsl associato.

Nel caso del formato MARC21 rimando al sito ufficiale. Sostanzialmente si tratta di aver un file MARC21 e di caricarlo tramite il comando

Per chi non conoscesse MARC21 (ad esempio me) VUFIND da la possibilità di caricare i libri in formato XML associando un foglio di stile xsl che effettui la trasformazione del file nel formato xml supportato da Solr, le cui specifiche sono consultabili qui.

Personalmente preferisco questa seconda soluzione, più abbordabile e alla portata di tutti. Inoltre permette a chiunque abbia un catalogo xml di poterlo caricare sul nostro sistema agevolmente.

Facciamo un caso pratico, l’esempio vale più di 1000 parole. Supponiamo di avere un file xml che contiene il nostro catalogo così fatto:

A questo punto definiamo un foglio xsl che trasforma il file xml nel formato atteso da Solr.

Questo file permetterà di trasformare il file xml nel seguente formato atteso da Solr:

Per Solr ogni documento è definito come una sequenza di field, ciascuno con il proprio nome e valore. Il file deve rispettare lo schema definito in solr, in caso contrario il file verrà rifiutato durante l’importazione.

A questo punto non ci resta che caricare il file tramite la direttiva

Tale direttiva processa il file books.xml applicando le regole definite nel file opac.properties che contiene i parametri per invocare il servizio esposto da solr.  La configurazione minimale è la seguente:

Il parametro xslt indica il file xsl da usare e deve essere disponibile all’interno della directory xsl

A questo punto se abbiamo operato riceveremo come risposta

Buon caricamento dati