Ext.js 2.0: Javascript à son meilleur

Les amateurs d’Ajax et de web dit 2.0 conaissent probablement déja les bibliothèques que sont prototype ou encore scipt.aculo.us.
Ext.js est plus qu’une simple bibliothèque, c’est un véritable framework permettant de créer notamment des composants tels que des grilles, accordéons, etc…
Le site du projet présente de nombreuses démos, de la simple pop-up au web-os. Impressionnant.

Ext est soumis au termes de la licences GPL 3 pour toute utilisation open-source. Dans le cadre d’une utilisation commerciale, d’autres licences sont disponibles. De nombeuses grosses boites font déja appel à ce framework, comme par exemple IBM, Activestate ou encore Adobe. Pour les blogueurs, un thème Wordpress utilisant Ext est disponible ici. Interessant bien qu’à mon avis peu adéquat dans le cadre d’un blog.

Je n’ai pas (encore?) testé Ext.js moi-même, mais le code à l’air franchement accessible. On poura jeter un oeuil à la page http://www.geekdaily.net/projects/ext/accordion/ pour s’en rendre compte.

La source js de l’exemple cité ci-dessus:

if(!Ext.plugins) { Ext.plugins = {}; }
Ext.plugins.Accordion = function(params) {
	var container = Ext.get(params.container);
	var panels = Ext.select("#" + params.panels + " > div");
	var panel;
	var panelArray = [];
	var panelWidth = (params.width != null) ? params.width : “auto”;
	var panelHeight = (params.height != null) ? params.height : “auto”;
	var element;
	for(var i=0;i<panels.getCount();i++) {
		element = panels.elements[i];
		panel = new Ext.Panel({
			title: element.title,
			collapsible: true,
			renderTo: container,
			width: panelWidth,
			height: panelHeight,
			html: element.innerHTML
		});
		panelArray.push(panel);
		if(element != panels.elements[0]) {
			panel.collapse(false);
		}
	}
	for(var i=0;i<:panelArray.length;i++) {
		panelArray[i].on(”beforeexpand”,function() {
			for(var i=0;i<panelArray.length;i++) {
				panelArray[i].collapse(true);
			}
		});
    }
};

Ext.onReady(function(){
	var nav = new Ext.plugins.Accordion({
		container: “navigation”,
		panels: “panels”,
		width: 200,
		height: 200
	});
});

Dans un monde ou l’on recherche toujours la meilleure interactivité avec l’utilisateur, il y à fort à parier que Ext.js à de beaux jours devant lui. Vivement que je teste!