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

<%@ Register Assembly="RadTabStrip.Net2" Namespace="Telerik.WebControls" TagPrefix="radTS" %>
<!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>
    <title>Coffee Kiosk</title>

    <script type="text/javascript">
    //<!--        

        // -------------------------
        // global
        // -------------------------
        var selectedTab;  
                              
        // -------------------------
        // tab strip event handlers
        // -------------------------

        function SelectingHandler(sender, eventArgs)
        {   
            // if this is a top level tab, ask the user if 
            // they want to navigate to that tab; cancel
            // the event if they don't.
            if (isTopLevel(eventArgs.Tab))
            {
                return confirm("Do you want to see "+ eventArgs.Tab.Text + " coffee?");            
            }
            else 
            {
                return true;             
            }
        }                               
        
        function SelectedHandler(sender, eventArgs)
        {       
            // get a reference to standard asp.net control        
            var btnOrder = document.getElementById('btnOrder'); 
            
            // only place an order when a coffee tab is selected
            btnOrder.disabled = isTopLevel(eventArgs.Tab); 
            
            // save the selected tab to use when placing the order
            selectedTab = eventArgs.Tab; 
        }
                
        function MouseOverHandler1(sender, eventArgs)
        {
            // get a reference to a standard asp.net control
            var lblOrder = document.getElementById('lblStatus'); 
            
            // if this is a top level control, display a status message
            // that contains the coffee type and the coffees of that
            // type.
            if (isTopLevel(eventArgs.Tab))
            {
                lblOrder.innerHTML = "Try great " + 
                    eventArgs.Tab.Text + 
                    " coffee: " + 
                    GetChildTabsText(eventArgs.Tab); 
            }
            return true; 
        }
        
        function MouseOverHandler2(sender, eventArgs)
        {
            // get a reference to a standard asp.net image control
            var imgCup = document.getElementById('imgCup'); 
            
            // if this is a top level tab, use the tab text to 
            // get the corresponding image file name.
            if (isTopLevel(eventArgs.Tab))
            {
                imgCup.src = "images/" + eventArgs.Tab.Text + ".jpg"; 
            }
            return true; 
        }
        

        // -------------------------
        // standard asp.net control 
        // event handlers
        // -------------------------

        function PlaceOrderHandler()
        {
            // get a reference to the tab strip control
            var tabStrip = <%= RadTabStrip1.ClientID %>;
            // get a reference to the multi page control
            var multiPage = <%= RadMultiPage1.ClientID %>;  
            
            // get references to standard asp.net controls
            var lblOrder = document.getElementById('lblOrder'); 
            var tbName = document.getElementById('tbName'); 
                                  
            // 
            lblOrder.innerHTML = tbName.value + ", your " + selectedTab.Text + " is ready."; 
            multiPage.SelectPageByIndex(1);
            tabStrip.DetachEvent('OnClientTabSelected', 'SelectedHandler');
            tabStrip.DetachEvent('OnClientTabSelecting', 'SelectingHandler');
        }
        
        function DecafClickHandler()
        {
            // get a reference to the RadTabStrip control
            var tabStrip = <%= RadTabStrip1.ClientID %>;

            // get a reference to the checkbox control
            var cbDecaf = document.getElementById('cbDecaf'); 
            
            // get references to each top level tab
            var boldTab = tabStrip.FindTabByText("Bold"); 
            var mildTab = tabStrip.FindTabByText("Mild"); 
            var decafTab = tabStrip.FindTabByText("Decaf"); 

            // enable/disable if the tab represents a type of decaf coffee
            //if (document.form1.cbDecaf.checked)
            if (cbDecaf.checked)
            {
                boldTab.Disable(); 
                mildTab.Disable(); 
                decafTab.Enable(); 
            }
            else
            {
                boldTab.Enable(); 
                mildTab.Enable(); 
                decafTab.Disable();             
            }        
        }

        // -------------------------
        // helper functions 
        // -------------------------

        function GetChildTabsText(tab)
        {
            var childTabText = ""; 
            
            // iterate the child tabs of the passed in tab
            for (var i=0; i<tab.Tabs.length; i++)
            {
                // separate with commas
                if (childTabText != '')
                {
                    childTabText += ", "; 
                }
                // add the child tab text
                childTabText += tab.Tabs[i].Text; 
            }
            return childTabText;                             
        }
        
       
        function isTopLevel(tab)
        {
            // retrieve a reference to the RadTabStrip
            var tabStrip = <%= RadTabStrip1.ClientID %>;

            // iterate the root level tabs
            for (var i=0; i<tabStrip.Tabs.length; i++)
            {
	        // if the text matches, "tab" is a root level tab.
                if (tab.Text == tabStrip.Tabs[i].Text)
                    return true;  
            }
            return false; 
        } 
       
        //-->
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table border="0" cellpadding="0" cellspacing="0" style="width: 100%; height: 100%">
                <tr>
                    <td colspan="2">
                        <radTS:RadTabStrip ID="RadTabStrip1" runat="server">
                            <Tabs>
                                <radTS:Tab runat="server" Text="Bold">
                                    <Tabs>
                                        <radTS:Tab runat="server" Text="Torino">
                                        </radTS:Tab>
                                        <radTS:Tab runat="server" Text="Treviso">
                                        </radTS:Tab>
                                    </Tabs>
                                </radTS:Tab>
                                <radTS:Tab runat="server" Text="Mild">
                                    <Tabs>
                                        <radTS:Tab runat="server" Text="Calabria">
                                        </radTS:Tab>
                                        <radTS:Tab runat="server" Text="Debole ">
                                        </radTS:Tab>
                                    </Tabs>
                                </radTS:Tab>
                                <radTS:Tab runat="server" Text="Decaf">
                                    <Tabs>
                                        <radTS:Tab runat="server" Text="Sonno ">
                                        </radTS:Tab>
                                    </Tabs>
                                </radTS:Tab>
                            </Tabs>
                        </radTS:RadTabStrip>
                        &nbsp;
                    </td>
                </tr>
                <tr>
                    <td valign="top" style="width: 350px;">
                        &nbsp;<radTS:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0">
                            <radTS:PageView ID="PageView1" runat="server">
                                <asp:Button ID="btnOrder" runat="server" Text="Order" Enabled="False" UseSubmitBehavior="False" /></radTS:PageView>
                            <radTS:PageView ID="PageView2" runat="server" Width="100%">
                                &nbsp;<asp:Label ID="lblOrder" runat="server"></asp:Label>
                            </radTS:PageView>
                        </radTS:RadMultiPage>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </td>
                    <td valign="top" style="background-color: whitesmoke;">
                        Your Name:
                        <asp:TextBox ID="tbName" runat="server">Coffee Kiosk Customer</asp:TextBox><br />
                        <asp:CheckBox ID="cbDecaf" runat="server" Text="Decaf" />
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        &nbsp;<asp:Image ID="imgCup" runat="server" ImageUrl="~/Images/Bold.jpg" />
                        <asp:Label ID="lblStatus" runat="server"></asp:Label></td>
                </tr>
            </table>
        </div>
        &nbsp;
    </form>
</body>

<script type="text/javascript">
        //<!--        
            var tabStrip = <%= RadTabStrip1.ClientID %>;
            
            tabStrip.AttachEvent('OnClientTabSelected', 'SelectedHandler');
            tabStrip.AttachEvent('OnClientTabSelecting', 'SelectingHandler');
            tabStrip.AttachEvent('OnClientMouseOver', 'MouseOverHandler1');                        
            tabStrip.AttachEvent('OnClientMouseOver', 'MouseOverHandler2');   
        //-->
</script>

</html>
