<%@ Page Language="C#" AutoEventWireup="true" Codebehind="Default.aspx.cs" Inherits="ClientAPI._Default" %>

<%@ Register Assembly="RadSplitter.Net2" Namespace="Telerik.WebControls" TagPrefix="radspl" %>
<!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>Untitled Page</title>
</head>
<body>
  <form id="form1" runat="server">

    <script type="text/javascript">                              
        
        function RefreshClick()
        {
          var slidingZone = <%= zoneLeft.ClientID %>;
          slidingZone.UnDockPane("slidingPaneOptions");
          slidingZone.DockPane("slidingPaneFiles");
        }
        
        function BeforeResize(sender, eventArgs)
        {
          LogEvent("BeforeResize: " + eventArgs.splitterObj.ID); 
          return false; 
        }
        
        function Resized(sender, eventArgs)
        {
          LogEvent("Resized:" + eventArgs.splitterObj.ID); 
        }
        
        function Loaded(sender, eventArgs)
        {
          LogEvent("Loaded:" + eventArgs.splitterObj.ID); 
        }

function BeforePaneUnDock(sender, eventArgs)
{
  return confirm("Do you want to undock " + 
    eventArgs.paneObj.ID + "?");
}

        
        function ListPanes()
        {
            var splitter = <%= splitterTopBottom.ClientID %>;
            var panes = splitter.GetPanes(); 
            for(i = 0; i < panes.length; i++)
            {
              panes[i].Collapse(
                RadSplitterNamespace.RAD_SPLITTER_DIRECTION.Forward);             
            }

            var splitBars = splitter.GetSplitBars(); 
            for(i = 0; i < splitBars.length; i++)
            {
              alert(splitBars[i].GetContainerElement().innerHTML); 
            }
            
            var pane = <%= paneBottom.ClientID %>; 
            pane.SetContentUrl("http://www.telerik.com");             
            alert(pane.GetExtContentContainerElement().outerHTML); 

            alert(pane.GetState()); 

        }


                
        function LogEvent(text)
        {
          var ta = document.getElementById("TextArea1");
            
          if (ta)
          {
            ta.value += text + "\n";
            ta.scrollTop = ta.scrollHeight;
          }
        }
    </script>

    <radspl:RadSplitter ID="splitterMain" runat="server" Height="90%" Width="100%" EnableClientDebug="False"
      HeightOffset="8" BorderSize="0" BorderStyle="None" Orientation="Horizontal"
      VisibleDuringInit="False" FullScreenMode="true" LiveResize="True" 
      OnClientBeforeResize="BeforeResize" OnClientLoaded="Loaded" OnClientResized="Resized"
      >
      <radspl:RadPane ID="paneMain" runat="server" Height="100%" Width="100%" Scrolling="None">
        <radspl:RadSplitter ID="splitterLeftRight" runat="server" Height="100%" Width="100%"
          EnableClientDebug="False" BorderSize="0" BorderStyle="None" Orientation="Vertical"
          VisibleDuringInit="False">
          <radspl:RadPane ID="paneLeft" runat="server" Height="80%" Scrolling="None">
            <radspl:RadSlidingZone ID="zoneLeft" runat="server" InitiallyDockedPaneId="slidingPaneFiles">
              <radspl:RadSlidingPane ID="slidingPaneOptions" runat="server" Scrolling="none" Title="Options">
              <input type="button" value="List Panes" onclick="ListPanes();" />
              </radspl:RadSlidingPane>
              <radspl:RadSlidingPane ID="slidingPaneFiles" runat="server" Scrolling="none" Title="Files"
              OnClientBeforePaneUnDock="BeforePaneUnDock">
              </radspl:RadSlidingPane>
            </radspl:RadSlidingZone>
          </radspl:RadPane>
          <%-- end pane left--%>
          <radspl:RadSplitBar ID="RadSplitBar1" runat="server"  CollapseMode="Both"/>
          <radspl:RadPane ID="paneRight" runat="server" Height="40%" Width="60%" Scrolling="None">
            <radspl:RadSplitter ID="splitterTopBottom" runat="server" Height="100%" Width="100%"
              EnableClientDebug="False" BorderSize="0" BorderStyle="None" Orientation="Horizontal"
              VisibleDuringInit="False">
              <radspl:RadPane ID="paneTop" runat="server" Height="50%" Width="100%" Scrolling="None">
                <textarea id="TextArea1" cols="100" rows="10"></textarea>
              </radspl:RadPane>
              <radspl:RadSplitBar ID="RadSplitBar2" runat="server" CollapseMode="Both" />
              <radspl:RadPane ID="paneBottom" runat="server" Height="50%" Width="100%" Scrolling="None">
              </radspl:RadPane>
            </radspl:RadSplitter>
            <%-- end splitter right--%>
          </radspl:RadPane>
          <%-- end pane right--%>
        </radspl:RadSplitter>
        <%-- end splitter left--%>
      </radspl:RadPane>
      <%-- end main pane--%>
      <radspl:RadPane ID="paneFooter" runat="server" Height="30px" Width="100%" CssClass="footer"
        Scrolling="none">
      </radspl:RadPane>
    </radspl:RadSplitter>
  </form>
</body>
</html>
