laboratorio caffeina

in few words, just developing

 

Fuori.tv on-line

Laboratorio Caffeina rilascia l’ultimo progetto: “Fuori.tv”.

Fuori Tv racconta la quotidianità attraverso le voci dei protagonisti che diventano così i veri narratori della trasmissione. L’idea portante è quella di un giornalismo dal basso, che nasca dalla vita delle persone.

Nata un anno fa dall’idea di un gruppo di videomakers modenesi, Fuori Tv nella prima edizione ha avuto un grande successo: oltre 500 visitatori al giorno per il sito web www.fuori.tv

La prima serie, conclusasi nel giugno 2007, era composta da sedici puntate, accomunate da un denominatore comune: dire quello che si vuole. Il progetto vuole introdurre tematiche e contenuti innovativi rispetto ai palinsesti delle tv locali e sfruttare la televisione e il web per diffondere informazioni importanti e significative destinate a tutta la cittadinanza.

Fuori Tv si basa sul concetto di redazione aperta per sviluppare i contenuti in modo orizzontale, ovvero con un dialogo costante con chiunque voglia proporre, suggerire e realizzare nuove idee e progetti.

Laboratorio Caffeina ha contribuito al progetto realizzando il design del sito. Sviluppato su piattaforma WordPress.

http://www.fuori.tv/

Condividi

 
 
 

Remove whitespace from wordpress tagcloud

I hate whitespace in html code: if I need them I'll use css rules.

so that's a simple plugin edited from this one.
if you need both merge them

PLAIN TEXT
PHP:
  1. <?php
  2. /*
  3. Plugin Name: Tag Cloud noWhitespace
  4. Plugin URI: http://www.laboratoriocaffeina.it/design/2008/04/03/remove-whitespace-from-wordpress-tagcloud.html
  5. Description: Makes wordpress dump out a tag cloud without whitespace between each word in tags (edit from http://www.185vfx.com/2007/10/wordpress-tag-cloud-formatting/)
  6. Author: cedmax
  7. Version: 1.0
  8. Author URI:  http://www.dioblog.it
  9. */
  10.  
  11.  
  12. // This just echoes the chosen line, we'll position it later
  13. function tci_kill_breaks($taglist) {
  14.     return str_replace('&nbsp;',' ',$taglist);
  15. }
  16.  
  17. // Now we set that function up to execute when the tag list is generated
  18. add_filter('wp_generate_tag_cloud', 'tci_kill_breaks',50);?>

download, rename to .php, upload to plugin folder and activate

(tested on 2.5)

Condividi

 
 
 

DNS dinamico con TopHost

Per oscuri motivi che non indagheremo, il mio server ha un IP dinamico. Ovvero, l'internet provider che lo collega ad internet ne cambia l'indirizzo IP ad intervalli che vanno da alcune ore a pochi giorni. Per raggiungere la macchina da remoto, o per permettere ad altri di collegarvisi, ho dovuto perciò configurare un DNS dinamico: un nome cui corrisponda l'IP attuale frequentemente aggiornato.

Esistono molte soluzioni gratuite che permettono di scegliere un sottodominio ed aggiornarne automaticamente l'indirizzo IP. Una di queste, cui mi sono appoggiato per alcuni anni, è DynDNS: sul sito internet dell'azienda si registra un sottodominio, come daniele.homelinux.org, dove "daniele" è la parte scelta da me, e "homelinux.org" è il dominio principale scelto da una lista predeterminata di nomi (piuttosto bruttini). Un programma installato sul server (ddclient) si occuperà di mantenere aggiornati i registri DNS di DynDNS. Il client controlla periodicamente l'IP della macchina e quello registrato presso DynDNS: qualora i due differiscano, richiede un aggiornamento.

Quando ho acquistato un dominio mio con gestione DNS su TopHost (modena1.it), ho dovuto redirigere sottodomini come "www" al mio server con IP dinamico. La prima soluzione è stata inserire un registro DNS di tipo CNAME, ovvero che fa corrispondere ad un nome un altro nome, come:

www CNAME daniele.homelinux.org

Ho sempre pensato che questa soluzione fosse antiestetica, sebbene invisibile all'utente finale (che si collega comunque a www.modena1.it e vede solo quel nome). Se ho un dominio mio, perché dovrei usare queste parolacce? Del resto l'alternativa era visitare il pannello di controllo di TopHost ogni volta che il mio IP cambiava ed aggiornarlo manualmente... decisamente impraticabile! Allora mi sono rassegnato - temporaneamente, s'intende.

La questione è tornata fuori quando ho avuto bisogno di un gran numero di sottodomini per la gestione della posta e che fossero di tipo A, e scontrandomi inoltre con una limitazione tecnica di DynDNS. L'unica via d'uscita sembrava essere comprare un nuovo dominio, o un account pro su DynDNS.

