var dragdrop = false;
var currentPopupId;
//var IE6 = true;
var isDivVisible = false;

function liHover(parentClassName)
{
    var parentDiv;
    var divs = document.getElementsByTagName("div");
	for(i=0;i < divs.length;i++) {
		if(divs[i].className==parentClassName) parentDiv = divs[i];
	}
	if(parentDiv!=null) {
	    var els = parentDiv.getElementsByTagName("li");
	    for(i=0; i < els.length;i++) {
	        els[i].onmouseover=function() {
	            this.className+=" hover";
	        }
	        els[i].onmouseout=function() {
	            this.className=this.className.replace(new RegExp(" hover\\b","g"), "");
	        }
	    }
	}
}

function checkSmartNav()
{
    var nMax=0;
	var dts = document.getElementsByTagName('dt');
	for(i=0;i < dts.length;i++) 
	{
	    if (dts[i].offsetHeight>nMax)
	    {
	        nMax=dts[i].offsetHeight;
	    }
	}   
	for(i=0;i < dts.length;i++) 
	{
	    dts[i].style.height = nMax;
	}   
	for(i=0;i < dts.length;i++) 
	{
        dts[i].style.height = (nMax - (dts[i].offsetHeight - nMax)) + 'px';
	}   
}

function checkPanels() {
	var productPanel;
	var configWrapper;
	var configPanel;
	
	var divs = document.getElementsByTagName('div');
	for(i=0;i < divs.length;i++) {
		if(divs[i].className == 'productpanel') productPanel = divs[i];
		if(divs[i].className == 'configwrapper') configWrapper = divs[i];
		if(divs[i].className == 'configpanel') configPanel = divs[i];
	}

	if(configWrapper != null && configWrapper != 'undefined' && productPanel != null && productPanel != 'undefined') {
		var tmpConfigWrapperY = findPosY(configWrapper);
		var tmpProductPanelY = findPosY(productPanel);
		var diff = (document.body.clientHeight - productPanel.offsetHeight) - (document.body.clientHeight - configWrapper.offsetHeight);
		productPanel.style.height = (productPanel.offsetHeight + diff) - (tmpProductPanelY - tmpConfigWrapperY)  + 'px';
	}
	
	if(configPanel != null && configPanel != 'undefined') {
		configPanel.style.paddingBottom = (configWrapper.offsetHeight - configPanel.offsetHeight - 30) + 'px';
	}
}

function showModalPopup(id, isAutoHide)
{
    showModalPopupOpt(id,isAutoHide,true);
}

function showModalPopupOpt(id, isAutoHide,isFadeIn) {

	// IE6 hidden selects!!	
	if(IE6) {
		els = document.getElementsByTagName('select');
		for (i=0;i<els.length;i++) 
		{
    	    els[i].style.visibility = 'hidden';
		}
	}
	
	// set global var to the id so we can reference it later
	currentPopupId = id;
	// point to correct popup div
	var tmpEl = document.getElementById(id);
	
	// initialise params for the fade in
	opacity = 0;
	// find our layer which masks the input
	mainCtl = document.getElementById('inputmask');
	var chromeHeight = chrome(mainCtl) - 50;

	// bring it to the front, and set it to be 30% opaque
	mainCtl.style.zIndex = nextZIndex();
	mainCtl.style.position = (IE6) ? 'absolute' : 'fixed';
	if(IE6) {	    
	    mainCtl.style.height = document.body.offsetHeight + chromeHeight;	    
	    mainCtl.style.width = document.body.offsetWidth;	   
	    mainCtl.style.top = (0 - chromeHeight) + 'px';
	}
	
	setCtlOpacity(mainCtl, 30);
	mainCtl.style.display = 'block';
	//mainCtl.style.visibility = 'visible';
	// bring it to the front of the z-order, set it to be completely opaque
	
	if(isFadeIn)
	{   

	        setCtlOpacity(tmpEl, opacity);
	        // set the fade in timer
	        timerId = setInterval(fadeIn, timeDelay);
	 }
	

	    // bring the modal box to the front
	    tmpEl.style.zIndex = nextZIndex();
	    // display and position the box (we can't position it until it is part of the dom (as no sizes are available)
	    tmpEl.style.display = 'block';
	    tmpEl.style.visibility = 'visible';
	    tmpEl.style.left = ((document.body.offsetWidth / 2) - (tmpEl.offsetWidth / 2))  + 'px';
	    
	    //alert(
	      //  'document.body.offsetWidth:'+document.body.offsetWidth + 
	      //  ',tmpEl.offsetWidth:' + tmpEl.offsetWidth + 
	      //  'tmpEl.style.left:'+tmpEl.style.left );
	    
	    tmpEl.style.top = ((document.documentElement.offsetHeight / 2) - (tmpEl.offsetHeight / 2) - chromeHeight)  + 'px';
	    
	   // alert(
	       // 'document.documentElement.offsetHeight: '+ document.documentElement.offsetHeight + 
	      //  ', tmpE1.offsetHeight:' + tmpEl.offsetHeight + 
	      //  ', chromeHeight:' + tmpEl.chromeHeight + 
	      //  ', tmpEl.style.top:' + tmpEl.style.top);
	    
	    tmpEl.style.position = (IE6) ? 'absolute' : 'fixed';
	    tmpEl.focus();

	isDivVisible = (id== 'divPopResume'?true : false)

	//isDivVisible = (id== 'divPopResume'?false : true)
	
	if (isAutoHide)
		document.onmousedown = hidePopupTest;
	else
		document.onmousedown = null;
}

