Addon Firefox: Content Encoding Detector 0.4b

Dans le but de promouvoir un web plus rapide et donc plus respectueux de ses utilisateurs, je viens de créer un petit Addon Firefox qui promeut l’encodage des pages en GZIP.

Cet encodage permet de réduire drastiquement le poid des fichiers transférés entre le serveur web et votre navigateur.

Capture d'écran - Content Encoding Detector

Point de vue technique :

L’addon Content Encoding Detector soumet l’url de la page que vous visitez au service JSON-HEAD de Simon Willison.

Si le serveur retourne l’http_header “Content-Encoding”, l’icône de status Firefox est mise à jour pour refléter l’encodage.

L’addon est en cours de validation mais vous pouvez déjà le télécharger à sa page Mozilla Addons.

tag: ContentEncoding

Geotagging Bookmarklet

ou I CAN HAZ GEOTAGZ?

Status actuel de la géolocalisation :

Geotag bookmarklet

Via les spécifications disponibles et méthodes les plus faciles, je viens donc d’écrire un bookmarklet qui rajoute votre position géographique dans n’importe quel page web.

GeoTag Bookmarket

Pour l’installer, il suffit de glisser déposer le lien ci-dessus dans votre barre de favoris.

En cliquant dessus, le bookmarket rajoutera votre position (s’il la trouve) au premier champ textarea de la page que vous visitez. Parfait pour Twitter.com

Le script de mon Geotag bookmarklet

var GT=(function(){
	var P=4,u="undefined",d=document;
	var format=function(n,c){
		var m=Math.pow(10,c);
		return Math.round(n*m)/m;
	};
	var addMarker=function (p){
		var t=d.getElementsByTagName("textarea")[0];
		if(t.value.indexOf("#geo")<0){t.value+="#geo:"+format(p.latitude,P)+","+format(p.longitude,P);}
	};
	this.getLocation=function(){
		var p=google.loader.ClientLocation;
		if (p!==null){addMarker(p);}
	};
	this.tag=function(){
		if(typeof(navigator.geolocation)!=u){
			//https://developer.mozilla.org/En/Using_geolocation || geode
			navigator.geolocation.getCurrentPosition(function(p){addMarker(p);});
		} else {
			////code.google.com/apis/ajax/documentation/#ClientLocation
			if (typeof(google)==u){
				var jsapi=document.createElement("script");
				jsapi.src="//www.google.com/jsapi?callback=GT.getLocation";
				d.getElementsByTagName("body")[0].appendChild(jsapi);
			}
		}
	};
	return {tag:tag,getLocation:getLocation};
})();
GT.tag();

Mon script vérifie si l’objet navigator.geolocation existe (donc, si c’est FF3.1b2 ou si Firefox a l’addon Geode installé), sinon, il utilisera les méthodes fournies par le JSAPI de Google.

