Oggi ti spiego come realizzare un pulsante di login per la tua applicazione facebook.
Come prima cosa devi aprire un'applicazione facebook dal centro sviluppatori facebook e settare tutti i parametri necessari. Ai fini del mio esempio basta settare l'indirizzo del sito e il canvas url.
A questo punto hai ottenuto un Application ID che ci servirà per far riconoscere la nostra applicazione al sistema.
Per evitare casini con le impostazioni di privacy di internet explorer, che ci impediscono di aprire delle sessioni per problemi con i cookies e i frames, per prima cosa invio un header P3P:
header('P3P: CP="CAO PSA OUR"');
In seguito metto il codice xfbml per renderizzare un bottone di login facebook
Ci sono diversi parametri da settare, come puoi vedere nella pagina ufficiale dedicata al Login Button, io ho solo utilizzato lo show-faces per mostare gli amici che utilizzano la mia applicazione e il perms, che serve per settare i permessi da chiedere all'utente, ma ce ne sono degli altri.
Poi viene il <div id="fb-root"></div> che serve al javascript sdk di facebook per caricarsi correttamente all'interno della nostra pagina.
Infine tutto il blocco javascript che prima carica il Javascript SDK di facebook, poi inizializza l'oggetto FB con FB.init, al posto degli asterischi devi mettere il tuo ID Applicazione.
FB.XFBML.parse() mi serve per parserizzare tutti i codici xfbml e renderizzarne il contenuto.
Le ultime righe mi sono utili per monitorare l'evento login ed effettuare il reload della pagina nel caso in cui l'utente si logga. Questo mi è utile ad esempio per mostrare del contenuto diverso all'utente loggato.
E' tutto qui, il nostro facebook login è completo, ciao!
In verità la api key non è indispensabile, ma noi siamo dei bravi nerd e facciamo le cose per bene :D
Adesso passo a realizzare una semplice funzione, che accetta come paramentri un indirizzo e una google maps key, compone il giusto url, chiede i dati a google e restituisce la posizione del luogo desiderato, sotto forma di latitudine e longitudine.
Alla prima riga di codice la funzione compone l'url, facendo l'encode dell'indirizzo passato e aggiungendo la chiave. Come output ho impostato json, ma è possibile ottenere i dati in formato xml. Ecco la documentazione sul geocoding di google.
Alla seconda riga ottengo il documento e lo carico in una variabile, In seguito, grazie a json_decode, ottengo l'oggetto json che poi posso leggere per ottenere i dati di mio interesse.
Come puoi facilmente notare, ci sono due return, il primo in caso di successo mi restituisce un array di due valori (latitudine e longitudine), il secondo restituisce false in caso di fallimento.
All'interno di uno script posso richiamare la funzione in questo modo:
dopo aver valorizzato la variabile $address con l'indirizzo di mio interesse (meglio se completo, costituito da via, numero civico, cap e città) e la variabile $key con la mia api key.
Il json (o xml) ottenuto contiene altre informazioni utili, che puoi sfruttare con un pò di fantasia nella tua applicazione, anche in base alle esigenze.
Se vuoi utilizzare i dati in formato xml puoi trovare delle informazioni utili in questo articolo che ho scritto sul blog, in cui parlo di gestione dati xml in php.
E tu hai idee al riguardo? Utilizzi fantasiosi delle API di googla maps?
Oggi mi è capitato di dover validare il prefisso telefonico in un form validato con il plugin validation di jquery.
Suppongo che sai validare un form con jquery, in caso contrario corri a studiare! Ci sono tante risorse in rete, come ad esempio questo articolo sulla validazione ma su google trovi una marea di risorse al riguardo.
Ho creato un metodo apposito, utilizzando addMethod e l'ho chiamato "phone_prefix".
Alla prima riga della funzione estraggo la parte che contiene il prefisso (le prime 3 cifre, supponendo che non mi interessa il prefisso internazionale) var prefix = value.substring(0,3);
Poi creo l'array dei prefissi permessi, che posso facilmente modificare ed ampliare nel tempo.
Infine, faccio un return dell'esito del controllo. Ho utilizzato la funzione inArray() di jquery in modo da semplicare al massimo il controllo stesso.
Semplice e veloce, naturalmente è uno script minimale molto migliorabile e ampliabile ma già ci permette di prendere confidenza con addMethod nella validazione dei campi di un form.