function chrome(obj) {
    var y = 0;
    if (obj.parentNode != null) {
        while (obj = obj.parentNode) {
            if(obj.currentStyle.position == 'absolute')
                break; // if the element clicked on is positioned absolute then ignore the chrome
            if(obj.parentNode.nodeName == 'BODY') {
                y = obj.offsetTop;
                break;
            }
        }
	}
	return y;
}


function showPopup(e, id, pos, isAutoHide, hideSelects) {
	// e: source element
	// id: id of popup div
	// pos: where to position, 
	// 0 = centred, 1 = above, 2 = below, 3 = left, 4 = to cursor, 
	// 5 = below + left of far right of content
	// 6 = left and centered on content
	// 7 = right and centered on content
	
	if (e.className=="iconinfo")
	{
    	nforcefail=true;
    }
	
	// IE6 hidden selects!!
	if(IE6 && hideSelects) {
		els = document.getElementsByTagName('select');
		for (i=0;i<els.length;i++) {
			els[i].style.visibility = 'hidden';
		}
	}
	
	// set global var to the id so we can reference it later
	currentPopupId = id;

	// point to correct popup div
	var tmpEl = document.getElementById(id);
	
	// display the popup
	tmpEl.style.position = (IE6) ? 'absolute' : 'fixed';
	tmpEl.style.visibility = 'visible';
	tmpEl.style.display = 'block';
	switch (pos) {
		case 0: { 
			tmpEl.style.left = ((document.body.scrollWidth / 2) - (tmpEl.offsetWidth / 2))  + 'px';
			tmpEl.style.top = ((document.body.clientHeight / 2) - (tmpEl.offsetHeight / 2))  + 'px';
			break;
		}
		case 2: {
			// get x,y coords of calling button
			var tmpX = findPosX(e);
			var tmpY = findPosY(e);
			var top = (tmpY + e.offsetHeight + 1);
			// subtract the chrome, but only if our clicked on element is not positioned absolute
			top -= chrome(e);
			// needed to add 'px' for firefox!! at least it still works in IE7!!!; 
			tmpEl.style.top = top + 'px'; 
			tmpEl.style.left = tmpX + 'px';
			inScreen(tmpEl);
			break;
		}
		case 3:	{
			var tmpX = findPosX(e);
			var tmpY = findPosY(e);
			tmpEl.style.left = (tmpX - tmpEl.offsetWidth - 10) + 'px'; 
			tmpEl.style.top = (tmpY - chrome(e)) + 'px';
			//tmpEl.style.top = (tmpY - (chrome(e) - 40)) + 'px';
			inScreen(tmpEl);
			break;
		}
		case 4:	{
			var e = window.event;
			var tmpX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
		    var tmpY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
			tmpEl.style.left =(tmpX + 22) + 'px';
			tmpEl.style.top = (tmpY - 25 - chrome(tmpEl)) + 'px';
			break;
		}
		case 5: {
			// get x,y coords of calling button
			var tmpX = findPosX(e);
			var tmpY = findPosY(e);
			var left = ((tmpX + e.offsetWidth) - tmpEl.offsetWidth - 320)
			// needed to add 'px' for firefox!! at least it still works in IE7!!!;
			tmpEl.style.top = ((tmpY + e.offsetHeight + 1) - chrome(e)) + 'px'; 
			//tmpEl.style.left = ((tmpX + e.offsetWidth) - tmpEl.offsetWidth) + 'px';
			if(IE6) left += 302; // fudge!!
			tmpEl.style.left = left + 'px';
			inScreen(tmpEl);
			break;
		}
		case 6: 
		case 7: {
			// get x,y coords of calling button
			//var tmpX = findPosX(e.parentNode);
			//var tmpY = findPosY(e.parentNode);
			//tmpEl.style.left = (tmpX + e.parentNode.offsetWidth + 1) + 'px';
			//tmpEl.style.top = ((tmpY + e.parentNode.offsetHeight) - tmpEl.offsetHeight) + 'px';
			
			//WJN - 24/10/2007 Commented out this code below and Replaced it using oHint class
			/*
			    var tmpX = event.clientX + document.body.scrollLeft;
			    var tmpY = event.clientY + document.body.scrollTop;
			    // alert (tmpX + "," +tmpY)
			
			    tmpEl.style.left = (tmpX - tmpEl.offsetWidth - 20) + 'px'
			    tmpEl.style.top = (tmpY - 50) + 'px';
			    //inScreen(tmpEl);
			*/
			oHint.calcObjects(e,currentPopupId, isAutoHide, !hideSelects );
            oHint.calcLayerPosition();
            oHint.displayArrow2();			
			break;
		}
		
		//WJN - 24/10/2007 Commented out this code below and Replaced it using oHint class			    
		/*
		case 7: {			
			
			var tmpX = event.clientX + document.body.scrollLeft;
			var tmpY = event.clientY + document.body.scrollTop;
			
			tmpEl.style.left = (tmpX + 20) + 'px'
			tmpEl.style.top = (tmpY - 50) + 'px';
			
			break;
		}*/
	}

	tmpEl.style.zIndex = nextZIndex();
	
	// insert IFRAME if <IE7 to mask SELECT elements
	if(IE6) {
		var ifr = document.createElement('iframe');
		if(document.location.protocol == "https:")
			ifr.src = "//0";
		else
			ifr.src = "javascript:false";
		ifr.scrolling="no";
		ifr.frameBorder="0";
		ifr.style.filter = "mask()";
		ifr.style.position = 'absolute';
		ifr.style.top = -1;
		ifr.style.left = -1;
		ifr.style.width= tmpEl.offsetWidth+2+"px";
		ifr.style.height= tmpEl.offsetHeight+2+"px";
		//WJN - 25/10/2007 Set the iframe display = block
		ifr.style.display = "block";			
		ifr.style.zIndex = -1; 
		tmpEl.appendChild(ifr);
		//WJN - 25/10/2007 Hide the popup when user scrolls using mouse wheel
		document.onmousewheel  = hidePopupTest;
	}

	if (isAutoHide) 
		document.onmousedown = hidePopupTest;			    
	else
		document.onmousedown = null;	
}

