Difficile de ne pas écrire un petit quelque chose après le blogue de Hugues… Pour une démonstration à un client potentiel j’ai conçu une page d’accueil pour un portail d’intranet fournissant des blocs d’informations très similaire à l’accueil personnalisé de google. Dans le concept d’un intranet où les intérêts des différents utilisateurs varient ce concept est très prometteur. Chaque utilisateur sélectionne les sources d’informations relative à son travail et adapte sa page d’accueil à ses besoins. Bon assez de flafla et place à la démo. Si vous suivez ce lien vous trouverez la page en question. Chaque bloc d’information peut être déplacé, presqu’à volonté, sur la page. Malgré l’effet le truc derrière la page est relativement simple. Trois éléments importants permettent d’obtenir cet effet. Premièrement la capacité pour le navigateur web de déplacer dynamiquement les éléments de la page. Cette partie est géré par la fonction sortable_element du module ActionView::Helpers::ScriptaculousHelper. Cette fonction créé le code javascript qui active l’effet de tri de Scriptaculous. Avec l’aide d’un peu de code sur le serveur on peut alors mémoriser l’emplacement des éléments de la page. Le deuxième élément est un changement CSS qui permet aux blocs de la page de vraiment s’aligner un à côté de l’autre plutôt qu’un à la suite de l’autre. On obtient cet effet par l’attribut float sur l’élément LI le reste des attributs de la liste cette liste en une série de blocs. Le code sur le serveur est le troisième élément de cet effet. Il sert à la mémorisation ainsi qu’au rendu de la page (c’est bien beau de les déplacer dans le navigateur mais si la page reprends son aspect initial lorsqu’on y retourne on brise l’expérience de l’utilisateur). Il reste bien sûr à ajouter les éléments html et le code pour l’ajout et le retrait des blocs d’informations mais le cœur de l’effet est bien en vue dans cette démo.
