Addy Osmani a publie un tutoriel dans lequel il montre comment créer une galerie de photos avec jQuery et CSS3. L’effet est intéressant pour afficher des photos « polaroides ».

Screencast: http://screenr.com/Z0W
Démo: http://www.addyosmani.com/resources/shinetime
Telechargement: http://www.addyosmani.com/resources/shinetime/shinetime.1.01.zip

La premiere version alpha de jQuery Mobile est releasee. jQueryMobile est un framework pour créer des interfaces utilisateur qui est basé sur jQuery, simplifiant le processus de développement des applications mobiles.

L’équipe a fait un bon progrès après deux mois du début du projet. Plusieurs composants, layouts et outils on été créées :

• Thèmes et Layout
• Headers/Footers (Fixes et Persistents)
• contrôles de formulaires
• boites de dialogue
• listes
• événements
• transitions

jQueryMobile est base entièrement sur le principe de l’amélioration progressive (progressive enhancement) et est concu donc pour etre fonctionnel sur tous les navigateurs mobiles supportant HTML.

La documentation et la démonstration du premier release peut etre trouvee dans cette applicationn  unifiée a telecharger :

• jQuery Mobile 1.0a1 Demo et Documentation

Tympanus.net présente un tutoriel assez cool qui montre comment développer en jQuery un  Previsualiseur de nouvelles qui vous permet d’afficher dans un mode compact une série d’articles. Les articles sont affichés en liste avec pagination. Le clic sur un item affiche la description et un lien vers le détail complet de l’article. Le skin est personnalisable via CSS.

• Le tutoriel : http://tympanus.net/codrops/2010/10/03/compact-news-previewer/
• La demonstration : http://tympanus.net/Tutorials/CompactNewsPreviewer/
• Telechargement : http://tympanus.net/Tutorials/CompactNewsPreviewer/CompactNewsPreviewer.zip

Voici une librairie que j’ai longtemps cherchée! phpQuery est un portage de la populaire librairie Javascript jQuery en PHP. phpQuery offre une multitude de fonctionnalités excellentes, tournant pour la majorité par rapport a la manipulation du DOM. Avec phpQuery, vous pouvez chercher les noeuds fils d’un noeud donné, appliquer des filtres de recherche ou encore manipuler les éléments d’un formulaire.

phpQuery est très utile quand vous avez a manipuler du html cote serveur.

Ce qui est vraiment intéressant c’est que la librairie est a jour et elle suit exactement la meme syntaxe que jQuery. Par exemple :

1
2

// remplace tous les liens par "newVal", enleve la classe CSS "className" et met le texte du lien a "newHtml"
pq('a')->attr('href', 'newVal')->removeClass('className')->html('newHtml');

La technique de chaining en utilisant les « fluent interfaces » permet d’avoir une syntaxe lisible et minimise le nombre de lignes.

Instanciation et chargement

Les methodes newDocument* et newDocumentFile* permettent respectivement de charger du contenu depuis une chaine de caractères ou un fichier. Exemple :

1
2
3

// charge un document XHTML
phpQuery::newDocumentFileXHTML('my-xhtml.html')->find('p');
$ul = pq('ul');

il est possible de charger du contenu/fichier HTML, XHTML, XML et PHP.

Ajax

Il est possible d’effectuer des appels Ajax et récupérer des éléments html. Par exemple :

1
2

// permet de charger les elements qui ont une classe .inline-selector depuis http://somesite.com/page et les affecte a l'element #element
pq('#element')->load('http://somesite.com/page .inline-selector') ...;

getJSON, get, post et getScript sont aussi disponibles!

Support PHP5

La librairie implémente quelques classes SPL comme Countable, ArrayAccess et Iterator. C’est possible donc de faire un truc du genre :

1
2
3
4
5
6
7
8
9
10
11

// recupere tous les li dont la ul liste a la classe 'im-the-list'
$LIs = pq('ul.im-the-list > li');
if (count($LIs)) {
	foreach($LIs as $li) {
  		pq($li)->addClass('foreached');
	}
}
 
$pq = phpQuery::newDocumentFile('somefile.html');
// print first list outer HTML
print $pq['ul:first'];

Excellent non ?

CLI

phpQuery peut être utilisée en ligne de commande. Exemple :

1
2
3

phpquery 'http://code.google.com/p/phpquery/downloads/list?can=1' \
  --find '.vt.col_4 a' --contents \
  --getString null array_sum