function fixIE6Update(id) 
{
	var tmpEl = document.getElementById(id);
	tmpEl.style.position = (IE6) ? 'absolute' : 'fixed';
	if(IE6) {
		var ifr = document.createElement('iframe');
		if(document.location.protocol == "https:")
			ifr.src = "//0";
		else
			ifr.src = "javascript:false";
		ifr.scrolling="no";
		ifr.frameBorder="0";
		ifr.style.filter = "mask()";
		ifr.style.position = 'absolute';
		ifr.style.top = -1;
		ifr.style.left = -1;
		ifr.style.width= tmpEl.offsetWidth+2+"px";
		ifr.style.height= tmpEl.offsetHeight+2+"px";
		ifr.style.zIndex = -1;
		tmpEl.appendChild(ifr);
	}
}

function nextZIndex()
{
	var z = 0;
	for(i=0; i<document.all.length; i++)
	{
		if(document.all[i].style.zIndex != null)
			if(document.all[i].style.zIndex > z)
				z = document.all[i].style.zIndex;
	}
	return z + 10;
}

function hidePopup(id) {
//check scrollbar click
  //if (tempX>document.body.offsetWidth)
  //   return;

	var pop = document.getElementById(id);
    if(pop!=null) {
	    pop.style.display="none";
	    pop.style.zIndex = 0;
	}

	document.onmousedown = null;
}

