Ruotare le immagini con Canvas jQuery

Sviluppato da Pawel Witkowski, Wilq32.RotateImage è un interessante plugin per jQuery che vi permetterà di ruotare facilmente le vostre immagini.

Qui sotto potete vedere un esempio di codice, che produce l’effetto sotto mostrato:

// just do it 5 degrees
$('#image2').rotate({angle:5});
// animate the rotation
var rot=$('#image3').rotate({maxAngle:25,minAngle:-55,
bind: [
{"mouseover":function(){rot.rotateAnimation(85);}},
{"mouseout":function(){rot.rotateAnimation(-35);}}
]
});


Provare le API Google in real-time con Ajax APIs Playground

Google Ajax API Playground è una pagina creata da Ben Lisbakken in cui è possibile esplorare in modo interattivo le API di Google, al fine di capire cosa possono offrire effettivamente.

Lo strumento è molto interessante, in quanto presenta oltre 170 esempi presi da 8 Google JavaScript APIs (esattamente Maps, Search, Feeds, Calendar, Visualization, Language, Blogger, Libraries e Earth) sui quali possiamo effettuare modifiche per poi esportarli o salvarli al fine di riutilizzarli in un secondo momento.

L’interfaccia è molto personalizzabile: le 3 sezioni presenti (pick, edit, run) infatti possono essere ridimensionate a piacimento, oltre al fatto che la sezione “run” può essere impostata come pop-up in una nuova finestra; è presente inoltre un motore di ricerca con filtri su nome degli esempi, categorie e tags.

Considerato che in Google credono molto nell’Open Source, il codice di questa pagina non poteva che essere sotto licenza Apache 2.0 e utilizzare librerie e strumenti Open Source quali jQuery, jQuery UI, App Engine, YUI Compressor, e CodeMirror. E’ infatti lo stesso autore che invita gli utenti a utilizzare questo framework per mostrare i propri esempi di codice, mettendo a disposizione una guida su come aggiungere esempi e una directory dedicata a caricarli.

jQuery una libreria presidenziale

Nuovo presidente e nuovo sito per la casa bianca. Il nuovo sito, curato dallo stesso team che già aveva lavorato alla campagna elettorale online di Obama, ha uno stile decisamente più fresco della precedente versione e, spulciando nell’html del sito si può notare che il tutto è basato su jQuery con molti suoi plugin.
Un’altra bella conquista per la mia libreria preferita :)

Dojo Zoomer - widget di zoom immagini

Come spesso succede nel mondo dell’Open Source, progetti nati per essere piccoli e semplici spesso diventano applicazioni molto funzionali grazie all’aiuto della comunità.
Dojo Zoomer era nato infatti come semplice widget per il drag & drop di immagini, e grazie all’aiuto di alcuni membri della #dojo community è ora diventato uno strumento che permette di effettuare lo zoom sulle porzioni di immagine di nostro interesse.

Come si può vede dall’esempio qui sotto, selezionando nella finestra di destra la parte di immagine su cui vogliamo focalizzarci, nella parte sinistra comparirà lo zoom della suddetta selezione.
Una feature molto interessante se pensate ad eventuali applicazioni su siti di photo managment come Flickr.

Il componente inoltre è un’estensione delle Dojo’s Dijit library, ed è quindi estremamente personalizzabile.

Plugin jQuery per Sexy Page Curls

Dopo il grande successo di jQuery in molti si sono cimentati nello sviluppo di nuovi Plugin. Tra questi ne abbiamo trovato uno sfizioso, sviluppato da Elliot Kember, che permette di inserire un arricciamento nella pagina per sfogliarla come se fosse una pagina di un libro.

Esempi spettacolari di Javascript nel 2008

Il 2008 ha visto un vero e proprio Boom nell’utilizzo di Javascript per realizzare giochi ed effetti visivi spettacolari nel browser. Jacob Seidelin ha steso una lista veramente interessante delle migliori dimostrazioni delle potenzialità di Javascript in questo ambito.

Si parte dai giochi Javascript: Super Mario, Pac-Man, Breakout, Space Invaders, Bomberman, Tetris. Ma non solo, è stato realizzato il porting in Javascript dello SCUMM interpreter utilizzato dalla LucasGames tanti anni fa per giochi come Maniac Mansion che possono ora rivivere nel nostro browser. E’ stato anche realizzato un interprete per AGI. il motore utilizzato dall’rmai defunta SIERRA in avventure grafiche del calibro di Leisure Suit Larry anche se forse molti dei nostri lettori sono troppo giovani per ricordarsi questi giochi !
Nel 2008 hanno inoltre visto la luce due librerie Javascript destinate proprio alla realizzazione di giochi: GameJS e GameQuery basato su jQuery.

Ma si parla anche di Demo Javascript, meno interattivi ma ancora più sorprendenti nel mostrare le capacità grafiche di Javascript, SVG e Canvas. Ecco alcuni esempi: Antisocial demo, Dynamic Hypnoglow, Twinkle, Hypno Trip Down the Fractal Rug, colliding balls, 3D cube effect e dynamically generated BMP flames.

Fra le cose evidenziate c’è anche l’ottima libreria di visualizzazione dati Processing.js, sviluppata da John Resig e semplicemente spettacolare !

Nel post di Jacob troverete tantissimi altri esempi con cui rifarvi gli occhi e magari iniziare a pennsare a cosa potrete fare con queste tecnologie una volta che godranno di un supporto cross browser migliore.

