// begin extending jQuery

// outerHTML
$.fn.outerHTML = function() {
	return $("<div>").append( this.eq(0).clone() ).html();
};

// reverse matched sets
$.fn.reverse = Array.prototype.reverse;

// resize iframe height
$.fn.setToScrollHeight = function() {
	var theHeight;
	return this.each(function() {
		if (this.tagName.toLowerCase() == "iframe") {
			theHeight = this.contentWindow.document.body.scrollHeight;
			$(this).css('height', theHeight + 'px');
		}
	});
};

// resize iframe width
$.fn.setToScrollWidth = function() {
	var theWidth;
	return this.each(function() {
		if (this.tagName.toLowerCase() == "iframe") {
			theWidth = this.contentWindow.document.body.scrollWidth;
			$(this).css('width', theWidth + 'px');
		}
	});
};

// add query string to element
$.fn.addQuery = function() {
	var curSrc;
	var newSrc;
	return this.each(function() {
		curSrc = $(this).attr("src");
		newSrc = (curSrc.indexOf("?") == -1) ? window.location.search : window.location.search.toString().replace(/\?/, "&");
		$(this).attr("src", curSrc + newSrc);
		
	});
};

// reset forms
$.fn.reset = function() {
	return $(this).each(function() {
		this.reset();
	});
}
// end extending jQuery

// global variables
var userAgent = navigator.userAgent.toLowerCase();

// begin onload functions

// Local and server environment setting
var envSetting;
var serverSetting;
$(function() {
	var stringArray = $("#environmentsetting").attr("value").split("framework");
	var stringArray2 = $("#environmentsetting").attr("value").split("://");
	envSetting = stringArray[0];
	httpSetting = stringArray2[0];
	serverSetting = $("#serversetting").attr("value");
});

// browser detection
$(browserDetection);

var roundedFinish = false;
// rounded corners
$(function() {
	if($("body").hasClass("IE")) {
		// setup VML for IE
		if (!document.namespaces.v) {
			document.namespaces.add("v", "urn:schemas-microsoft-com:vml");
		}
		
		// round corners if there are any
		$(".rounded").reverse().each(rounded);
		$(".rounded").not("img").each(roundedHover);
	} else {
		$("img.rounded").each(roundedImg);
	}
});

// kill outline for link clicks
$(function() {
	$("a").mousedown(function() {
		$(this).css("outline", "none");
	});
});

$(loadScripts);

// end onload functions

// global functions
function browserDetection() {
	$.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase()); 
	if($.browser.msie) { // Is this a version of IE?
		$("body").addClass("IE");        
		$("body").addClass("IE" + $.browser.version.substring(0,1));
	}
	if($.browser.chrome) { // Is this a version of Chrome?
		$("body").addClass("Chrome");
		userAgent = userAgent.substring(userAgent.indexOf("chrome/") +7);
		userAgent = userAgent.substring(0,1);
		$("body").addClass("Chrome" + userAgent);  
		$.browser.safari = false; // If it is chrome then jQuery thinks it's safari so we have to tell it it isn't
	}
	if($.browser.safari) { // Is this a version of Safari?
		$("body").addClass("Safari");        
		userAgent = userAgent.substring(userAgent.indexOf("version/") +8);
		userAgent = userAgent.substring(0,1);
		$("body").addClass("Safari" + userAgent);
	}
	if($.browser.mozilla) { // Is this a version of Mozilla?
		if(navigator.userAgent.toLowerCase().indexOf("firefox") != -1) { //Is it Firefox?
			$("body").addClass('Firefox');
			userAgent = userAgent.substring(userAgent.indexOf("firefox/") +8);
			userAgent = userAgent.substring(0,1);
			$("body").addClass("Firefox" + userAgent);
		} else { // If not then it must be another Mozilla
			$("body").addClass("Mozilla");
		}
	}
}

function loadScripts() {
	try {
		for(var i = loadScripts.length - 1; i >= 0; i--) {
			$.getScript(loadScripts[i]);
		}
	} catch (err) {
		// do nothing
	}
}

