var hiddenProductId;

function registerHiddenFieldId(id) {
	hiddenProductId = document.getElementById(id);
}

function getScrollY() {
  scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
  }
  return scrOfY;
}

function displayPopup(e, title, id, imageSource) {
    var jqwin=$("div#ColorPreviewWindow");
    if(jqwin.is(':visible')){
        jqwin.shadowDestroy();
        jqwin.hide();
    }
	var win = document.getElementById("ColorPreviewWindow");
	var img = document.getElementById("ColorSampleImage");
	img.src = imageSource;
	var titleBar = document.getElementById("Title");
	var container = document.getElementById("container");
	$("div#ColorDescription").load("../DescriptionServer.ashx",{ProductId:id});
	if (e == null) e = window.event;
	var x = navigator.appName == "Microsoft Internet Explorer" ? e.x+20 : e.layerX+40;
	var y = navigator.appName == "Microsoft Internet Explorer" ? e.y-100 : e.clientY+getScrollY()-100;
	var sender = e.srcElement == null ? e.target : e.srcElement;	
	titleBar.innerHTML = title;	
	hiddenProductId.value = id;   
    win.style.left = (x) + "px";
    win.style.top = (y - win.offsetHeight) + "px";   
    jqwin.show("slow",function(){$("div#ColorPreviewWindow").shadow({offset:3});});
    return false;
}

function closePopup() {
    var win=$("div#ColorPreviewWindow");
	win.hide("slow");
	win.shadowDestroy();
}

function initColorPreview(){
      var win=$("div#ColorPreviewWindow");
      win.resizable({minWidth:350,minHeight:100,start:function(){$("div#ColorPreviewWindow").shadowDestroy();},stop:function(){$("div#ColorPreviewWindow").shadow({offset:3});}});
      win.draggable({handle:"#TitleBar",start:function(){$("div#ColorPreviewWindow").shadowDestroy();},stop:function(){$("div#ColorPreviewWindow").shadow({offset:3});}});
}