Bugs connus :

  • Si vous passez par un server proxi pour vous connecter à internet ou si simplement les services de géolocalisation ne reconnaissent pas, aucun tag ne sera affiché.
  • Internet Explorer 6 ne supporte pas les longs bookmarklets, je vous recommande donc d’installer un autre navigateur.
  • La géolocalisation avec Firefox 3.1 beta 2 ne marche pas encore super bien.
  • Je limite la précision à quatre décimales.
  • J’emploie le système de géotagging employé BrightKite (par soucis de brièveté pour le status Twitter #geo:<lat>,<long>) et pas celui recommandé par Flickr (geo:lat=<lat>,geo:lon=<long>)

Liens relatifs :

Signature automatique sur un blog

Quand je vois le nombre de signatures sur les commentaires de blogs, je me dis qu’un petit script pour automatiser les signatures serait le bienvenu.

Prérequis

Quelques ingrédients sont nécessaires pour avoir une signature automatique :

Amicalement, Greasemonkey

Greasemonkey est une extension qui vous permet d’écrire des scripts pour modifier les pages que vous visitez.

Voici le script :

//&lt;![CDATA[
// ==UserScript==
// @name		Amicalement Greasemonkey
// @author		Marin Gatellier
// @namespace	//www.gatellier.be/blog/
// @description	Ads your signature into textareas
// @include		*
// ==/UserScript==
(function(){
	var t=document.getElementsByTagName("TEXTAREA");
	var signature="\n\nAmicalement,\nGreasemonkey";
	for (var i=0,j=t.length;i&lt;j;i++){
		if (t[i].value.indexOf(signature)&lt;0){
			t[i].value=t[i].value+signature;
		}
	}
})()
//]]&gt;

Vous devez évidemment modifier la variable signature (ligne 10) avec votre propre signature.

Petites astuces :

\n
représente une nouvelle ligne
\t
représente un tab
\\
représente un backslash

Une fois installé, ce petit script ajoutera automatiquement votre signature à chaque textearea de chaque site web (peut être customisé par site)

Installer le script Amicalement Greasemonkey

Rétablir l’ancienne icône de status de Firebug

Firebug, l’excellente extension Firefox de Joe Hewitt, n’est compatible avec Firefox 3 que dans sa version 1.2 beta.

Cette nouvelle version apporte plein de changements sous le capot mais aussi une nouvelle icône de status qui me chipote un peu.

La nouvelle icône de status de Firebug, qui reprend le logo Firebug, passe vraiment inaperçue. Elle manque vraiment de contraste par rapport aux autres icônes qu’on pourrait avoir dans la barre de status.

Manque de contraste de la nouvelle icône Firebug
La nouvelle icône de status Firebug passe inaperçue.

La bonne nouvelle c’est que, vu l’architecture des Addons Firefox, l’ancienne icône peut être facilement rétablie.

Localisation du fichier CSS de Firebug.

Pour ce faire, il faut trouver et éditer la CSS qui gère la présentation de Firebug.
Sur Windows, par défaut, elle se trouve dans le répertoire :

C:\Documents and Settings\User\Application Data\Mozilla\Firefox​\Profiles\la1xxvhe.default\extensions\firebug@software.joehewitt.com​\skin\classic\firebug.css

Les parties en italiques sont des parties qui différeront sur votre PC.

Sur MacOS, il faut chercher un petit peu, l’explication se trouve sur le site de support Mozilla.

Edition du fichier CSS.

Pour rétablir l’ancienne icône de Firebug, j’ai simplement quitté Firefox puis remplacé les lignes suivantes dans le fichier CSS :

#fbStatusIcon {
    list-style-image: url(chrome://firebug/skin/firebug-gray-16.png);
}
#fbStatusIcon[jsd="on"] {
    list-style-image: url(chrome://firebug/skin/firebug16.png);
}
#fbStatusIcon[net="on"] {
    list-style-image: url(chrome://firebug/skin/firebug16.png);
}
#fbStatusIcon[errors="on"] {
    list-style-image: url(chrome://firebug/skin/firebug16.png);
}

par :

#fbStatusIcon {
    list-style-image: url(chrome://firebug/skin/disabledIcon.png);
}
#fbStatusIcon[jsd="on"] {
    list-style-image: url(chrome://firebug/skin/okIcon-sm.png);
}
#fbStatusIcon[net="on"] {
    list-style-image: url(chrome://firebug/skin/okIcon-sm.png);
}
#fbStatusIcon[errors="on"] {
    list-style-image: url(chrome://firebug/skin/okIcon-sm.png);
}

L'ancienne icône Firebug est rétablie

Et hop, une fois Firefox redémarré, l’ancienne icône, beaucoup plus visible, est restaurée.

Liens relatifs :

Extensions Firefox d’un Intégrateur

Tout comme j’ai exposé ma liste de plugins WordPress, je profite de la sortie imminente de Firefox 3 pour faire un status des extensions que j’emploie sur mon butineur préféré au travail.

Ma version: Firefox 2.0.0.14 (2008040413)

Operating System: WINNT (x86-msvc)

Je teste aussi évidemment mon code sur IE 6, 7, 8 (et des fois sur 5.5), Opera 9.27, 9.5b, FF 3RC1, Safari etc…

Next Page →