function nextAction() {
//  var elmt = document.getElementById( "load" );
//  elmt.style.visibility = "show";
  var args = nextAction.arguments;
  ajaxObject = createAjaxObj();
  ajaxObject.onreadystatechange=function() {
    if (ajaxObject.readyState == 4) { 
        if (ajaxObject.status==200) {
            parasData(); 
        }
        else {
            alert( "error: " + ajaxObject.status );
        }
    }
  }
  var submitURL = "../patcontrol.do?" + tokenName + "=" + token;
  if ( args.length == 1 ) {
     submitURL +="&step="+args[0];
  }
  else if ( args.length == 2 ) {
     submitURL +="&fdid="+args[0]+"&fvid="+args[1];
  }
  else if ( args.length == 4 ) {
     submitURL +="&fdid="+args[0]+"&fvid="+args[1]+"&pricef="+args[2]+"&pricet="+args[3];
  }
  else {
     alert( "Invalid argument" );
  }
//alert( submitURL );
  ajaxObject.open('GET', submitURL, true);
  ajaxObject.send(null);
}

function parasData() {
   var xmlData = ajaxObject.responseXML;
   var root = xmlData.getElementsByTagName("root")[0];
   if ( root != null ) {
        step = getXMLValue( root, "step" );
        var view = getXMLNode( root, "view" );
        var select = getXMLNode( root, "select" );
        var info = getXMLNode( root, "info" );
        var pricing = getXMLNode( root, "pricing" );
        var control = getXMLNode( root, "control" );
        var navigation = getXMLNode( root, "navigation" );
        var select2 = getXMLNode( root, "select2" );
        var size = getXMLNode( root, "size" );

        if ( step == 'CBINFO_FINISH' ) finish();
        if ( view != null ) {
            refreshView( view );
        }
        if ( select != null ) refreshSelect( select );
        if ( info != null ) refreshInfo( info );
//        if ( pricing != null ) refreshPricing( pricing );
        if ( control != null ) refreshControl( control );
        if ( navigation != null ) refreshNavigation( navigation );            
        if ( select2 != null ) refreshSelect2( select2 );
        if ( size != null ) refreshSize( size );
        refreshInstructions( step );
   }
   else {
        location.reload();
   }
}


