//
//      Functions to handle the Digital Spa Side pages.
//
var xmlFile="partlists/products.xml";

var model = "";
var descr = "";
var modelString = new Array(2);
var descrString = new Array(2);
var priceString = new Array(2);
var price = 0;
var ssCable = 0;
var arCable = new Array(3);
for ( var i=0; i<arCable.length; i++ )
    arCable[i] = new Array(6);
for (  var i=0; i<2; i++ )
{
    modelString[i] = "";
    descrString[i] = "";
    priceString[i] = "";
}

function getRadios( formID, arOffset )
{
    var rb = formID.rbCable;
    for ( var i = 0; i<rb.length; i++ )
        if ( rb[i].checked )
            ssCable = i;

    formID.ID_NUM.value = modelString[arOffset] + arCable[0][ssCable];

    formID.NAME.value = descrString[arOffset] + " with " + arCable[1][ssCable];
    
    price  = Number( priceString[arOffset] );
    price += Number( arCable[2][ssCable].slice( 1, arCable[2][ssCable].length ) );
    formID.PRICE.value = '$' + price;
}


function select_spaside_options(xmlProduct, xmlOptions)
{
    var y = null;
    var z = null;

    loadXMLDoc( xmlFile );
    document.write( "<table class='ptable' align='center' width='100%' border='2'>" );
    document.write( "<thead>" );
    document.write( "<tr>" );
    document.write( "<th align='center'><input type='button' value='Copy' class='btn-sml' onClick='Copy2Clipboard(false)' ></th>" );
    document.write( "<th align='center'>Part Number:</th>" );
    document.write( "<th align='center'>Cable Length:</th>");
    document.write( "<th align='center'>Description:</th>" );
    document.write( "<th align='center'>List Price:</th>" );
    document.write( "<th align='center'>Quantity:</th>" );
    document.write( "</tr>" );
    document.write( "</thead>");
    document.write( "<tbody>" );
    var x = xmlhttp.responseXML.documentElement.getElementsByTagName( xmlProduct );
    for (var i = 0; i < x.length; i++)
    {
      modelString[i] = null;
      descrString[i] = null;
      priceString[i] = null;
      document.write( "<form name='product_" + i + "'>" );
      document.write( "<tr>" );
      document.write( "<td width='5%' align='center'><input type='checkbox' name='clipcopy'>" );
      i == 1 ? document.write( "<br />&nbsp;</td>" ) : document.write( "</td>" );
      document.write( "<td width='5%' align='left'>" );
      modelString[i] = x[i].getElementsByTagName( "PART_NUM" ) [0].childNodes[0].nodeValue;
      document.write( "<input type='text' name='ID_NUM' class='inp-field' size='20' onchange='this.value=modelString' value='" + modelString[i] + "' readonly />");
      i == 1 ? document.write( "<br /><b>Dual Seal O-Ring</b></td>" ) : document.write( "</td>" );

      document.write( "<td align='left'>" );
      document.write( "<div onclick='getRadios(document.product_" + i + ", " + i + ")' />" );
      x = xmlhttp.responseXML.documentElement.getElementsByTagName( xmlOptions );
      for (var ii = 0; ii < x.length; ii++)
      {
          arCable[0][ii] = x[ii].getElementsByTagName( "PART_NUM" ) [0].childNodes[0].nodeValue;  
          document.write( "<input type='radio' name='rbCable' value='" + arCable[0][ii] );
          ii == 0 ? document.write("' checked='true'>" ) : document.write( "'>" );
          arCable[1][ii] = x[ii].getElementsByTagName( "PART_DESC" ) [0].childNodes[0].nodeValue;  
          arCable[2][ii] = x[ii].getElementsByTagName( "PART_PRICE" ) [0].childNodes[0].nodeValue;  
          document.write( arCable[0][ii] + "<br />" );
      }
      document.write( "</td>" );
      document.write( "</div>" );

      document.write( "<td align='left'>" );
      x = xmlhttp.responseXML.documentElement.getElementsByTagName( xmlProduct );
      z = x[i].getElementsByTagName( "PART_DESC" ) [0].childNodes[0].nodeValue;
      descrString[i] = z;
      document.write( "<textarea name='NAME' class='inp-field' cols='40' rows='6' wrap='hard' onchange='this.value=descrString[i]' value='" + z + "' readonly ></textarea>");
      document.write( "</td>" );
      document.write( "<td width='10%' align='center'><span style='color:red'>" );
      y = x[i].getElementsByTagName( "PART_PRICE" ) [0].childNodes[0].nodeValue;
      priceString[i] = y.slice( 1, y.length );
      document.write( "<input type='text' name='PRICE' size=8 class='inp-field-red' onchange='this.value=priceString[i]' value='$" + priceString[i] + "' readonly />");
      document.write( "</td>" );
      document.write( "<td width='10%' align='center'>" );
      document.write( "<input type='text' size=6 maxlength=4 name='QUANTITY' onchange='this.value=CKquantity(this.value)' value='1' /><br />" );
      document.write( "<input type='button' value='Add to Order' class='btn-sml' onClick='AddToCart(this.form)' /><br />" );
      document.write( "<input type='button' value='View Order' class='btn-sml' onclick='DisplayCartAsWindow()' />" );
      document.write( "</span></td>" );
      document.write( "</tr>" );
      i == 0 ? getRadios(document.product_0, 0) : getRadios(document.product_1, 1);
      document.write( "</form>" );
   }
   document.write( "</tbody>" );
   document.write( "</table>" );
}