var imageUrl="http://images.blinds.com/images/options/imagecharts";

var activeId=0;
var activeState="hide";
var swatchVisible=false;

// Temporary variables to hold mouse x-y pos.s
var tempX = 0;
var tempY = 0;
var swatchPanelX = 700;
var swatchPanelY = 0;
var swatchBuilt=false;

// Main function to retrieve mouse x-y pos.s
function getPageX(o) {
    return o.offsetParent ? o.offsetLeft + getPageX(o.offsetParent) : o.offsetLeft;
}
function getPageY(o) {
    return o.offsetParent ? o.offsetTop + getPageY(o.offsetParent) : o.offsetTop;
}

function getCoordinates(){

    var divLbl= "img_lbl_" + activeId;
    
    var activeDiv=document.getElementById(divLbl);
    activeDiv.style.position = "relative";
    tempY=activeDiv.offsetTop;
    
    tempX=getFreeSampleX();
    
}
function getFreeSampleX(){

    var freeSampleX=false;
    var divLbl="free_sample_"+activeId;
    
    var activeDiv=document.getElementById(divLbl);
    activeDiv.style.position = "relative";  
    
    freeSampleX=getPageX(activeDiv);
    
    return freeSampleX;    
}
function getFreeSampleY(){

    var freeSampleY=false;
    var divLbl="free_sample_"+activeId;
    
    var activeDiv=document.getElementById(divLbl);
    activeDiv.style.position = "relative";  
    
    freeSampleY=getPageY(activeDiv);
    
    return freeSampleY;    
}

function getSwatchPanelHeight() {
		
	var textHeight=document.getElementById("div_swatchPanelHeight").innerHTML;
	if(!textHeight) { return false; }
	
	var height=parseInt(textHeight);
	
	return height;
	
	/* The following two divs are on top of and below the swatch panel */
    var topDiv=document.getElementById("div_swatchNumColumns");
//    topDiv.style.position = "relative";
    var topY=topDiv.offsetTop;

    var bottomDiv=document.getElementById("div_swatchPanelHeight");
//    bottomDiv.style.position = "relative";
    var bottomY=bottomDiv.offsetTop;
    
    var height=bottomY - topY;
   
    return height;
}
function getSwatchPanelWidth() {
    var linkClose=document.getElementById("div_swatchClosePanel");
    linkClose.style.position = "relative";
    var closeX=linkClose.offsetLeft + 8;
    
    return closeX;
}
function calcLargeImageOffsetX() {
    var $x=getFreeSampleCoordinates();
    
    var $offset=(($x + 76)/2) - (55/2);

    return $offset;
}

function determineSwatchPanelCoordinates() {
    if(tempX > 0 || tempY > 0) {
        swatchPanelX=getFreeSampleX()-(getSwatchPanelWidth()/2) + 50;
        swatchPanelY=getFreeSampleY() - (getSwatchPanelHeight() + 100);
    }
}
function isSwatchPanelVisible() {
    var o=document.getElementById("swatchPanel");
    if(!o) {
        return false;
    }
    if(document.getElementById("swatchPanel").style.visibility!="visible") {
        return false;
    } else {
        return true;
    }
}
function smallSwatchSwitch(img) {
    swatchImg=document.getElementById("smallSwatchImage");
    swatchImg.src=img.src;
    
    swatchLbl=document.getElementById("smallSwatchLabel");
    swatchLbl.innerHTML=img.alt;
    
    return false;    
}
function syncSmallSwatch(url,lbl) {
    
    swatchImg=document.getElementById("smallSwatchImage");
    swatchImg.src=url;
    
    swatchLbl=document.getElementById("smallSwatchLabel");
    swatchLbl.innerHTML=lbl;
    
}
function showSwatchPanel(id) {
    if(isSwatchPanelVisible()) {
        return false;
    } 
	
	activeId=id; 
    
    // var sp=document.getElementById("swatchPanel");
    var sp=getElement("swatchPanel");
	/* Start of Code. These adjustment has been made related to ticket: 2643  */
    sp.style.display = "block";
    sp.style.position = "relative";
	/* End of Code. These adjustment has been made related to ticket: 2643  */    
    //getCoordinates();
    //determineSwatchPanelCoordinates();
    var height=getSwatchPanelHeight();
    var width=getSwatchPanelWidth();

    swatchPanelX=getFreeSampleX()-(width/2)+35;
    swatchPanelY=getFreeSampleY()-(height+100);
    if (swatchPanelY < 1) {swatchPanelY = 1;}

    sp.style.visibility="visible";
    var my_item = dd.elements["swatchPanel"];

    if(my_item) {
    	my_item.moveTo(swatchPanelX,swatchPanelY);

	if(my_item.x != sp.offsetLeft || my_item.y != sp.offsetTop) {
	    sp.style.top=swatchPanelY+"px";
	    sp.style.left=swatchPanelX+"px";
	    sp.style.position = "absolute"; 	   				
	}

 	if(!swatchBuilt) {
		/* Add padding to height */
		height = height + 8;
		//if(navigator.appName != "Microsoft Internet Explorer") {
			my_item.resizeTo(width,height);    
		//}
		my_item.setZ(35);
		swatchBuilt=true;
	}
    } else {
	sp.style.top=swatchPanelY+"px";
        sp.style.left=swatchPanelX+"px";
        sp.style.position = "absolute";
	sp.style.zIndex = 35;
    }
}
function hideSwatchPanel() {
    document.getElementById("swatchPanel").style.visibility = "hidden";
	/* Start of Code. These adjustment has been made related to ticket:2643  */    
    document.getElementById("swatchPanel").style.display = "none";
 	/* End of Code. These adjustment has been made related to ticket:2643  */
}
function getShowLargeOffsetX() {
    numCols=parseInt(document.getElementById("div_swatchNumColumns").innerHTML);
    var offset=-12 + ((7-numCols) * 10) + ((7-numCols)+1) ;
    

//    return offset+"pt";    

    //alert(numCols);

    switch(numCols)
    {
        case 1:
          offset-=0;
          break;    
        case 2:
          offset-=0;
          break;
        case 3:
          offset-=4;
          break;
        case 4:
          offset-=9;
          break;
        case 5:
          offset-=10;
          break;
        case "6":
          offset-=0;
          break;
        case "7":
          offset-=0;
          break;

        default:
          
    }
    return offset+"pt";
}
function ShowLarge(id) {

    if(activeId!=id && activeId>0) {  HideLarge(activeId); }
    
    var div, divLbl;
    div="div_showLarge_" + id;
    divLbl="div_showLargeLbl_" + id;    

    var obj, objLbl;
    obj = document.getElementById(div);
    objLbl = document.getElementById(divLbl);    

    var url;
    url = imageUrl+"/image_"+id+".jpg";
    
    if(isSwatchPanelVisible()) {
        objLbl.style.visibility="hidden";
    } else {
        objLbl.style.visibility="visible";        
    }

    obj.style.backgroundImage="url("+url+")"; 
    obj.style.visibility = "visible";

    obj.style.left=getShowLargeOffsetX();

    activeId=id;
    activeState="show";

    //- Sync the small swatch div
    lbl=document.getElementById("img_lbl_"+id).innerHTML;   
    syncSmallSwatch(url,lbl);
    
}


