// The lucasDisplay is a library that contains commonly used scripts
// affecting the visible graphics.
//


//
// The library "package" name
//
var lucasDisplay = {}; 


//
// Global library variables should be defined here
//
lucasDisplay.dummy = "aDummy";   /* an example global library variables */








// hideDiv - hides a div
//
// Note: in future a identifier input variable, mighrt be the way to go
//       current solution only supports one popup data flow, ie. if another popup
//       window is open any currently open will close(and be destroyed).
//
lucasDisplay.hideDiv = function() 
{
  (document.getElementById) ? dom = true : dom = false;
  if (dom)             {document.getElementById('popupWinAlfa').style.visibility='hidden';}
  if (document.layers) {document.layers['popupWinAlfa'].visibility='hide';} 
}



// showDiv - un-hides a div
//
// Note: in future a identifier input variable, mighrt be the way to go
//       current solution only supports one popup data flow, ie. if another popup
//       window is open any currently open will close(and be destroyed).
//
lucasDisplay.showDiv = function() 
{	
  (document.getElementById) ? dom = true : dom = false;
  if (dom)             {document.getElementById('popupWinAlfa').style.visibility='visible';}
  if (document.layers) {document.layers['popupWinAlfa'].visibility='show';} 
}



// placeDiv - sets the coordinates for the upper left corner of the div popupWinAlfa
//
// Note: in future a identifier input variable, mighrt be the way to go
//       current solution only supports one popup data flow, ie. if another popup
//       window is open any currently open will close(and be destroyed).
//
lucasDisplay.placeDiv = function (xcoord, ycoord)  
{
  (document.getElementById) ? dom = true : dom = false;

  if (dom  &&  !document.all) {
   	var topval = ycoord+"px";
	var leftval = xcoord+"px";
	document.getElementById('popupWinAlfa').style.top = topval;
    	document.getElementById('popupWinAlfa').style.left = leftval;
  }
  if (document.layers) {
    document.layers['popupWinAlfa'].top =  (window.innerHeight - (window.innerHeight-ycoord));
    document.layers['popupWinAlfa'].left = xcoord;
  }
  if (document.all) {
    document.all['popupWinAlfa'].style.top = (document.body.clientHeight - (document.body.clientHeight-ycoord));
    document.all['popupWinAlfa'].style.left = xcoord;
  }
  if (dom)             {document.getElementById('popupWinAlfa').style.visibility='visible';}
  if (document.layers) {document.layers['popupWinAlfa'].visibility='show';}
}




// showPopup - opens a popup window using the "global" and normaly hidden div with id popupWinAlfa
//
// Note: in future a identifier input variable, mighrt be the way to go
//       current solution only supports one popup data flow, ie. if another popup
//       window is open any currently open will close(and be destroyed).
//
lucasDisplay.showPopup = function(e, indata, xdelta, ydelta) 
{ 
    if( !e ) { 
        e = window.event; 
    } 
    if( !e  ||  ( typeof( e.pageX ) != 'number' && typeof( e.clientX ) != 'number' ) ) { 
        return window.alert('Your browser did not pass the required information about the event'); 
    }

    if( typeof( e.pageX ) == 'number' ) { 
        var xcoord = e.pageX; var ycoord = e.pageY; 
    } else {
        var xcoord = e.clientX; var ycoord = e.clientY;
        if( !( (window.navigator.userAgent.indexOf('Opera')+1)  ||  (window.ScriptEngine && ScriptEngine().indexOf('InScript')+1 && !document.createElement )  ||  window.navigator.vendor == 'KDE') ) {
            if( document.documentElement && ( document.documentElement.scrollTop || document.documentElement.scrollLeft ) ) {
	        xcoord += document.documentElement.scrollLeft; ycoord += document.documentElement.scrollTop;
	    } else if( document.body && ( document.body.scrollTop || document.body.scrollLeft ) ) {
		xcoord += document.body.scrollLeft; ycoord += document.body.scrollTop;
	    }
        }
    }

    // add handling of ' and \' in indata
    var divData =  "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" OnMouseOver=\"lucasDisplay.showDiv()\" OnMouseOut=\"lucasDisplay.hideDiv()\" ><tr><td>" + indata + "</td></tr></table>";
    if (document.getElementById) {
	document.getElementById('popupWinAlfa').innerHTML = divData;
    } else if (document.all) {
	document.all('popupWinAlfa').innerHTML = divData;
    } else if (document.layers) {
	document.layers['popupWinAlfa'].document.write(divData);
	document.layers['popupWinAlfa'].document.close();
    }

    lucasDisplay.placeDiv(xcoord+xdelta, ycoord+ydelta);
    lucasDisplay.showDiv();
}


