/*
 * JavaScript effect framework: js
 * Version 0.2.0a
 * Dmitrij Sosnovsenko
 * pietzpluswild.de
 *
 * last update: 2011-12-13
 */

js.effect= function(opt){
	opt.fps= opt.fps ? opt.fps : 20;
	opt.duration= opt.duration ? opt.duration : 1200;
	var delay= Math.ceil(1000/opt.fps);
	var self= this;

	this.timer({
		uid: opt.timerIdx,

		autoStart: true,

		onStart: {fn: function(args){
			var timer= this;
			timer.frames= Math.ceil(opt.fps*opt.duration/1000);
			timer.frame= 0;

			for(var prop in opt.css){
				var val= opt.css[prop].param;
				var start= undefined, end, unit= undefined;

				if(js.typeOf(val) == 'array'){
					start= val[val.length-2];
					end= val[val.length-1];
				}
				else{
					end= val
				}
				if(start == undefined){
					start= self.css(prop);
				}

				if(prop.toLowerCase().indexOf('color') >= 0){
					opt.css[prop].start= js.color.getRGB(start);
					opt.css[prop].end= js.color.getRGB(end);
				}else{
					unit= js.formatOf(end);
					opt.css[prop].start= js.toInt(start);
					opt.css[prop].end= js.toInt(unit[2]);
					opt.css[prop].unit= unit[3];
				}
			}
		}, args:{}, delay: 0},

		onStep: {fn: function(args){
			var timer= this;
			for(var prop in opt.css){
				var i= timer.frame, n= timer.frames, min= opt.css[prop].start, max= opt.css[prop].end;
				var unit = opt.css[prop].unit || '';
				var easing= opt.css[prop].easing ? opt.css[prop].easing : js.easing.easeDefault;
				timer.min= min;
				timer.max= max;

				if(typeof min == 'object'){// color
					timer.val= [
						Math.floor(js.easing[easing](i,n,min[0],max[0])),// r
						Math.floor(js.easing[easing](i,n,min[1],max[1])),// g
						Math.floor(js.easing[easing](i,n,min[2],max[2])) // b
					];
				}else{
					timer.val= js.easing[easing](i,n,min,max);
				}

				if(prop == 'opacity'){
					timer.val= Math.floor(timer.val);
					//js('debug').addLast('<div>p: '+prop+'; v: '+this.val+'; min: '+min+'; max: '+max+'</div>');
				}

				if(!/opacity|color/.test(prop.toLowerCase())){
					timer.val += unit;
				}

				if(prop == 'backgroundColor'){
					//js('debug').addLast('<div>p: '+prop+'; v: '+this.val+'; min: '+min+'; max: '+max+'</div>');
				}

				//js('debug').addLast('<div>p: '+prop+'; v: '+this.val+'; min: '+min+'; max: '+max+'</div>');
				self.css(prop, timer.val);
				//if(typeof opt.onFrame == 'function'){opt.onFrame.call(this,obj)}
				if(typeof opt.onFrame == 'function'){opt.onFrame.call(timer)}
			}

			if(timer.frame >= timer.frames || timer.stop){
				return false;;
			}
			timer.frame++;
		}, args:{counter:0}, delay: delay || 75},

		onFinish: {fn: function(args){
			var timer = this;
			if(typeof opt.callback == 'function'){opt.callback.call(timer)}
		}, args:{}, delay: 0},

		onPause: {fn: function(args){
			//js('demo1').addLast('pause ')
		}, args:{} },

		onResume: {fn: function(args){
			//js('demo1').addLast('resume ')
		}, args:{} },

		onStop: {fn: function(args){
			//js('demo1').addLast('STOP ')
		}, args:{} },

		onTimeout: {fn: function(args){}, args:{}, delay: 5000}

	});

}//