function hideModalPopup(id)
{
//check scrollbar click
  /*if (tempX>document.body.offsetWidth)
     return;*/
     
    hidePopup(id);
    
    var mask = document.getElementById('inputmask');
    if(mask != null) {
		mask.style.display = 'none';
	}
	
	// IE6 hidden selects!!
	if(IE6) {
		els = document.getElementsByTagName('select');
		for (i=0;i<els.length;i++) {
			els[i].style.visibility = 'visible';
		}
	}
	
	isDivVisible = false//reset flag
}


function moveToTop(id) {
	var els = document.getElementsByTagName("div");
	for(var i=0; i < els.length - 1; i++) {
		if(els[i].id == id)
			els[i].style.zIndex = 1;
		else
			els[i].style.zIndex = 0;
	}
}

function movePopup() {
	var bar = event.srcElement;
	while (bar.tagName != "BODY" && bar.id.substr(0,2) != "dd") bar = bar.parentElement;
	
	if (bar.id.substr(0,2) == "dd") {
		offsetx = event.clientX; offsety = event.clientY;
		elPop = document.getElementById("pop" + bar.id.charAt(5));
		//moveToTop(elPop.id);
		elPop.style.zIndex = nextZIndex();
		tempx = parseInt(elPop.style.left);
		tempy = parseInt(elPop.style.top);
		dragdrop = true;
		document.onmousemove=move;
	}
}

function move(e) {
	if (dragdrop) {
		elPop.style.left = tempx + event.clientX - offsetx;
		elPop.style.top = tempy + event.clientY - offsety;
		inScreen(elPop);
	}
}

function findPosX(obj) {
	var curleft = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft;
		while (obj = obj.offsetParent) {
			if(obj.currentStyle.marginLeft.indexOf('px') > 0)
				curleft -= obj.currentStyle.marginLeft.substr(0,obj.currentStyle.marginLeft.indexOf('px'));
			curleft += obj.offsetLeft
		}
	}
	else if (obj.x) curleft += obj.x;
	return curleft;
}
	
function findPosY(obj) {
	var curtop = 0;
	if (obj.offsetParent) {
		curtop = obj.offsetTop;
		while (obj = obj.offsetParent) {
			if(obj.currentStyle.marginTop.indexOf('px') > 0)
				curtop -= obj.currentStyle.marginTop.substr(0,obj.currentStyle.marginTop.indexOf('px'));
			curtop += obj.offsetTop;
		}
	}
	else if (obj.y) { curtop += obj.y; }
	return curtop;
}

function inScreen(obj) {
	// do top - easy!!
	if (obj.offsetTop < document.documentElement.clientTop) obj.style.top = document.documentElement.clientTop;
	// do left
	if (obj.offsetLeft < document.documentElement.clientLeft) obj.style.left = document.documentElement.clientLeft;
	// do right
	if ((obj.offsetLeft + obj.offsetWidth) > document.documentElement.clientWidth)
		obj.style.left = (document.documentElement.clientWidth - obj.offsetWidth);
	// do bottom
	if ((obj.offsetTop + obj.offsetHeight) > document.body.clientHeight)
		obj.style.top = (document.documentElement.clientHeight - obj.offsetHeight);
}

var timeDelay = 20; // change delay time in milliseconds
var timerId = 0;
var opacity;

function hidePopupTest(){
	if (!isPopupClicked(currentPopupId))
		hidePopup(currentPopupId);
}

function isPopupClicked(id){
	var t = window.event.srcElement;
	while (t.parentElement != null) {
		if (t.id==id) {
			return true;
			}
		t = t.parentElement;
		}
	return false;

}

