Come molti di voi sapranno Google mette a disposizione per la maggior parte dei propri prodotti una serie di strumenti per sfruttarne le potenzialità nei nostri progetti.
Google Maps non fa eccezione e ci fornisce tutti gli strumenti (API) per sfruttare le mappe di Google nei nostri siti tramite Javascript.

Una delle funzionalità più utili è quella di poter calcolare il percorso ottimale per raggiungere un determinato luogo, ottenendo tutte le indicazioni sulle svolte e sulle strade da percorrere. Non molti sanno che queste funzionalità sono a disposizione degli sviluppatori per integrarle nei propri progetti, ed è proprio ciò che faremo.

Demo

Read more »

Visitando il sito Apple Store è possibile vedere all’opera un interessante funzionalità che permette lo zoom delle foto direttamente nel loro spazio, senza aprire fastidiosi popup.

Grazie a jQuery e la sua estensione jQuery UI è possibile realizzare il medesimo effetto in maniera semplice. In particolare andremo ad utilizzare il plugin "draggable" di jQuery UI.

Demo

Read more »

In questo passaggio del tutorial a CodeIgniter vediamo finalmente l’elemento del framework che si occupa della logica dell’applicazione, e cioè il controller. Come vedremo questo elemento è quello che viene eseguito direttamente dall’utente ed è ciò che mette in comunicazione i dati (e cioè i modelli) con l’output (le viste).

CodeIgniter infatti, tramite la classe Routing, si occupa di leggere l’URL digitato e indirizzare all’apposito controller il metodo da eseguire. Ad esempio, digitando l’indirizzo http://www.dominio.com/index.php/nome_controller/nome_metodo/ CodeIgniter andrà a richiamare il controller nome_controller ed eseguirà il metodo nome_metodo. Se invece viene omesso nome_metodo verrà richiamato il metodo di default chiamato index.

Read more »

Il footer, per definizione, è quell’elemento che chiude la pagina e si pone alla fine dei contenuti. Quando però il contenuto è più corto dello spazio disponibile a video – il viewport – il footer si “solleva” dal bordo inferiore della pagina, lasciando uno spazio più o meno grande al di sotto di esso. L’effetto in certi casi può essere poco gradevole, dando l’impressione di un layout “tagliato a metà”. Potete vedere qui un esempio…
Read more »

Riprendo dopo qualche tempo il tutorial su CodeIgniter, dato che ho ultimato una prima versione preliminare dell’applicazione (molto scarna, ma rende l’idea). Potete quindi già testarne il funzionamento e seguire i prossimi tutorial direttamente sul codice finito.

L’installazione è semplicissima se avete un webserver php attivo con mysql configurato. Provate visitando l’indirizzo http://localhost/ (altrimenti esistono ambienti preconfigurati come XAMPP per windows o MAMP per macintosh molto facili da installare).

Innanzitutto scaricate il file contenente tutto il necessario: [Scarica]

Create poi una cartella (io l’ho chiamata “homeDB”) all’interno del vostro “localhost” (dove avete le cartelle dei vostri progetti in php, per intenderci) e scompattate all’interno il file zip. Quest’ultimo contiene, oltre al framework e all’applicazione, un file SQL per creare le tabelle necessarie (eseguite la query all’interno di phpMyAdmin o della vostra interfaccia MySQL preferita).

Ora non resta che modificare la configurazione dell’applicazione per adattarla al vostro ambiente. Per prima cosa aprite il file config.php all’interno di [vostraCartella]/system/application/config/ e modificate la riga $config['base_url'] = "http://127.0.0.1/homeDB/"; con la vostra cartella al posto di homeDB.

In secondo luogo bisognerà indicare i nuovi parametri di connessione al database. Per farlo aprite database.php nella stessa cartella e modificate in fondo alla pagina i parametri con quelli corretti.

A questo punto tutto dovrebbe essere configurato correttamente e dovreste già poter vedere l’applicazione funzionante visitando l’indirizzo http://localhost/[vostraCartella]. Potete creare qualche record fittizio per provare il tutto: vi suggerisco di partire dalle tipologie e dagli stati dato che sono campi obbligatori. Potete anche vedere, nell’inserimento degli articoli, la libreria Validation fornita direttamente da CodeIgniter (provate a creare un articolo vuoto).

Nei prossimi giorni vedremo gli altri elementi dell’applicazione, ovvero i controller e le viste, nonché l’utilizzo di helper e librerie.

Edit: ho messo on-line una demo di questo primo abbozzo di applicazione a questo indirizzo se volete provarla “dal vivo”. Mi raccomando non scrivete oscenità

Oggi ho realizzato un piccolo plugin in jQuery che ben si presta a fare da breve introduzione allo sviluppo di plugin per il famoso framework javascript.

Quello di cui avevo bisogno era un plugin per simulare il comportamento della pseudo-classe “focus” in modo da renderla compatibile con tutti i browser. Nella fattispecie quando ci si posiziona su un campo di input, a questo viene aggiunta una classe in modo da cambiarne lo stile. In questo modo si evidenzia all’utente il campo in cui sta operando favorendo l’accessibilità e l’usabilità.

Read more »

Come potete vedere qui a destra ho implementato da poco le API di last.fm tramite i feed xml.

Nel mio post precedente ho spiegato come utilizzare i dati in Xml nel codice PHP per creare i propri widget. Questo sistema però ha un inconveniente: finché il php non ha avuto il file dal server di last.fm la pagina non viene completata e il sito non si carica. E questo vale in generale.

Tramite javascript invece i contenuti vengono aggiunti dopo e se per qualche motivo il server non rispondesse, avremmo comunque possibilità di consultare il sito. E’ per questo che ho deciso di implementare la soluzione via jQuery.

Read more »

Molti di voi probabilmente conoscono il servizio Google Maps, l’avrete visto sicuramente in molti siti. Nella stragrande maggioranza viene usato via javascript tramite le API pubbliche o tramite iFrame.

Qualche volta però queste soluzioni non sono applicabili, ad esempio se stiamo realizzando un sito per dispositivi portatili che non supportano bene i contenuti dinamici, oppure se non vogliamo appesantire la pagina con troppe mappe dinamiche, o in generale per tutte quelle situazioni dove javascript non è la soluzione migliore.

La cosa che forse non tutti sanno è che Google mette a disposizione anche la possibilità di generare mappe statiche, che diventano quindi semplici immagini jpeg, gif o bitmap. I vantaggi possono essere moltissimi:

Read more »

Continua la mia caccia alla ricerca di API e feed per i servizi di social network più diffusi. Stavolta tocca a Flickr.

Anche qui il nostro obiettivo è reperire le nostre ultime foto per utilizzarle nel proprio sito come più ci aggrada.

Pur non essendo disponibili liberamente tutte le API, per i nostri scopi possiamo utilizzare i feeds pubblici forniti da Flickr.

Read more »

Se cinguettate su Twitter e volete inserire i messaggi nel vostro sito avete a disposizioni le completissime API. La documentazione la trovate qui ma vi do due dritte al volo…
Read more »