var arySectionTitle_WB;//coolice
var aryBulletPointItem_WB;//coolice
var aryBulletPointItemContent_WB;//coolice
var WB_currentSection=-1;//coolice
var WB_currentBulletPoint=-1;//coolice

if (!window.ExpMIX_WhyBuy)
	window.ExpMIX_WhyBuy = {};

ExpMIX_WhyBuy.Config = {
    xmlData: "./XMLRequest.aspx?method=getWhyBuyWidgetData&a=1",
    xamlSource: "./silverlight/why-buy-widget/xaml/Page.xaml.aspx"
}

ExpMIX_WhyBuy.Page = function() 
{
	this.IconStates=[];
	this.bulletPageCapacity=10;
	this.lastSection=1;
	this.bpEnterFlag=false;
}
var productIconBtnArr=[],bulletPtBtnArr=[],navBtnArr=[];
ExpMIX_WhyBuy.Page.prototype =
{
	
	// Sample event handler
	onProductIconClicked: function(i) 
	{
		// The following line of code shows how to find an element by name and call a method on it.
		//
		
		this.currentSection=i+1;//currentSection ranges from 1 to 6;
		WB_currentSection = this.currentSection;//coolice

		this.control.content.findName("SectionImage").Source = webRoot + this.tree.parent.ExpressionProduct[this.currentSection-1].SectionImage;
		if (this.atHome)
			this.photoScopeOutroSB.begin();
		else {
			this.enterSection();
		}
	},
	onBgOverlayShowSBDone:function(){
		if (!this.atHome){

			//update PrevNextBtn
			this.hasPrevNextBtn=(this.currentProductObj.BulletPoint.length>this.bulletPageCapacity);
			this.control.content.findName("PrevNext_Btn").Visibility=this.hasPrevNextBtn?'Visible':'Collapsed';
			this.showNext=true;
			this.prevNextBtn.toggled=!this.showNext;
			this.prevNextBtn.updateButton();

		}
	},
	showSectionOverlay:function(i){//i=this.currentSection
		
		this.control.content.findName("bgOvlImg"+i+"Show_SB").begin();
		//this.control.content.findName("SectionTitleText").text=this.tree.parent.ExpressionProduct[i-1].SectionTitle;
		this.currentProductObj=this.tree.parent.ExpressionProduct[i-1];

		//init BulletPoints;
		this.updateBulletPage();
	},
	hideSectionOverlay:function(i)
	{
		this.control.content.findName("bgOvlImg"+i+"Hide_SB").begin();
	},
	onTryItClicked: function() 
	{
	    window.location.href = webRoot + this.targetURI;
		//window.open(webRoot + this.targetURI);
	},
	onSeeWhatIsClicked:function()
	{
		this.onProductIconClicked(0);
	},
	onIconEnter: function(sender,args,i) 
	{
		this.control.content.findName("PhotoScopeImg7").Opacity=0;
		sender["Canvas.ZIndex"]=1000;
		this.control.content.findName("IconDesc")["Canvas.ZIndex"]=1001;
		this.IconStates[i]=1;

	},
	onIconLeave: function(sender,args,i) 
	{
		sender["Canvas.ZIndex"]=0;
		this.control.content.findName("IconDesc")["Canvas.ZIndex"]=0;
		this.IconStates[i]=0;
		this.checkDefault();
	},
	onSecNavEnter: function(sender,args,i) 
	{
		if (this.tree.parent.ExpressionProduct[i].Name)
			this.control.content.findName("NavBtnNameText").text=this.tree.parent.ExpressionProduct[i].Name;
		this.control.content.findName("NavBtnNameShow_SB").begin();
	},
	onSecNavLeave: function(sender,args,i) 
	{
		this.control.content.findName("NavBtnNameHide_SB").begin();
	},
	checkDefault:function()
	{	var sum=0;
		for (var i=0;i<6;i++)
			sum+=this.IconStates[i];
		if (sum==0)
			this.control.content.findName("PhotoScopeImg7").Opacity=1;
		
	},
	onPhotoScopeOutroCompleted:function()
	{
		this.control.content.findName("NavBtnsIntro_SB").begin();
		this.enterSection();
	},
	enterSection:function()
	{
		//alert('current='+this.currentSection);
		//alert('last='+this.lastSection);
		this.oldTime=new Date();
		this.landingPage.Visibility="Collapsed";
		this.sectionPage.Visibility="Visible";
		this.bulletPageIndex=0;

		if (this.atHome)
			this.hideSectionOverlay(1);
		else if (this.lastSection!=0)
				this.hideSectionOverlay(this.lastSection);
			else
				this.hideSectionOverlay(1);
		this.atHome=false;
		this.autoPlay=true;
		this.showSectionOverlay(this.currentSection);

		this.lastSection=this.currentSection;

	},
	getShowNextFlag:function()
	{	
		return !this.showNext;
	},
	updateBulletPage:function()
	{
		/*coolice
		for (var j=0;j<this.bulletPageCapacity;j++)
		{	
			var tmpInt=j+this.bulletPageIndex*this.bulletPageCapacity;
			if (this.currentProductObj.BulletPoint[tmpInt])
			{	
				this.control.content.findName("BulletPoint"+(j+1)+"_Btn").Visibility="Visible";
				this.control.content.findName("BulletPointTitle"+(j+1)).text=(this.currentProductObj.BulletPoint[tmpInt].Title)?this.currentProductObj.BulletPoint[tmpInt].Title:"";
				this.control.content.findName("BulletImage"+(j+1)).Source=(this.currentProductObj.BulletPoint[tmpInt].Image) ? webRoot + this.currentProductObj.BulletPoint[tmpInt].Image:"";
			}
			else {
				this.control.content.findName("BulletPoint"+(j+1)+"_Btn").Visibility="Collapsed";

			}
		}
		*/
		try{
			var tmpIdxCurSec = WB_currentSection - 1;
			//Jun:
			var startTopPosition = 110;
			var bulletSpace = 10;
			//
			for (var j=0;j<10;j++)
			{	
				var tmpInt=j;
				var tmpItem= document.getElementById("BP_"+(j+1));
				if (j<aryBulletPointItem_WB[tmpIdxCurSec].length){
					tmpItem.style.display = "";
					tmpItem.innerHTML = aryBulletPointItem_WB[tmpIdxCurSec][j];
					this.control.content.findName("BulletPoint"+(j+1)+"_Btn").Visibility="Visible";
					this.control.content.findName("BulletImage"+(j+1)).Source=(this.currentProductObj.BulletPoint[tmpInt].Image) ? webRoot + this.currentProductObj.BulletPoint[tmpInt].Image:"";
				}else{
					tmpItem.style.display = "none";
					tmpItem.innerHTML = "";
				}
				if (this.currentProductObj.BulletPoint[tmpInt])
				{	
					this.control.content.findName("BulletPoint"+(j+1)+"_Btn").Visibility="Visible";
					//this.control.content.findName("BulletPointTitle"+(j+1)).text=(this.currentProductObj.BulletPoint[tmpInt].Title)?this.currentProductObj.BulletPoint[tmpInt].Title:"
					this.control.content.findName("BulletImage"+(j+1)).Source=(this.currentProductObj.BulletPoint[tmpInt].Image) ? webRoot + this.currentProductObj.BulletPoint[tmpInt].Image:"";
				}
				else {
					//this.control.content.findName("BulletPoint"+(j+1)+"_Btn").Visibility="Collapsed";
					//tmpItem.innerHTML = "";
				}
				//Jun
				tmpItem.style.top = startTopPosition+"px";
				startTopPosition += tmpItem.scrollHeight+bulletSpace;
				//
			}
		}
		catch (e){}
	},
	onBulPtEnter:function(sender,args,i)
	{
if (true) return;
		this.oldTime=new Date();
		this.bpEnterFlag=true;
		//this.currentBP=i+this.bulletPageIndex*this.bulletPageCapacity;
		//this.bpContTxt.text=(this.tree.parent.ExpressionProduct[this.currentSection-1].BulletPoint[this.currentBP].Content)?this.tree.parent.ExpressionProduct[this.currentSection-1].BulletPoint[this.currentBP].Content:"";
		if (this.BPContentOff)
		{
			this.control.content.findName("BulletPointContentShow_SB").begin();
			this.BPContentOff=false;
		}
		this.control.content.findName("BulletImage"+(i+1)).Opacity=1;
		this.control.content.findName("SectionImage").Opacity=0;
	},
	onBulPtLeave:function(sender,args,i)
	{
if (true) return;
		this.bpEnterFlag=false;
		/*
		if (!this.BPContentOff)
		{
			this.control.content.findName("BulletPointContentHide_SB").begin();
			this.BPContentOff=true;
		}*/
		this.oldTime=new Date();
		this.control.content.findName("BulletImage"+(i+1)).Opacity=0;
		this.control.content.findName("SectionImage").Opacity=1;
	},
	hideContent:function()
	{	this.oldTime=new Date();
		if (!this.BPContentOff)
		{
			this.control.content.findName("BulletPointContentHide_SB").begin();
			this.BPContentOff=true;
		}
	},
	onPrevNextClicked:function()
	{	this.oldTime=new Date();
		this.bulletPageIndex+=this.prevNextBtn.toggled?(-1):1;
		this.updateBulletPage();
	},
	goHome:function()
	{
	    try {
	    	hideDIV_WB();//coolice
		    this.control.content.findName("Return_SB").begin();
		    this.landingPage.Visibility="Visible";
		    this.sectionPage.Visibility="Collapsed";
		    this.control.content.findName("PhotoScope").Opacity=1;
		    this.control.content.findName("PhotoScope").RenderTransform.Children.getItem(0).ScaleX=1;
		    this.control.content.findName("PhotoScope").RenderTransform.Children.getItem(0).ScaleY=1;
		    //alert(this.control.content.findName("PhotoScope").RenderTransform.Children.getItem(0).ScaleY);
    		
		    this.hideSectionOverlay(this.currentSection);
		    this.currentSection=0;
		    WB_currentSection=-1;//coolice
		    this.atHome=true;
		    this.showSectionOverlay(1);
		    this.autoPlay=false;
        }
        catch (e) {
        }
	},
	checkTimeout:function()
	{
	//coolice_start
		var vMask = document.getElementById("WB_Mask"); 
		var vSecTitle = document.getElementById("WB_SecTitle"); 
		var idxBP = 0;
		if (this.currentSection<=0){//clear
			/*vSecTitle.innerHTML = "";
			vSecTitle.style.display = "none";
			vMask.style.display = "none";
			var tmpBPItem;
			for (idxBP=1; idxBP<11; idxBP++){
				tmpBPItem = document.getElementById("BP_"+(idxBP));
				tmpBPItem.innerHTML = "";
				tmpBPItem.style.display = "none";
			}*/	
		}else{	
			if (this.currentSection>0){	
				for (idxBP=1; idxBP<11; idxBP++){
					this.control.content.findName("BulletImage"+(idxBP)).Opacity=0;
				}
				
				var idxTmpSec = WB_currentSection;
				var iSec = parseInt(idxTmpSec);
				iSec  = iSec-1;
				var iSecLen = -1;		
				
				if (iSec>=0){
					vSecTitle.innerHTML = arySectionTitle_WB[this.currentSection-1];
					vSecTitle.style.display = "";
					vMask.style.display = "";
					
					iSecLen = aryBulletPointItem_WB[iSec].length;
					
					var idxTmpBP = WB_currentBulletPoint;
					var idxBP = parseInt(idxTmpBP);		
			
					if ((iSec>-1)&&(idxBP>-1)&&(idxBP<= iSecLen)){
						try{
							this.control.content.findName("BulletImage"+(idxBP)).Opacity=1;
							this.control.content.findName("SectionImage").Opacity=0;
							this.bpEnterFlag=true;
						}
						catch (e) {}
					}else{
						try{
							this.control.content.findName("SectionImage").Opacity=1;
							this.bpEnterFlag=false;
						}
						catch (e) {}
					}
				}
			}
		}
	//coolice_end
	
		if (this.bpEnterFlag)
			this.oldTime=new Date();
		var now=new Date();
		if ((now-this.oldTime)>this.timeOut&&this.autoPlay){
			WB_currentSection=-1;//coolice
			WB_currentBulletPoint=-1;//coolice
			this.playNext();
		}
	},
	playNext:function()
	{
        try {
			if (this.hasPrevNextBtn==false||this.prevNextBtn.toggled)
			{	
				if (this.currentSection<this.tree.parent.ExpressionProduct.length){
					this.currentSection++;
					WB_currentSection = this.currentSection;//coolice
					this.control.content.findName("SectionImage").Source= webRoot + this.tree.parent.ExpressionProduct[this.currentSection-1].SectionImage;
					this.enterSection();
				}
				else{
					this.goHome();
				}
			}
			else {
				this.onPrevNextClicked();
				this.showNext=!this.showNext;
				this.prevNextBtn.toggled=!this.showNext;
				this.prevNextBtn.updateButton();
			}
		}
		catch(e) {}
		this.oldTime=new Date();
	}
}
ExpMIX_WhyBuy.Page.prototype.handleLoad=function(control, userContext, rootElement) 
{
		resetData_WB();//coolice
		setLangLib_WB();//coolice
		this.control = control;
		this.rootElement=rootElement;
		this.name='ExpMIX';
		this.atHome=true;
		this.timeOut=8000;
		this.checkTimeInterval=500;
		this.autoPlay=false;
		
		this.photoScopeOutroSB=this.control.content.findName("PhotoScopeOutro_SB");
		
		this.contentShowArea=this.control.content.findName("ContentShowArea");
		//eventListener;
		this.photoScopeOutroSB.addEventListener("Completed",delegate(this,this.onPhotoScopeOutroCompleted));
		this.contentShowArea.addEventListener("MouseLeave",delegate(this,this.hideContent));
		this.landingPage=this.control.content.findName("LandingPageCanvas");
		this.sectionPage=this.control.content.findName("SectionPageCanvas");
		this.sectionPage.Visibility="Collapsed";
		//this.bpContTxt=this.control.content.findName("BulletPointContentText");
		this.BPContentOff=true;
		//XML init
		this.xotree=new XML.ObjTree();
		//var xmlUrl="../silverlight/why-buy-widget/ExpMIX.xml";
		var xmlUrl = webRoot + ExpMIX_WhyBuy.Config.xmlData;
		this.tree=this.xotree.parseHTTP(xmlUrl);
		//////////////////
		for (var i=0;i<6;i++)
		{	
			this.IconStates[i]=0;
			productIconBtnArr[i]=new AdvBtn(control,"ProductIcon"+(i+1),false,true,delegate(this,this.onProductIconClicked,i),null);
			navBtnArr[i]=new AdvBtn(control,"SecNav"+(i+1),false,true,delegate(this,this.onProductIconClicked,i),null);
			this.control.content.findName("bgOvlImg"+(i+1)+"Show_SB").addEventListener("Completed",delegate(this,this.onBgOverlayShowSBDone));
			if (this.tree.parent.ExpressionProduct[i])
			{	if (this.tree.parent.ExpressionProduct[i].IconBtnImage)
				{	
				this.control.content.findName("IconImg"+(i+1)).Source= webRoot + this.tree.parent.ExpressionProduct[i].IconBtnImage;
				this.control.content.findName("NavBtnImg"+(i+1)).Source = webRoot + this.tree.parent.ExpressionProduct[i].IconBtnImage;
				this.control.content.findName("bgOvlImg"+(i+1)).Source = webRoot + this.tree.parent.ExpressionProduct[i].SectionBackgroundOverlay;
				
				}
			}
			//init PhotoScopeImg
			this.control.content.findName("PhotoScopeImg"+(i+1)).Source= webRoot + this.tree.parent.ExpressionProduct[i].PhotoScopeImage;
			//init photoIcon Description
			this.control.content.findName("IconDescText"+(i+1)).text=this.tree.parent.ExpressionProduct[i].Name;
			
			//add new EventListeners
			this.control.content.findName("ProductIcon"+(i+1)+"_Btn").addEventListener("MouseEnter",delegate(this,this.onIconEnter,i));
			this.control.content.findName("ProductIcon"+(i+1)+"_Btn").addEventListener("MouseLeave",delegate(this,this.onIconLeave,i));
			this.control.content.findName("SecNav"+(i+1)+"_Btn").addEventListener("MouseEnter",delegate(this,this.onSecNavEnter,i));
			this.control.content.findName("SecNav"+(i+1)+"_Btn").addEventListener("MouseLeave",delegate(this,this.onSecNavLeave,i));
		}
		
		navBtnArr[navBtnArr.length]=new AdvBtn(control,"SecNavHome",false,true,delegate(this,this.goHome),null);
		
		this.targetURI=this.tree.parent.TryIt.URI;
		var tryBtn=new AdvBtn(control,"TryIt",false,true,delegate(this,this.onTryItClicked),null);
		var seeWhatIsBtn=new AdvBtn(control,"SeeWhatIs",false,true,delegate(this,this.onSeeWhatIsClicked),null);
		this.prevNextBtn=new AdvBtn(control,"PrevNext",true,false,delegate(this,this.onPrevNextClicked),null);
		
		this.control.content.findName("NavHomeBtnImg").Source = webRoot + this.tree.parent.NavHomeImg;
		this.control.content.findName("TryItImg").Source = webRoot + this.tree.parent.TryIt.Image;
		this.control.content.findName("SeeWhatIsImg").Source = webRoot + this.tree.parent.SeeWhatIsImg;

		for (var i=0;i<this.bulletPageCapacity;i++)
		{
			bulletPtBtnArr[i]=new AdvBtn(control,"BulletPoint"+(i+1),false,true,null,null);
			this.control.content.findName("BulletPoint"+(i+1)+"_Btn").addEventListener("MouseEnter",delegate(this,this.onBulPtEnter,i));
			this.control.content.findName("BulletPoint"+(i+1)+"_Btn").addEventListener("MouseLeave",delegate(this,this.onBulPtLeave,i));
			
		}
		setInterval(delegate(this,this.checkTimeout),this.checkTimeInterval);

}


