Digital Fashion - javascript

Google Gears

Geoffrey — Thu, 31 May 2007 10:09:00 +0200

La dernière petite roxitude de google: Google Gears, une extension firefox qui embarque une base SQLite pour faciliter le développement d'applications offline.

on en parle là, là et puis aussi là.

Éviter les appels de fonction en double en javascript

Geoffrey — Thu, 12 Apr 2007 13:22:00 +0200

Dans un accès de désespoir vu l'activité débordante de ce blog en ce moment, je me lance et je vous propose cette petite librairie javascript qui va vous permettre d'éviter les appels de fonction en double:

var Defer = {
	config: {
		defaultTimeout: 1000
	},
	stack: {},
	schedule: function(id, fn, timeout) {
		if (typeof(timeout) == 'undefined') {
			timeout = Defer.config.defaultTimeout;
		}
		if (typeof(Defer.stack[id]) == 'undefined') {
			Defer.stack[id] = {defer: false, fn: fn, timeout: timeout };
			window.setTimeout('Defer.execute(\'' + id + '\')', timeout);
		} else {
			Defer.stack[id].defer = true;
		}
	},
	execute: function(id) {
		if (typeof(Defer.stack[id]) != 'undefined' && !Defer.stack[id].defer) {
			Defer.stack[id].fn();
			Defer.stack[id] = undefined;
		} else {
			Defer.stack[id].defer = false;
			window.setTimeout('Defer.execute(\'' + id + '\')', Defer.stack[id].timeout);
		}
	},
};

On peut l'utiliser ainsi par exemple (jquery requis):

$(document).ready(function() {
	$('#nickname').keyup(function() {
		Defer.schedule('chknickname', function() {
			$.get('/account/check_nickname.php', { nickname: $('#nickname').val() }, function(data) {
				data = eval(data);
				$('#nickname_availability').html(data ? 'Pseudo disponible' : 'Pseudo indisponible');
			});
		}, 2000);
	});
});

Concrétement, ce bout de code attache à un input un événement qui ne sera executé que s'il n'est pas répété avant une certaine période (2 secondes ici). C'est à dire qu'on évite de faire une requête xmlhttp à chaque keyup, on attend plutot que l'utilisateur arrête de taper un moment avant de balancer la sauce. A noter que de par la méthode utiliser, l'espace de nommage d'execution de la fonction change (par exemple ici, on ne peut pas utiliser this pour accéder a l'input).

Voila voila.

Le firebug nouveau est arrivé

Geoffrey — Tue, 05 Dec 2006 11:05:00 +0100

Firebug 1.0b1 est sorti. Et il est bien (tm).

Liens du jour

Geoffrey — Wed, 30 Aug 2006 14:29:00 +0200

Liens en vrac:

MySQL DBA, le blog d'un DBA de chez flickr.
Serving Javascript Fast, par un développeur de chez flickr (décidément...) A noter que cet article parle des méthodes de cache d'une manière assez généraliste pour être appliquée à autre chose que du JavaScript, et n'oubliez pas non plus de lire les commentaires, il y en a de très interressants.
AJAX & Protoype: A Primer, explication simple et claire sur l'utilisation d'AJAX et des Classes avec Prototype.
Akra's Devnotes: Zend Framework, la catégorie Zend Framework du blog de Rob Allen, très interressante.

Tracs en vruc

Geoffrey — Wed, 15 Mar 2006 08:47:41 +0000

Comme dirait l'autre :)

McAfee : une mise à jour boiteuse supprime Excel, ahah.
Re: Possible to get the administrator password ?, un peu moins drole (enfin ça dépend des gouts hein).
Google Mars, jolies images.
style Object, la référence ultime de Element.style sous IE.
logahead: affaire à suivre.

Sélectionner dans un select multiple avec des checkbox

Geoffrey — Thu, 16 Feb 2006 13:10:03 +0000

Un petit exemple vaut mieux qu'un grand discours :-)

var recognizePattern = 'autoselect-';
 
var inputCollection = document.getElementsByTagName('input');
var collectionLength = inputCollection.length;
 
for (var j = 0; j < collectionLength; j++) {
 
	var myInput = inputCollection[j];
 
	if (myInput.getAttribute('type') == 'checkbox' && myInput.getAttribute('id').indexOf(recognizePattern) == 0) {
 
		myInput.addEventListener('change', function() {
 
			var mySelect = document.getElementById('slt');
			var optLength = mySelect.options.length;
 
			var re = new RegExp(this.getAttribute('id').substr(recognizePattern.length));
 
			for (var i = 0; i < optLength; i++) {
 
				if (re.exec(mySelect.options[i].text)) {
 
					mySelect.options[i].selected = this.checked;
 
				}
 
			}
 
		}, false);
 
	}
 
}