function rounded() {
	try {
		// current tag
		var tagName = this.tagName.toLowerCase();
		// html to be inserted
		var innerHTML = "";
		// get default styles
		var defaultState = eleStyles($(this));
		// get hover styles
		$(this).addClass("hover");
		var hoverState = eleStyles($(this));
		// set back to default
		$(this).removeClass("hover");
		
		// prepare html
		if(tagName == "img") {
			defaultState.backgroundImage = $(this).attr("src");
			var divWrapper = document.createElement($(this).outerHTML().toString().replace(/^<img/i, "<div"));
		} else {
			// apply new styles
			$(this).css({"background": "transparent",
						"border": "none",
						"padding": "0",
						"margin": defaultState.margin,
						"width": (defaultState.width + 1) + "px",
						"height": (defaultState.height + 1) + "px"});
			innerHTML = $(this).html();
		}
		// wrap rounded corners around the innerHTML of the element
		var newHTML = '<div style="position:relative"><v:shape coordorigin="0 0" coordsize="' + defaultState.width + ' ' + defaultState.height + '" path="m ' + defaultState.borderRadiusTL + ',0 l ' + (defaultState.width - defaultState.borderRadiusTR) + ',0 qx ' + defaultState.width + ',' + defaultState.borderRadiusTR + ' l ' + defaultState.width + ',' + (defaultState.height - defaultState.borderRadiusBR) + ' qy ' + (defaultState.width - defaultState.borderRadiusBR) + ',' + defaultState.height + ' l ' + defaultState.borderRadiusBL + ',' + defaultState.height + ' qx 0,' + (defaultState.height - defaultState.borderRadiusBL) + ' l 0,' + defaultState.borderRadiusTL + ' qy ' + defaultState.borderRadiusTL + ',0 x e" strokecolor="' + defaultState.borderColor +'" strokeweight="' + defaultState.borderWidth + '" style="behavior:url(#default#VML); display:block; position:absolute; top:0; left:0; antialias:true; width:' + defaultState.width + 'px; height:' + defaultState.height + 'px;"><v:fill color="' + defaultState.backgroundColor + '"';
		newHTML += (defaultState.backgroundImage == "") ? "" : ' src="' + defaultState.backgroundImage + '" type="tile" position="' + (parseInt(defaultState.backgroundPositionX) / defaultState.width)  + ", " + (parseInt(defaultState.backgroundPositionY) / defaultState.height) + '"';
		newHTML += ' style="behavior:url(#default#VML);"/>';
		// create the new html depending on tag type
		if(tagName == "img") {
			divWrapper.innerHTML = newHTML + '</v:shape></div>';
			$(this).replaceWith(divWrapper);
			$(divWrapper).css({"border": "none",
						"padding": defaultState.padding,
						"margin": defaultState.margin,
						"width": (defaultState.width + 1) + "px",
						"height": (defaultState.height + 1) + "px",
						"float": defaultState.float,
						"clear": defaultState.clear,
						"display": (defaultState.display == "inline") ? "inline-block" : display,
						"position": defaultState.position,
						"top": defaultState.top,
						"right": defaultState.right,
						"bottom": defaultState.bottom,
						"left": defaultState.left});
		} else {
			newHTML += '</v:shape><v:shape coordorigin="0 0" coordsize="' + hoverState.width + ' ' + hoverState.height + '" path="m ' + hoverState.borderRadiusTL + ',0 l ' + (hoverState.width - hoverState.borderRadiusTR) + ',0 qx ' + hoverState.width + ',' + hoverState.borderRadiusTR + ' l ' + hoverState.width + ',' + (hoverState.height - hoverState.borderRadiusBR) + ' qy ' + (hoverState.width - hoverState.borderRadiusBR) + ',' + hoverState.height + ' l ' + hoverState.borderRadiusBL + ',' + hoverState.height + ' qx 0,' + (hoverState.height - hoverState.borderRadiusBL) + ' l 0,' + hoverState.borderRadiusTL + ' qy ' + hoverState.borderRadiusTL + ',0 x e" strokecolor="' + hoverState.borderColor +'" strokeweight="' + hoverState.borderWidth + '" style="behavior:url(#default#VML); display:none; position:absolute; top:0; left:0; antialias:true; width:' + hoverState.width + 'px; height:' + hoverState.height + 'px;"><v:fill color="' + hoverState.backgroundColor + '"';
			newHTML += (hoverState.backgroundImage == "") ? "" : ' src="' + hoverState.backgroundImage + '" type="tile" position="' + (parseInt(hoverState.backgroundPositionX) / hoverState.width)  + ", " + (parseInt(hoverState.backgroundPositionY) / hoverState.height) + '"';
			newHTML += 'style="behavior:url(#default#VML);"/></v:shape><div style="position:absolute; top:0; left:0; width:' + defaultState.innerWidth + 'px; height:' + defaultState.innerHeight + 'px; margin:' + defaultState.padding + ';">' + innerHTML + '</div></div>';
			this.innerHTML = newHTML;
		}
	} catch(err) {
		// do nothing
	}
}

