Fine sondaggio: Quante applicazioni hai aperte contemporaneamente in una sessione di lavoro?

I dati del sondaggio:


Totale voti: 29.
Il prossimo sondaggio, per chi fosse interessato, riguarda gli editor usati per la programmazione.

Nuova interfaccia grafica per OpenOffice

Sul blog della Sun è presente il prototipo della nuova interfaccia grafica di OpenOffice.
Il prototipo ricalca quello che era stato un passo fatto da MS Office 2007, che aveva l'intento di mettere in evidenza tutte le funzionalità del programma.
Già per questo cambiamento, moltissimi utenti delle versioni precedenti avevano bocciato la nuova interfaccia grafica, anche per il semplice fatto di dover di nuovo imparare un'interfaccia praticamente da zero.



È possibile provare un prototipo (necessario Java).
La nuova interfaccia verrà provata dagli utenti mentre il lavoro comunque è in continuo svolgimento.
Anche se sembra che la maggior parte delle opinioni siano piuttosto scettiche su questo cambiamento, l'interesse nel migliorare l'esperienza dell'utente è sicuramente positiva.

Fonti: Blog Sun, OSNews

5 fantastici design, numero 8

Ogni giorno visito vari siti web per studiarne la grafica e prendere ispirazione.
Catalogo spesso quelli che mi hanno più colpito, quindi condivido questi siti web nel blog, sperando che alcuni possano essere utili anche ad altri.
Continuiamo con altri 5 design :)

1. Lyften Designs (http://www.lyften.com/)




2. Twitter (http://twitter.com)



3. Meet Crush + Lovely. (http://crushlovely.com/)



4. Icon Desinger (http://www.icondesigner.net/)



5. FileSocial.com (http://www.filesocial.com/)



Quale preferisci?

Il nuovo banner di ubuntu-it con JQuery

Da pochi giorni abbiamo un nuovo banner nella homepage del sito web di ubuntu-it.
Il suo compito è quello di evidenziare i contenuti del sito più importanti, dato che il menù, essendo un sito che contiene molti contenuti, è piuttosto corposo.
Il nuovo banner utilizza un mix di HTML, CSS e javascript con la libreria JQuery.




Innanzitutto nella pagina in cui verrà incluso il banner dobbiamo includere il file javascript per jquery e quello del banner, oltre ai file CSS: a questo proposito, dobbiamo includere con degli IF condizionali dei CSS speciali per Internet Explorer 7 e Internet Explorer 6, se sono i browser utilizzati dall'utente.

  
   <link rel="stylesheet" href="banner.css">
   <!--[if IE 7]><br />      <link rel="stylesheet" href="ie7tricks.css"><br />    <![endif]-->

   <!--[if IE 6]><br />      <link rel="stylesheet" href="ie6tricks.css"><br />    <![endif]-->

Per quanto riguarda l'HTML, potete trovarlo qui.

Il file javascript che gestisce il banner (che contiene degli accorgimenti specifici per Internet Explorer 6, che come al solito è categoria a parte), è il seguente:

/* Licenza tagliata per limiti di spazio, si veda il file originale indicato giù per la licenza */


/* The currently selected category */
curCategory = "";
/* The URL realated to the current category */
url = "http://www.ubuntu-it.org/Ottenere_Ubuntu.shtml";
/* category -> url map */
urlsMap = {
  "support": "http://www.ubuntu-it.org/Supporto.shtml",
  "contribuire": "http://www.ubuntu-it.org/contribuire.shtml",
  "newsletter": "http://www.ubuntu-it.org/contenuti/newsletter-italiana.shtml",
  "fcm": "http://www.ubuntu-it.org/contenuti/fcm.shtml",
  "media": "http://www.ubuntu-it.org/contenuti/media.shtml",
  "contatti": "http://www.ubuntu-it.org/contatti.shtml"
}
/* Tracking activated items, if the user highlights more than 1 menu item
 * too fast. */
activatedItems = Array();

function changeActiveCategory(liId) {
  /* Change the active category in the banner.

  @param liId the ID of the selected 'li' element
  */
  /* Change 'li' classes for the old selected category and the new one */
  newCategory = liId.substring(2);
  if (curCategory != "") {
    $("#li" + curCategory).removeClass("lihover");
    $("#li" + curCategory).addClass("linormal");
  }
  $("#" + liId).removeClass("linormal");
  $("#" + liId).addClass("lihover");
  /* Change the main image for the new category*/
  $("#bannermainbg").fadeOut("slow", function(data) {
    if (curCategory != "") {
      $("#bannermainbg").removeClass(curCategory + "main");
    }
    /* Update info about the new category */
    curCategory = newCategory;
    url = urlsMap[curCategory];
    $("#bannermainbg").addClass(curCategory + "main");
    /* Workaround for IE6: CSS class doesn't work properly, so we set
     * the background manually. */
    if ($.browser.msie) {
      /* Check that is IE with version < 7 */
      if ($.browser.version < 7.0) {
        path = "url(/uploads/file/banner2009/images/" + curCategory + ".png)";
        $("#bannermainbg").css("background-image", path);
      }
    }
    $("#bannermainbg").fadeIn("slow");
  });

}


$(document).ready(function() {
  /* Change the link href, because the user has JS enabled */
  $("#bannerlinkslist li a").attr("href", "#");
  $("#bannerlinkslist li").hover(function() {
    /* Give info about the current 'li' id to the function */
    activatedItems.push($(this).attr("id"));
    changeActiveCategory($(this).attr("id"));
  },
  function() {
    /* If it's not the currently selected item, 
     * remove the correspective class */
    for (iter = 0; iter < activatedItems.length; iter += 1) { 
      if (activatedItems[iter] != ("li" + curCategory)) {  
        $("#" + activatedItems[iter]).removeClass("lihover");
        $("#" + activatedItems[iter]).addClass("linormal");
        activatedItems.splice(iter);
      }
    }
  });
  /* Manage the onclick event on the main banner content */
  $("#bannermain").click(function() {
    window.location = url;
  });
});

//vim: ai ts=2 sw=2 et sts=2

Il codice completo è a questo indirizzo.

La funzione changeActiveCategory() si occupa di:
1) evidenziare la voce correntemente selezionata nella lista della parte destra del banner;
2) riportare nello stato di elemento non selezionato la voce precedentemente selezionata;
3) assicurarsi che soltanto 1 sola voce sia selezionata (il problema si pone se l'utente passa velocemente su più di un elemento, più velocemente dell'effetto, che poteva portare a più voci selezionate nello stesso tempo);
4) cambiare l'immagine principale del banner nella parte sinistra: il tutto è gestito da classi CSS, tranne per IE6 per il quale aggiungiamo un controllo e cambiamo "manualmente" l'immagine;
5) cambiare l'indirizzo a cui si arriva cliccando sul banner.