Considérations nocturne sur PHP

Geoffrey — Sat, 28 Jan 2006 03:49:56 +0000

Souvent le week end, je fais une nuit blanche du samedi au dimanche pour travailler. Bon ok, là on est la nuit de vendredi à samedi, et je vais pas tarder à aller me coucher, mais quand même. Bon enfin de toute façon c'est pas le sujet. Le truc, c'est que du coup je suis obligé de me taper la compagnie de Christophe, et je crois que finalement, c'est avec lui que j'ai le plus de discussions en rapport avec le nom du chan sur lequel on traine (#phpmafia (d'ailleurs, note pour plus tard: renouveler phpmafia.net, ça urge)).

On va commencer par parler du chroot. En gros, j'ai émis l'idée qu'une fonction chroot builtin serait utile. Elle existe, mais ne fait pas exactement ce que je veux, ou du moins pas comme je le veux. En l'état actuel des choses, elle execute un vrai chroot, et n'est donc utilisable qu'avec les droits root, ce qui est bien, mais pas top. Le but ultime serait d'éviter tout risque de faille du type remote file access, alors si c'est pour me taper a coté de ça des remote code execution with privilege escalation, ben ça perd de son interêt.

Deuxième challenge, implémenter la structure with() en PHP. Pour ceux qui ne connaissent pas, un petit dessin en javascript:

with(document) {
	getElelementById('foo');
}

Bon, l'exemple que je viens de donner ne sert a rien, mais je pense qu'on comprend tout de suite le but de la structure sus-citée. J'aimerai donc pouvoir disposer de la même chose en PHP. Etant donné que je n'ai pas les compétences C requises, la seule solution qu'il me reste est de l'implémenter d'une manière ou d'une autre en PHP. C'est d'autant plus complexe que je m'impose le cahier des charges simples mais strict suivant:

Conserver les références
Ne pas casser la coloration syntaxique
Ne pas avoir une syntaxe trop tarabiscotée

Ce qui exclut une solution du genre:

$object = new Object();
$with = array('method();', 'autremethode();' 'foo = "bar"');
foreach($with as $item) { eval('$object->' . $item); }

Puisque ça casse la coloration syntaxique. J'ai pensé a un truc genre:

function foo() {
	method();
	foo = 'bar';
}
 
with(new Object, 'foo');

Mais j'ai des doutes sur la faisabilité de la chose. A voir si on peut en tirer quelque chose via l'API de Réflexion (décidemment je l'aime bien celle là).

Dernière chose, on aimerait bien avoir des trucs genre bash, par exemple pouvoir faire:

require_once('header-*.php');
require('{foo,bar}.php');

Voilà voilà, petit papa noël, si tu passes par là...

Prototype + Behaviour = Magie

Geoffrey — Sat, 21 Jan 2006 22:37:05 +0000

Behaviour.register({
 
	'#checkall': function(el) {
	
		el.style.display = 'block';
		el.onclick = function() {
		
			$$('input.delete').each(function(element) { element.checked = $F('checkall'); });
		
		}
	
	}
	
});

Franchement, j'aime.

EDIT: A la demande générale, un exemple :-) A savoir: la version que j'utilise de prototype est partiellement tirée du SVN. Et oui, $$ n'est pas encore disponible dans prototype release (ainsi que String.strip(), nécessaire à $$).

Prototype gets selector magic

Geoffrey — Thu, 19 Jan 2006 10:38:44 +0000

via miraculous:

On en rêvait tous, c'est désormais chose faite: le support de getElementBySelector a été ajouté à prototype via la fonction $$ \o/

On a plus qu'a attendre l'intégration de la librairie Behaviour :p

La panoplie du parfait petit web2.0developer

Geoffrey — Fri, 13 Jan 2006 10:24:13 +0000

Pour ceux que ça interresse, une sélection de quelques outils pour développer des sites web2.0 enabled^[1] .

Le framework Prototype, avec sa documentation
La librairie script.aculo.us, basée sur prototype
La fonction cssQuery, pour sélectionner des éléments via des sélecteurs CSS
Behavior, pour du javascript non-obtrusif
Le blog de Dean Edwards en général, et en particulier ses billets sur la gestion de window.onload

J'en profite pour noter ça sur mon wiki.

Notes

[1] Bien que je ne cautionne pas le terme web 2.0 ou tous les buzz qui tournent autour des technologies sous-jacentes, force est de constater que ce terme est bien pratique quand on veut parler des technologies sus-évoquée