function HideLarge(id) {

    var curElement = document.activeElement;
     
    var div, divLbl;
    div="div_showLarge_" + id;
    divLbl="div_showLargeLbl_" + id;    

    var obj;

    obj = document.getElementById(div);
    obj.style.visibility = "hidden";

    objLbl = document.getElementById(divLbl);
    objLbl.style.visibility = "hidden";

    activeState="hide";
}
function showMainProductRoll (o, filename) {

	var mainDiv = document.getElementById("topProductImage");
	var mainDivRoll = document.getElementById("topProductImageRoll");
	var imgRoll = document.getElementById("topImageRoll");
	
	var srcFile="http://images.blinds.com/views/content/showgallery.php?picture="+filename+"&size=large";
	
	mainDiv.style.display="none";
	imgRoll.src=srcFile;
	imgRoll.height=150;
	imgRoll.width=150;
	mainDivRoll.style.display="block";
	
	o.className="smallGalleryImageRoll";
		
}
function showMainProduct () {
	var mainDiv = document.getElementById("topProductImage");
	var mainDivRoll = document.getElementById("topProductImageRoll");	

	mainDiv.style.display="block";
	mainDivRoll.style.display="none";	
	
}
function AddDraperySample (productId) {
	var colorChartId = document.getElementById("colorChartID").value;
	var price = document.getElementById("samplePrice").value;	
	var colorId = document.getElementById("imageID").value;     
	var productName = document.getElementById("productName").value;
	var imageLabel = document.getElementById("imageNameDiv").innerHTML;

	//alert(colorChartId + "\n" + price + "\n" + colorId + "\n" + productId + "\n" + productName + "\n" + imageLabel);
	AddSample(colorChartId, price, colorId, productId, productName, imageLabel)
}
function AddSample(colorChartId, price, colorId, productId, productName, imageLabel) {
	//Unhide the sample popup and loading blocker.
	$(".samplePopupOuter").show();
	$("#loadingBlocker").show();

	//Load the add sample in a hidden iframe.
	document.getElementById("addSampleFrame").src = '/control/cartConsoleAddColorSample?&colorChartID=' + colorChartId + '&price=' + price + '&colorID=' + colorId + '&productID=' + productId + '&productName=' + productName;

	//Make the loading blocker slightly opaque temporarily for use in this application. Has effect
	//of graying out the screen for a "modal popup" look.
	document.getElementById("loadingBlocker").style.opacity = ".3";
	document.getElementById("loadingBlocker").style.filter = "alpha(opacity = 30)";

	document.getElementById("sampleName").innerHTML = imageLabel;
	
} 

function CloseAddSample() {
	//Hide the sample popup and loading blocker.
	$(".samplePopupOuter").hide();
	$("#loadingBlocker").hide();


	//Set the opacity back to 0 to make the loading blocker its default transparant self.
	document.getElementById("loadingBlocker").style.opacity = ".0";
	document.getElementById("loadingBlocker").style.filter = "alpha(opacity = 0)";
}