function refreshSelect( select ) {
//alert( "select" );
      var result="";
      var title="";
      var fvid = [];
      var fvcode = [];
      var fvname = [];
      var fvimg = [];

      var tab1content = document.getElementById( "tab1content" );
      var tab2container = document.getElementById( "tab2container" );
      var tab2content = document.getElementById( "tab2content" );

      var etitle = document.getElementById( "tab1title" );
      var elmt = document.getElementById( "tab1select" );

      title = getXMLValue( select, "title" );
      etitle.innerHTML = title.toUpperCase();

      var fd = getXMLNode( select, "fd" );
      var fdid = getXMLValue( fd, "fdid" );
      var fdcode = getXMLValue( fd, "fdcode" );
      var fdname = getXMLValue( fd, "fdname" );
      var choices = getXMLNodes( fd, "choice" );
      for (var i=0;i<choices.length;i++) {
        fvid[i]= getXMLValue( choices[i], "fvid" );
        fvcode[i]= getXMLValue( choices[i], "fvcode" );
        fvname[i]= getXMLValue( choices[i], "fvname" );
        fvimg[i]= getXMLValue( choices[i], "fvimg" );
      }

      var index;
      if ( step == "CBINFO_CONF" ) {
          tab2container.style.display = "none";
          tab1content.style.height = "325px";

          result += '<table width="100%" >';
          result += '<tr valign="bottom">';
          result += '<td width="3%" height="88" align="left">';
          result += '</td>';
          result += '<td width="47%" align="left">';
          if ( ( index = indexOf( fvcode, '100' ) ) >= 0 ) {
            result += '<a href="javascript:nextAction( ' + fdid + ',' + fvid[index] + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" height="74" border="0" /></a>';
          }
          result += '</td>';
          result += '<td width="3%" height="88" align="left">';
          result += '</td>';
          result += '<td width="47%" align="left">';
          if ( ( index = indexOf( fvcode, '130' ) ) >= 0 ) {
            result += '<a href="javascript:nextAction( ' + fdid + ',' + fvid[index] + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" height="74" border="0" /></a>';
          }
          result += '</td>';
          result += '</tr>';
          result += '</table>';
          result += '<table width=100%>';
          result += '<tr align="left" valign="middle">';
          result += '<td class="style10" bgcolor="#eeeeee"><strong class="style19">SINGLE DOOR CONFIGURATIONS:</strong></td>';
          result += '</tr>';
          result += '</table>';
          result += '<table width="100%" >';
          result += '<tr valign="bottom">';
          result += '<td width="3%" height="88" align="left">';
          result += '</td>';
          result += '<td width="47%" align="left">';
          if ( ( index = indexOf( fvcode, '200' ) ) >= 0 ) {
            result += '<a href="javascript:nextAction( ' + fdid + ',' + fvid[index] + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" height="74" border="0" /></a>';
          }
          result += '</td>';
          result += '<td width="3%" height="88" align="left">';
          result += '</td>';
          result += '<td width="47%" align="left">';
          if ( ( index = indexOf( fvcode, '230' ) ) >= 0 ) {
            result += '<a href="javascript:nextAction( ' + fdid + ',' + fvid[index] + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" height="74" border="0" /></a>';
          }
          result += '</td>';
          result += '</tr>';
          result += '</table>';
          result += '<table width=100%>';
          result += '<tr align="left" valign="middle">';
          result += '<td class="style10" bgcolor="#eeeeee"><strong class="style19">DOUBLE DOOR CONFIGURATIONS:</strong></td>';
          result += '</tr>';
          result += '</table>';
          result += '<table width="100%">';
          result += '<tr valign="bottom">';
          result += '<td width="3%" height="88" align="left">';
          result += '</td>';
          result += '<td width="47%" align="left">';
          if ( ( index = indexOf( fvcode, 'T00' ) ) >= 0 ) {
            result += '<a href="javascript:nextAction( ' + fdid + ',' + fvid[index] + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" height="74" border="0" /></a>';
          }
          result += '</td>';
          result += '<td width="3%" height="88" align="left">';
          result += '</td>';
          result += '<td width="47%" align="left">';
          if ( ( index = indexOf( fvcode, 'Q00' ) ) >= 0 ) {
            result += '<a href="javascript:nextAction( ' + fdid + ',' + fvid[index] + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" height="74" border="0" /></a>';
          }
          result += '</td>';
          result += '</table>';
          result += '<table width=100%>';
          result += '<tr align="left" valign="middle">';
          result += '<td bgcolor="#eeeeee" width="50%"  class="style10"><span class="style19">TRIPLE CONFIGURATIONS:</span></td>';
          result += '<td bgcolor="#eeeeee" width="50%"  class="style10"><span class="style19">QUAD CONFIGURATIONS:</span></td>';
          result += '</tr>';
          result += '</table>';
      }
      else if ( step == "CBINFO_SWING" ) {
          tab2container.style.display = "none";
          tab1content.style.height = "325px";

          result += '<table width="100%" height="150" cellpadding="5" cellspacing="5" >';
  	  result += '<tr valign="bottom">';
          for (var i=0;i<choices.length;i++) {
            result += '<td class="style10" height="132" align="center"><a href="javascript:nextAction( ' + fdid + ',' + fvid[i] + ' )"><img src="' + rpath + fvimg[i] + '" alt="' + fvname[i] + '" title="' + fvname[i] + '" border="0" /><br><br>' + fvname[i] + '</a></td>';
            if ( i%2 == 1 && i != choices.length - 1 ) {
                result += "</tr><tr>";
            }
          }        
  	  result += '</tr>';
          result += '</table>';
      }
      else if ( step == "CBINFO_SIZE" ) {
          tab2container.style.display = "none";
          tab1content.style.height = "325px";

          result += '<table width="100%" class="style10" >';
  	  result += '<tr align="center">';
  	  result += '<td width="8%" height="25" align="left" valign="middle" bgcolor="#CCCCCC" class="style10"></td>';
  	  result += '<td width="15%" align="left" valign="middle" bgcolor="#CCCCCC" class="style10">Nominal <br />Door Width</td>';
  	  result += '<td width="16%" valign="middle" bgcolor="#CCCCCC" class="style10">Nominal <br />Door Height</td>';
  	  result += '<td width="26%" valign="middle" bgcolor="#CCCCCC" class="style10">Prehung Unit Size</td>';
          result += '<td width="25%" valign="middle" bgcolor="#CCCCCC" class="style10">Rough Opening </td>';
          result += '</tr>';
          var bgcolor;
          for (var i=0;i<choices.length;i++) {
            if ( i%2 == 0 ) {
                bgcolor = "#efefef";
            }
            else {
                bgcolor = "#ffffff";
            }
            result += '<tr valign="top" bgcolor="' + bgcolor + '" >';
            result += '<td align="center" ><input type="radio" name="dmsn" onclick="nextAction( ' + fdid + ',' + fvid[i] + ' )" /></td>';
            result += '<td align="center" >' + getXMLValue( choices[i], "attrs3" ) + '</td>';
            result += '<td align="center" >' + getXMLValue( choices[i], "attrs4" ) + '</td>';
            result += '<td align="center" >' + getXMLValue( choices[i], "attrs1" ) + '</td>';
            result += '<td align="center" >' + getXMLValue( choices[i], "attrs2" ) + '</td>';
            result += '</tr>';
          }        
          result += '</table>';
      }
      else if ( step == "CBINFO_COLLECTION" ) {
          tab2container.style.display = "none";
          tab1content.style.height = "325px";
          result += '<table width="100%" height="300"  class="style10" >';
          result += '<tr valign="top">';
          for (var index=0;index<choices.length;index++) {
            if ( index%4 == 0 && index != 0 ) {
                   result += '</tr><tr valign="top">';
            }
            if ( getXMLValue( choices[index], "status" ) == "2" ) {  
                   result += '<td height="150" align="left" ><div class="style11" ><a href="javascript:nextAction( ' + fdid + ',' + fvid[index] 
                          + ' )"><img src="' + rpath + fvimg[index] + '" alt="' + fvname[index]  + '" title="' + fvname[index]
                          + '" width="125" height="125" border="0"  /><br>' + fvname[index] + '</a></div></td>';
            }
            else {
                   result += '<td height="150" align="left" ><div class="style22" ><img src="' 
                          + rpath + fvimg[index] + '" alt="' + fvname[index] + '" title="' + fvname[index] + '" width="125" height="125" border="0"  /><br>' 
                          + fvname[index] + '</div></td>';
            }
          }
          result += '</tr>';
          result += '</table>';

      }
      else if ( step == "CBINFO_STYLE" ) {
          tab1content.style.height = "75px";
          result += '<table width="100%" height="70"  class="style10" >';
          result += '<tr valign="top">';
          result += '<td height="63" align="left" >';
          for (var index=0;index<choices.length;index++) {
            if ( getXMLValue( choices[index], "status" ) == "2" ) {  
                   result += '<td><div class="style11" ><a href="javascript:nextAction( ' + fdid + ',' + fvid[index] 
                          + ' )" ><img src="' + rpath + fvimg[index] + '" '
                          + ' onmouseover="javascript:MM_showHideLayers(\'finish_' + fvcode[index] + '\',\'\',\'show\')" '
                          + ' onmouseout="javascript:MM_showHideLayers(\'finish_' + fvcode[index] + '\',\'\',\'hide\')" '
                          + '" width="65" height="35" border="0" /><br>' 
                          + fvname[index] + '</a></div></td>';
            }
            else {
                   result += '<td><div class="style22" ><img src="' 
                          + rpath + fvimg[index] + '" '
                          + ' onmouseover="javascript:MM_showHideLayers(\'finish_' + fvcode[index] + '\',\'\',\'show\')" '
                          + ' onmouseout="javascript:MM_showHideLayers(\'finish_' + fvcode[index] + '\',\'\',\'hide\')" '
                          + '" width="65" height="35" border="0" /><br>' 
                          + fvname[index] + '</div></td>';
            }
          }
          result += '</td>';
          result += '</tr>';
          result += '</table>';

      }
      else if ( step == "CBINFO_JAMB" ) {
          tab2container.style.display = "none";
          tab1content.style.height = "200px";

          result += '<table width="97%">';
          result += '<tr valign="top" class="style10">';
  	  result += '<td height="18" align="center"><strong>PRIMED PINE</strong></td>';
  	  result += '<td align="center">&nbsp;</td>';
  	  result += '<td align="center"><strong>COMPOSITE</strong></td>';
  	  result += '<td align="center">&nbsp;</td>';
	  result += '</tr>';
  	  result += '<tr valign="top">';
          result += '<td width="20%" align="center"><img src="' + rpath + 'jamb/smooth.jpg" alt="Smooth Finish Jamb" width="100" height="100" border="1" /></td>';
          result += '<td width="30%" align="left" class="style10">Common Widths:<br /><br />';
          for (var i=0;i<choices.length;i++) {
             if ( choices[i].getElementsByTagName("attrs1")[0].firstChild.nodeValue == "OP_JAMB_TYPE__W" ) {
                result += '<input type="radio" name="jamb" onclick="nextAction( ' + fdid + ',' + fvid[i] + ' )" />'
                result += fvname[i] + '<br/>';
             }
          }
          result += '</td>';
          result += '<td width="20%" height="109" align="center" class="style10"><img src="' + rpath + 'jamb/composite.jpg" width="100" height="100" border="1" /></td>';
          result += '<td width="30%" align="left" class="style10">Common Widths:<br /><br />';
          for (var i=0;i<choices.length;i++) {
             if ( choices[i].getElementsByTagName("attrs1")[0].firstChild.nodeValue == "OP_JAMB_TYPE__CM" ) {
                result += '<input type="radio" name="jamb" onclick="nextAction( ' + fdid + ',' + fvid[i] + ' )" />'
                result += fvname[i] + '<br/>';
             }
          }
          result += '</td>';
          result += '</tr>';
          result += '</table>';

      }
      elmt.innerHTML = result;

}

