var Venetianization = new Class({
	field: null,
	canvas: null,
	context: null,
	width: 320,
	height: 240,
	
	endCallback: null,
	frameIntervalId: 0,
	music: null,
	playing: false,
	script: null,
	audioDelay: 0,
	fps: 30,
	
	initialize: function( canvas, musicPath, width, height, fps ) {
		this.width = width;
		this.height = height;
		this.canvas = canvas;
		this.canvas.width = this.width;
		this.canvas.height = this.height;
		this.context = this.canvas.getContext("2d");
		
		this.fps = fps;
		
		this.load();
		this.music = new Audio();
		if( this.music.canPlayType('audio/mpeg') ) {
			this.music.src = musicPath + '.mp3';
		}
		else {
			this.music.src = musicPath + '.ogg';
			this.audioDelay = -200;
		}
		this.music.autobuffer = true;
		this.music.play();
		this.music.pause();
	},
	
	load: function() {
		this.field = new DotField( this.context, this.width, this.height, 41, 31 );
		this.script = new Script( this.field );
	},
	
	begin: function( endCallback ) {
		this.endCallback = endCallback;
		
		this.playing = true;
		//this.music.currentTime = 0;
		this.music.play();
		this.frameIntervalId = setInterval( this.update.bind(this), 1000/this.fps );
	},
	
	end: function() {
		clearInterval( this.frameIntervalId );
		
		this.playing = false;
		this.music.currentTime = 0;
		this.music.pause();
		
		this.load();

		if( this.endCallback ) {
			this.endCallback();
		}
	},
	
	update: function() {
		var time = this.music.currentTime * 1000 + this.audioDelay;

		if( this.music.ended ) {
			this.end();
			return;
		}
		
		this.script.update( time );
		this.field.draw();
	}
});