function IncMosaic()

{

	// --------------------------------------------------------------------------------------------------------------------

	// Members

	// --------------------------------------------------------------------------------------------------------------------

	// Canvas

	this.canvasId;

	this.canvas;

	this.ctx;

	this.imageData;

	/// Images

	this.imageUrls = [];

	this.listeUrls = [];	// The images list to blend

	this.pairImages = [];

	this.imagesLoaded = 0;

	this.imageWidth;

	this.imageHeight;

	// Effect

	this.waitStartEffectTime = 3000;

	this.waitStartEffectGo;

	this.effectSpeed;

	this.squareCountX;

	this.squareCountY;

	this.srcSquareWidth;

	this.srcSquareHeight;

	this.squareWidth;

	this.squareHeight;

	this.effects = [];

	this.squareEffects = [];

	this.loop;

	this.endEffecFunc;

	// Time

	this.startTime;

	// --------------------------------------------------------------------------------------------------------------------

	// Functions

	// --------------------------------------------------------------------------------------------------------------------

	this.addImageUrl = function(url)

	{

		this.imageUrls.push(url);

	};

	this.start = function(canvasId, effectSpeed, squareCountX, squareCountY, loop, waitStartEffectGo, endEffecFunc)

	{

		// Canvas ID

		this.canvasId = canvasId;

		// Speed

		this.effectSpeed = 1 / effectSpeed;

		// Set square count

		this.squareCountX = squareCountX;

		this.squareCountY = (squareCountY === undefined) ? squareCountX: squareCountY;

		// End effect behavior

		this.loop = loop;

		this.endEffecFunc = endEffecFunc;

		// Does the effect wait for go

		this.waitStartEffectGo = waitStartEffectGo;

		// Init the canvas objects

		this.init();

		// Register effects

		this.registerEffects();

		// Set a new effect transition between 2 images

		this.setNewEffect();

		// Main loop

		this.loopCallback();

	};

	this.setNewEffect = function()

	{

		// Set a random pair images

		this.setRandomPairImages();

		// Set random effect on the squares

		this.setRandomSquareEffect();

		// Time

		this.startTime = new Date().getTime();		

	};

	this.UnpauseEffect = function(go)

	{

		this.waitStartEffectGo = !go;

	};

	this.init = function()

	{

		if (this.canvas === undefined || this.canvas === null) {

			// Init canvas objects

			this.canvas = document.getElementById(this.canvasId );

			this.ctx = this.canvas.getContext('2d');

			this.ctx.fillStyle = "#000000";

			this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);			

		}

	};

	this.registerPostNewCanvasSize = function(newCanvasWidth, newCanvasHeight)

	{

		// Recalculate the size of the mosaic squares

		incMosaic.squareWidth = Math.floor(newCanvasWidth / incMosaic.squareCountX);

		incMosaic.squareHeight = Math.floor(newCanvasHeight / incMosaic.squareCountY);

	};

	this.fillListUrl = function()

	{

		}

	};

	this.setRandomPairImages = function()

	{

		if (this.listeUrls.length == 0) {

			this.fillListUrl();

		}

		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.listeUrls.remove(0);

		} else {

			this.imagesLoaded = 1;

			this.pairImages[0] = this.pairImages[1]; // Swap

			this.pairImages[1] = this.getImageFromUrl(this.listeUrls[0])

		}

		this.listeUrls.remove(0);

		// Todo preload the next image

	};

	this.setRandomSquareEffect = function()

	{

		this.squareEffects.length = 0;

		for (var i = 0; i < this.squareCountX; ++i) {

			for (var j = 0; j < this.squareCountY; ++j) {

				var fullEffect = this.effects[this.randomInt(0, this.effects.length)].copy();

				fullEffect.x = i;

				fullEffect.y = j;

				this.squareEffects.push(fullEffect);				

			}			

		}

	};	

	this.loopCallback = function()

	{

		var self = incMosaic;

		if (self.imagesLoaded == 2) {

			// Redraw

			self.redraw();

		}

		// Loop

		requestAnimationFrame(self.loopCallback);

	};

	this.redraw = function()

	{

		// Get time

		var time = new Date().getTime();

		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);

			return;

		}

		// Update effects

		var effectsContinue = false;

		for (var i = 0; i < this.squareEffects.length; ++i) {			

			// Update

			var fullEffect = this.squareEffects[i];

			effectsContinue = fullEffect.update(time) || effectsContinue;

			for (var j = 0; j < 2; ++j) {

				var effectInfo = fullEffect.effectInfos[j];

				if (effectInfo !== null) {

					// Draw square

					this.drawSquare(fullEffect, this.pairImages[j], effectInfo);	

				}

			}

		}

		if (!effectsContinue) {

			if (this.endEffecFunc != undefined && this.endEffecFunc != null) {

				// Call the end callback

				var func = this.endEffecFunc;

				if (!this.loop) {

					this.endEffecFunc = null;

				}

				func();

			}

			if (this.loop) {

				// The effect loop

				this.setNewEffect();

			}

		}	

	};

	this.drawSquare = function(fullEffect, image, effectInfo)

	{

		this.ctx.save();

		// Global alpha

		this.ctx.globalAlpha = effectInfo.alpha;

		// Compute src and dest square position

		var srcPosX = fullEffect.x * this.srcSquareWidth;

		var srcPosY = fullEffect.y * this.srcSquareHeight;		

		var destPosX = fullEffect.x * this.squareWidth;

		var destPosY = fullEffect.y * this.squareHeight;		

		// Draw colored rectangle

		this.ctx.fillStyle = "rgba(" + effectInfo.color.r + "," + effectInfo.color.v + "," + effectInfo.color.b + "," + effectInfo.color.a + ")";

		this.ctx.fillRect(destPosX, destPosY, this.squareWidth, this.squareHeight);

		// Draw image

		this.ctx.drawImage(image, srcPosX, srcPosY, this.srcSquareWidth, this.srcSquareHeight, destPosX, destPosY, this.squareWidth, this.squareHeight);

		this.ctx.restore();

	};

	this.registerEffects = function()

	{

		var count = 7;

		var color = 64;

		var speed = this.effectSpeed;

		// Create semi random effects

		var range1 = 3000 * speed;

		var range2 = 5000 * speed;

		this.registerEffectsTime(count, color, range1, range2);

		// Create semi random effects

		range1 = 7000 * speed;

		range2 = 15000 * speed;

		this.registerEffectsTime(count, color, range1, range2);

		// Create semi random effects

		range1 = 17000 * speed;

		range2 = 23000 * speed;

		this.registerEffectsTime(count, color, range1, range2);

	};

	this.registerEffectsTime = function(count, color, range1, range2)

	{

		for (var i = 0; i < count; ++i) {

			var time1 = this.randomInt(range1, range2);

			var time2 = this.randomInt(range1, range2);

			var c1 = this.randomInt(0, color);

			var effectParam1 = new IncEffectParams(new IncColor(c1, c1, c1, 0), new IncAnim(1, time1), 1, new IncAnim(-1, time1));

			var effect1 = new IncSquareEffect_Alpha(effectParam1, createjs.Ease.quadOut, createjs.Ease.quadOut);

			var effectParam2 = new IncEffectParams(new IncColor(c1, c1, c1, 1), new IncAnim(0, time2), 0, new IncAnim(1, time2));

			var effect2 = new IncSquareEffect_Alpha(effectParam2, createjs.Ease.quadIn, createjs.Ease.quadIn, time1 / 2.5);

			var fullEffect1 = new IncFullEffect(effect1, effect2, time1, time2);

			this.effects.push(fullEffect1);

		}

	};

	// --------------------------------------------------------------------------------------------------------------------

	// Tools

	// --------------------------------------------------------------------------------------------------------------------

	this.randomInt = function(min, max)

	{

		return Math.floor(this.randomFloat(min, max));

	};

	this.randomFloat = function(min, max)

	{

		return Math.random() * (max - min) + min;

	};

	this.getImageFromUrl = function(url)

	{

		var self = incMosaic;

		var image = new Image();

		image.onload = function() {

			// 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;

				self.srcSquareWidth = image.width / self.squareCountX;

				self.srcSquareHeight = image.height / self.squareCountY;

				// Call the resize object

				if (incResize !== undefined) {

					incResize.resizeElements();

				}

			}			

			self.imagesLoaded += 1;

		};

		image.src = url;

		return image;

	};

}

// --------------------------------------------------------------------------------------------------------------------

// Effects

// --------------------------------------------------------------------------------------------------------------------