function refreshInstructions( step ) {
//alert( "default instructions" );
      var result="";

      var elmt = document.getElementById( "instructions" );

      elmt.style.height = "164px";
      elmt.style.width = "239px";

      if ( step == "CBINFO_CONF" ) {
        result += '<table width="100%" >';
        result += '<tr>';
        result += '<td width="87%" height="20" align="left" valign="top" class="style10"><strong>CONFIGURATION<br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td align="left" valign="top" class="style10">';
        result += 'Please click on the configuration that you would like for your entry way. Then please click the next button.';
        result += '</td>';
        result += '</tr>';
        result += '</table>';
      }
      else if ( step == "CBINFO_SWING" ) {
        result += '<table width="100%" >';
        result += '<tr>';
        result += '<td width="87%" height="20" align="left" valign="top" class="style10"><strong>SWING &amp; HANDING<br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td align="left" valign="top" class="style10">';
        result += 'Please click on the way that you would like your door to swing. Inswing means that your door with open into your home (like a door you push to open). Outswing means that your door will open away from your home (like a door you pull to open).';
        result += '</td>';
        result += '</tr>';
        result += '</table>';
      }
      else if ( step == "CBINFO_SIZE" ) {
        result += '<table width="100%" >';
        result += '<tr>';
        result += '<td width="87%" height="20" align="left" valign="top" class="style10"><strong>DIMENSIONS<br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td align="left" valign="top" class="style10">';
        result += 'Select the dimension of your entry way, and then click the next button. The "Nominal Door Width" and "Nominal Door Height" reflect the dimensions of the Sidelites and Door Slabs in this configuration before prehanging. The "Prehung Unit Size" is the size of the unit. The "Rough Opening" is the size of the entry way that the unit is designed to fit into.';
        result += '</td>';
        result += '</tr>';
        result += '</table>';
      }
      else if ( step == "CBINFO_COLLECTION" ) {
        result += '<table width="100%" >';
        result += '<tr>';
        result += '<td width="87%" height="20" align="left" valign="top" class="style10"><strong>COLLECTION<br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td align="left" valign="top" class="style10">';
        result += 'Please select the patio collection you are looking for.';
        result += '</td>';
        result += '</tr>';
        result += '</table>';
      }
      else if ( step == "CBINFO_STYLE" || step == "999" ) {
        result += '<table width="100%" >';
        result += '<tr>';
        result += '<td width="87%" height="20" align="left" valign="top" class="style10"><strong>FINISH &amp; STYLE<br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td align="left" valign="top" class="style10">';
        result += 'First select the finish color for your door and then select the style of door that you would like for your home. Finally click the next button.';
        result += '</td>';
        result += '</tr>';
        result += '</table>';
      }
      else if ( step == "CBINFO_FINISH" ) {
        result += '<table width="100%" >';
        result += '<tr>';
        result += '<td width="87%" height="20" align="left" valign="top" class="style10"><strong><br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td align="left" valign="top" class="style10">';
        result += 'To create another design, press the "START OVER" button or to print out the patio entryway that you designed select the "PRINT VIEW" button. After printing your design, please take it to your nearest Home Depot sales associate that can complete your order and answer any questions that you may have.';
        result += '</td>';
        result += '</tr>';
        result += '</table>';

      }
      else if ( step == "CBINFO_JAMB" ) {
        elmt.style.height = "230px";
        result += '<table width="100%" height="204">';
        result += '<tr>';
        result += '<td width="87%" height="28" align="left" valign="top" class="style10"><strong>What is a Door Jamb?<br />';
        result += '</strong></td>';
        result += '</tr>';
        result += '<tr>';
        result += '<td colspan="2" align="left" valign="top" class="style10">';
        result += '<dl>'
        result += '<dt><img src="' + rpath + 'jamb/diagram.jpg" width="200" height="163" /></dt>';
        result += '</dl></td>';
        result += '</tr>';
        result += '</table>';
      }
      else {
      }
      elmt.innerHTML = result;
}