function setCtlOpacity(ctl, percent){
	if (typeof(ctl.style.MozOpacity) != 'undefined')
		ctl.style.MozOpacity = percent / 100;
	else
	{
		ctl.style.filter="alpha(opacity=" + percent + ")";	
		if(percent == 100)
	        ctl.style.filter="";
    }	
}

function fadeIn()
{
	// find our popup, and increase opacity by 50%
	ctl = document.getElementById(currentPopupId);
	opacity += 50;
	setCtlOpacity(ctl, opacity);

	// if we've reached 100%, kill the timer
	if (opacity >= 100) 
	{
		clearInterval(timerId);
	}
}

//Loop through ALL the divs in the parent div, setting the supplied div to visible and the rest to hidden
function setActiveDiv2(parent,div) {
	if ((document.getElementById(parent) != null) && (document.getElementById(div) != null ))
	{
		var element = document.getElementById(parent);
		for(var i=0;i<element.childNodes.length;i++)
		{	
			if (element.childNodes[i].id == div)
				element.childNodes[i].style.display='block';
			else {
				if (element.childNodes[i].style) {
					element.childNodes[i].style.display='none';
				}
			}
		}
	}		
}


function showResumePopup(id, isAutoHide)
{
    //showModalPopupOpt(id,isAutoHide,true);
    //mods PJM 09/2007 - disable autohide and timer so that any clicking outside of the popup will not produce any effect...
    //on first time call allow the timer to start but disable autohide..
    showModalPopupOpt(id,false,true);
    var isDivVisible = true;

}


//function that is invoked on a first click - sets the timer delay for a fade in but turns off autohide
//you MUST implent the same funtion in the InputMask of the corresponding page as (ID, true) as then this will lock the page down to 
//the users response to the dialog....
function showPopupWithModalDialogBehaviour(id, isInputMask)
{
    if(!isInputMask)
    {
        showModalPopupOpt(id,false,true);
    }
    else
    {
       showModalPopupOpt(id,false,false);
    }
}

function DisableValidator()
{
    isDivVisible = false;
}


function ValidateReportCode(source, value)
{
    //only execute this code if the divvisible flag is set to TRUE
    if(isDivVisible)
    {
           var regExp = new RegExp("[a-zA-Z0-9]{3,3}-[a-zA-Z0-9]{3,3}-[a-zA-Z0-9]{3,3}|[a-zA-Z0-9]{9,9}");
           var inputValue = value.Value;
           
           var result = regExp.test(inputValue);
           if(result)
           {
            value.IsValid = true;
           }
           else
           {
             value.IsValid = false;
             var el = document.getElementById("Resume1_RetrieveMessage");
             
             if(el != null)
             {
                 el.innerHtml = "";
                 el.style.display='none';
             }
           }
           
           return result;
    }

}


// WJN - 21/10/2007 - Display hint popup with correct arrow images.
// WJN - 24/10/2007 - Integrate the hint popup into pageutils for maintenance
//                    Call the oHint from pageutils.js  


//Description: Set coordinate (x,y) in the screen. 
//             x and y is integer
function oPoint(x, y)
{
    this.get_x = function() { return x; }
    this.set_x = function(value) { x = value; }
    this.get_y = function() { return y; }
    this.set_y = function(value) { y = value; }
}

//Description: Set string object
function oString(str)
{
    this.get_str = function()      { return str; }
    this.set_str = function(value) { str = value; }
}

