// JavaScript Document

var bgimg = new Image();
var fgimg = new Image();

var images = new Array();
var sotw_img = new Image();
var polaroids = new Array();

var ctx = null;
var a_ctx = null;
var global_timer;
var i = 0;

function Polaroid(canvas) {
	
	var _this = this;
	
	this._self = "" // objektname;
	this.x;
	this.y;
	this.rotation;
	this.alpha = 100;
	this.img = new Image();
	this.imgno = 0;
	this.imgready = false;
	
	this.img.onload = function() {
		_this.imgready = true;
	}	
	
	var fadetimer;
	var switchtimer;
	var canvas = canvas;
	var degree = (Math.PI*2) / 360;
	
	var dh = 172
	var dw = 206;
	var sw,sh;
	
	this.drawImage = function() {
		if(_this.imgready) {
			
			canvas.save();
			
			canvas.translate(_this.x,_this.y);
			canvas.rotate(degree*_this.rotation);
			
			if(_this.alpha<1) {
				canvas.globalAlpha = (_this.alpha);
			}
			
			var dratio_w = dw/dh;
			var dratio_h = dh/dw;
			
			var sratio_w = (_this.img.width/_this.img.height);
			var sratio_h = (_this.img.height/_this.img.width);
			
			if(sratio_w<dratio_w) {
				sw = _this.img.width;
				sh = Math.round(dratio_h * sw);
			} else if(sratio_w>dratio_w) {
				sh = _this.img.height;
				sw = Math.round(dratio_w * sh);
			} else {
				sw = _this.img.width;
				sh = _this.img.height;
			}

			
			canvas.drawImage(_this.img,0,0,sw,sh,16,20,dw,dh);
			canvas.globalAlpha = 1;
			canvas.globalCompositeOperation = "source-over";
			
			canvas.restore();
		}
	}
	
	this.startFader = function(opacity,speed) {
		timer = setTimeout(_this._self+".fadeImage("+opacity+","+speed+")",100);
	}
	
	this.fadeImage = function(opacity,speed) {
		var running = true;
		opacity+=speed;
		_this.alpha = opacity/100;
	
		if(speed<0) {
			if(opacity<=0) {
				_this.alpha = 100;
				running=false;
			}
		} else if(speed>0) {
			if(opacity>=100) {
				_this.alpha = 100;
				running=false;
			}
		} else {
			_this.alpha = 100;
			running=false;
		}
		
		if(running) {
			fadetimer = setTimeout(_this._self+".fadeImage("+opacity+","+speed+")",100);
		} else {
			//document.getElementById("debug").innerHTML = _this.imgno + " / " + images.length + "<br>";
			_this.imgno+=4;
			if(_this.imgno>(images.length-1)) _this.imgno=_this.imgno-images.length;
			//document.getElementById("debug").innerHTML += "canvas.drawImage("+_this.img.src+",0,0,"+sw+","+sh+",0,0,"+dw+","+dh+");<br>"
			_this.imgready = false;		
			_this.img.src = images[_this.imgno];
			switchtimer = setTimeout(_this._self+".startFader("+100+","+(-20)+")",8000);
		}
	}
}

function drawAllstar() {
	a_ctx = document.getElementById('allstar_canvas').getContext('2d');
	a_ctx.save();
	
	var dh = 120
	var dw = 125;
	var degree = (Math.PI*2) / 360;
	
	a_ctx.font="9pt Calibri";
 	a_ctx.fillStyle="#FF0000"; // fill color
	
	a_ctx.translate(60,20);
	a_ctx.rotate(degree*11.7);
	
	var dratio_w = dw/dh;
	var dratio_h = dh/dw;
	
	var sratio_w = (sotw_img.width/sotw_img.height);
	var sratio_h = (sotw_img.height/sotw_img.width);
	
	if(sratio_w<dratio_w) {
		sw = sotw_img.width;
		sh = Math.round(dratio_h * sw);
	} else if(sratio_w>dratio_w) {
		sh = sotw_img.height;
		sw = Math.round(dratio_w * sh);
	} else {
		sw = sotw_img.width;
		sh = sotw_img.height;
	}
	
	a_ctx.drawImage(sotw_img,0,0,sw,sh,0,0,dw,dh);
	a_ctx.textAlign = "center";
	a_ctx.fillText("Imagine Allstar:", 60, 134);
	a_ctx.fillText(sotw_text, 60, 145);
	a_ctx.restore();
}

function init() {
	
	drawAllstar();
	
	ctx = document.getElementById('canvas').getContext('2d');
	ctx.fillStyle = "#FFFFFF";
	
	polaroids[0] = new Polaroid(ctx);
	polaroids[0]._self = "polaroids[0]";
	polaroids[0].x = 18;
	polaroids[0].y = 38;
	polaroids[0].rotation = -4;
	polaroids[0].imgno = 0;
	polaroids[0].img.src = images[polaroids[0].imgno];
	

	polaroids[1] = new Polaroid(ctx);
	polaroids[1]._self = "polaroids[1]";
	polaroids[1].x = 279;
	polaroids[1].y = 21;
	polaroids[1].rotation = 7.4;
	polaroids[1].imgno = 1;
	polaroids[1].img.src = images[polaroids[1].imgno];
	
	polaroids[2] = new Polaroid(ctx);
	polaroids[2]._self = "polaroids[2]";
	polaroids[2].x = 492;
	polaroids[2].y = 42;
	polaroids[2].rotation = -4;
	polaroids[2].imgno = 2;
	polaroids[2].img.src = images[polaroids[2].imgno];
	
	polaroids[3] = new Polaroid(ctx);
	polaroids[3]._self = "polaroids[3]";
	polaroids[3].x = 740;
	polaroids[3].y = 38;
	polaroids[3].rotation = 2;
	polaroids[3].imgno = 3;
	polaroids[3].img.src = images[polaroids[3].imgno];

	setTimeout("polaroids[2].startFader("+100+","+(-20)+")",8000);
	setTimeout("polaroids[0].startFader("+100+","+(-20)+")",10000);
	setTimeout("polaroids[1].startFader("+100+","+(-20)+")",12000);
	setTimeout("polaroids[3].startFader("+100+","+(-20)+")",14000);
	global_timer = setInterval(draw,200);
}

var count = 0;

function draw() {
	ctx.globalAlpha = 1;
	//ctx.clearRect(count*266,0,(count+1*266),400);
	ctx.clearRect(0,0,1000,295);

	for(i=0;i<polaroids.length;i++) {
		count=i;
		polaroids[count].drawImage();
		//count++;
		//if(count>2) count=0;
	}

}