Invece mi sono scritto un client per il pannello di controllo DNS di TopHost: thdns. Praticamente, un clone ddclient ma adattato per TopHost.

Il programma esegue i seguenti passaggi:

  1. Confronta l'ip memorizzato all'ultima esecuzione e quello attuale o fornito come argomento. Se sono uguali, esce.
  2. Si autentica sul pannello DNS e controlla che anche l'IP sul pannello sia diverso da quello verso cui è richiesto l'aggiornamento. Se non lo è, esce specificando che l'IP è stato mantenuto.
  3. Aggiorna l'ip per il nome richiesto, stampando l'IP precedente e quello nuovo.

Quindi sul pannello ho registrato diversi sottodomini e li ho inseriti nel programma come nomi da aggiornare:

www IN A ...ip a caso...

daniele IN A ...ip a caso...

etc...

Infine ho inserito una linea in /etc/crontab per chiamare il client ad ogni quarto d'ora:

0,15,30,45 * * * * daniele thdns

Ora la mia macchina è quasi sempre raggiungibile al suo vero ip, grazie a questa piccola magia python: ogni15 minuti infatti il campo IP di tutti i miei record DNS viene sincronizzato con l'indirizzo corrente.

Il programma naturalmente può essere utile anche per chi ha ip statici da amministrare : ad esempio per redirigere rapidamente i propri sottodomini verso server di backup, in caso di emergenza.

Condividi

Risorse, Vita da Developer mythsmith 29 November 2007 16:46 1 Commento , Popularity: 71% No related posts

 
 
 

Volevo farvi un appunto. Anzi, una @Annotazione

Intanto chiedo scusa per la mia assenza, vedrò di farmi perdonare:-)

Proseguendo da dove ero rimasto l'altra volta, ho controllato un po' in giro come le librerie JavaScript più diffuse trattano l'argomento della validazione dei form. Ho visto che l'unica cosa che hanno in comune è che ognuno la fa in modo differente dagli altri...

Ad esempio qui c'è la validazione dei campi di testo secondo Spry.

Volevo però fermarmi ad analizzare come avviene la validazione nella mia libreria preferita, ovvero jQuery. Ecco un esempio di validazione con il jQuery Validation Plugin.

Guardiamo un po' il sorgente: come posso indicare che un valore in un campo è sempre richiesto ed ha lunghezza massima 2?

PLAIN TEXT
HTML:
  1. <input type="text"
  2. class="{required: true, maxLength: 2}">

Argh... va be che anch'io avevo dettto che l'attributo class può essere utilizzato inserire delle annotazioni, ovvero delle informazioni "nascoste" associate ai nodi HTML, da usare poi per la validazione. Ma qui mi sembra che lo strumento venga utilizzato un po' disinvoltamente:-)

(Niente da ridire, in verità, anche io sono uno di quelli a cui piace ogni tanto sfruttare dei trucchetti..)

Però io suggerirei di inserire le annotazioni in un modo un po' diverso. Ovvero in un modo in cui nessun validatore, nessun esaminatore, nessun censore potrà mai avere a che ridire sul modo in cui queste annotazioni siano state inserite.

Ecco qua:

PLAIN TEXT
HTML:
  1. <!-- type: "integer", maxLength: 2
  2. --><input type="text">

Ecco fatto, tutto qua. Come si vede ho inserito le informazioni direttamente all'interno di un commento posto immediatamente prima del nodo a cui si riferiscono. Inoltre in questo modo posso costruire delle annotazioni di arbitraria complessità, su qualunque nodo HTML, e naturalmente non solo per la validazione. Perché semplicemente all'interno del commento è presente un frammento di testo JSON (senza le graffe) e così potrei scrivere, ad esempio:

PLAIN TEXT
HTML:
  1. <!-- id: 1020, type: "integer",
  2.      children: [101, 102, 103],
  3.      coords: {
  4.          x: 100,
  5.          y: 200
  6.      }
  7. --><input type="text" id="text1>

Qui ho specificato un campo "id" contenente un valore intero (magari letto da un database), che a questo campo sono legati in qualche modo degli altri nodi "children" (ad esempio per indicare che se uno solo di questi nodi è compilato devo compilare poi anche questo) e che associato al campo ho delle coordinate che andrò a gestire in un certo modo.

Come faccio poi via JavaScript per utilizzare questi dati "nascosti"? Con una bella funziona apposita:

PLAIN TEXT
JavaScript:
  1. function Annotation(node)
  2. {
  3.     // se è un nodo
  4.     if (node && node.previousSibling)
  5.     {
  6.         // cerco il primo commento precedente
  7.         for
  8.         (
  9.             node = node.previousSibling;
  10.             node && node.nodeType != 8;
  11.             node = node.previousSibling
  12.         )
  13.             ;
  14.         // se ho trovato il commento
  15.         if (node)
  16.         {
  17.             var ann = null;
  18.             try { eval("ann = {" + node.nodeValue + "}"); }
  19.             catch (e) { }
  20.             for (var item in ann)
  21.                 this[item] = ann[item];
  22.         }
  23.     }
  24. }

Che andrò poi ad utilizzare ad esempio così:

PLAIN TEXT
HTML:
  1. <!-- required: true, maxLength: 2
  2. --><input type="text" onclick="clicked(this);">
  3. <script type="text/javascript">
  4. function clicked(node)
  5. {
  6.     var ann = new Annotation(node);
  7.     alert("required = " + ann.required + ", maxLength = " + ann.maxLength);
  8. }
  9. </script>

Condividi

 
 
 

Come gestire timeout multipli

Spesso lavorando in Javascript ci si ritrova a lavorare con i timeouts. Generare eventi temporizzati in Javascript è abbastanza banale, si ricorre all'uso di due funzioni:

  • setTimeout() - che esegue una porzione di codice dopo lo scadere di x millisecondi
  • clearTimeout() - cancella il setTimeout()

Notare la sintassi dei comandi:

PLAIN TEXT
JavaScript:
  1. /* richiama la funzione alert allo scadere dei 5000 ms */
  2. var timeout = setTimeout( "alert('5 secondi!')",5000);
  3.  
  4. /* cancella l'evento associato alla variabile timeout*/
  5. clearTimeout(timeout);

Ma se si devono gestire più eventi temporizzati contemporaneamente? Una possibile soluzione è creare una variabile globale in cui gestire la coda di timeout, e una funzione che ripulisca la coda.

PLAIN TEXT
JavaScript:
  1. //dichiaro variabile globale
  2. var timeoutsQueue = new Array();
  3.  
  4. //aggiungo evento
  5. timeoutQueue[n] = setTimeout("ritardaFunction("+parametro+")",250);
  6.  
  7. //interrompo un singolo evento
  8. clearTimeout(timeoutQueue[n]);
  9.  
  10. //interrompo tutti gli eventi della coda
  11. for(i=0;i<timeoutQueue.length;i++){
  12.         clearTimeout(timeoutQueue[i]);
  13. }

Condividi

Programmazione, Vita da Developer davide 23 October 2007 21:08 4 Commenti Popularity: 70% Free icon set

 
 
 

Easy Clear #4, ovvero “e mò basta però”

dopo la terza puntata di easy clear mi sono accorto che non sempre funziona su ie6.

dramma e panico.
non vi preoccupate ho la soluzione:

la 3 prevedeva di mettere nel contenitore dei float il seguente codice

PLAIN TEXT
CSS:
  1. #wrapper {
  2.      overflow:hidden;
  3.      height:1%;
  4.      height:auto !important;
  5. }

se non funziona su ie6 provate questo.

PLAIN TEXT
CSS:
  1. #wrapper {
  2.      overflow:hidden;
  3.      width:100%;
  4. }

any feedback?

Condividi

 
 
 

404 error: File not found

Ci sono mille motivi per cui capita, ma spesso in rete ci si ritrova davanti ad una pagina di errore 404. Il 404 è un codice di risposta dello standard HTTP che indica che il cliente è in grado di comunicare con il server, ma il server non ha trovato la risorsa richiesta.

Troppi siti non si preoccupano di cambiare la pagina predefinita di errore 404, queste schermate disorientano l'utente e spesso sono causa di un suo abbandono del sito. Nelle situazioni critiche, ovvero in caso di errore, la compilazione di una form o i moduli di ricerca, bisognerebbe progettare e implementare con ancora maggiore rigore e attezione l'usabilità dell'interfaccia Web.

La pagina di errore 404 di default non ha lo stesso layout del sito e non spiega nulla dell'errore ma fornisce solo un messaggio tecnico, quindi disorienta e non lo aiuta in alcun modo.

Quindi primo punto è ricreare un design simile al resto del sito o almeno includere il logo. Ricreando il design del sito facciamo attenzione ad evidenziare il fatto che ci si trova su una pagina di errore, quindi viene il momento delle spiegazioni e suggerimenti, evitando tecnicismi dobbiamo:

  • spiegare il perchè viene visualizzata la pagina di errore;
  • elencare le cause più comuni;
  • dare delle alternative, ovvero link alla homepage, motore di ricerca o meglio ancora qualcosa tipo "forse cercavi" di Google;
  • infine un indirizzo email per riferire del problema.

Sengalo come esempio positivo il sito Apple ,per le note folcloristiche e non il 404 Research Lab, invece per maggiori dettagli tecnici fate riferimento al solito ListApart.

Condividi

 
 
 
Chiudi
E-mail It