Leggete Woork HandBook

Per chi non conoscesse Woork, è probabilmente ora che lo conosciate. Si tratta del blog di Antonio Lupetti, scritto purtroppo in inglese, in cui vengono pubblicati con un’ottima frequenza, moltissimi tutorial e articoli sempre di altissima qualità su Ajax (principalmente MooTools), Html e CSS.

Antonio ha ora rilasciato il Woork Handbook. Si tratta di un eBook Gratis su tutte le tematiche trattate dal blog, non credo ci siano molti contenuti originali, il grosso dell’eBook sono tutti i migliori articoli pubblicati sul blog nel corso del 2008. Veramente molto materiale e di prima scelta, tutto comodamente raccolto in un pdf stampabile.

Ricordate che, come detto, tutti i testi sono scritti in inglese.

il 2009 vedrà la fine di explorer 6 ?

Se anche voi siete fra le schiere di sviluppatori che non vedono l’ora si possa abbandonare il supporto per Internet Explorer 6, vi segnalo queste statistiche pubblicate da Asa Dotzler.

Come vedete negli ultimi anni Explorer 6 è andato in caduta libera ma purtroppo rappresenta ancora un buon 20% del mercato. Quest’anno sicuramente si assisterà ad un ulteriore calo grazie anche all’uscita di Explorer 8 e Windows 7. Tuttavia temo che anche per quest’anno Explorer 6 resterà con una percentuale troppo significativa per poterlo ignorare del tutto. D’altro canto la maggior parte di quel 20% degli utenti sono probabilmente grandi aziende con politiche di aggiornamento software non proprio al passo con i tempi ed in questo caso dubito che l’uscita di Windows 7 potrà cambiare di molto la situazione.

Non ci resta che sperare nel 2010, o che io mi stia sbagliando completamente :)

Google Chrome esce dalla fase beta

La notizia probabilmente non sarà sconvolgente visto che il market share del nuovo browser di Google, Chrome, è solo dell’1%, però mi pare interessante segnalare che dopo soli tre mesi dal rilascio della prima versione pubblica, Google Chrome, è oggi uscito dalla fase di Beta. Ciò significa che gli sviluppatori lo ritengono ormai un prodotto stabile ed affidabile.
L’unico problema restano le funzionalità del browser, molto veloce ma ad oggi ancora un po’ limitato, soprattutto per la mancanza di Extension.

3 ragioni per usare Google Ajax Libraries

Forse molti di voi conosceranno già Google Ajax Libraries, un servizio offerto da Google grazie al quale potremo utilizzare i server di Google ed un set di comode funzioni per caricare le nostre librerie Javascript preferite senza doverle hostare sui nostri server ma utilizzando le più veloci e stabili connessioni di Google.

Il servizio è ben fatto e consente di caricare sui nostri siti tutte le principali librerie:

• jQuery
• jQuery UI
• Prototype
• script.aculo.us
• MooTools
• Dojo
• SWFObject
• Yahoo! User Interface Library (YUI)

Per ogni libreria si hanno a disposizione varie versioni della stessa. Ovviamente in termini di spazio su disco ospitare una libreria Javascript sul nostro hosting non comporta di certo problemi, esistono però altri fattori da tenere in considerazione. L’utilizzo del network di Google Ajax Libraries otterremo infatti tre grossi benefici.

Maggiore velocità di download
Le librerie fornite da Google sfruttano la rete di distribuzione contenuti di Google. Ciò significa connessioni ad Internet molto veloci e presenza dei server in mezzo mondo tramite la CDN di Google. In pratica i vostri utenti non dovranno scaricare le librerie dai server americani di google ma tramite la CDN riceveranno i file richiesti dal server più vicino a loro. Questo è comunque il meno influente dei tre fattori a mio avviso

Più download paralleli
I browser da noi utilizzati tutti i giorni sono configurati per non scaricare mai più di due file contemporaneamente dallo stesso dominio durante la visualizzazione di una pagina web. Questo comporta che, ad esempio, il browser inizierà a scaricare i 2 file Javascript del nostro sito e solo al termine di questa operazione inizierà il download dei file CSS. Sfruttando il network di Google le librerie Javascript si troveranno su un dominio di Google invece che sul nostro. In questo modo il browser scaricherà contemporaneamente 4 file: 2 Javascript da Google e 2 CSS dal nostro sito.

Miglior utilizzo della Cache dei Browser
La cache dei browser ha un funzionamento piuttosto semplice. Una volta scaricato un file da un certo dominio per la prima volta lo tiene in cache locale sul pc dell’utente per un certo periodo non richiedendone così il download alle successive visite. Se il nostro sito ha una media del 50% di nuovi visitatori ogni giorni ciò significa che il 50% dei nostri visitatori non ha il nostro file Javascript in cache. Le librerie Javascript ospitate sui server di Google vengono adottate da migliaia di siti al mondo, c’è quindi un’ottima possibilità che anche quel 50% di nuovi visitatori del nostro sito abbiano già il file Javascript in cache sul proprio pc perché lo hanno scaricato su un sito precedentemente visualizzato.

Come vedete i vantaggi sono molti ! Ammetto però che ci sia anche qualche svantaggio. Per gli esperimenti che abbiamo fatto fino ad ora abbiamo notato che a volte, qui in Italia, la connessione ai server di Google non è proprio velocissima e, se si dispone di server propri su buone connesioni, a volte ospitare le librerie Javascript direttamente sul nostro server può essere più veloce.