var request=0;
var currentColor=0;
var currentWidth=0;
var currentPriceRange=0;
var currentGlazing=0;
var ma = new Array();

function changeGlazing(obj, value)
{
    var f = document.getElementById('WizardForm');
    var g = value;
    var fn = f.FrameNo.value;
    var ft = f.FrameType.value;
    var fs = parseInt ( f.FrameSize.value );

    if ( currentGlazing == g )
        return true;
    else
        currentGlazing = g;

    var timestamp = new Date();

    //var s = "gl=" + glazing + "&fn=" + FrameNo +  "&ft=" + FrameType + "&fs=" + FrameSize + "&timestamp="+ timestamp.getTime();;
    //alert ( s );
    //request=ajaxRequest("/ajax/changeGlazing.php",glazingCallback,s, "post","");
    new Ajax.Request('/ajax/changeGlazing.php',
    {
        parameters: {ft: ft, gl: g, fn: fn, fs: fs },

        onSuccess: function(transport,json)
        {
          var response = transport.responseText || "no response text";
          //alert("Success! \n\n" + response);

          var p = eval("(" + response + ")");

          var fp = p.FramePrice.toFixed(2);
          //alert ( p.FramePrice );
          document.getElementById('prFramePrice').innerHTML = '<p><strong>Frame Price :</strong> $' + p.FramePrice.toFixed(2) + '</p>';
          var gp = p.GlazingPrice.toFixed(2);
          //alert ( p.GlazingPrice );
          //alert ( p.Glazing );
          //alert ( p.GlazingDesc );
          if ( gp > 0 )
          {
              document.getElementById('prGlazingPrice').style.display = "block";
              document.getElementById('prGlazingPrice').innerHTML = '<p><strong>Glazing Price :</strong> $' + gp + '</p>';
              document.getElementById('prGlazingDesc').innerHTML = '<p><strong>Glazing :</strong> ' + p.GlazingDesc + '</p>';
          }
          else {
              document.getElementById('prGlazingPrice').style.display = "none";
              document.getElementById('prGlazingPrice').innerHTML = '';
              document.getElementById('prGlazingDesc').innerHTML = '<p><strong>Glazing :</strong> FF3 Acrylic</p>';
          }

          var tpT = parseFloat(fp) + parseFloat(gp);
          var tp = tpT.toFixed(2);

          document.getElementById('prTotalPrice').innerHTML = '<p><strong>Total Price :</strong> $' + tp + '</p>';
        },
        onFailure: function(){ alert('Something went wrong...') }
  });
}
function changeMouldingColor(obj, value)
{
    var f = document.getElementById('WizardForm');
	f.SelectMouldingColor.value = value;
	requestFrames();
}

function changeMouldingWidth(obj, value)
{
    var f = document.getElementById('WizardForm');
	f.SelectMouldingWidth.value = value;
	requestFrames();
}
function changeMouldingPriceRange(obj, value)
{
    var f = document.getElementById('WizardForm');
	f.SelectMouldingPrice.value = value;
	requestFrames();
}
function viewMoulding(obj, FrameNo)
{
    //alert ( FrameNo );
    window.open ( '/FrameDetailPage.php?FrameNo=' + FrameNo, '', 'width=950,height=800,resizable,scrollbars');w
}

function changeOuterMat(obj, OuterMat, OuterMatDesc, img )
{
	var f = document.getElementById('WizardForm');
	var s;
	f.OuterMat.value = OuterMat;

	//alert ( OuterMat + OuterMatDesc + img);

	//<img style='border:1px solid #000000;' alt='' src='/lib/matcolors/{php}global $info; echo Mat::GetMatColorImage($info['OuterMat']){/php}' width='60' height='32'/>
	//<strong>Outer Mat :</strong>  {$info.OuterMat}
	//{$info.OuterMatDescription}
	s = "<img style='border:1px solid #000000;'  src='/lib/matcolors/";
	s += img;
	s+= "' width='60' height='32'/>";
	s+= "<strong> Outer Mat :</strong> "
	s += OuterMat;
	s += " ";
	s += OuterMatDesc;

	document.getElementById('OuterMat').innerHTML = s;


}
function changeInnerMat(obj, InnerMat, InnerMatDesc, img )
{
	var f = document.getElementById('WizardForm');
	var s;
	f.InnerMat.value = InnerMat;

	//alert ( InnerMat + InnerMatDesc + img);

	//<img style='border:1px solid #000000;' alt='' src='/lib/matcolors/{php}global $info; echo Mat::GetMatColorImage($info['InnerMat']){/php}' width='60' height='32'/>
	//<strong>Inner Mat :</strong>  {$info.InnerMat}
	//{$info.InnerMatDescription}
	s = "<img style='border:1px solid #000000;'  src='/lib/matcolors/";
	s += img;
	s+= "' width='60' height='32'/>";
	s+= "<strong> Inner Mat :</strong> "
	s += InnerMat;
	s += " ";
	s += InnerMatDesc;

	document.getElementById('InnerMat').innerHTML = s;


}

