<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
  <title>ASP.NET AJAX</title>

  <script type="text/javascript">
  function pageLoad() {
    gotoStep(1);
  }

  function gotoStepClick(nr) {
    Sys.Application.get_history().addHistoryPoint({myHistory: nr});
    gotoStep(nr);
  }
  
  function gotoStep(nr) {
    if (nr >= 1 && nr <= 3) {
      $get("Wizard1_Step1").style.display = "none";
      $get("Wizard1_Step2").style.display = "none";
      $get("Wizard1_Step3").style.display = "none";
      $get("Wizard1_SideBar1").style.fontWeight = "normal";
      $get("Wizard1_SideBar2").style.fontWeight = "normal";
      $get("Wizard1_SideBar3").style.fontWeight = "normal";
      $get("Wizard1_Step" + nr).style.display = "";
      $get("Wizard1_SideBar" + nr).style.fontWeight = "bold";
    }
  }
  
  function pageNavigate(sender, e) {
    var step = 1;
    if (e.get_state().myHistory != null) {
      step = e.get_state().myHistory;
    }
    gotoStep(step);
  }
  </script>

</head>
<body>
  <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    <asp:History ID="History1" runat="server" />
    <table cellspacing="0" cellpadding="0" border="0" id="Wizard1" style="border-collapse: collapse;">
      <tr>
        <td style="height: 100%;">
          <table id="Wizard1_SideBarContainer_SideBarList" cellspacing="0" border="0" style="border-collapse: collapse;">
            <tr>
              <td id="Wizard1_SideBar1">
                <a id="Wizard1_SideBarContainer_SideBarList_ctl00_SideBarButton" href="javascript:gotoStepClick(1)">
                  Etap 1.</a></td>
            </tr>
            <tr>
              <td id="Wizard1_SideBar2">
                <a id="Wizard1_SideBarContainer_SideBarList_ctl01_SideBarButton" href="javascript:gotoStepClick(2)">
                  Etap 2.</a></td>
            </tr>
            <tr>
              <td id="Wizard1_SideBar3">
                <a id="Wizard1_SideBarContainer_SideBarList_ctl02_SideBarButton" href="javascript:gotoStepClick(3)">
                  Etap 3.</a></td>
            </tr>
          </table>
        </td>
        <td style="height: 100%;">
          <table cellspacing="0" cellpadding="0" border="0" style="height: 100%; width: 100%;
            border-collapse: collapse;">
            <tr id="Wizard1_Step1" style="height: 100%; display: none;">
              <td>
                <h1>
                  Do startu...</h1>
              </td>
            </tr>
            <tr id="Wizard1_Step2" style="height: 100%; display: none;">
              <td>
                <h1>
                  Gotowi...</h1>
              </td>
            </tr>
            <tr id="Wizard1_Step3" style="height: 100%; display: none;">
              <td>
                <h1>
                  Start!</h1>
              </td>
            </tr>
          </table>
        </td>
      </tr>
    </table>
  </form>
</body>
</html>
