<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CollapsiblePanelDemo.aspx.cs"
   Inherits="CollapsiblePanelDemo" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!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 runat="server">
   <title>Kontrolka Panel</title>

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

</head>
<body>
   <form id="form1" runat="server">
   <div>
      <asp:ScriptManager ID="ScriptManager1" runat="server" />
      <p>
         <asp:Label ID="lblCollapse" runat="server" Text="Kliknij, aby zwinąć" />
         ||
         <asp:Label ID="lblExpand" runat="server" Text="Kliknij, aby rozwinąć" />
      </p>
      <p>
         <asp:Image ID="imgToggle" runat="server" /> : <asp:Label ID="lblState" runat="server" />
      </p>
      <p>

         <asp:Panel runat="server" ID="pnlDynamic" BorderWidth="2px" BorderColor="red" Width="500" ScrollBars="Both">
         W tym miejscu znajduje się statyczna zawartość panelu.
         <br />
         Celem tego zdania jest pokazanie efektu zmiany
         wartości dopełnienia. Wartości dopełnienia mogą być wyrażone w pikselach (px),
         centymetrach (cm) lub jako dany procent szerokości panelu (%).
         <p />
         </asp:Panel>
         <cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" TargetControlID="pnlDynamic"
            CollapseControlID="lblCollapse" ExpandControlID="lblExpand" Collapsed="true" 
            ExpandedText="Aktualnie rozwinięty" CollapsedText="Aktualnie zwinięty" TextLabelID="lblState"
            ExpandedImage="ToggleButton_Checked.gif" CollapsedImage="ToggleButton_Unchecked.gif" ImageControlID="imgToggle"
            ExpandDirection="Horizontal" CollapsedSize="100" ScrollContents="true">
         </cc1:CollapsiblePanelExtender>
      </p>
   </div>
   </form>
</body>
</html>
