// JScript File
//sushi boat needs parameters
	var _intSushiTotalContent = 0;
	var _intAutoChangeSec = 11;
	var _divMainName = 'SushiCarousel';
	var _intNormalSmallImage = '280';
	var _intShrinkSmallImage = '266'; // 280 * 0.95 = 266
	
	var _intNormalLargeImage = '420';
	var _intShrinkLargeImage = '399';
	
	var _intIEonlyNormalMargin = '-130';
	var _intIEonlyLargeMargin = '-200';
	
	var _intIEonlyNormalMoveMargin = '-140';
	var _intIEonlyLargeMoveMargin = '-212';
	
	var _cssLargeSectionName = 'largeSection';
	var _objSushi = null;
	var _blnStart = false;
	
//------------------------------------------------------------------------------------------------------------	
	function GetX(objLi,lienbable,lihover){		
		var intXposition = 0; 
		if($(objLi).attr("class").indexOf("normalProduct") > -1){
				intXposition = -130;
		}
		
		if(lienbable == true){
			if(lihover == true){
				intXposition = intXposition - 520;
			}
		}else{
			intXposition = intXposition - 260;
		}
		
		return intXposition;
	}
//------------------------------------------------------------------------------------------------------------				
function hideLeftNavigation(){
	$('#leftcontentarea').css("display","none");
	if($("#subContentArea").length > 0){
		if(jQuery.browser.msie == true && jQuery.browser.version == '6.0'){
			var CssSetting = {
				'margin-left' : '10px',
				'margin-top' : '6px',
				'width' : '900px'
			}
			$("#subContentArea").css(CssSetting);
		}else{
			var CssSetting = {
				'margin-left' : '20px',
				'margin-top' : '6px',
				'width' : '900px'
			}
			$("#subContentArea").css(CssSetting);
		}
	}
}

	
//for sushiboat product all button --> called this function from flash file------------------------------------------
	function ShowAllProductButton(){
		if(DisplayProductAll == true){
			return 'N';
		}else{
			return 'Y';
		}
	}	
	
	
	//setup product news
	function ShowNews(){
		
		$('#subContentArea').width('500px');
		$('#maincontentarea').width('733px');
		
		var cssVisibleObj = {
			'display' : 'block'
		}
		$('#c3news').css(cssVisibleObj);

	}
	
	function HideNews(){
		var cssVisibleObj = {
			'display' : 'none'
		};
		$('#c3news').css(cssVisibleObj);
		var cssContent = {
			'width' : '700px'
		};
		$('#subContentArea').css(cssContent);
	}
	
	//setup product news in product_gallery.aspx------------------------------------------------
	function ShowNewsInGallery(){
		var cssContent = {
			'width' : '520px',
			'margin' :'0px',
			'padding' : '0px 0px 0px 6px',
			'overflow' : 'hidden'
		};
		$('#subContentArea').css(cssContent);
		
		var cssMainContent = {
			'width' : '733px',
			'float' : 'left'
		};
		$('#maincontentarea').css(cssMainContent);
		
		var cssVisibleObj = {
			'display' : 'block'
		};
		$('#c3news').css(cssVisibleObj);
	}
	
	function HideNewsInGallery(){
		var cssVisibleObj = {
			'display' : 'none'
		};
		$('#c3news').css(cssVisibleObj);
		
		var cssContent = {
			'width' : '720px',
			'margin' :'0px',
			'padding' : '0px'
		};
		$('#subContentArea').css(cssContent);
	}

