cj.init({require:'debug'});
cj.bobii = {
	init : function(){
		var t = this;
		t.n = cj.util.getElementsByIds('wrapper,page_holder,footer,switchBtn,left,right,right_index');
		t.pages = [];
		cj.util.each(t.n.page_holder.getElementsByTagName('div'),function(i){
			if(/container/i.test(i.className)){
				i.index = t.pages.length;
				i.btn = (i.index==0) ? t.n.switchBtn : t.n.footer.appendChild(t.n.switchBtn.cloneNode(true));
				i.btn.onmouseover = function(){
					if(i.index==cj.bobii.index) return false;
					t.btnOn(i);
				}
				i.btn.onmouseout = function(){
					if(i.index==cj.bobii.index) return false;
					t.btnOff(i);
				}
				i.btn.onclick = function(){t.rollTo(i.index)}
				i.btn.img1 = i.btn.getElementsByTagName('img')[0];
				i.btn.img2 = i.btn.getElementsByTagName('img')[1];
				cj.util.each(i.getElementsByTagName('div'), function(n){
					if(/right/i.test(n.className)) n.onclick = function(){t.rollTo(i.index+1)};
					if(/left/i.test(n.className)) n.onclick = function(){t.rollTo(i.index-1)};
				});
				cj.util.each(i.getElementsByTagName('img'),function(n){
					if(!/bg/.test(n.className)) return false;
					i.bg = n;
				});
				t.pages.push(i);
			}
		});
		t.index = 0;
		t.left = 0;
		t.setBg();
		cj.evt.add(cj.w, 'resize', function(){setTimeout(function(){t.setBg()},100)});
		if(!t.pages.length) return;
		t.setSwitch();
		cj.util.setStyle(t.n.right, {display:'none'});
		t.hover(t.n.left);
		t.hover(t.n.right);
		t.hover(t.n.right_index);
		t.n.left.onclick = function(){t.rollTo(t.index-1)}
		t.n.right.onclick = function(){t.rollTo(t.index+1)}
		t.n.right_index.onclick = function(){t.rollTo(1)}
	},
	rollTo : function(p){
		var t = this;
		if(p<0) p = t.pages.length-1;
		if(p>t.pages.length-1) p = 0;
		var test = t.pages.length - p;
		t.dir = (t.index - p > 0) ? -1 : 1;
		t.index = p;
		t.cp = t.left;
		t.left = (p==0) ? 0 : p * t.vp.w;
		doRoll = function(){
			if(t.dir*(t.left - t.cp)<5){
				cj.util.each(t.n.page_holder.getElementsByTagName('img'), function(i){
					if(/bg|fade/i.test(i.className)){
						cj.util.setStyle(i,{visibility:'visible'});
						cj.fade.start(i, 0.3, 0.2, 1);
					}
				})
				t.n.page_holder.style.marginLeft = -t.left + 'px';
				return false;
			}
			t.cp += t.dir * Math.max(10, Math.floor(Math.abs(t.left - t.cp)*0.3));
			t.n.page_holder.style.marginLeft = -t.cp + 'px';
			setTimeout(function(){doRoll()}, 5);
		}
		t.setSwitch();
		cj.util.each(t.n.page_holder.getElementsByTagName('img'), function(i){
			if(/bg|fade/i.test(i.className)){
				cj.fade.start(i, 0.3, 0.9, 0.11);
			}
		})
		setTimeout(function(){
			cj.util.each(t.n.page_holder.getElementsByTagName('img'), function(i){
				if(/bg|fade/i.test(i.className)){
					cj.util.setStyle(i,{visibility:'hidden'});
				}
			})
			doRoll();
		},500);
		if(t.index==0){
			cj.util.setStyle(t.n.right_index, {display:'block'});
			cj.util.setStyle(t.n.right, {display:'none'});
		}else{
			cj.util.setStyle(t.n.right_index, {display:'none'});
			cj.util.setStyle(t.n.right, {display:'block'});
		}
	},
	setBg : function(){
		cj.util.setStyle(cj.b, {overflow:'hidden'});
		var t = this, vp = cj.util.getVP(), barH = t.n.footer.offsetHeight, vph = vp.h-barH;
		//vp.w = 1600; vp.h = 600;
		t.vp = vp;
		cj.util.setStyle(t.n.wrapper, {width:vp.w,height:vp.h});
		cj.util.setStyle(t.n.left, {height:vp.h});
		cj.util.setStyle(t.n.right, {height:vp.h});
		cj.util.setStyle(t.n.right_index, {height:vp.h});
		t.left = t.index * vp.w;
		t.n.page_holder.style.marginLeft = -t.left + 'px';
		cj.util.setStyle(t.n.page_holder, {width:t.pages.length*vp.w+10,height:vph});
		cj.util.each(t.pages,function(i){
			cj.util.setStyle(i,{width:vp.w,height:vp.h});
		});
		cj.util.each(t.n.page_holder.getElementsByTagName('img'), function(i){
			if(!/bg/.test(i.className)) return;
			if(!i.dw) i.dw = i.width || 1;
			if(!i.dh) i.dh = i.height || 1;
			var
				rw = vp.w/i.dw,
				rh = vph/i.dh,
				test = rw>rh,
				w = (test) ? vp.w : Math.ceil(vp.h*(i.dw/i.dh)),
				h = (test) ? Math.ceil(vp.w*(i.dh/i.dw)) : vph,
				left = (test) ? 0 : Math.floor((vp.w-w)/2),
				top = (test) ? Math.floor((vph-h)/2) : 0
			;
			//cj.debug.log.add('vp.w:'+vp.w + ' vph:' + vp.h + '<br/>rw:'+rw + ' rh:'+rh + '<br/>w:' + w + ' h:' + h + '<br/>dw:'+i.dw + ' dh:' + i.dh);
			cj.util.setStyle(i,{left:left,top:top,width:w,height:h});
		});
	},
	btnOn : function(i){
		i.btn.img1.style.display = 'none';
		i.btn.img2.style.display = 'inline';
	},
	btnOff : function(i){
		if(i.index==cj.bobii.index) return false;
		i.btn.img1.style.display = 'inline';
		i.btn.img2.style.display = 'none';
	},
	setSwitch : function(){
		var t = this;
		cj.util.each(t.pages, function(i){
			if(i.index==t.index){
				t.btnOn(i);
			}else{
				t.btnOff(i);
			}
		});
	},
	hover : function(n, on){
		if(!n.imgs){
			n.imgs = n.getElementsByTagName('img');
		}
		if(n.imgs.length != 2) return false;
		n.imgs[1].style.display = 'none';
		cj.evt.add(n, 'mouseover', function(){
			n.imgs[0].style.display = 'none';
			n.imgs[1].style.display = 'block';
		});
		cj.evt.add(n, 'mouseout', function(){
			n.imgs[0].style.display = 'block';
			n.imgs[1].style.display = 'none';
		});
	}
}

cj.evt.add(cj.w, 'load', function(){
	cj.bobii.init();
});