Plugins

phpQuery est aussi extensible via un système de plugins. Deux bons exemples de plugins sont jQueryServer et WebBrowser.

Conclusion

phpQuery est une librairie extrêmement puissante. La documentation est également disponible sur la Wiki du site officiel de phpQuery

Google Buzz Widget est un plugin jQuery qui vous permet d’utiliser google buzz dans votre page web. Puisque google Buzz n’offre pas de format JSON pour ses feeds, le plugin utilise plutôt l’API  Google AJAX Feed API pour convertir en JSON. Après avoir recueilli le contenu, il a ajoute le contenu dans une liste pour l’afficher dans votre page web.

Le widget jQuery Google Buzz est un plugin compatible avec plusieurs navigateurs. L’affichage est évidemment personnalisable via les options de configuration.

Plus d’informations sur le site web de Google Buzz Widget.

TomatoCMS est un Gestionnaire de contenu (CMS) open source développé avec  Zend Framework, jQuery et 960 Grid System. Il implémente une architecture MVC et suit des principes de design approuves. TomatoCMS est aussi doté d’un système de plugins/hooks afin d’améliorer l’extensibilité via des widgets. Le système de template permet au site d’avoir de multiples templates, de plus, un template peut avoir plusieurs skins.

Fonctionnalités / options

• Éditeur de layout
• Administration des modules simple
• Extensible (système de plugins/hooks)
• multi-template et multi-skin
• multilangue
• Permet la réécriture d’URLS
• Outils pour builder un sitemap
• permet d’implémenter des rôles et des responsabilités via un ACL (Access control list)

TomatoCMS requiert un serveur Apache, MySQL 5.0 ou plus, PHP 5.2 ou plus.

Information, demo, documentation & download sur TomatoCMS.

jQuery Slider plugin est un plugin jQuery simple d’utilisation et multi-fonctionnel. Il permet d’afficher des éléments selectionnables dans des glissières (slides). Le plugin offre plusieurs options de style de pointeur, d’étapes, de dimension, de limites et d’échelle. Vous pouvez aussi personnaliser le thème des glissières. Le plugin est sous une licence gratuite.

Demo: http://blog.egorkhmelev.com/2009/11/jquery-slider-safari-style/

Reel Plugin est un plugin jQuery qui permet d’afficher une vue en 360 degrés de vos images sans avoir a utiliser des techniques Flash. Tout ce dont vous aurez besoin est de collecter un ensemble de frames pour votre vue. Le plugin est compatible avec la majorité des navigateurs  : Safari 3+, Firefox 3+, Chrome et IE 5.5+. La syntaxe d’utilisation est facile et intuitive puisque le plugin expose une seule methode. Il offre aussi la possibilite de redefinir les options par défaut.

Fonctionnalités

• support du scroll de souris
• compatible avec votre CSS existant
• support de la majorite des navigateurs

Le plugin est developpe par  Petr Vostrel et est disponible sous une double licence MIT et GPL.

Plus d’infos, telechargement et demo sur le site de Reel Plugin.

jParse est un plugin jQuery pour parser du XML retourne par la méthode .ajax de jQuery.

Il peut sélectionner la valeur de n’importe quel nœud ou de ses attributs. Aussi, il permet d’afficher du code HTML personnalisable. Le plugin offre plusieurs fonctionnalités:

• exécuter des fonctions de callback avant et apres la requete
• contrôler le nombres d’éléments processées
• exclure les nœuds avec certains mots, nombres ou symboles
• Afficher le nombre d’éléments dans le document

Il est a noter que du fait que la méthode jQuery .ajax ne permet pas d’effectuer des requêtes sur des domaines externes, le fichier XML doit être sur le même domaine.

Galleriffic est un plugin jQuery qui offre une expérience riche et optimisée pour gérer un grand volume de photos en conservant la bande passante. Il est simple a installer, marche sur la presque totalité des navigateurs. Il est aussi extensible.

Parmi les fonctionnalités offertes on retrouve :

• la navigation pour les thumbnails via une pagination,
• Une optimisation dans le chargement des images (chargement des images après que la page aie été chargée)
• Friendly Urls par image
• Navigation par clavier
• Evenements pour permettre d’ajouter des effets de transition personnalisables

L’extension est développée par  Trent Foley sous une licence  MIT.

Les demos et le telechargement sur  Le site du plugin jQuery Galleriffic.