var jsbs_ref = null;
function jsbs_command( a_name , a_target , a_data ){
	this.name	= a_name;
	this.target	= a_target;
	this.data	= a_data;
}
function jsbs(){
	// -------
	this.c_all	= 'jsbs_container';
	this.c_btn	= 'jsbs_b_container';
	this.c_img	= 'jsbs_i_container';
	this.data = [
    	{ url:"/cp/rise.html" , id:"jsbs_btn_1" , img:null , img_name:"photo1.jpg" , state:'off' , area:null , off:null , over:null , btn_off_name:"menu1.jpg" , btn_over_name:"menu1_on.jpg" } ,
    	{ url:"/rise/" , id:"jsbs_btn_2" , img:null , img_name:"photo2.jpg" , state:'off' , area:null , off:null , over:null , btn_off_name:"menu2.jpg" , btn_over_name:"menu2_on.jpg" } ,
    	{ url:"/tiscalp/check.html" , id:"jsbs_btn_3" , img:null , img_name:"photo3.jpg" , state:'off' , area:null , off:null , over:null , btn_off_name:"menu3.jpg" , btn_over_name:"menu3_on.jpg" } 
		];
	this.img_path		= '/shared/img/top/';
	this.fade_speed		= 400;
	this.autoplay_delay	= 4000;
	// -------
	this.commands		= {};
	this.states			= {};
	this.images			= [];
	this.cur_img_name	= null;
	this.img_uid		= 0;
	this.autoplay_ref	= null;
	this.autoplay_area	= null;
	this.init();
}
jsbs.prototype.init = function(){
	// Set images
	
	// Set buttons
	for( var i = 0; i < this.data.length; i++ ){
		
		var btn_data = this.data[i];
		var btn = document.getElementById(btn_data.id);
		
		var over = document.createElement('div');
		over.className = 'bg';
		over.id = btn.id + "_over";
		over.style.backgroundImage = 'url('+this.img_path+btn_data.btn_over_name+')';
		btn_data.over = over;
		this.commands[over.id] = [];
		this.states[over.id] = 'invisible';
		
		var off = document.createElement('div');
		off.className = 'bg';
		off.id = btn.id + "_off";
		off.style.backgroundImage = 'url('+this.img_path+btn_data.btn_off_name+')';
		btn_data.off = off;
		this.commands[off.id] = [];
		//this.states[off.id] = 'visible';
		
		var area = document.createElement('div');
		area.className = 'bg';
		area.id = btn.id + "_area";
		area.style.cursor = 'pointer';
		btn_data.area = area;
		
		btn.appendChild(off);
		btn.appendChild(over);
		btn.appendChild(area);
		
		$('#'+area.id).click(function(){
			jsbs_ref.launch_url();
		});
		
		area.onmouseover = function(){ jsbs_ref.mouse_over(this); };
		//area.onmouseout = function(){ jsbs_ref.mouse_out(this); };
		
		if( this.autoplay_area == null ){
			this.autoplay_area = area;
		}
		
		eval("$('#"+over.id+"').fadeOut(0);");
		
		var jsbsc = document.getElementById(this.c_all);
		jsbsc.onmouseout = function(){jsbs_ref.start_autoplay();};
		jsbsc.onmouseover = function(){jsbs_ref.stop_autoplay();};
		
	}
	
	this.mouse_over(this.data[0].area);
	this.autoplay_area = this.data[0].area;
	
	this.start_autoplay();
	
};
jsbs.prototype.start_autoplay = function(){
	if( this.autoplay_ref == null ){
		this.log("start_autoplay");
		this.autoplay_ref = setInterval("jsbs_ref.check_autoplay()", this.autoplay_delay);
	}
};
jsbs.prototype.stop_autoplay = function(){
	if( this.autoplay_ref != null ){
		this.log("stop_autoplay");
		clearInterval(this.autoplay_ref);
		this.autoplay_ref = null;
//		for( var i = 0; i < this.data.length; i++ ){
//			if( this.data[i].area != this.autoplay_area ){
//				this.mouse_out(this.data[i].area,false);
//			}
//		}
	}
};
jsbs.prototype.check_autoplay = function(){
	this.log("autoplay");
	
	var area = null;
	if((this.autoplay_area == null) || (this.autoplay_area == this.data[this.data.length-1].area)){
		area = this.data[0].area;
	}
	else{
		for( var i = 0; i < this.data.length; i++ ){
			if( this.data[i].area == this.autoplay_area ){
				area = this.data[i+1].area;
				break;
			}
		}
	}
	if( area != null ){
		this.mouse_out(this.autoplay_area);
		this.mouse_over(area);
	}
	this.autoplay_area = area;
};
jsbs.prototype.mouse_over = function( btn ){
	if( btn != null ){
		for( var i = 0; i < this.data.length; i++ ){
			var d = this.data[i];
			if( d.area == btn ){
				this.autoplay_area = btn;
				this.add_command( new jsbs_command( 'fade_in' , d.id+'_over' , d ) );
			}
			else{
				this.add_command( new jsbs_command( 'fade_out' , d.id+'_over' , d ) );
			}
		}
	}
};
jsbs.prototype.mouse_out = function( btn ){
	if( (btn != null) ){
		for( var i = 0; i < this.data.length; i++ ){
			var d = this.data[i];
			if( d.area == btn ){
				this.add_command( new jsbs_command( 'fade_out' , d.id+'_over' , d ) );
				break;
			}
		}
	}
};
jsbs.prototype.add_command = function( c ){
	var n = c.name;
	var t = c.target;
	var d = c.data;
	if( n == 'fade_in' ){
		switch( this.states[t] ){
			case 'invisible':
				this.states[t] = 'fade_in';
				if( isNaN(this.fade_speed) ){
					eval("$('#"+t+"').fadeIn('"+this.fade_speed+"',function(){ jsbs_ref.states['"+t+"'] = 'visible'; jsbs_ref.check_commands();	});");
				}
				else{
					eval("$('#"+t+"').fadeIn("+this.fade_speed+",function(){ jsbs_ref.states['"+t+"'] = 'visible'; jsbs_ref.check_commands();	});");
				}
				this.display_image(d.img_name);
				break;
			case 'fade_in':
				this.commands[t] = [];
				break;
			case 'fade_out':
				this.commands[t].push(c);
				break;
			case 'visible':
				break;
		}
	}
	else if( n == 'fade_out' ){
		switch( this.states[t] ){
			case 'invisible':
				break;
			case 'fade_in':
				this.commands[t].push(c);
				break;
			case 'fade_out':
				this.commands[t] = [];
				break;
			case 'visible':
				this.states[t] = 'fade_out';
				if( isNaN(this.fade_speed) ){
					eval("$('#"+t+"').fadeOut('"+this.fade_speed+"',function(){ jsbs_ref.states['"+t+"'] = 'invisible'; jsbs_ref.check_commands();	});");
				}
				else{
					eval("$('#"+t+"').fadeOut("+this.fade_speed+",function(){ jsbs_ref.states['"+t+"'] = 'invisible'; jsbs_ref.check_commands();	});");
				}
				break;
		}
	}
};
jsbs.prototype.check_commands = function(){
	var i;
	for( i in this.commands ){
		if( this.commands[i].length > 0 ){
			has_command = true;
			var c = this.commands[i].shift();
			this.add_command( c );
		}
	}
	// Check states to start autoplay
	if(this.autoplay_ref != null){
		//this.start_autoplay();
		this.mouse_over(this.autoplay_area,true);
	}
};
jsbs.prototype.check_images = function(){
	while( this.images.length > 5 ){
		var ni = this.images.shift();
		document.getElementById(this.c_img).removeChild(ni);
		//this.log("removed an image");
	}
};
jsbs.prototype.display_image = function( img_name ){
	if( img_name != this.cur_img_name ){
		this.cur_img_name = img_name;
		var ni = document.createElement('div');
		ni.id = 'jsbs_img_'+(this.img_uid++);
		ni.style.backgroundImage = 'url('+this.img_path+img_name+')';
		ni.style.display = 'none';
		ni.style.cursor = 'pointer';
		//ni.style.left = (this.images.length * 20)+'px';
		//ni.style.top = (this.images.length * 20)+'px';
		this.images.push(ni);
		document.getElementById(this.c_img).appendChild(ni);
		$('#'+ni.id).click(function(){
			jsbs_ref.launch_url();
		});
		$('#'+ni.id).fadeIn(this.fade_speed,function(){jsbs_ref.check_images();});
	}
};
jsbs.prototype.launch_url = function(){
	this.log("launch_url");
	if( this.autoplay_area != null ){
		for( var i = 0; i < this.data.length; i++ ){
			if( this.data[i].area == this.autoplay_area ){
				this.log("launch_url : "+this.data[i].url);
				window.location.href = this.data[i].url; 
				break;
			}
		}
	}
};
jsbs.prototype.log = function(message){
	//var log_container = document.getElementById('log');
	//log_container.innerHTML += "\n<br />" + message;
};
jsbs.prototype.log_replace = function(message){
	//var log_container = document.getElementById('log');
	//log_container.innerHTML = message;
};