js.sprite= function(opt){
	var pause= 0; // local pause for timeline, not global js.$[id].pause
	var obj= js.$[this.id];
	obj.width= this.innerWidth();
	obj.height= this.innerHeight();
	obj.frame= obj.startFrame= opt.startFrame;
	obj.frames= opt.endFrame - opt.startFrame;
	obj.timeline= opt.timeline;
	obj.timelineIndex= 0;
	obj.cycle= opt.cycle;
	obj.dir= 1; // durection: 1 or -1
	obj.index= 0;

	var delay= Math.ceil(1000/opt.fps);

	this.timer({
		uid: 'sprite',

		autoStart: true,

		onStart: {fn: function(args){
			//js('demo1').addLast('start ')
		}, args:{}, delay: 0},

		onStep: {fn: function(args){
			var timer = this;
			var obj= js.$[this.pid];
			if(pause){return}
			var pos_x= obj.frame*obj.width;
			obj.elm.style.backgroundPosition= (-1)*pos_x+'px 0';
			if(obj.timeline){
				if(obj.timelineIndex > obj.timeline.length-1){obj.timelineIndex= 0}
				var timeline= obj.timeline[obj.timelineIndex];
				//js('debug').elm.innerHTML= 'obj.index='+obj.index+' | obj.frame='+obj.frame+' | obj.frames='+obj.frames;
				if(obj.frame == timeline.keyframe){
					pause= 1;
					if(js.typeOf(timeline.callback) == 'function'){timeline.callback.call(obj)}
					setTimeout(function(){pause=0},timeline.delay);
					obj.timelineIndex+=obj.dir;
				}
			}

			if(obj.index >= obj.frames){
				obj.index= 0;
				obj.frame= (obj.dir > 0) ? obj.startFrame : (obj.frames + obj.startFrame);
				if(obj.cycle == undefined || obj.cycle < 0){return}
				if(obj.cycle > 0){obj.cycle--}
				if(obj.cycle == 0){
					js.timer.stop(timer.pid, timer.uid);
					if(js.typeOf(opt.callback) == 'function'){opt.callback.call(obj)}
				}
				return
			}

			obj.frame+=obj.dir;
			obj.index++;
		}, args:{counter:0}, delay: delay || 75},

		onFinish: {fn: function(args){
			//js('demo1').addLast('FINISH ')
		}, args:{}, delay: 0},

		onPause: {fn: function(args){
			//js('demo1').addLast('pause ')
		}, args:{} },

		onResume: {fn: function(args){
			//js('demo1').addLast('resume ')
		}, args:{} },

		onStop: {fn: function(args){
			//js('demo1').addLast('STOP ')
		}, args:{} },

		onTimeout: {fn: function(args){}, args:{}, delay: 5000}

	});

}//

// hightlight for: color, backgroundColor, borderColor, borderTopColor, borderBottomColor, borderLeftColor, borderRightColor, outlineColor
js.hightlight= function(opt){
	var self= this;
	var durationIn= opt.durationIn ? opt.durationIn : 400;
	var durationOut= opt.durationOut ? opt.durationOut : 600;
	var hightlight= opt.hightlight ? opt.hightlight : '#FFFFFF';
	var borderColor= ['borderTopColor','borderBottomColor','borderLeftColor','borderRightColor'];

	var cssIn={}, cssOut={};
	for(var prop in opt.css){
		var val= opt.css[prop].param;
		var start= undefined, end;
		if(js.typeOf(val) == 'array'){start= val[val.length-2];end= val[val.length-1]}
		else{end= val}

		if(prop == 'borderColor'){
			if(start == undefined){start= self.css('borderLeftColor');}
			for(var i=0;i<4;i++){
				cssIn[borderColor[i]]= {param:[start,hightlight], easing:'easeInExpo'};
				cssOut[borderColor[i]]= {param:[hightlight,end], easing:'linear'};
			}
		}else{
			if(start == undefined){start= self.css(prop);}
			cssIn[prop]= {param:[start,hightlight], easing:'easeInCirc'};
			cssOut[prop]= {param:[hightlight,end], easing:'easeInCirc'};
		}
	}

	self.effect({timerIdx: 'lightIn', css:cssIn, fps:opt.fps, duration: durationIn, callback: function(){lightOut()}});
	var lightOut= function(){
		if(typeof opt.onHightlight == 'function'){opt.onHightlight.call(self)}
		self.effect({timerIdx: 'lightOut', css:cssOut,fps:opt.fps,duration: durationOut, callback: opt.callback});
	}
}//