//Hint Class
var oHint = {

    //--- Private Attributes ---
    constPadding: null,
    eventHint: null,
    IE: document.all ? true : false,
    browser: null,
    mouse: null,
    mousePosition: null,
    div: null,
    divName: null,
    isAutoHide: null,
    hideSelects: null,
    bottombanneradjust: null,


    //--- Private Methods ----

    //Description: calculate objects position in the screen
    calcObjects: function(e, id, isAutoHide, hideSelects) {
        //get element & set the properties
        this.divName = id;
        this.div = document.getElementById(id);
        this.isAutoHide = isAutoHide
        this.eventHint = e;
        this.hideSelects = hideSelects;
        this.bottombanneradjust = 0;

        //hack for correct hint positioning
        var popup = document.getElementById(id);
        if (popup != null) {
            if (popup.lastChild != null) {
                var lastTag = popup.lastChild.tagName.toUpperCase()
                if ((lastTag == "UL") || (lastTag == "H1")) {
                    this.bottombanneradjust = 45;
                }
            }
        }

        // If NS -- that is, !IE -- then set up for mouse capture                      
        if (!this.IE) document.captureEvents(Event.MOUSEMOVE)

        // Temporary variables to hold mouse x-y pos.s
        var tempX = 0
        var tempY = 0

        if (this.IE) { // grab the x-y pos.s if browser is IE
            if (document.documentElement) {
                switch (this.eventHint.tagName.toUpperCase()) {
                    case "IMG":
                        tempX = event.clientX;
                        tempY = event.clientY;
                        this.constPadding = new oPoint(20, 50);
                        break;
                    case "A":
                        tempX = event.clientX + document.documentElement.scrollLeft
                        tempY = event.clientY + document.documentElement.scrollTop
                        this.constPadding = new oPoint(50, 50);
                        break;
                }
            }
            else {
                tempX = event.clientX + document.body.scrollLeft
                tempY = event.clientY + document.body.scrollTop
            }

        } else {  // grab the x-y pos.s if browser is NS
            tempX = e.pageX
            tempY = e.pageY
        }
        // catch possible negative values in NS4
        if (tempX < 0) { this.mouse.set_x = 0 }
        if (tempY < 0) { this.mouse.set_x = 0 }

        //Get the mouse position 
        this.mouse = new oPoint(tempX, tempY);

        //Get the browser size
        if (this.IE) {
            //WJN - 18/10/2007 - can't get the browser size in minimize window using document.body.clientHeight
            //                   found that document.body.clientHeight is not supported in IE6.0 and upper version
            //                   need to use document.documentElement.clientHeight  
            if (document.documentElement)
                this.browser = new oPoint(document.documentElement.clientWidth, document.documentElement.clientHeight);
            else
                this.browser = new oPoint(document.body.clientWidth, document.body.clientHeight);
        }
        else
            this.browser = new oPoint(window.innerWidth, window.innerHeight);

        if ((this.browser.get_x() - this.mouse.get_x()) < this.mouse.get_x()) {       //left                
            if ((this.browser.get_y() - this.mouse.get_y()) > this.mouse.get_y())
                this.mousePosition = new oString('left-bottom');
            else
                this.mousePosition = new oString('left-top');
        }
        else {  //right                
            if ((this.browser.get_y() - this.mouse.get_y()) > this.mouse.get_y())
                this.mousePosition = new oString('right-bottom');
            else
                this.mousePosition = new oString('right-top');
        }

    },

    //WJN - 30/10/2007 - this function is replaced with displayArrow2
    //Description: display the arrow images with hardcoded object in the layer   
    displayArrow: function() {
        var objBlueLeft = document.getElementById("imgBlueLeft");
        var objBlueRight = document.getElementById("imgBlueRight");
        var objWhiteLeft = document.getElementById("imgWhiteLeft");
        var objWhiteRight = document.getElementById("imgWhiteRight");

        switch (this.mousePosition.get_str()) {
            case 'right-bottom':
                objBlueLeft.style.visibility = "visible";
                objBlueRight.style.visibility = "hidden";
                objWhiteLeft.style.visibility = "hidden";
                objWhiteRight.style.visibility = "hidden";
                break;
            case 'right-top':
                objBlueLeft.style.visibility = "hidden";
                objBlueRight.style.visibility = "hidden";
                objWhiteLeft.style.visibility = "visible";
                objWhiteRight.style.visibility = "hidden";
                break;
            case 'left-bottom':
                objBlueLeft.style["visibility"] = "hidden";
                objBlueRight.style["visibility"] = "visible";
                objWhiteLeft.style["visibility"] = "hidden";
                objWhiteRight.style["visibility"] = "hidden";
                break;
            case 'left-top':
                objBlueLeft.style.visibility = "hidden";
                objBlueRight.style.visibility = "hidden";
                objWhiteLeft.style.visibility = "hidden";
                objWhiteRight.style.visibility = "visible";
                break;
        }
    },

    //Description: Display the arrow images dynamically.
    displayArrow2: function() {
        //Find all the image objects
        var objList = this.div.getElementsByTagName("img");
        var newImg = false;
        var objImg;

        if (objList == null) { //if there is no image object, create new image
            newImg = true;
            objImg = document.createElement("IMG");
        }
        else {
            //Popup has only 1 arrow image.
            if (objList.length > 1) {
                for (i = 0; i < objList.length; i++) {
                    if (objList[i].name == "arrow") {
                        objImg = objList[i];
                        break;
                    }
                }
            }
            else
                objImg = objList[0];
        }


        //set general properties    
        //objImg.setAttribute("id","imgArrow");
        //objImg.style.position     = "absolute";
        objImg.style.width = "43px";
        objImg.style.height = "44px";
        objImg.style.marginBottom = "0px";
        objImg.style.marginRight = "0px";
        objImg.style.visibility = 'visible';
        //objImg.style.display      = 'inline';

        //set specific properties base on layer position
        switch (this.mousePosition.get_str()) {
            case 'right-bottom':
                objImg.style.marginTop = "5px";
                objImg.style.marginLeft = "-28px";
                objImg.style.top = 5;
                objImg.setAttribute("className", "pointtopleft");
                objImg.setAttribute("src", "images/3.0/pop_point_left.gif");
                break;
            case 'right-top':
                objImg.style.marginTop = "215px";
                objImg.style.marginLeft = "-28px";
                objImg.style.top = 0;
                objImg.setAttribute("className", "pointbottomlefthint");
                objImg.setAttribute("src", "images/3.0/pop_point_white_left.gif");
                break;
            case 'left-bottom':
                objImg.style.width = "29px";
                objImg.style.marginTop = "5px";
                objImg.style.marginLeft = "380px";
                objImg.style.left = 0;
                objImg.style.top = 0;
                objImg.setAttribute("className", "pointtopright");
                objImg.setAttribute("src", "images/3.0/pop_point_right.gif");
                break;
            case 'left-top':
                objImg.style.marginTop = "215px";
                objImg.style.marginLeft = "366px";
                objImg.style.left = 0;
                objImg.style.top = 0;
                objImg.setAttribute("className", "pointbottomrighthint");
                objImg.setAttribute("src", "images/3.0/pop_point_white_right.gif");
                break;
        }
        if (newImg)
            this.div.appendChild(objImg);
    },

    //Description: calculate layer position in the screen
    calcLayerPosition: function() {
        //alert(this.mousePosition.get_str()+':MouseX:'+this.mouse.get_x()+'|MouseY:'+this.mouse.get_y()+'| BrowserX:'+this.browser.get_x()+'|BrowserY:'+this.browser.get_y()+'|ScrollLeft:'+document.documentElement.scrollLeft+'|ScrollTop:'+document.documentElement.scrollTop);		       
        switch (this.mousePosition.get_str()) {
            case 'right-bottom':
                this.div.style.left = this.mouse.get_x() + this.constPadding.get_x() + 'px';
                this.div.style.top = this.mouse.get_y() - this.constPadding.get_y() + 'px';
                break;
            case 'right-top':
                this.div.style.left = this.mouse.get_x() + this.constPadding.get_x() + 'px';
                this.div.style.top = this.bottombanneradjust + this.mouse.get_y() - this.div.offsetHeight + 'px';
                break;
            case 'left-bottom':
                this.div.style.left = this.mouse.get_x() - this.div.offsetWidth - this.constPadding.get_x() + 'px';
                this.div.style.top = this.mouse.get_y() - this.constPadding.get_y() + 'px';
                break;
            case 'left-top':
                this.div.style.left = (this.mouse.get_x() > this.browser.get_x() ? this.browser.get_x() : this.mouse.get_x()) - this.div.offsetWidth - this.constPadding.get_x() + 'px';
                this.div.style.top = (this.mouse.get_y() > this.browser.get_y() ? this.browser.get_y() : this.mouse.get_y()) - this.div.offsetHeight + 'px';
                break;
        }
    }
}