//setup product news in product_press_review.aspx-------------------------------------------------
	function ShowNewsInReward(){
		var cssContent = {
			'width' : '520px',
			'margin' :'0px',
			'padding' : '0px 0px 0px 6px',
			'overflow' : 'hidden'
		};
		$('#subContentArea').css(cssContent);
		
		var cssMainContent = {
			'width' : '733px',
			'float' : 'left'
		};
		$('#maincontentarea').css(cssMainContent);
		
		var cssVisibleObj = {
			'display' : 'block'
		};
		$('#c3news').css(cssVisibleObj);
	}
	
	function HideNewsInReward(){
		var cssVisibleObj = {
			'display' : 'none'
		};
		$('#c3news').css(cssVisibleObj);
		
		var cssContent = {
			'width' : '720px',
			'margin' :'0px',
			'padding' : '0px'
		};
		$('#subContentArea').css(cssContent);
	}
	
//sushi boat----------------------------------------------------------------------------------------------------------------
	function BuildSushiBoat(XMLPath){
	    $.ajax({
	        dataType: 'xml',
	        url: XMLPath,
	        type: 'get',
	        success: function (oXml) {
	            _objSushi = $('#' + _divMainName);
	            _objSushi.html('');
	            var xmlDoc = $(oXml).find('root');
	            var Groups = '';
	            _intSushiTotalContent = xmlDoc.find('images').length;
	            xmlDoc.find("images").each(
					function () {
					    var PhoneItem = '';
					    var GroupItem = '<li>{0}</li>';

					    var ValidItems = 0;
					    var GivenClass = 'phoneItem';

					    var classNameLarge = '';
					    var shrinkSizeFirst = _intShrinkSmallImage;
					    var isLargeImageSection = false;
					    if (typeof ($(this).attr('type')) != undefined && $(this).attr('type') == 'large') {
					        classNameLarge = _cssLargeSectionName + ' ';
					        shrinkSizeFirst = _intShrinkLargeImage;
					        isLargeImageSection = true;
					    };


					    $(this).find('image').each(
							function () {
							    var ProductImage = $(this).find('ProductImage').text();
							    if (ProductImage != null && ProductImage.length > 0) {
							        ValidItems += 1;
							    }
							}
						);

					    if (isLargeImageSection == true) {
					        if (ValidItems == 2) {
					            GivenClass = 'tablet2Item';
					        } else if (ValidItems == 1) {
					            GivenClass = 'tablet1Item';
					        }
					    } else {
					        if (ValidItems == 2) {
					            GivenClass = 'phone2Item';
					        } else if (ValidItems == 1) {
					            GivenClass = 'phone1Item';
					        }
					    }

					    $(this).find('image').each(
							function () {
							    var ProductImage = $(this).find('ProductImage').text();
							    var ProductNameImage = $(this).find('ProductNameImage').text();
							    var ProductBrief = $(this).find('ProductBrief').text();
							    var Link = $(this).find('Link').text();

							    if (ProductImage != null && ProductImage.length > 0) {
							        //build li 
							        PhoneItem += "<div class='" + classNameLarge + GivenClass + "'>"; //class name should be 'phoneItem', 'phone1Item' or 'phone2Item'.
							        PhoneItem += "<div class='ProductImage'>";
							        PhoneItem += "<img src='" + ProductImage + "' width='" + shrinkSizeFirst + "px'  />";
							        PhoneItem += "</div>";
							        PhoneItem += "<div class='ProductNameImage'><img  src='" + ProductNameImage + "'/></div>";
							        PhoneItem += "<div class='ProductBrief' >" + ProductBrief + "</div>";
							        PhoneItem += "<div class='Link' style='display:none;'>" + Link + "</div>";
							        PhoneItem += "</div>";
							    }
							}
						);

					    if (PhoneItem.length > 0) {
					        GroupItem = GroupItem.replace('{0}', PhoneItem);
					    }

					    if (GroupItem.indexOf('{0}') == -1) {
					        Groups += GroupItem;
					    }
					}
				);

	            Groups = '<ul>' + Groups + '</ul>';
	            _objSushi.append(Groups);

	            //add round button------------------------------------------------------------------------------------
	            var strButtons = '<div id="jcarousel-control" align="center">';
	            strButtons += '<div class="jcarousel-prev">&nbsp;</div>';
	            strButtons += '<div class="jcarousel-next">&nbsp;</div>';
	            strButtons += '<table id="TableForRound">';
	            strButtons += '<tr><td align="center">{0}</td></tr></table></div>';
	            var strControl = '';
	            for (i = 1; i <= _intSushiTotalContent; i++) {
	                strControl += '<div class="round" id="round_btn_' + i + '"></div>';
	            }
	            _objSushi.append(strButtons.replace('{0}', strControl));


	            //build mouseover & mouseout & click--------------------------------------------------------------------

	            //div class is like 'largeSection tablet2Item' or 'phone2Item', detect end string is 'Item'
	            _objSushi.find('ul li div[class$=Item]').hover(
					function () {
					    MouseOverOnSelectedPhone($(this));
					},
					function () {
					    MouseOutOnSelectedPhone($(this));
					}
				).click(
					function () {
					    var strLink = $(this).find('div.Link').text().toLowerCase();
					    var strGaTracker = strLink.replace('/product/', '/product/sushiboat/');
					    //remove "xxxx.html" into "clicks"
					    strGaTracker = RewriteUrlLinkString(strGaTracker);

					    //insert GA tracker into event
					    InsertGAeventAndGotoLink('Product Sushiboat', 'Clicks', strGaTracker, strLink);
					}
				); //click end--------------------------------
	            _objSushi.jcarousel({
	                start: 1,
	                wrap: 'both',
	                scroll: 1,
	                auto: _intAutoChangeSec,
	                size: _intSushiTotalContent,
	                visible: 1,
	                buttonNextHTML: null,
	                buttonPrevHTML: null,
	                initCallback: SushiCarousel_initCallback,
	                itemFirstInCallback: SushiCarousel_itemFirstInCallback,
	                itemFirstOutCallback: SushiCarousel_itemFirstOutCallback
	            });
	        },
	        error: function (XMLHttpRequest, textStatus, errorThrown) {
	            alert('error');
	        }
	    });
	}

	function RewriteUrlLinkString(Link) {
	    //remove "xxxx.html" into "clicks"
	    var arrUrlLink = Link.split("/");
	    var intPartNum = 0;
        //trim
	    var strLink = Link.replace(/(^[\\s]*)|([\\s]*$)/g, "");
	    var strPageName = '';
	    while (intPartNum < arrUrlLink.length) {
	        var strPart = arrUrlLink[intPartNum];
	        if (strPart.indexOf(".htm") > 0) {
	            strPageName = strPart;
	        }
	        intPartNum += 1;
	    }
	    if (strPageName != '') {
	        strLink = strLink.replace(strPageName, 'clicks');
	        //alert('\"' + strPageName + '\"+' + strLink);
        }

	    return strLink;
    }

	function BuildGAeventAndGotoLink(link) {
	    var strType = '';
	    if (location.href.toLowerCase().indexOf('type=1') > 0) {
            strType = 'touch';
        } else if (location.href.toLowerCase().indexOf('type=2') > 0) {
            strType = 'touchortype';
        } else if (location.href.toLowerCase().indexOf('type=3') > 0) {
            strType = 'type';
        }else{
            strType = 'all';
        }

        var strGaTracker = link.replace('/product/', '/product/list/' + strType + '/');
        //remove "xxxx.html" into "clicks"
        strGaTracker = RewriteUrlLinkString(strGaTracker);

        InsertGAeventAndGotoLink("Product Type", "Clicks", strGaTracker, link);
    }

    function InsertGAeventAndGotoLink(category, event, insertstring, link) {
	    if (pageTracker) {
	        if (insertstring.length > 0 && insertstring != '') {
	           pageTracker._trackEvent(category, event, insertstring);
	        }
	    }

	    setTimeout('document.location = "' + link + '"', 100);
	}
	
	function SushiCarousel_initCallback(carousel){
		if(_blnStart==false){
			carousel.scroll(1);
			_blnStart = true;
		}
		
		_objSushi.find('#TableForRound div').bind('click', function() {
			var strClickRoundId = this.id;
			var strIdx = strClickRoundId.replace('round_btn_','');
			carousel.scroll(jQuery.jcarousel.intval(strIdx));
			return false;
		});
		
		 carousel.clip.hover(function() {
			carousel.stopAuto();
		}, function() {
			carousel.startAuto();
		});
	}
	
	function SushiCarousel_itemFirstInCallback(carousel, item, i, state) {
		var idxNow = carousel.index(i, _intSushiTotalContent);
		$("#round_btn_" + idxNow).removeClass('round');
		$("#round_btn_" + idxNow).addClass('roundSelected');
		$("#round_btn_" + idxNow).unbind('click');
	}

	function SushiCarousel_itemFirstOutCallback(carousel, item, i, state)
	{
		var idxNow = carousel.index(i, _intSushiTotalContent);
		$("#round_btn_" + idxNow).removeClass('roundSelected');
		$("#round_btn_" + idxNow).addClass('round');
		$("#round_btn_" + idxNow).bind('click', function() {
			carousel.scroll(i);
			return false;
		}); 
	};	
	
	function MouseOverOnSelectedPhone(obj){
		obj.css('cursor','pointer').find('div.ProductNameImage').stop().fadeTo(200, 0,function(){
			obj.find('div.ProductBrief').stop().show();
		});
		
		//get large image or normal
		var enlargeWidth = _intNormalSmallImage;
		var enlargeMargin = _intIEonlyNormalMoveMargin;
		if(obj.hasClass(_cssLargeSectionName) == true){
			enlargeWidth = _intNormalLargeImage;
			enlargeMargin = _intIEonlyLargeMoveMargin;
		};
		
		var cssObj;
		if(jQuery.browser.msie == true){
			var siteName = location.href.toLowerCase();
			if(siteName.indexOf('/mea-sa/') > -1 || siteName.indexOf('/eg/') > -1){
				cssObj = {
					width: enlargeWidth + 'px',
					marginRight:enlargeMargin+'px'
				}
			}else{
				cssObj = {
					width: enlargeWidth + 'px',
					marginLeft:enlargeMargin+'px'
				}
			}
		}else{
			cssObj = {
				width: enlargeWidth + 'px'
			}
		}
		
		//padding: "'" + ((0-obj.find('div.ProductImage').height)/2) + "px 0 0 " + ((0-obj.find('div.ProductImage').width)/2) + "px'"
		obj.find('div.ProductImage img').stop().animate(cssObj,{duration: 100});
	}
	
	function MouseOutOnSelectedPhone(obj){
		obj.css('cursor','default').find('div.ProductBrief').stop().hide();
		obj.find('div.ProductNameImage').stop().fadeTo(300, 1);
		
		//get large image or normal
		var shrinkWidth = _intShrinkSmallImage;
		var IEmargin = _intIEonlyNormalMargin;
		if(obj.hasClass(_cssLargeSectionName) == true){
			shrinkWidth = _intShrinkLargeImage;
			IEmargin = _intIEonlyLargeMargin;
		};
		
		var cssObj;
		if(jQuery.browser.msie == true){
			var siteName = location.href.toLowerCase();
			if(siteName.indexOf('/mea-sa/') > -1 || siteName.indexOf('/eg/') > -1){
				cssObj = {
					width: shrinkWidth + 'px',
					marginRight:IEmargin + 'px'
				}
			}else{
				cssObj = {
					width: shrinkWidth + 'px',
					marginLeft:IEmargin+'px'
				}
			}
		}else{
			cssObj = {
				width: shrinkWidth + 'px'
			}
		}
	
		obj.find('div.ProductImage img').stop().animate(cssObj,{duration: 100});
	}