--- a/web/static/res/js/incmosaic.js	Mon Jan 21 21:00:24 2013 +0100
+++ b/web/static/res/js/incmosaic.js	Mon Jan 21 21:04:36 2013 +0100
@@ -15,8 +15,10 @@
 	this.listeUrls = [];	// The images list to blend
 	this.pairImages = [];
 	this.imagesLoaded = 0;
+	this.imageLoadedIndex = -1;
 	this.imageWidth;
 	this.imageHeight;
+	this.postFirstImageCallback;
 
 	// Effect
 	this.waitStartEffectTime = 3000;
@@ -45,7 +47,7 @@
 		this.imageUrls.push(url);
 	};
 
-	this.start = function(canvasId, effectSpeed, squareCountX, squareCountY, loop, waitStartEffectGo, endEffecFunc)
+	this.start = function(canvasId, effectSpeed, squareCountX, squareCountY, loop, waitStartEffectGo, endEffecFunc, postFirstImageCallback)
 	{
 		// Canvas ID
 		this.canvasId = canvasId;
@@ -64,6 +66,9 @@
 		// Does the effect wait for go
 		this.waitStartEffectGo = waitStartEffectGo;
 
+		// callback to call after the load of the first image
+		this.postFirstImageCallback = postFirstImageCallback;
+
 		// Init the canvas objects
 		this.init();
 
@@ -150,13 +155,13 @@
 
 		if (this.pairImages.length == 0) {
 			this.imagesLoaded = 0;
-			this.pairImages.push(this.getImageFromUrl(this.listeUrls[0]));
-			this.pairImages.push(this.getImageFromUrl(this.listeUrls[1]));
+			this.pairImages.push(this.getImageFromUrl(this.listeUrls[0], 0));
+			this.pairImages.push(this.getImageFromUrl(this.listeUrls[1], 1));
 			this.listeUrls.remove(0);
 		} else {
 			this.imagesLoaded = 1;
 			this.pairImages[0] = this.pairImages[1]; // Swap
-			this.pairImages[1] = this.getImageFromUrl(this.listeUrls[0])
+			this.pairImages[1] = this.getImageFromUrl(this.listeUrls[0], 999)
 		}
 		this.listeUrls.remove(0);
 
@@ -180,15 +185,30 @@
 	{
 		var self = incMosaic;
 
-		if (self.imagesLoaded == 2) {
+		if (self.imagesLoaded === 2) {
 			// Redraw
 			self.redraw();
+		} else if (self.imageLoadedIndex === 0) {
+			// Draw first image
+			self.drawFirstImage();
+			self.imageLoadedIndex = -1;
 		}
 
 		// Loop
 		requestAnimationFrame(self.loopCallback);
 	};
 
+	this.drawFirstImage = function()
+	{
+		// Draw the first image
+		this.ctx.drawImage(this.pairImages[0], 0, 0, this.srcSquareWidth*this.squareCountX, this.srcSquareHeight*this.squareCountY, 0, 0, this.squareWidth*this.squareCountX, this.squareHeight*this.squareCountY);
+
+		if (this.postFirstImageCallback !== null) {
+			this.postFirstImageCallback();
+			this.postFirstImageCallback = null;
+		}
+	};
+
 	this.redraw = function()
 	{
 		// Get time
@@ -196,8 +216,7 @@
 
 		var timeToWait = (this.startTime + this.waitStartEffectTime)*this.effectSpeed;
 		if (time < timeToWait || this.waitStartEffectGo) {
-			// Draw the first image
-			this.ctx.drawImage(this.pairImages[0], 0, 0, this.srcSquareWidth*this.squareCountX, this.srcSquareHeight*this.squareCountY, 0, 0, this.squareWidth*this.squareCountX, this.squareHeight*this.squareCountY);
+			this.drawFirstImage();
 			return;
 		}
 
@@ -310,13 +329,19 @@
 		return Math.random() * (max - min) + min;
 	};
 
-	this.getImageFromUrl = function(url)
+	this.getImageFromUrl = function(url, index)
 	{
 		var self = incMosaic;
 		var image = new Image();
+		var ind = index;
+
 		image.onload = function() {
+
+			self.imageLoadedIndex = ind;
+
 			// When the first image is loaded we can get the image dimention and init the autoresize of the canvas
 			if (self.imagesLoaded === 0) {
+
 				// Set some image size related vars
 				self.imageWidth = image.width;
 				self.imageHeight = image.height;