Scapture.com v. 0.9 bêta 1

Ce petit article ne parle pas vraiment du fonctionnement de scapture, il s'agit plutôt d'exposer une petite bricole qui peut s'avérer utile si vous manipulez des pages Web avec Firefox.

Depuis Firefox 1.5, il est possible d'utiliser une balise canvas pour dessiner diverses formes (graphiques, images, logo...) via Javascript.
Ainsi, parmi l'infinité de possibilités offertes, il est possible de rendre dans une balise canvas une page web.

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.drawWindow(window, 0, 0, 100, 200, "rgb(0,0,0)");

Voir l'introduction à canvas sur developer.mozilla.org

L'extension Tab Preview montre que l'on peut faire des choses très intéressantes avec canvas et les fenêtres du navigateur.

Problématique

Malheureusement, le contenu des plug-ins n'est pas pris en charge (bug n° 313462). Il existe une solution pour flash, il s'agit d'ajouter l'attribut wmode=transparent aux éléments <embed>. D'après ce que j'ai compris du fonctionnement du plug-in flash, ce paramètre force le plug-in à utiliser un canal de communication spécial afin que la couleur d'arrière plan puisse être prise en compte. Accidentellement, cela permet à drawWindow de dessiner le contenu du plug-in.

Cette solution n'est donc efficace que si l'on peut modifier le contenu de la page pour modifier l'attribut wmode.

Bricolage et solution

Afin de modifier automatiquement toutes les animations flash je me suis basé sur l'extension block flash (initiée par Jesse Ruderman sur cette page), dont le principe est d'utiliser les styles personnels pour bloquer les animations flash.

J'ai d'abord repris le style qu'il donne sur sa page (à placer dans votre_profil/chrome/userContent.css) :

object[classid$=":D27CDB6E-AE6D-11cf-96B8-444553540000"],
object[codebase*="swflash.cab"],
object[type="application/x-shockwave-flash"],
embed[type="application/x-shockwave-flash"],
embed[src$=".swf"]
{ -moz-binding: url("http://www.scapture.com/documents/modflash.xml#ctv");}

Seule l'URL a été changée pour pointer sur http://www.scapture.com/documents/modflash.xml qui est une version modifiée du fichier de Jesse Ruderman permettant d'ajouter le paramètre wmode=transparant automatiquement à toutes les pages.

Le fichier XML peut bien sûr être enregistré en local pour en accéler le chargement.

En images

Par défaut le contenu d'une vidéo sur YouTube ne peut s'afficher avec l'extension Tab Preview.

Avec notre modification, la vidéo est parfaitement rendue.

Si vous avez une meilleure solution ou des améliorations à apporter, n'hésitez pas à m'en faire part.