function changeMoulding(obj, FrameNo)
{
    // called when user clicks 'Select' button on Select Your Frame page
    //  calculats the new frame and total price and displays the new moulding and description
    if (FrameNo != "")
    {
        var f = document.getElementById('WizardForm');
        f.FrameNo.value = FrameNo;
        f.Frame.value = FrameNo;
    
        //alert ( FrameNo );
    
        var ft = f.FrameType.value;
        var g = f.Glazing.value;
        var fn = f.FrameNo.value;
        var fs = f.FrameSize.value;

    
        if ( fs == "" )
        {
            alert ( "You need to enter the size of your collectible before selecting a frame" );
        }
        else
        {
            //var s = "ft=" + ft + "&g=" + g + "&fn=" + fn + "&fs=" + fs;
            //alert ( s );
            //request=ajaxRequest("/ajax/changeMoulding.php",changeSummaryCallback,s, "post","");
            new Ajax.Request('/ajax/changeMoulding.php',
            {
                parameters: {ft: ft, g: g, fn: fn, fs: fs },

                onSuccess: function(transport,json)
                {
                  var response = transport.responseText || "no response text";
                  //alert("Success! \n\n" + response);
                  //alert(json ? Object.inspect(json) : "no JSON object");
                  //var p = eval("(" + response + ")");
                  //alert ( json.FramePrice );

                  var fp = json.FramePrice.toFixed(2);
                  document.getElementById('prFramePrice').innerHTML = '<p><strong>Frame Price :</strong> $' + json.FramePrice.toFixed(2) + '</p>';
                  var gp = json.GlazingPrice.toFixed(2);
                  if ( gp > 0 )
                  {
                      document.getElementById('prGlazingPrice').innerHTML = '<p><strong>Glazing Price :</strong> $' + gp + '</p>';
                  }
                  var tp = parseFloat(fp) + parseFloat(gp);
                  document.getElementById('prTotalPrice').innerHTML = '<p><strong>Total Price :</strong> $' + tp + '</p>';
                  document.getElementById('FrameDesc').innerHTML = json.FrameDesc;

                },
                onFailure: function(){ alert('Something went wrong...') }
          });

        }
    }

}