// openDefaultMultiFormatPopup - opens a default tracks formate based multival window (using adiv named popupWinAlfa).
//
// write description of script and indata parameters. 
//
//
//
lucasDisplay.openDefaultMultiFormatPopup = function(event, titleText, helpURL, imageDir, formatArrayStr)
{
  //To Do add indata validation (and solve error handilng)

  var dataToDisplay = '<div id="multiFormatSelect">' +
    "  <table width=\"264\" border=\"1\" cellspacing=\"0\" cellpadding=\"0\" bordercolor=\"#FFFFFF\">"+ 
    "    <tr>"+
	"      <td class=\"multiFormatSelect_frame_dark\">"+
	"        <table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">"+
	"          <tr>"+
	"            <td class=\"multiFormatSelect_frame_lite\">"+
    "              <table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">"+
	"                <tr>"+
	"                  <td class=\"multiFormatSelect_header\">" + titleText + ":</td>"+
	"                  <td align=\"right\" class=\"multiFormatSelect_header\">"+
	"                    <a href=\"" + helpURL + "\" title=\"" +  titleText + "\">"+
	"                      <img src=\"" + imageDir + "multiFormatSelect_butt_help.png\" alt=\"\" width=\"12\" height=\"13\" hspace=\"5\" border=\"0\">"+
	"                    </a>"+
	"                  </td>"+
	"                </tr>"+
	"              </table>"+
	"            </td>"+
	"          </tr>"+
	"          <tr>"+
	"            <td class=\"multiFormatSelect_line_dark\" height=\"1\"></td>"+
	"          </tr>"+
	"          <tr>"+
	"            <td>"+
	"              <table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
	
	var itemArray = formatArrayStr.split(":group:");
	var buyImagePath = imageDir + "multiFormatSelect_icon_put_in_basket.png";
	for (elem in itemArray) {
		var itemData  = itemArray[elem].split(":delim:");
		var catEntryId = itemData[0];
		var formatText = itemData[1];
		var price      = itemData[2];
		var buyAction  = "onclick=\"submitBuyForm(document.orderForm,'" + catEntryId + "','true','true')\"";

		var imageElem  = "<img src=\"" + imageDir + "multiFormatSelect_icon_cd.png\" width=\"17\" height=\"17\" alt=\"\">";
		if (formatText.split(" ")[0] == "WMA") {
                  imageElem  = "<img src=\"" + imageDir + "multiFormatSelect_icon_wma.png\" width=\"25\" height=\"17\" alt=\"\">";
		} else if (formatText.split(" ")[0] == "MP3") {
		  imageElem  = "<img src=\"" + imageDir + "multiFormatSelect_icon_mp3.png\" width=\"21\" height=\"17\" alt=\"\">";
		}
		
		dataToDisplay = dataToDisplay + 
		"<tr>"+
		"  <td class=\"multiFormatSelect_td_first\" width=\"35\" align=\"center\">" + imageElem + "</td>"+ 
		"  <td class=\"multiFormatSelect_td\" width=\"160\">" + formatText + "</td>"+
		"  <td class=\"multiFormatSelect_td\" width=\"35\">" + price +"</td>"+
		"  <td class=\"multiFormatSelect_td\" width=\"30\"><a href=\"#\" " + buyAction + "><img src=\"" + buyImagePath + "\" width=\"16\" height=\"14\" border=\"0\"></a></td>"+
		"</tr>";
	}

	dataToDisplay = dataToDisplay + 
	"              </table>"+
	"	     </td>"+
	"	   </tr>"+
	"	   <tr>"+
	"	     <td class=\"multiFormatSelect_line_dark\" height=\"1\"></td>"+
	"	   </tr>"+
	"	   <tr>"+
	"	     <td class=\"multiFormatSelect_frame_lite\">"+
	"	       <table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">"+
	"		 <tr>"+
	"		   <td height=\"5\" class=\"multiFormatSelect_bottom\"><img src=\"" + imageDir + "multiFormatSelect_001.gif\" width=\"1\" height=\"5\" alt=\"\"></td>"+
	"		 </tr>"+
	"	       </table>"+
	"	     </td>"+
	"	   </tr>"+
	"	 </table>"+
	"      </td>"+
	"    </tr>"+
	"  </table>"+
	"</div>";
	
  lucasDisplay.showPopup(event, dataToDisplay, -132, -95);
}