Dator Blog

La nouvelle version de jQuery 1.3 vient de sortir en bêta aujourd’hui.

Dans cette bêta on peut noter plusieurs nouveautés surtout axé sur la rapidité d’exécution des actions et des effets comme par exemple :

• On retrouve le Sizzle de John Resig (Sizzle est une librairie de selecteur CSS).
• Une délégation d’événement en direct.
• Une nouvelle méthode $(’div’).closest(’div’); qui retourne l’élément le plus proche de celui selectionné (ou celui-ci).
• .hide()/.show() ont été ré-écrites augmentant la rapidité de 50 à 200%
• .append()/.before()/.prepend()/.after()  ont été ré-écrites augmentant la rapidité d’exécution de 10 à 15 fois.

Cette nouvelle version promet beaucoup de chose et je suis sur quelle ravira beaucoup de développeur !

• 1 commentaire

The Cloud Player est un lecteur MP3 écrit entièrement en Javascript et plus précisement avec la librairie jQuery.
Ce genre d’application montre toute la puissance du Javascript quand celui-ci est bien maitrisé.

Les musiques présente sur ce site vienne de la banque de son SoundCloud.

• 8 commentaires

J’ai trouvé cela sur Ajaxian, Deploy* permet de générer simplement vos fichiers HTML avec les inclusions CSS et Javascript qu’il faut.

Ce genre de générateur est assez pratique car il simplifie grandement le début de vos applications web.

Deploy* permet de choisir entre :

• Les différents DOCTYPE (Strict / Transitional / Frameset ).
• Les fichiers CSS ( None / Vide / Reset CSS ).
• Les composant de la librairie JQuery.
• Ajout de dossier images, PHP, Flash et includes.

Vous pouvez créer votre base sur le site ou télécharger le petit framework de génération.

• 4 commentaires

Petit trouvaille du jour (ou de la soirée), je viens de trouver un script pour jQuery qui permet de générer des mots de passes sécurisé. De plus ce plugin permet de vérifier la sécurité d’un mot de passe donné.

Voici le code du plugin :

$.fn.passwordStrength = function( options ){
	return this.each(function(){
		var that = this;that.opts = {};
		that.opts = $.extend({}, $.fn.passwordStrength.defaults, options);

		that.div = $(that.opts.targetDiv);
		that.defaultClass = that.div.attr('class');

		that.percents = (that.opts.classes.length) ? 100 / that.opts.classes.length : 100;

		 v = $(this)
		.keyup(function(){
			if( typeof el == "undefined" )
				this.el = $(this);
			var s = getPasswordStrength (this.value);
			var p = this.percents;
			var t = Math.floor( s / p );

			if( 100 < = s )
				t = this.opts.classes.length - 1;

			this.div
				.removeAttr('class')
				.addClass( this.defaultClass )
				.addClass( this.opts.classes[ t ] );

		})
		.after('Generate Password')
		.next()
		.click(function(){
			$(this).prev().val( randomPassword() ).trigger('keyup');
			return false;
		});
	});

	function getPasswordStrength(H){
		var D=(H.length);
		if(D>5){
			D=5
		}
		var F=H.replace(/[0-9]/g,"");
		var G=(H.length-F.length);
		if(G>3){G=3}
		var A=H.replace(/\W/g,"");
		var C=(H.length-A.length);
		if(C>3){C=3}
		var B=H.replace(/[A-Z]/g,"");
		var I=(H.length-B.length);
		if(I>3){I=3}
		var E=((D*10)-20)+(G*10)+(C*15)+(I*10);
		if(E<0){E=0}
		if(E>100){E=100}
		return E
	}

	function randomPassword() {
		var chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$_+";
		var size = 10;
		var i = 1;
		var ret = ""
		while ( i < = size ) {
			$max = chars.length-1;
			$num = Math.floor(Math.random()*$max);
			$temp = chars.substr($num, 1);
			ret += $temp;
			i++;
		}
		return ret;
	}

};

$.fn.passwordStrength.defaults = {
	classes : Array('is10','is20','is30','is40',
        'is50','is60','is70','is80','is90','is100'),
	targetDiv : '#passwordStrengthDiv',
	cache : {}
}

$(document).ready(function(){
	$('input[name="password"]').passwordStrength();
	$('input[name="password2"]').passwordStrength({targetDiv: '#passwordStrengthDiv2',
        classes : Array('is10','is20','is30','is40')});
});

Vous pourrez trouver un exemple d’utilisation à cette adresse.
Il ne faut pas oublier d’inclure la librairie jQuery avant d’utiliser ces morceaux de code.

Grâce à cela, plus besoin de chercher des scripts un peu vieux pour vérifier la sécurité des mots de passes dans vos applications, un plugin pour jQuery existe !

• 3 commentaires

En ce moment les plugins pour jQuery apparaissent de plus en plus vite et il sont de plus en plus impressionnant d’un part pour leurs simplicités et leurs fonctionnalités.

jQuery.spy() permet d’afficher des éléments HTML comme par exemple une liste d’éléments de façon très classe et très intéressante.

En effet ce procédé est optimisé pour le référencement même si le javascript limite 5 élements dans la liste, il sont tous présents dans le HTML.

On peut donc imaginé utiliser ce procédé pour les derniers produits dans un site marchant ou encore les derniers articles d’un blog.

• 2 commentaires

jQuery.popeye() est un plugin jQuery qui permet d’afficher vos images d’une façon quasiment identique à tous les plugins lightbox mais cette fois on peu naviguer dans un carrousel d’image et agrandir l’image voulue.

L’installation de ce plugin est très simple, voici le code HTML :

Et le Javascript :

// jQuery
$(document).ready(function() {
   $('.popeye').popeye(); // on active le plugin en prenant la classe mis dans le html
});

En utilisant la classe CSS popeye on active le plugin et on peut désormais naviguer dans nos photos de façon très simplifié et joli !

• 1 commentaire