function roundedHover() {
	try {		
		// apply hover states
		$(this).hover(
			function() {
				$(this).find("shape").eq(0).css("display", "none");
				$(this).find("shape").eq(1).css("display", "block");
			},
			function() {
				$(this).find("shape").eq(1).css("display", "none");
				$(this).find("shape").eq(0).css("display", "block");
			}
		);
	} catch(err) {
		// do nothing
	}
}

function roundedImg() {
	var backgroundImage = $(this).attr("src");
	var display = $(this).css("display");
	$(this).css({"background-image": "url(" + backgroundImage + ")",
				"display": (display == "inline") ? "inline-block" : display});
	var innerHTML = $(this).outerHTML().toString().replace(/^<img/i, "<div");
	$(this).replaceWith(innerHTML);
}

function eleStyles(obj) {
	try {
		// return object
		var eleStyles = new Object();
		// get background color and image
		eleStyles.backgroundColor = ($(obj).css("background-color") == "transparent") ? "#fff" : $(obj).css("background-color");
		eleStyles.backgroundImage = $(obj).css("background-image").replace(/^url\("(.+)"\)$/, '$1');
		if(eleStyles.backgroundImage.toLowerCase() == "none") {
			eleStyles.backgroundImage = "";
		}
		// get background position
		eleStyles.backgroundPositionX = $(obj).css("background-position-x");
		eleStyles.backgroundPositionY = $(obj).css("background-position-y");
		eleStyles.backgroundPosition = eleStyles.backgroundPositionX + " " + eleStyles.backgroundPositionY;
		// get border color and width
		eleStyles.borderColor = $(obj).css("border-color");
		eleStyles.borderWidth = parseInt($(obj).css("border-width"));
		// get border-radius
		eleStyles.borderRadius = parseInt($(obj).css("border-radius"));
		eleStyles.borderRadiusTL = 0;
		eleStyles.borderRadiusTR = 0;
		eleStyles.borderRadiusBL = 0;
		eleStyles.borderRadiusBR = 0;
		// if it doesn't exist, get each border-radius
		if(isNaN(eleStyles.borderRadius)) {
			eleStyles.borderRadiusTL = parseInt($(obj).css("border-top-left-radius"));
			eleStyles.borderRadiusTR = parseInt($(obj).css("border-top-right-radius"));
			eleStyles.borderRadiusBL = parseInt($(obj).css("border-bottom-left-radius"));
			eleStyles.borderRadiusBR = parseInt($(obj).css("border-bottom-right-radius"));
		} else { // otherwise set each border-radius to the same value
			eleStyles.borderRadiusTL = eleStyles.borderRadiusTR = eleStyles.borderRadiusBL = eleStyles.borderRadiusBR = eleStyles.borderRadius;
		}
		// get display, float and positioning
		eleStyles.display = $(obj).css("display");
		eleStyles.float = $(obj).css("float");
		eleStyles.clear = $(obj).css("clear");
		eleStyles.position = $(obj).css("position");
		eleStyles.top = $(obj).css("top");
		eleStyles.right = $(obj).css("right");
		eleStyles.bottom = $(obj).css("bottom");
		eleStyles.left = $(obj).css("left");
		// get the margin
		eleStyles.margin = $(obj).css("margin-top") + " " + $(obj).css("margin-right") + " " + $(obj).css("margin-bottom") + " " + $(obj).css("margin-left") + ";";
		// get each padding value
		eleStyles.paddingTop = parseInt($(obj).css("padding-top"));
		eleStyles.paddingRight = parseInt($(obj).css("padding-right"));
		eleStyles.paddingBottom = parseInt($(obj).css("padding-bottom"));
		eleStyles.paddingLeft = parseInt($(obj).css("padding-left"));
		// set padding
		eleStyles.padding = (eleStyles.paddingTop + eleStyles.borderWidth) + "px " + (eleStyles.paddingRight + eleStyles.borderWidth) + "px " + (eleStyles.paddingBottom + eleStyles.borderWidth) + "px " + (eleStyles.paddingLeft + eleStyles.borderWidth) + "px;";
		// get the css height and width
		eleStyles.innerHeight = $(obj).height();
		eleStyles.innerWidth = $(obj).width();
		// set height and width including borders and padding
		eleStyles.height = eleStyles.innerHeight + eleStyles.paddingTop + eleStyles.paddingBottom + (eleStyles.borderWidth * 2) - 1;
		eleStyles.width = eleStyles.innerWidth + eleStyles.paddingRight + eleStyles.paddingLeft + (eleStyles.borderWidth * 2) - 1;
		
		return eleStyles;
	} catch(err) {
		// do nothing
	}
}

