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

<%@ Register Assembly="RadRotator.Net2" Namespace="Telerik.WebControls" TagPrefix="radR" %>

<!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>Rotator Demo</title>
    <link rel="stylesheet" type="text/css" href="rotator.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <radr:radrotator id="RadRotator1" runat="server" contentfile="~/RotatorDemo.xml"
            height="600px" width="800px" AutoAdvance="true">
            <FrameTemplate>
                <table width="100%">
                    <tr >
                        <td width="60%"></td>
                        <td width="40%"></td>
                    </tr>
                    <tr align="center">
                        <td>
                            <asp:TextBox ID="txtTitle" runat="server" 
                                Text='<%# DataBinder.Eval(Container.DataItem, "Name") %>' />
                        </td>
                        <td></td>                            
                    </tr>
                    <tr>
                        <td>
                            <asp:Image ID="Image2" runat="server" Width="480px" 
                                ImageUrl='<%# DataBinder.Eval(Container.DataItem, "Image") %>' />
                        </td>
                        <td>
                            <radR:RadTicker ID="RadTicker1" runat="server">
                                <%# DataBinder.Eval(Container.DataItem, "Description") %>
                            </radR:RadTicker>
                        </td>
                    </tr>
                </table>
            </FrameTemplate>
</radr:radrotator>
    <table  width="480px">
        <tr>
            <td width="130px"></td>
            <td width="40px">
                <button onclick="RadRotator1.ShowPrevFrame();" type="button" class="left" />
            </td>
            <td width="20px" />
            <td width="40px">
                <button onclick="RadRotator1.StopRotator();" type="button" class="stop" />
            </td>
            <td width="20px" />
            <td width="40px">
                <button onclick="RadRotator1.StartRotator();" type="button" class="start" />
            </td>
            <td width="20px" />
            <td width="40px">
                <button onclick="RadRotator1.ShowNextFrame();" type="button" class="right" />
            </td>
            <td width="130px" />
        </tr>
    </table>
        &nbsp;&nbsp;
        <asp:CheckBox ID="cbSuspend" runat="server" Text="Suspend" />&nbsp;&nbsp;Count: &nbsp;<asp:Label ID="lblCount" runat="server" />
    </div>
<script type="text/javascript">
    RadRotator1.attachEvent("OnClientFrameChanging", "bchange_handler");
    function bchange_handler(sender, args)
    {
        var target = document.getElementById("cbSuspend");
        return !target.checked;
    }
    RadRotator1.attachEvent("OnClientFrameChanged", "achange_handler");
    var clickCount = 1;
    function achange_handler(sender, args)
    {
        clickCount += 1;
        document.getElementById("lblCount").innerText = "Total frames viewed: " + clickCount;
        //return !target.checked;
    }
    
</script>        
    </form>
</body>
</html>
