lunedì 17 novembre 2008

jQuery plugin uiTableFilter e piccola modifica

Poco fa stavo usando questa ottima plugin di jquery: uiTableFilter.

Dandogli in pasto una tabella, ed eventualmente il testo dell'header () relativo alla colonna scelta, esegue una ricerca semplicissima tra le righe, nascondendo quelle che non contengono il testo voluto, eseguendo quindi in maniera rapida un filtro.

L'ho trovata molto semplice e dal codice leggibilissimo, per questi motivi ho scelto di utilizzarla.
Però la tabella su cui l'ho applicata è abbastanza complessa, per cui ho messo due input testuali, per filtrare su due colonne differenti. Il problema che si è subito evidenziato è che (giustamente) il filtro su una colonna non considera il filtro sull'altra. Il motivo è semplice: se una riga ha il match con la ricerca che ho effettuato, chiama la funzione show() di jquery, mentre se non contiene il testo cercato chiama una hide(), non avendo quindi modo di capire se la riga era nascosta per un testo cercato precedente oppure per il filtro sull'altra colonna. Ecco quindi come ho risolto:

Ecco il diff con la versione ufficiale


21c21
< jQuery.uiTableFilter = function(jq, phrase, column, ifHidden){
---
> jQuery.uiTableFilter = function(jq, phrase, column, dontUnhide, ifHidden){
28c28
< var success = function(elem) { elem.show() }
---
> var success = function(elem) { if(!dontUnhide) elem.show() }



Ho cambiato la signature del metodo aggiungendo un parametro "dontUnhide" che permette di specificare, in pratica se il campo su cui si sta filtrando è primario o meno. Quindi di default (non passando il parametro o dando valore false) si comporta normalmente, quindi è un campo primario. Passando invece il flag impostato a true, si comporta in modo da considerare il campo secondario, non chiamando mai lo show(), ma nasconde comunque le righe che hanno passato il filtro primario ma non passano quello corrente.. il risultato è l'effetto "AND" che mi serviva.. e l'utilizzo che ne faccio è il seguente:


$(document).ready(function() {
var theTable = $('table#filtered');

function realFilter() {
$.uiTableFilter( theTable, $("#filter").val() , 'Site Name');
$.uiTableFilter( theTable, $("#filterCity").val() , 'City', true);
}
$("#filter").keyup(function() {
realFilter();
})

$("#filterCity").keyup(function() {
realFilter();
})
});


Al caricamento della pagina associo le funzioni alle due caselle di testo, uno per filtrare su Site Name e l'altra su City. Ma in realtà al keyup su qualunque delle due, la funzione è la stessa, che filtra prima sul Site Name, poi sulla City (flag dontUnhide = true).

L'unica cosa che non mi piace tanto è il giro su dontUnhide.. che è macchinoso pensare quando il flag per non "non nascondere" vada impostato a false.. mi sarebbe piaciuto usare un flag tipo "primary", ma in javascript preferisco sempre avere flag booleani il cui valore false causi il comportamento "normale", in modo che siano non obbligatori.

Ho appena scritto al creatore della plugin.. chissà che non possa tornare utile a lui o ad altri..

sabato 15 novembre 2008

Il nuovo modello di campagna elettorale made in USA

Non è mia intenzione parlare dell'aspetto politico delle elezioni del nuovo presidente degli USA, ma puntare l'attenzione su un dettaglio che per me ha una grande importanza e sicuramente è un punto di svolta: l'utilizzo di internet durante la campagna elettorale.

Di questo aspetto hanno già parlato in molti: l'utilizzo massiccio di strumenti quali linkedin, myspace, twitter, facebook ed altri canali di comunicazione su internet è un evento senza precedenti. Da notare che questi strumenti sono stati usati da una parte e dall'altra. Per esempio su linkedin (l'unico network sociale a cui sono iscritto e quindi quello che conosco meglio) ci sono tutti i "protagonisti" da Obama (attualmente 16° su toplinked ) a McCain, Sarah Palin a Hillary Clinton (Joe Biden non mi pare ci sia..).
E già questo è un punto su cui si potrebbe discutere. Infatti l'utilizzo di questi strumenti ha reso possibile un diverso approccio alla vita politica ed alla vita di un politico.
Personalmente ho l'impressione che i nostri politici non riescano minimamente a rendere la gente partecipe delle decisioni, che vengono viste come un'imposizione dall'alto.
Ed è proprio su questa mancanza di comunicazione che ha trovato terreno fertile un movimento come quello dei grillini. Che va ben oltre, certo, ma non si può nemmeno negare che uno dei fattori del suo successo sia il concetto di estraneità che prova il singolo cittadino verso la classe politica.

Su questo si potrebbe andare avanti ancora molto, ma arrivo invece al motivo che mi ha spinto a scrivere queste riflessioni: Obama ha risposto alla grande, secondo me, ai dubbi di tutte le persone che si son chieste "ma dopo questa campagna in stile web 2.0, con il coinvolgimento in prima linea di elettori e simpatizzanti, cosa succederà?" la risposta è stata chiara: change.gov. In attesa dell'insediamento del nuovo presidente, che avverrà il prossimo 20 gennaio, quello sarà il canale ufficiale per seguire l'avvicinamento alla Casa Bianca di Barack Obama: da lì avremo notizie, video (proprio oggi ne hanno pubblicato uno), news e potremo anche interagire.. il fatto che questo sia avvenuto nel States, fa ben sperare che presto anche altri paesi si adegueranno, cercando di riavvicinare la gente al mondo politico attraverso gli strumenti che mette a disposizione internet e forse riusciranno anche ad attenuare un po' la sensazione di estraneità verso lo Stato.

PS: Basta che non sia un'altra puttanata in stile Italia.it!

martedì 11 novembre 2008

JQuery + thickbox con url dinamici

Ormai da tempo mi affido a jQuery per rendere più dinamica l'interfaccia grafica e non preoccuparmi della portabilità, dopo aver perso il sonno causa browser assolutamente non standard (che non nominerò, ma già sapete..).
Oggi mi trovo a dover sostituire, in un sito abbastanza recente, un parte fatta a popup con una più elegante e moderna versione ajax con tanto di thickbox, plugin che ho usato già per altri lavori.

Il problema è il seguente: allo stato attuale, all'href del link è associato una funzione javascript (selectSite()) che carica parametri in base a selezioni fatte dall'utente in diverse parti della pagina, crea un url con questi parametri e apre un "simpatico" popup con la pagina generata dinamicamente.

Ora, se attivo thickbox direttamente su questo link, esso cambierà l'href associato.
Il risultato è che se poi si cambiano i parametri nel resto del form, un click sul link genererà comunque la richiesta con i vecchi parametri. All'inizio ho pensato a come associare una callback alla chiusura della finestra thickbox per rimettere di nuovo la funzione "selectSite()" all'href del link in questione. Ma mi sembrava un po' macchinosa, soprattutto contando che esistono altri link del genere, con funzioni simili ("selectService()", "selectSupplier()".. etc).

Allora ho pensato di indirizzare il mio refactor in una direzione differente: lasciare intatto il link, ma usarne uno di appoggio fatto apposta per aprire il thickbox e niente più.
Quindi ho creato un link vuoto ed invisibile () ed una funzione a cui si appoggiano selectSite e le sue sorelle:


function loadAjaxContent(url) {
var urlPar = url + "&height=500&width=800";
var nodeId = '#HiddenLink';
if(!$(nodeId).hasClass( "thickbox" )) {
$(nodeId).addClass("thickbox");
tb_init('a.thickbox');
}
$(nodeId).attr("href", urlPar);
$(nodeId).click();
}


Vediamo cosa fa nel dettaglio:

* prepara l'href a partire dall'url (che prima veniva richiamato come popup)
* cerca il link nascosto; se è la prima richiesta aggiungo la classe "thickbox" al link nascosto ed inizializzo thickbox, questo perchè la pagina stessa viene chiamata attraverso ajax e messa dentro un div con innerHTML, quindi l'unico modo per inizializzare thickbox è lanciare l'init dopo il caricamento del contenuto (una callback sull'avvenuto inserimento) oppure on-demand.
* aggiorno l'href del link nascosto e lancio un click su questo.

In questo modo l'href viene aggiornato costantemente, i link non vengono toccati ed il mio refactor va a sostituire i window.open(url) con loadAjaxThickbox(url).. non male, direi..
Ora miglioro alcune cose:
* potrei creare direttamente il link con id HiddenLink in questa funzione
* lancio tb_init('a#HiddenLink') per non appesantire nel caso ci siano diversi thickbox nella pagina
* aggiungo altri parametri per rendere più flessibile la gestione della finestra (altezza, larghezza, modal..)

lunedì 10 novembre 2008

Ma che bello tvtime

Stasera ho pensato di dare un'occhiata alla scheda tv che ho su un pc fisso che non uso molto. Ecco come è andata:
intanto da lspci ho scoperto che la scheda è una:

02:00.0 Multimedia controller: Philips Semiconductors SAA7134/SAA7135HL Video Broadcast Decoder (rev 01)

Il driver del kernel è semplicemente saa7134, quindi
> modprobe saa7134

Per quanto riguarda l'applicazione, pensavo ci sarebbero stati problemi, visto che il pc non è recentissimo e tanto meno lo è il sistema operativo..

=Primo tentativo: zapping
Tendo ad installare applicazioni specifiche per gnome, ma questa volta mi è andata male. La versione è la 0.9.6, mi dà problemi da subito e mi pare l'interfaccia un po' scarna. Non riesco a prendere un canale neanche per errore, mi si pianta ogni volta che cerco di aprire le impostazioni, quindi ringrazio, saluto e disinstallo.

=Secondo tentativo: tvtime
Lo installo, lo avvio, mi chiede un minimo di configurazione e attraverso un semplice menù intuitivo lancio la scansione delle frequenze. In meno di un minuto ho tutto configurato e funzionante.. davvero complimenti! Semplice ed efficace.
http://tvtime.sourceforge.net/