Aggiornamenti di JQuery e Live Table

Question

Mi chiedevo se qualcuno potesse indicarmi la direzione degli esempi o del codice di esempio per alcune cose riguardanti la manipolazione delle tabelle che sto cercando di ottenere ma non sono ancora riuscito a decifrare.

Attualmente sto producendo una tabella di dati che viene ordinata e visualizzata utilizzando il plug-in Tablesorter per Jquery.

Vorrei aggiungere queste funzionalità extra

1. Aggiorna la tabella automaticamente ogni pochi secondi con tutti i nuovi dati (senza aggiornare la pagina) e mantieni l'ordinamento. Posso creare lo script PHP per generare json per nuovi dati, ma in qualche modo avrei bisogno di inviarlo l'id dell'ultima riga visualizzata (in modo da poter scoprire quali nuove righe visualizzare)
2. Una volta aggiunta una nuova riga (idealmente con una transizione graduale come dissolvenza) avrebbe una classe CSS di " new " o qualcosa che gli darà un nuovo colore
3. Il nuovo colore passerà quindi allo stile normale della tabella (rimuovi classe) entro 15 secondi dalla pagina mantenendo lo stato attivo
4. se la pagina non ha lo stato attivo e ci sono nuovi dati (ovvero l'aggiornamento in background ma l'utente sta guardando un'altra finestra / scheda) attende fino a quando l'utente non ha lo stato attivo sulla finestra / scheda e quindi esegue la dissolvenza in un colore normale come descritto in 3.

Spero che sia stato chiaro, la parte di cui sono un po 'scettico è il punto 4 con il problema della messa a fuoco, ma penso che Facebook sembri farlo con il loro feed di notizie in diretta. Non sembra aggiornarsi fino a quando non avrò la finestra attiva (o almeno così suppongo)

Qualsiasi aiuto e guida sarebbe molto apprezzato!

La mia tabella è in questo formato:

<table class="tablesorter" cellspacing="1"> 
    <thead> 
    <tr> 
        <th>ID</th> 
        <th>lid</th> 
        <th>Time</th> 
        <th>Season</th> 
        <th>Keyword</th> 
        <th>Campaign</th> 
        <th>IP</th>         
    </tr> 
    </thead> 
    <tbody> 
        <tr> 
            <td class="id">6875</td> 
            <td class="lid">-----</td> 
            <td class="time">28 Nov 09 16:35:24</td> 
            <td class="season">xxx xxx</td> 
            <td class="keyword">xx xx xxxx</td> 
            <td class="campaign">xxx</td> 
            <td class="ip">xx.xx.xx.xx</td> 
        </tr>
    <tbody> 
<table>

Answer 1

1: per attivare un evento ogni pochi secondi in JavaScript, utilizzare setTimeout() . Utilizza il filtro :last per aiutarti a prendere l'ultima riga. Memorizza l'id in un campo di input nascosto all'interno dell'ultima riga.

2: L'ultima volta che ho provato, dissolvenze e roll-down non hanno funzionato bene sulle righe della tabella. Ho dovuto creare hack davvero brutti per far funzionare questa funzionalità come la creazione di un <table> completamente nuovo per riga. Forse le cose sono migliorate nelle ultime versioni di jQuery? Dai un'occhiata a Effects per un elenco di modi in cui puoi animare i tuoi contenuti.

3: puoi implementarlo usando i callback proprio come con dissolvenze, roll-down e altri effetti.

4: Non ho esperienza con il rilevamento del focus della finestra, anche se sembra che ci siano risorse là fuori che possono aiutarti in questo. Eccone un paio: http://www.webdeveloper.com/forum/archive/ index.php / t-33457.html http://www.thefutureoftheweb.com/blog/detect-browser-window- concentrarsi