function Sprite(type,url){
	this.type=type;
	this.src=url;
	this.isLoaded=false;
	this.x=0;
	this.y=0;
	this.width=0;
	this.height=0;
	if(type==Sprite.SHIP){
		this.speed=1;
		this.interval=400;
	}
	else if(type==Sprite.TRAIN){
		this.speed=-2;
		this.interval=0;
	}
	else if(type==Sprite.CAR){
		this.speed=7;
		this.interval=300;
	}
	this.img=null;
}
Sprite.SHIP="ship";
Sprite.CAR="car";
Sprite.TRAIN="train";

var homePage={
	isIE:true
	,spriteImgs:null
	,loadingIndex:0
	,divRoad:null
	,intervalLoadSprites:0	
	,intervalAnim:0
	,INTERVAL_LOAD_SPRITES:50
	,INTERVAL_ANIM:50


	,countAnim:0
	,loadedDynamicImages:{}
	,ANIM_FADING_TIME:20
	,ANIM_TIME_FADING_TEXT:10
	,ANIM_SHOW_TIME:100

	,animIndex:0
	,animStep:0
	//,albumIndex:0
	,albumName:null
	,albumNameShadow:null
	,albumText:null
	,albumTextShadow:null

	,setOpacity:function(d,o){
		if(homePage.isIE){
			if(o==1) d.style.removeAttribute('filter');
			else d.style.filter="alpha(opacity="+Math.round(o*100)+")";
		}
		else d.style.opacity=o;
	}
	,isImageLoaded:function(img) {
		if(img.getAttribute("isLoaded"))return true;
		// During the onload event, IE correctly identifies
		// any images that
		// weren’t downloaded as not complete. Others should too. Gecko-based
		// browsers act like NS4 in that they report this incorrectly.
		if(!img.complete)return false;

		// However, they do have two very useful properties:
		//naturalWidth and
		// naturalHeight. These give the true size of the image. If it failed
		// to load, either of these should be zero.
		if(typeof img.naturalWidth!="undefined"&&img.naturalWidth==0)return false;

		// No other way of checking: assume it’s ok.
		return true;
	}
	,onImageLoad:function(e){
		var lim=eventTarget(e);
		//var id=lim.getAttribute("id").substring(1);
		//var j=id.substring(2);
		homePage.setImageLoaded(lim);
		//alert("Loaded: "+j+": "+lim.src);
	}
	,setImageLoaded:function(lim){
		// mark it as loaded:
		lim.setAttribute("isLoaded",1);
		var i=lim.getAttribute("index");
		//console.log("Sprite ["+i+"] is loaded ("+lim+"), height:"+lim.height);
		//alert("Sprite ["+i+"] is loaded ("+lim+"), height:"+lim.offsetHeight);

		// update sprite:
		var a=sprites[i];
		a.isLoaded=1;
		a.width=lim.offsetWidth;
		a.height=lim.offsetHeight;
		a.isLoaded=1;
		a.img=lim;
		a.isLoaded=1;
		homePage.setCoords(a);

		// show sprite:
		lim.style.width=a.width+"px";
		lim.style.height=a.height+"px";
		lim.className="loaded";

		//start loading next image if any:
		homePage.loadingIndex++;
		lim=homePage.spriteImgs[homePage.loadingIndex];
		if(lim)homePage.loadImage(lim);
		//else console.log("All sprites are loaded!");
	}
	,setCoords:function(a){
		// to find out x we iterate all previously loaded sprites of that type
		a.x=0;
		for(i=0;i<sprites.length;i++){
			var b=sprites[i];
			if(a==b)continue;
			if(b.isLoaded!=1)continue;
			if(b.type!=a.type)continue;
			a.x=b.x+b.width+b.interval;
			//console.log("b.x="+b.x+",b.width="+b.width);
		}
		if(a.type==Sprite.SHIP)	a.y=(77-a.height);
		else if(a.type==Sprite.TRAIN) a.y=(169-a.height);
		else if(a.type==Sprite.CAR) a.y=(274-a.height);

		// place sprite:
		a.img.style.left=a.x+"px";
		a.img.style.top=a.y+"px";
	}
	,anim:function(){
		Screen.getSize();
		// iterate all sprites imgs and move them:
		for(i=0;i<sprites.length;i++){
			var a=sprites[i];
			if(a.isLoaded!=1)continue;
			var img=a.img;
			if(a.speed>0){
				if(a.x>Screen.width){
					// find item with lowest x:
					a.x=-a.width;
					for(j=0;j<sprites.length;j++){
						var b=sprites[j];
						if(a==b)continue;
						if(b.isLoaded!=1)continue;
						if(b.type!=a.type)continue;
						if(b.x-a.width-a.interval<a.x)a.x=b.x-a.width-a.interval;
					}
				}
				else a.x+=a.speed;
			}
			else{
				if(a.x+a.width<0){
					// find item with highest x:
					a.x=Screen.width;
					for(j=0;j<sprites.length;j++){
						var b=sprites[j];
						if(a==b)continue;
						if(b.isLoaded!=1)continue;
						if(b.type!=a.type)continue;
						if(b.x+b.width+b.interval>a.x)a.x=b.x+b.width+b.interval;
					}
				}
				else a.x+=a.speed;
			}

			/*if(a.type==Sprite.CAR){
				if(a.y==342-a.height)a.y=343-a.height;
				else a.y=342-a.height;
				img.style.top=a.y+"px";
			}*/

			img.style.left=a.x+"px";
		}
	}
	,loadImage:function(lim){
		lim.setAttribute("src",lim.getAttribute("lsrc"));
		if(homePage.isImageLoaded(lim)){
			//////console.log("Image is already loaded:"+lim);
			homePage.setImageLoaded(lim);
		}
		else eventOn(lim,"load",homePage.onImageLoad);
	}
	,loadSprites:function(){
		if(!isWindowLoaded)return;

		// clear this interval:
		clearInterval(homePage.intervalLoadSprites);
		homePage.intervalLoadSprites=null;

		Screen.getSize();

		// create image placeholder for each sprite:
		for(i=0;i<sprites.length;i++){
			var a=sprites[i];

			var lim=d.createElement("img");
			lim.setAttribute("id","_im"+i);
			lim.setAttribute("index",i);
			lim.setAttribute("lsrc",a.src);
			homePage.divRoad.appendChild(lim);
			//homePage.setOpacity(lim,0);
			homePage.spriteImgs.push(lim);
		}

		// start loading first image:
		var lim=homePage.spriteImgs[homePage.loadingIndex];
		homePage.loadImage(lim);

		// start animation:
		homePage.intervalAnim=setInterval("homePage.anim()",homePage.INTERVAL_ANIM);
	}
	,init:function(){
		BrowserDetect.init();
		homePage.isIE=BrowserDetect.browser=="Explorer";

		homePage.divRoad=d.getElementById("road");

		// start loading sprites:
		if(homePage.divRoad!=undefined){
			homePage.spriteImgs=new Array();
			// we need this interval to waint untill this JS is done and window is loaded:
			if(!homePage.intervalLoadSprites)homePage.intervalLoadSprites=setInterval("homePage.loadSprites()",homePage.INTERVAL_LOAD_SPRITES);
			//homePage.loadSprites();
		}
	}
}
onReadys.push(homePage.init);