//truncate string
//clsName: CSS class name
//strLength: string length
//trail: string that will follow truncated text.
function truncateString(clsName, strLength, trail) {
    var para = $("." + clsName);
    for (var i = 0; i < para.length; i++) {
        var txt = para[i].lastChild.nodeValue;
        if (txt.length > strLength) {
            var newtxt = txt.substring(0, strLength) + trail;
            para[i].innerHTML = newtxt;
        }
    }
}

//finds the value of a querystring variable
function parseURL(n) {
	var returnValue = "";
	var regexS = "[\\?&]"+n+"=([^&#]*)";
	var regex = new RegExp(regexS);
	var tmpURL = window.location.href;
	var results = regex.exec(tmpURL);
	
	if (results != null) returnValue = results[1];
	
	return returnValue;
};


//
// jokers wild
//
var arrowUp;
var arrowUpHover;
var arrowDown;
var arrowDownHover;
var listSize = 85;
var totalListNum = 3;

function iniJokerswild() {
    arrowUp = envSetting + "/common/framework/pages/global/jokerswild/jw_arrowup.gif"
    arrowUpHover = envSetting + "/common/framework/pages/global/jokerswild/jw_arrowup_hover.gif";
    arrowDown = envSetting + "/common/framework/pages/global/jokerswild/jw_arrowdown.gif";
    arrowDownHover = envSetting + "/common/framework/pages/global/jokerswild/jw_arrowdown_hover.gif";

    if ($('.jokerswild').length != 0) {

        $('.jokerswild').each(function() {
            var objJW = $(this);
            var productList = objJW.find('li');
            var productListHTML = [];
            var newProductList = [];
            if (productList.length <= totalListNum) {
                $(this).find('ul').css('display', 'block'); //the list is hidden in default
            }
            else {
                for (var i = 0; i < productList.length; i++) {
                    productListHTML[i] = $(productList[i]).html();
                }
                //create new productList
                for (var i = productListHTML.length - totalListNum; i < productListHTML.length; i++) { //add last 3 list from original lists
                    newProductList.push(productListHTML[i]);
                }
                for (var i = 0; i < productListHTML.length; i++) { //add original lists
                    newProductList.push(productListHTML[i]);
                }
                for (var i = 0; i < 3; i++) {   //add first 3 lists from original lists
                    newProductList.push(productListHTML[i]);
                }

                //display new productList
                var txt = '';
                txt += '<ul class="newlist">';
                for (var i = 0; i < newProductList.length; i++) {
                    txt += '<li>';
                    txt += newProductList[i];
                    txt += '</li>';
                }
                txt += '</ul>';
                objJW.find('ul').replaceWith(txt);
                displayArrow(objJW, productList);
            }
        }); 
    }
}