//coolice
function showData(varItem){
	var tmpItemID = ""+varItem.id;
	tmpItemID = tmpItemID.substring(tmpItemID.indexOf("_")+1, tmpItemID.length);
	WB_currentBulletPoint = tmpItemID;
		if ((WB_currentSection>0) && (WB_currentBulletPoint>0)) {
			var tmpIdxCurSec = WB_currentSection - 1;
			var tmpIdxBP = tmpItemID-1;
			var tmpContTxt=document.getElementById("WB_BulletPointContentText");
			tmpContTxt.innerHTML= aryBulletPointItemContent_WB[tmpIdxCurSec][tmpIdxBP];
			tmpContTxt.style.display = "";
			WB_currentBulletPoint = tmpItemID;
		}
}

function hideData(){
	WB_currentBulletPoint=-1;
	var tmpContTxt=document.getElementById("WB_BulletPointContentText");
	tmpContTxt.innerHTML= "";
	tmpContTxt.style.display = "none";

}

function setLangLib_WB(){
	var strLang = getLanguagePreference();
	//strLang = strLang.substring(0, strLang.indexOf("-"));
	var txtLang = strLang;
	txtLang = txtLang.replace('-', '_');

	var strSecTitle = "arySectionTitle_WB_"+txtLang;	
	var strBulletPointItem = "aryBulletPointItem_WB_"+txtLang;
	var strBulletPointItemContent = "aryBulletPointItemContent_WB_"+txtLang;

	arySectionTitle_WB = eval(strSecTitle);
	aryBulletPointItem_WB = eval(strBulletPointItem);
	aryBulletPointItemContent_WB= eval(strBulletPointItemContent);
}

function resetData_WB(){
	WB_currentSection=-1;//coolice
	WB_currentBulletPoint=-1;//coolice
}

function hideDIV_WB(){
	try{
		var idxBP = 0;
		var vMask = document.getElementById("WB_Mask"); 
		var vSecTitle = document.getElementById("WB_SecTitle"); 
		vMask.style.display = "none";
		vSecTitle.innerHTML = "";
		vSecTitle.style.display = "none";
		var tmpBPItem;
		for (idxBP=1; idxBP<11; idxBP++){
			tmpBPItem = document.getElementById("BP_"+(idxBP));
			tmpBPItem.innerHTML = "";
			tmpBPItem.style.display = "none";
		}
	}catch(e){}
}