Archivi autore: alemux

Turn.js: plugin jQuery per simulare le pagine di un catalogo

Pubblicato il da
Rispondi

Ogni tanto capita che qualche cliente, per la gestione del proprio catalogo e/o delle offerte del giorno, richieda una pagina con un effetto usato principalmente sui siti delle agenzie di viaggi.

Ad onor del vero, l’effetto che simula le pagine di un catalogo cartaceo è una cosa che mi lascia alquanto perplesso: usare la tecnologia per simulare quello che sarebbe tanto facile fare…a mano. Non so voi, ma io preferisco starne alla larga. La maggior parte delle volte, inoltre, è più di intralcio alla consultazione effettiva delle pagine che altro.

Nel caso, invece, che la vostra volontà non sia chissà quanto tenuta in considerazione da parte della committenza, allora forse questo plugin di jQuery fa al caso vostro.

La Homepage del plugin la trovate qui.

Come mostrato sul sito, l’utilizzo di questo plugin è piuttosto semplice:

#magazine{
	width:800px;
	height:400px;
}
#magazine .turn-page{
	width:400px;
	height:400px;
	background-color:#ccc;
}

<div id='magazine'>
	<div> Page 1 </div>
	<div> Page 2 </div>
	<div> Page 3 </div>
</div>

$('#magazine').turn();

Converrete con me che è piuttosto di facile utilizzo.
Per la configurazione e la personalizzazione vi consiglio di visitare subito la pagina dedicata http://www.turnjs.com/#reference .

Se Flash non è compreso tra le vostre scelte, forse questo plugin fa al caso vostro.
Il peso è quasi risibile, appena 6kb, e la inizializzazione è presto fatta.

Il problema, piuttosto, nasce dal fatto che non è completamente compatibile con tutti i browser.
Sarà difficile spiegare al cliente che il fantastico catalogo di turno non girerà a pieno su IE.
Avevate qualche dubbio?

Aprire un file JSON con la console Firebug

Pubblicato il da
Rispondi

Ogni tanto, navigando, mi capita di imbattermi in sviluppatori e web designer che non riescono, durante il loro lavoro, a superare il problema degli errori javascript delle proprie pagine web.
Viene da se che realizzare siti, scrivere javascript, senza usare una console di debug, è un attività un po’ surreale.
Firefox, nonostante a mio avviso non sia il miglior browser, da ad ogni sviluppatore uno strumento portentoso, con il quale debuggare e andare oltre vari errori, soprattutto se jQuery e javascript sono il vostro pane quotidiano, come il sottoscritto. Proprio in occasione del parsing dei tweet che arrivano da Twitter, Firebug è uno strumento fondamentale per capire come il browser sta interpretando i vostri script.
Partiamo dall’account di twitter del sottoscritto, @alemussini, e immaginiamo di dover pubblicare sul proprio sito gli ultimi 20 tweet. Semplice? Si, no, dipende. Dipende dalla vostra conoscenza degli strumenti che sono a vostra disposizione, gratuitamente, sul web. Certo che se utilizzate esclusivamente IE per debuggare i vostri siti, fatevi qualche domanda.

Innanzitutto, procuratevi Firefox e successivamente Firebug qui.
Una volta installata, avrete la vostra bella iconcina in alto a destra. Quando caricherete la prima pagina, probabilmente la console non sarà ancora attiva. Cliccate sull’icona di Firebug per attivare la console ed, eventualmente, ricaricate la pagina.
Poniamo il caso di voler esaminare l’indirizzo http://search.twitter.com/search.json?q=from%3Aalemussini&rpp=20, che non è nient’altro che il JSON degli ultimi miei 20 tweet.

Come vedete, la console ha caricato correttamente il file search.js, e vi da molte informazioni a riguardo. Chiaramente il suo funzionamento è ampiamente spiegato nel sito di Firebug, quindi procediamo speditamente a consultare quale sia il funzionamento che mi serve.

Nel tab Net, cliccando sul nome del file GET search.json, mi si apre un sottopannello, con tutte le fino sui parametri di callback, sulla cache e, dulcis in fundo, sul JSON generato. Bello vero?



Avete tutte le variabili a vostra disposizione, cosi come il sottoalbero della variabile results, dentro la quale ci sono i 20 tweet che ho richiesto nell’url sopracitato.
Ora non vi resta che ricavare con una chiamata AJAX da JQuery ( o come volete voi ) il vostro elenco e scriverlo in pagina sul vostro sito.
Non sapete come fare neanche questo? Ma come no!
Nei miei prossimi post vedrò di analizzare passo passo anche questi aspetti, perchè quello che può sembrare logico per alcuni, non lo è per altri.
Un altro ambito abbastanza misterioso è il mondo di Sencha e ExtJS, che permettono di fare delle web app spettacolari, ma la curva di apprendimento è veramente ripida, e l’inizio può sembrare veramente frustrante.

Applicazioni degne di nota: Evernote

Pubblicato il da
2

Qualche tempo fa cercavo un’applicazione che mi desse la possibilità di sopperire alla mia mostruosa incapacità di ricordarmi le cose. Partendo dal presupposto che ho un iPhone, un iPad e qualche PC sparso, qua e la, in giro tra casa e ufficio, la cosa migliore sarebbe stata quella di avere una app sincrona su tutti i device.

Dopo aver provato varie applicazioni, più o meno degne di nota, mi sono imbattuto su Evernote, applicazione sviluppata dalla omonima ditta di stanza, guarda caso, a Mountain View, California.

L’applicazione su Windows è stabile e veloce e, cosa piuttosto importante e non sempre scontata, funziona sempre. A differenza di Wunderlist, web app tedesca che spesso e volentieri è down a causa di un Hosting piuttosto instabile, Evernote fa della semplicità il suo punto forte. E lo fa bene.

Quale è il vantaggio primario? L’avere una nota, una frase, un prezzo, sempre a disposizione, su qualsiasi device, a prescindere che l’abbiate inserito con l’iPhone, con un dispositivo Android o da un Mac Book Pro.

Quindi, qualsiasi piattaforma utilizziate, Evernote copre le vostre esigenze di fermare la vostra idea, il vostro appunto, nero su bianco. Non è cosa da poco.

Potete anche creare taccuini sincronizzati con un altro utente Evernote, potendo condividerne le note all’interno con il vostro eventuale team, e ricercare all’interno di tutte le note inserite attraverso l’uso di un comunissimo tag.

Un’altra funzione piuttosto carina è quella di poter integrare in Google Chrome un piccolo tool per ritagliare articoli dal web ed inserirli in una note, sempre a disposizione. Il modo migliore per non perdersi mai nel mare delle informazioni utili.

La notizia dell’ultim’ora è che Evernote ha conseguito il premio come miglior applicazione nella categoria Utilities & Services ai Webby Awards 2012, sia come Webby che come People’s Voice.

Potete seguire Evernote anche su Twitter qui.