function refreshSelect2( select ) {
      var result="";
      var title="";
      var fvid = [];
      var fvcode = [];
      var fvname = [];
      var fvimg = [];
      var fvattrs1 = [];
      var fvattrs2 = [];

      var etitle = document.getElementById( "tab2title" );
      var elmt = document.getElementById( "tab2select" );
      var tab2container = document.getElementById( "tab2container" );
      var tab2content = document.getElementById( "tab2content" );

      title = getXMLValue( select, "title" );

      if ( title == "null" ) {
        etitle.innerHTML = "";
        elmt.innerHTML = "";
        return
      }

      var fd = getXMLNode( select, "fd" );
      var fdid = getXMLValue( fd, "fdid" );
      var fdcode = getXMLValue( fd, "fdcode" );
      var fdname = getXMLValue( fd, "fdname" );

      var choices = getXMLNodes( fd, "choice" );
      for (var i=0;i<choices.length;i++) {
        fvid[i]= getXMLValue( choices[i], "fvid" );
        fvcode[i]= getXMLValue( choices[i], "fvcode");
        fvname[i]= getXMLValue( choices[i], "fvname" );
        fvimg[i]= getXMLValue( choices[i], "fvimg" );
        fvattrs1[i]= getXMLValue( choices[i], "attrs1" );
        fvattrs2[i]= getXMLValue( choices[i], "attrs2" );
      }

      etitle.innerHTML = title.toUpperCase();
      var index;
      if ( step == "CBINFO_STYLE" ) {
          tab2container.style.display = "block";
          tab2container.style.top = "240px";
          tab2content.style.height = "200px";

          result += '<table width="100%" height="199">';
          result += '<tr align="left">';
          result += '<td height="14" width="100%" align="left" valign="middle" bgcolor="#CCCCCC" class="style10">Choose Door Style</td>';
          result += '</tr>';
          result += '<tr valign="top">';
          result += '<td align="center" class="whitebg" >';
          result += '<div id="DS_DOOR_STYL" class="style10" >';
          result += '<ul>';
          for (var i=0;i<choices.length;i++) {
              
              result += '<li><a href="javascript:nextAction( ' + fdid + ',' + fvid[i] + ' )">'
                        + '<img src="' + rpath + fvimg[i] + '" '
                        + ' height="75" border="0" ';
              if ( fvattrs2[i] == 'Panel' || fvattrs2[i] == 'Clear' ) {
                  result += ' alt="' + fvname[i] + ' - ' + fvattrs2[i] + '" ' + ' title="' + fvname[i] + ' - ' + fvattrs2[i] + '" ';
              }
              else {
                  result += ' onmouseover="ShowContent( \'glass\',\'' + rpath + 'pglass/' + fvcode[i] + fvattrs1[i]  + '.jpg\' )" onmouseout="HideContent( \'glass\' )" ';
              }
              result += ' /><br>' + fvcode[i] + fvattrs1[i] + '</a></li>';
          }
          result += '</ul>';
          result += '</div>';
          result += '</td>';
	  result += '</tr>';
          result += '</table>';
      }
   
      elmt.innerHTML = result;
}

