Dator Blog

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

Un nouveau plugin de taille vient de faire son apparition dans la communauté jQuery. Il s’agit d’un plugin qui permet, à partir d’une liste de sites prédéfinis, savoir si vos visiteurs ont déjà visité un des sites.

Par exemple, vous avez dans la liste Digg, Facebook, si vous avez déjà utilisé un des deux services, leurs noms apparaitront dans la liste.

SocialHistory est une véritable avancé car comme vous le savez surement il est impossible de naviguer dans l’historique d’une personne avec le Javascript (ni le PHP d’ailleur).

En faite, le javascript va creer une iframe, mettre une couleur CSS spéciale sur la propriété CSS a:visited qui va permettre de détecter si la personne à déjà visité ce site. Pas mal non?

Mais on peut aussi détourner le script … si on peut voir les sites visités par un internautes, on peut voir si il a visiter un site à caractère pornographique. Intéressant non? Un ami qui tiens un petit blog à rédiger un tutorial pour modifier ce script.

• 2 commentaires

Voici le genre d’application développé en javascript que je trouve marrante et plutôt bien conçue. JS-909 permet de pouvoir faire de la musique (très basique) à partir d’une banque de son intégré, et le résultat est vraiment sympatique.

• 2 commentaires

Voici un clone du plugin Ligthbox pour jQuery. Celui-ci est plutôt bien réalisé et je doit dire, est très joli visuellement.

• 1 commentaire