function displayArrow(obj, productList) {

    obj.find('div.arrow.up a').css('display', 'block');
    obj.find('div.arrow.down a').css('display','block');
    
    //up & down arrow mouseover effect
    obj.find('div.arrow.up a img').mouseover(function() {
        $(this).attr("src", arrowUpHover);
    });
    obj.find('div.arrow.up a img').mouseout(function() {
        $(this).attr("src", arrowUp);
    });
    obj.find('div.arrow.down a img').mouseover(function() {
        $(this).attr("src", arrowDownHover);
    });
    obj.find('div.arrow.down a img').mouseout(function() {
        $(this).attr("src", arrowDown)
    });
    
    //attach click event
    obj.find('div.arrow.up a').click(function() {
        moveElement(+1, obj, productList);
    });
    obj.find('div.arrow.down a').click(function() {
        moveElement(-1, obj, productList);
    });
}

function moveElement(direction, obj, productList) {
    var visibleSize = listSize * totalListNum;
    var currentPos = -parseInt(obj.find('.newlist').css('top')) - visibleSize;
    var maxRange = productList.length * listSize;
    
    if(!(currentPos % listSize)){

        if (direction > 0) {    //up arrow
            if (currentPos < 0) {
                currentPos += maxRange;
                obj.find('.newlist').css('top', (-currentPos - visibleSize) + 'px');
            }
            currentPos -= visibleSize;
        }

        if (direction < 0) {    //down arrow
            if (currentPos + visibleSize > maxRange) {
                currentPos -= maxRange;
                obj.find('.newlist').css('top', (-currentPos - visibleSize) + 'px');
            }
            currentPos += visibleSize;
        }

        //animation
        toppos = (-currentPos - visibleSize) + 'px';
        obj.find('.newlist').animate({ top: toppos });
    }
}


$(document).ready(function(){
if($("body").hasClass("IE6")) {
	$(iniWarningPopup);
	}
});

/* ----------------------------------------------------------------------------	
ESD popup
Dependencies: jQuery 1.3.1+
*/
function iniESDpopup() {

    if($('.leaf').length > 0 &&  $('.esdPopup').length > 0) {
        
        $('.leaf').each(function(){
            var leafy = $(this).position().top;
		    var leafx = $(this).position().left;
		    var leafw = $(this).find('span').width()
		    var poph = $(this).next('.esdPopup').outerHeight(); 

            var popx = leafx + leafw;
            var popy = leafy - poph;
        
            var esdPopup = $(this).next('.esdPopup');
            esdPopup.css('left', popx);
		    esdPopup.css('top',popy);

            $(this).find('img').hover(
			    function(){
                    esdPopup.css('display', 'block');
			    },
			    function() {
                    esdPopup.css('display', 'none');
			    }
		    );
        });

	}
}

$(iniESDpopup);

/* ----------------------------------------------------------------------------	
Comparison Page
Dependencies: jQuery 1.3.1+
*/
function highlighteActiveGlobalLink() {
	var activeGlbLink = $('#comparisoncatmclass');
	var activeGlbLinkValue = activeGlbLink.attr('value');

	var glbNavElm = $('#globalNav > dl > dd');

	if(activeGlbLinkValue == "one") //windows link
		glbNavElm.eq(0).addClass('active');
	else if(activeGlbLinkValue == "two")	//office link
		glbNavElm.eq(1).addClass('active');
}