
var bear ={
	img_name:'',
	type			:	'personalised-kuokee-teddy-bear',
	step			:	'bear',
	errMsg			:	{
							selectBar		 : "Please select a bear to continue next step!",
							selectEmbroidery : "Please select Bear and hooide/Jumper to continue next step ",
							selectCard		 : "Please fillup step 1, step 2 and Step 3 correctly",
							selectIcon		 : "Please let us know which of the following you wish to add:\n- Small Heart \n- Small Bear",
							addMessage		 : "Please enter the text you would like in the Hoodie",
							addName			 : "Please enter the name you would like on the Hoodie",
							setCardText		 :  "Please fillup the card section correctlry"
						},
	gift			:	{
							bear:null,
							type:"name",
								/* Name Bear Section */
							name:null,
								/* Card Section */
							card:null,
							front_text_1 : "",
							front_text_2 : "",
							inside_text_1: "",
							inside_text_2: "",
							inside_text_3: ""
						},
	slide			:	{
							bear:"personalised-bear",
							hoodie:"personalised-hoodie",
							embroidery:"personalised-embroidery",
							card:"personalised-cards"
						},
	animate			:{
						bear:null,
						hoodie:null,
						embroidery:null,
						card:null,
						message_bear:null,
						bear_type:null,
						name_bear:null,
						message_bear_pan: null,
						name_bear_pan: null,
						personalise_card : null
					},
	confirmOrder : function()
	{
		var ord = "";
		ord		+= "bear_type|@|" + bear.type;
		ord		+= "|#|bear|@|" + bear.gift.bear;
		ord		+= "|#|type|@|" + bear.gift.type;
		ord		+= "|#|name|@|" + bear.gift.name;
		ord		+= "|#|card|@|" + bear.gift.card;
		ord		+= "|#|front_text_1|@|" + bear.gift.front_text_1;
		ord		+= "|#|front_text_2|@|" + bear.gift.front_text_2;
		ord		+= "|#|inside_text_1|@|" + bear.gift.inside_text_1;
		ord		+= "|#|inside_text_2|@|" + bear.gift.inside_text_2;
		ord		+= "|#|inside_text_3|@|" + bear.gift.inside_text_3;

		$('order_data').set('value',ord);
		/* Submit form */
		$('orderform').submit();
	},
	toggoler:function()
	{
		bear.step = this.get('id');
		bear.jump();		
	},	
	validation : function()
	{
		var noErr = true; 
		switch( bear.step )
		{
			case "hoodie"		:
									noErr = ( bear.gift.bear == null ) ? false : true;
									break;
			case "embroidery"	:
									noErr = ( bear.gift.bear == null ) ? false : true;
									break;
			case "card"			:	
									noErr = ( bear.gift.name == null || bear.gift.name == "" ) ? false : true;
									break;
		}

		return noErr;
	},
	setMessage : function(msg )
	{
		alert(msg);
	},
	jump : function ()
	{
		switch( bear.step )
		{
			case 'bear'		:	
								if( !bear.animate.bear.open )bear.animate.bear.toggle();
								if( bear.animate.embroidery.open )bear.animate.embroidery.toggle();
								if( bear.animate.card.open )bear.animate.card.toggle();
								break;
			case 'embroidery':
								if( bear.validation() )
								{	
									if( bear.animate.bear.open )bear.animate.bear.toggle();
									if( !bear.animate.embroidery.open )bear.animate.embroidery.toggle();
									if( bear.animate.card.open )bear.animate.card.toggle();
								} else bear.setMessage(bear.errMsg.selectEmbroidery);
								break;
			case 'card'		:	
								if( bear.validation() )
								{
									if( bear.animate.bear.open )bear.animate.bear.toggle();
									if( bear.animate.embroidery.open )bear.animate.embroidery.toggle();
									if( o_card == null )
									{
										if( !bear.animate.card.open )bear.animate.card.toggle();
									}
									else
									{
										$('personalise_a_card').setStyle('display','block');
									}	
								}else bear.setMessage(bear.errMsg.selectCard);
								break;
		}
	},
	selectBear : function ()
	{
		var id = this.get("id");
		bear.gift.bear = this.get('longdesc');
		var src = $(id).get("src").replace('/80/', '/110/');
		$("bear_pan_images").set("src",'');
		$("bear_pan_images").set("src",src);
		bear.appear($("bear_pan_images"));		
		$("bear_pan_images_title").set("text",$(id).get("alt"));
	},
	selectBearType : function()
	{	
		if (this.get('id') == 'message-bear' || this.get('id') == 'MessageBearBack')
		{
			bear.gift.type = 'message';
			bear.animate.message_bear.toggle();
			bear.animate.bear_type.toggle();

			if( !bear.animate.message_bear_pan.open )bear.animate.message_bear_pan.toggle();
			bear.animate.name_bear_pan.hide();
		}		
		else if (this.get('id') == 'name-bear' || this.get('id') == 'NameBearBack')
		{
			bear.gift.type = 'name';
			bear.animate.name_bear.toggle();
			bear.animate.bear_type.toggle();

			bear.animate.message_bear_pan.hide();
			if( !bear.animate.name_bear_pan.open )bear.animate.name_bear_pan.toggle();
		} 
	},
	addName :function ()
	{
		bear.gift.name = ( this.defaultValue == this.get('value') ) ? null : this.get('value');
		bear.appear($$('.name_pan'));
	},
	addNamePan : function()
	{
		$$('.name_pan').set("text",this.get('value'));
	},
	appear : function(obj)
	{
		obj.setOpacity(0).set('tween', {duration:1500}).fade('in'); 
	},
	disappear : function(obj)
	{
		obj.setOpacity(0).set('tween', {duration:1500}).fade('out'); 
	},
	embroideryComplete : function ()
	{ 
		if( bear.gift.name == null ||  bear.gift.name == "" )
		{
			alert( bear.errMsg.addName);
		}
		else
		{
			bear.step = 'card';
			bear.jump();
		}
	},
	selectCard : function()
	{
		var tmp = this.get('id').split('_');
		bear.gift.card = tmp[1];

		var src = base + "/common/get_image/"+this.get('longdesc') + "/251/fix";
		$('personalise_a_card_left').setStyle('background','url(' + src + ') no-repeat');
		bear.animate.card.toggle();
		$('personalise_a_card').setStyle('display','block');
	},
	chnageCard: function ()
	{	
		bear.animate.card.toggle();
		$('personalise_a_card').setStyle('display','none');
	},
	setCardText : function()
	{
		var name = this.get('name');
		var text = this.get('value');
		$(name).set('text',text);

		if( name == "front_text_1" ) bear.gift.front_text_1 = text;
		if( name == "front_text_2" ) bear.gift.front_text_2 = text;
		if( name == "inside_text_1" ) bear.gift.inside_text_1 = text;
		if( name == "inside_text_2" ) bear.gift.inside_text_2 = text;
		if( name == "inside_text_3" ) bear.gift.inside_text_3 = text;
		$$('.p_' + name).set('text',text);
		bear.appear($$('.p_' + name));


	},
	confirmCardText : function ()
	{ 
		if( false )
		{
			bear.setMessage(bear.errMsg.setCardText);
		}
		else
		{
			//if(confirm('Please confirm your order'))
			{
				//alert('Working');
				$('personalise_a_card').setStyle('display','none');
				$('orderform').setStyle('display','block');
				bear.appear($('orderform'));
				bear.confirmOrder();
			}
		}
		
	},	
	init: function(){

		$$('.personalised-btn').addEvent('click',bear.toggoler);
	
		/* Bear type */
		bear.type = $('bear_type').get('value');
		
		/* Select Bear */
		$$('.bear').addEvent('click',bear.selectBear);
		
		// Name Bear
		$('name').addEvent('blur',bear.addName);
		$('name').addEvent('keyup',bear.addNamePan);
		$('NameBearOk').addEvent('click',bear.embroideryComplete);
		
		/* Card Section */
		$$('.card').addEvent('click',bear.selectCard);
		$$('.text-box').addEvent('keyup',bear.setCardText);
		$('confirmCardText').addEvent('click',bear.confirmCardText);
		$('selectAnotherCard').addEvent('click',bear.chnageCard);
			
		/* FXZ */
		bear.animate.bear =  new Fx.Slide(bear.slide.bear);
		bear.animate.embroidery =  new Fx.Slide(bear.slide.embroidery).hide();
		bear.animate.card =  new Fx.Slide(bear.slide.card).hide();	
		bear.animate.message_bear_pan =  new Fx.Slide('message_bear_pan').hide();	
		bear.animate.name_bear_pan =  new Fx.Slide('name_bear_pan');	

		bear.gift.bear = o_bear;
		bear.gift.card = o_card;
		bear.gift.name = o_name;
		if( bear.gift.name != "")
		{	$$('.name_pan').set("text",bear.gift.name);
			bear.appear($$('.name_pan'));
		}
		bear.gift.front_text_1 =  o_front_text_1;
		bear.gift.front_text_2 =  o_front_text_2;
		bear.gift.inside_text_1 = o_inside_text_1;
		bear.gift.inside_text_2 = o_inside_text_2;
		bear.gift.inside_text_3 = o_inside_text_3;
		$$('.p_front_text_1').set('text',o_front_text_1);
		$$('.p_front_text_2').set('text',o_front_text_2);
		$$('.p_inside_text_1').set('text',o_inside_text_1);
		$$('.p_inside_text_2').set('text',o_inside_text_2);
		$$('.p_inside_text_3').set('text',o_inside_text_3);
	}
}
window.addEvent('domready', bear.init);