function finish() {
      var tab1content = document.getElementById( "tab1content" );
      var tab2container = document.getElementById( "tab2container" );
      tab2container.style.display = "none";
      tab1content.style.height = "275px";

      var etitle = document.getElementById( "tab1title" );
      var elmt = document.getElementById( "tab1select" );
      var result = "";

      etitle.innerHTML = '';

      result += '<div id="finish" >';
      result += '<br/><br/>';
      result += 'CONGRATULATIONS! YOUR DREAM PATIO ENTRYWAY IS ALMOST A REALITY...';
      result += '<br/><br/>';
      result += '<div style="padding-left: 10px; text-align: left;" >';
      result += '<p><a href="../patprintview.do?' + tokenName + '=' + token + '" target="_blank" >Print</a> this worksheet and bring it to a <a href="http://www.homedepot.com/webapp/wcs/stores/servlet/StoreFinderView?langId=-1&storeId=10051&catalogId=10053" target="_blank" >Home Depot</a> sales associate who can complete your order and answer any final questions you might have.</p>';
      result += '</div>';
      result += '<br/><br/><br/>';
      result += '<a href="../frcontrol.do?type=4" ><img src="' + rpath + 'nextbttn/startOver.jpg" border="0"/></a>&nbsp;&nbsp;&nbsp;&nbsp;';
      result += '<a href="http://www.homedepot.com/webapp/wcs/stores/servlet/StoreFinderView?langId=-1&storeId=10051&catalogId=10053" target="_blank" ><img src="' + rpath + 'nextbttn/locatorUp.png" border="0" /></a>&nbsp;&nbsp;&nbsp;&nbsp;';
      result += '<a href="../patprintview.do?' + tokenName + '=' + token + '" target="_blank" ><img src="' + rpath + 'nextbttn/printUp.png" border="0" /></a>&nbsp;&nbsp;&nbsp;&nbsp;';
      result += '</div>';
      elmt.innerHTML = result;
}