Il CSS principale è invece consultabile qui.

Il demo, oltre ovviamente al sito di ubuntu-it, è qui.

5 fantastici design, numero 7

Ogni giorno visito vari siti web per studiarne la grafica e prendere ispirazione.
Catalogo spesso quelli che mi hanno più colpito, quindi condivido questi siti web nel blog, sperando che alcuni possano essere utili anche ad altri.
Continuiamo con altri 5 design :)
1. Ryan McMaster (http://ryanmcmaster.com/web-design-blog/)



2. Tori's Eye (http://toriseye.quodis.com/)



3. Merchant Warrior (http://www.merchantwarrior.com/)



4. Design19 (http://www.design19.ro/)



5. Nalden.net (http://www.nalden.net/#/newsitem/1273/)



Quale preferisci?

Launchpad Open Source

Oggi è un giorno importante: Launchpad è ora Open Source.
Tutto il codice, anche quello di quei componenti che in precedenza erano indicati come parti il cui codice non sarebbe stato rilasciato (soyuz e codehosting), sono inclusi.

È possibile leggere l'annuncio di Canonical.

Fine sondaggio: quanti sistemi operativi hai provato finora?

I dati del sondaggio:


Totale voti: 50.
Il prossimo sondaggio, per chi fosse interessato, riguarda quante applicazioni hai in esecuzione contemporaneamente nella tua sessione di lavoro.

Box semplici ed eleganti con JQuery

Trovo i box molto efficaci in un layout di un'applicazione web, soprattutto quando è piuttosto complicata e le informazioni da mostrare sono molte. C'è, come fanno molte applicazioni web, il metodo stile accordion, i tab, un mix di stili oppure i box. Ognuna di queste possibilità si adatta meglio al genere di contenuto e al genere di applicazione.
Per una delle mie applicazioni web ancora in sviluppo, Enchanted Webmail (pagina su launchpad) utilizzo appunto i box, di cui riporto l'esempio qui:



Per realizzarli utilizziamo un mix di HTML, CSS e javascript con la libreria JQuery.
Il codice sorgente:

• CSS;
• HTML;
• JS;

Puoi provarlo subito visitando la pagina demo.

5 fantastici design, numero 6

Ogni giorno visito vari siti web per studiarne la grafica e prendere ispirazione.
Catalogo spesso quelli che mi hanno più colpito, quindi condivido questi siti web nel blog, sperando che alcuni possano essere utili anche ad altri.
Continuiamo con altri 5 design :)
1. OH! Media (http://www.ohmedia.ca)



2. VPS Hosting (http://www.howhost.com/en/)



3. BizShark (http://www.bizshark.com)




4. Nine Lion Design (http://www.nineliondesign.com)



5. stopdesign (http://www.tutorial9.net)



Quale preferisci?

Segnalazione articolo: 15 suggerimenti utili per gli sviluppatori PHP

Condivido un articolo che è stato più volte segnalato su twitter, lo ritengo molto utile: sono suggerimenti di base, quindi non così utili per programmatori esperti, ma contiene diversi procedimenti molto comuni.
I 15 punti sono:

1. Inviare un'email in PHP (molto basilare...necessiterebbe di un articolo a parte, comprendente anche l'autenticazione SMTP, etc...);
2. Encoding e decoding di stringhe;
3. Ottenere l'indirizzo IP del client (anche in presenza di un proxy);
   
4. Da secondi a stringhe;
5. Validazione email;
6. Semplice parsing XML;
7. Connessione a un database;
8. Creare e analizzare dati JSON;
9. Gestire il timestamp MySQL;
10. Generare un codice di autorizzazione;
11. Validazione del formato della data;
12. Reindirizzamento HTTP;
13. Mostrare il contenuto di una directory;
14. Ottenere il browser dell'utente;
15. Estrarre un file .zip.

L'articolo è a questo indirizzo.

5 fantastici design, numero 5

Ogni giorno visito vari siti web per studiarne la grafica e prendere ispirazione.
Catalogo spesso quelli che mi hanno più colpito, quindi condivido questi siti web nel blog, sperando che alcuni possano essere utili anche ad altri.
Continuiamo con altri 5 design :)

1. sitemakers Portfolio (http://www.sitemakers.co.uk/portfolio/30/)




2. 45rotale Inc. (http://www.45royale.com/)



3. Prolific Interactive (http://www.prolificinteractive.com/)



4. Web Design Berkshire (http://www.ormanclark.com/)





5. Tutorial9 (http://www.tutorial9.net/)



Quale preferisci?

esempi bash: zenity radiolist e rhythmbox-client

Gli script in bash vanno ben oltre l'idea di semplici sequenze di comandi eseguiti l'uno dopo l'altro.
Si può persino avere GUI, interfacciarsi con altri programmi, mostrare notifiche, barre di scorrimento, finestre di dialogo.
Questo è un esempio di un semplicissimo player che utilizza zenity e rhythmbox-client per controllare un'instanza di rhythmbox.


#!/bin/bash
# Copyright (C) 2009 Lorenzo Sfarra

# Rhythmobx is running?
RHYTHMBOXPID="`pidof rhythmbox`"
if [ "x$RHYTHMBOXPID" == "x" ]; then
# Launch rhythmbox...
rhythmbox &
else
echo "Found a rhythmbox instance with PID: $RHYTHMBOXPID";
fi

RHYTHMBOX="rhythmbox-client --no-start"

# ACTIONS AND INFOS
commands=( Pause Play Next Previous Info Details Close )
actionslist=""
command="zenity --title Player --list --radiolist --column=* --column=Action "

# Add the commands to the list
for act in ${commands[@]}
do
actionslist="$actionslist $act $act"
done
command="$command $actionslist --height 300"


# Infinite loop
while [ 1 ]; do
action="`$command`"
case "$action" in
Pause)
$RHYTHMBOX --pause
;;
Play)
$RHYTHMBOX --play
;;
Next)
$RHYTHMBOX --next
;;
Previous)
$RHYTHMBOX --previous
;;
Info)
# Display track name and track artist
playing="`$RHYTHMBOX --print-playing`"
zenity --info --title "Now playing..." --text "$playing"
;;
Details)
# A detailed list of info about the currently played song
playing="`$RHYTHMBOX --print-playing-format "%tt (%td) from %at (%ay, %ag) by %ta"`"
zenity --info --title "Details about the current track" --text "$playing"
;;
Close)
$RHYTHMBOX --quit
break;
;;
*)
break;
;;
esac
done

#vim: ai ts=2 sw=2 et sts=2

Per vedere il codice formattato e con l'highlight della sintassi, clicca qui.

age += 1

Ogni anno puntualmente succede.
Deve essere un bug, devo segnalarlo su launchpad, è arrivato il momento di risolverlo!

5 fantastici design, numero 4

Ogni giorno visito vari siti web per studiarne la grafica e prendere ispirazione.
Catalogo spesso quelli che mi hanno più colpito, quindi condivido questi siti web nel blog, sperando che alcuni possano essere utili anche ad altri.
Continuiamo con altri 5 design :)

1. branded07 (http://www.branded07.com)



2. Internet Dreams (http://www.netdreams.co.uk/)




3. Blogfullbliss (http://www.blogfullbliss.com)



4. anderbose (http://anderbose.com/)



5. Carrot Creative (http://carrotcreative.com/)

Kubuntu Tutorials Day

Ieri, 29/06/2009 si è tenuto il "Kubuntu Tutorials Day" dalle 19:00 UTC.
Il tutto si è svolto su IRC, canale #kubuntu-devel su FreeNode. Sono disponibili i log di 5 interessanti lezioni:

1. "The next six months with Kubuntu";

2. "Getting into Ruby";

3. "Packaging and Merging with the Ninjas";

4. "Artwork";

5. "Amarok scripting";

Assolutamente consigliata la lettura.

Come tracciare i problemi della comunità di Ubuntu e non solo

È capitato di leggere delle critiche alla comunità italiana di Ubuntu fatte su vari blog e anche integrate nel planet di ubuntu-it.
Sono sempre stato dell'idea che è un modo sbagliato per segnalare qualcosa, per cercare di cambiarla: ovviamente ognuno è libero di scrivere ciò che vuole, per cui mi limito a volte a farlo presente, ma sono un sostenitore della libertà di esprimere il proprio pensiero (ovviamente senza offendere nessuno e nei limiti della legge).
La cosa curiosa è che una situazione analoga si è presentata nella comunità internazionale di Ubuntu, e mi sono trovato molto allineato ai pensieri espressi da Jono Bacon in un articolo sul suo blog: http://www.jonobacon.org/2009/06/27/tracking-ubuntu-community-issues/: consiglio la lettura perchè molto interessante.
Il punto è: come risolvere? La sua proposta è di fornire un sistema di bug tracking anche per i problemi della comunità, in modo che sia possibile identificare il problema, tracciarlo, impostare le priorità, seguirlo e condividere informazioni e idee. Nel Consiglio avevamo pensato a una cosa del genere da alcune settimane, anche se non propriamente come sistema di bug.
Sicuramente questa "coincidenza" a livello internazionale avvalora l'idea che avevamo avuto.
Per quanto riguarda la comunità internazionale, Bacon ha registrato il progetto "Ubuntu Community" su Launchpad.

«Chi vivrà, vedrà..»

5 fantastici design, numero 3

Ogni giorno visito vari siti web per studiarne la grafica e prendere ispirazione.
Catalogo spesso quelli che mi hanno più colpito, quindi condivido questi siti web nel blog, sperando che alcuni possano essere utili anche ad altri.
Continuiamo con altri 5 design :)

1. love the septapus & he shall love unto you (http://leihu.com)


2. CSSZengarden Underthesea (http://www.csszengarden.com/?cssfile=/213/213.css)


3. CSSZengarden Oceanscape (http://www.csszengarden.com/?cssfile=/210/210.css)


4. indiqo media (http://www.indiqo.eu/)


5. Twisted Matrix Labs (http://twistedmatrix.com/trac/)

I 5 errori più "stupidi" nel web design

I 5 errori più "stupidi" che si commettono nello sviluppo di un sito web:

1. mancanza del tag title nella sezione head;
2. immagini senza l'attributo alt;
3. tag non chiusi sia per dimenticanza di un elemento come </div>, sia per la mancanza di un trailing slash come <img src="..." alt="desc"/>;
4. Escape della entità HTML (&, >, <, ");
5. DOCTYPE errato o mancante;

Ce ne sono altri che ritenete siano da aggiungere alla lista?

5 utility e comandi che potresti non conoscere, numero 2

Elencherò alcune utility e comandi più o meno particolari, sarebbe interessante vedere (magari anche scrivendolo nei commenti) chi li conosceva tutti, e se la risposta fosse negativa, quali di questi non conosceva.

1. iotop: "porting" del comando top per controllare l'uso dell' I/O;
2. sudo !!: ripetere il comando dato in precedenza, che non era andato a buon fine per mancanza di permessi;
3. !i: esegui l'ultimo comando che hai usato che comincia con la 'i';
4. $ </var/log/messages grep foo:mettere il file all'inizio del comando in modo da facilitare la modifica della/e stringa/he da cercare;
5. STRING="qualcosa";NAIL="cos";echo $STRING | grep -qi $NAIL && echo "Yes, I found it." || echo "no way, there isn't.": controllare se una stringa è all'interno di un'altra (su idea di Andrea Olivato).

Fine sondaggio: Quante macchine hai in casa (pc, laptop, server, netbook, etc...)?

I dati del sondaggio:



Totale votanti: 39.
Il prossimo sondaggio, per chi fosse interessato, riguarda quanti sistemi operativi hai provato fino a questo momento.