//
js.crossSlide= {
	id: '',
	o: null,

	init: function(opt){
		var o= js(opt.id);
		o.$[opt.id].items= [];
		o.$[opt.id].index= 0;
		var html= '';
		for(var i=0;i<opt.items.length;i++){
			var className= 'elm-transparent';
			if(!i){className= '';}
			var item_id= opt.id+'_img_'+i;
			o.$[opt.id].items[i]= item_id;
			html+= '<img id="'+item_id+'" src="'+opt.items[i]+'" border="0" class="'+className+'" style="position:absolute;top:0px;left:0px;">'+"\n";
		}
		o.elm.innerHTML= '<div id="img_pile_'+opt.id+'" style="position:absolute;top:0px;left:0px">'+html+'</div>'+"\n";
	},

	play: function(id){
		var self= js.crossSlide;

		if(id){
			self.id= id;
			self.o= js(id).$[id];
			self.o.index= 1;
			self.o.isEndFrame= 0;

			var item;
			for(var i=0; i < self.o.items.length; i++){
				var item_id= self.o.items[i];
				item= js(item_id).$[item_id];
				if(i){
					js(item.elm).css('opacity',0);
				}
				js.timer.resume(item_id);
			}

			self._loop();
			//setTimeout('js.crossSlide._loop()',1500);
			return;
		}

		var item_id= self.o.items[self.o.index];
		var item= js(item_id).$[item_id];
		js.timer.resume(item_id);

		//item.pause= 0;
		//item.stop= 0;

	},

	_loop: function(){
		var self= js.crossSlide;
		var item_id= self.o.items[self.o.index];
		var item= js(item_id).$[item_id];
		/*var timer= js.$[item_id].timer ? (js.$[item_id].timer['cross'] || null) : null;
		if(timer && timer.stop){
			self.o.index= 1;
			self.o.isEndFrame= 0;
			return;
		}*/

		var start= 0;
		var end= 100;
		if(self.o.isEndFrame){
			start= 100;
			end= 0;
		}

		js(item.elm).effect({timerIdx: 'cross', css:{opacity:{param:[start,end]}},
			duration:1500,fps:25,
			callback:function(){
				var timer= js.$[item_id].timer['cross'];
				//js('debug').elm.innerHTML= item.elm.id+': o.index='+self.o.index+' | start='+start+' | end='+end;
				if(self.o.index == self.o.items.length-1){
					if(!self.o.isEndFrame){
						self.o.isEndFrame++;
					}else{
						self.o.isEndFrame= 0;
						self.o.index= 0;
					}
				}
				if(self.o.index > 1){
					js(self.o.items[self.o.index-1]).css('opacity',0);
				}
				if(self.o.index < self.o.items.length-1){
					self.o.index++;
				}

				if(!timer.pause && !timer.stop){
					setTimeout(function(){js.crossSlide._loop()},2500);
				}
			}
		});
	},

	pause: function(){
		var self= js.crossSlide;
		var item_id= self.o.items[self.o.index];
		js.timer.pause(item_id);
	},

	stop: function(){
		var self= js.crossSlide;
		var item;

		if(!self.o || self.o.items.length <= 1){return;}

		for(var i=0; i < self.o.items.length; i++){
			var item_id= self.o.items[i];
			//js.timer.stop(item_id);
			js.timer.clear(item_id);
		}
		self.o.index= 1;
		self.o.isEndFrame= 0;
	},

	reset: function(){
		var self= js.crossSlide;
		var item;
		if(!self.o || self.o.items.length <= 1){return;}
		for(var i=0; i < self.o.items.length; i++){
			var item_id= self.o.items[i];
			item= js(item_id).$[item_id];

			if(!i){
				js(item_id).css('opacity',100);
			}else{
				js(item_id).css('opacity',0);
			}
		}
	}


}//


/**
* Use Track Animation:
*
var track1= new js.trackAnim({
	id: 'track1',
	fps: 20,
	track: [
		{x:445, y:203, duration:5000, easing:'easeInOutSine'}, // 1
		{x:460, y:180, duration:5000, easing:'easeInOutSine'}  // 0
	]
});
*/
js.trackAnim= function(opt){
	return {
		id: opt.id,
		index: 0,
		counter: 0,
		fps: opt.fps ? opt.fps : 20,
		pos: opt.track,
		anim: function(){
			var self= this;

			//js.$[timer.pid].timer[timer.uid].data

			js(self.id).effect(
				{timerIdx: 'track', css:{
					left:{param:self.pos[self.index].x+'px',easing:self.pos[self.index].easing},
					top:{param:self.pos[self.index].y+'px',easing:self.pos[self.index].easing}
				},
				fps:self.fps,duration:self.pos[self.index].duration,
				callback: function(){
					var timer = this;// alert(timer.stop);
					if(timer.stop){
						return false;
					}
					self.index++;
					self.counter++;
					if(self.index >= self.pos.length){self.index= 0}
					js.timer.clear(timer.pid, timer.uid);
					self.anim();
				}}
			);
			//alert('i: '+self.index);
		}
	}
}//

// Stop IE6 re-loading background images continuously
try {
  document.execCommand("BackgroundImageCache", false, true);
} catch(err) {}