function requestFrames(  )
{   
    // called when the combo boxes change on the Select Your Frame page
    //alert ( 'Hell2' );
    // get the Color, Width and Price Range from the form
    var f = document.getElementById('WizardForm');
    var mouldingColor = f.SelectMouldingColor.value;
    var mouldingWidth = f.SelectMouldingWidth.value;
    var mouldingPriceRange = f.SelectMouldingPrice.value;
    var FrameType = f.FrameType.value;
    var FrameSize = parseInt ( f.FrameSize.value );


    // don't make the call if the nothing has changed
    if ( currentColor == mouldingColor && currentWidth == mouldingWidth && currentPriceRange == mouldingPriceRange )
    {
        //alert ( mouldingColor );
        //alert ( mouldingWidth );
        //alert ( mouldingPriceRange );
        ;  
        //return;
	}
    else                    
    {
        currentColor = mouldingColor;
        currentWidth = mouldingWidth;
        currentPriceRange = mouldingPriceRange;
        document.getElementById('mouldingPanelLoading').style.display = "block";  

        //var s = "c=" + mouldingColor + "&w=" + mouldingWidth + "&pr=" + mouldingPriceRange + "&ft=" + FrameType + "&fs=" + FrameSize;
        //alert ( s );

        //request=ajaxRequest("/ajax/moulding.php",mouldingCallback,s, "post","");

        /*
        new Ajax.Request('/ajax/moulding.php',
        {
            parameters: {c: mouldingColor, w:mouldingWidth , pr: mouldingPriceRange , ft: FrameType, fs: FrameSize },
            onSuccess: function(transport,json)
            {
              var response = transport.responseText || "no response text";
              //alert("Success! \n\n" + response);
              alert(json ? Object.inspect(json) : "no JSON object");
              //alert(response.getHeader('Server'));
         
              
             for ( x in json ) 
              alert ( x['fp'] );
              
              alert ( json ['0'].fp );
         
             
              //var p = eval("(" + response + ")");
              //// alert ( "p.length = " + p.length );
              //
              ////alert ( p );
              //ma.length = 0;
              //for(var i in p)
              //{
              //    ma[i] = p[i];
              //    //alert ( ma[i] );
              //}
              ////alert ( ma );
              ////
              
              document.getElementById('mouldingPanelLoading').style.display = "none";  
              changeMouldings();
            },
            onFailure: function(){ alert('Something went wrong...') }
      });
      */  
        
        
        new Ajax.Request('/ajax/moulding.php',
        {
            parameters: {c: mouldingColor, w:mouldingWidth , pr: mouldingPriceRange , ft: FrameType, fs: FrameSize },
            onSuccess: function(transport,json)
            {
              var response = transport.responseText || "no response text";
              //alert("Success! \n\n" + response);
              //alert(json ? Object.inspect(json) : "no JSON object");
              //alert(response.getHeader('Server'));
              var p = eval("(" + response + ")");
              //alert ( "p.length = " + p.length );
              //alert ( "p = " + p );
              
              ma.length = 0;
              for(var i in p)
              {
                  ma[i] = p[i];
                  //alert ( ma[i] );
              }
              //alert ( ma );
              
              document.getElementById('mouldingPanelLoading').style.display = "none";  
              changeMouldings();
            },
            onFailure: function(){ alert('Something went wrong...') }
      });
      
	}
}
function changeMouldings ()
{
    //alert ( "ma.length = " + ma.length );
    // ma
    // 0 FrameNo
    // 1 Width
    // 2 Price
    // 3 LargeImage
    // 4 Thumbnail
    // 5 max thickness
    // 6 Description
    // 7 InStock

    var s = "";
    var href = ""
	//s += "<table class='center xsmall' style='width:540px;margin:0;padding:0'>"
    s += "<table class='center xsmall' style='width:540px'>"

   var l = ma.length;
   for ( var i = 0; i < l; i++ )
   {
       if ( i === 0 )
       {
           s += "<tr>";
       }

       //s += "<td class='border' style='width:174px;padding-top:10px;'>"
       s += "<td class='borderLight'>"
       
	   s += "<table style='width:172px'>";
       // Image
    
	   s += "<tr><td style='height:100px'>";
       href =  "<center><a  href ='";
       href += ma[i][4];
       href += "' "; 
       href += "rel='lightbox[frame]'"; 
       href += " title='Frame ";
       href += ma[i][0];       // Frame No
       href += " ";
       href += ma[i][6];       // Description
       href += "<br /> Width: ";
       href += ma[i][1];       
       href += "<br /> Max Thickness: ";
       href += ma[i][5];       
       href += "'";
       
       href += '>';
       href += " <img alt='' src='";
       href += ma[i][3];
       href += "' />";
       href += "</a></center>";
       s += href;
	   s += "</td></tr>";

	   // Description
	   s += "<tr><td>";
       s += " <center>";
       s += ma[i][0];       // Frame No
       s += " ";
       s += ma[i][6];       // Description
       s += "</center>";
	   s += "</td></tr>";



	   // buttons
	   s += "<tr><td>";
       s+=  "<img style='margin-bottom:4px' alt='Frame Details' id='n' src='/libtpf/img/details.jpg'";
       s += " onclick='javascript:viewMoulding(this,";
       s += ma[i][0];
       s += ")' />";

       s+=  "<img style='margin-bottom:4px' alt='Select' id='m' src='/libtpf/img/Select.jpg'";
       s += " onclick='javascript:changeMoulding(this,";
       s += ma[i][0];
       s += ")' />";
	   s += "</td></tr>";

	   // Instock
	   s += "<tr><td>";
	   var InStockDesc = '';
	   if ( ma[i][7] == 1 )
		InStockDesc = 'The moulding for this frame is in stock and should be built and shipped within 2-3 days after ordering.';
	   else if ( ma[i][7] == 2 || ma[i][7] == 4 )
		InStockDesc = 'The moulding for this  frame is ordered on demand from my distributor. Average shipping time after ordering is 5-7 days.';
	   else if ( ma[i][7] == 3 )
		InStockDesc = 'The moulding for this  frame is ordered on demand from my distributor. This distributor delivers every Friday with a Monday ordering cutoff. A frame ordered from Tuesday through Monday should ship the following Monday.';

	   s += "<center>In Stock?";
	   s +=     "<a href='#' class='hintanchor'"; 
	   s +=     "onMouseover=\"sh('";
	   s +=     InStockDesc;
	   s +=     "', this, event, '250px')\">";

	   if ( ma[i][7] == 1 )
	    s +=     "<img name='saf' src='/libimg/help.gif' style='margin: 0 0px -4px 10px;' border='0'>";
	   else 
	    s +=     "<img name='saf' src='/libimg/helpRed.gif' style='margin: 0 0px -4px 10px;' border='0'>";
	   s +=     "</a><center>";
	   s += "</td></tr>";

	   s += "</table>";

       s += "</td> ";
         
       if ( i > 0 && (i+1) % 3 == 0 )
       {
           s += "</tr><tr>";
       }
   }
    s += "</tr></table>";


    //alert( s );
    document.getElementById('mouldingDisplay').innerHTML = s;
}