<%@ Page Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Rotator.PagerIntegration.DefaultCS"CodeFile="DefaultCS.aspx.cs" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
<title>Telerik ASP.NET Example</title>
<link href="Styles.css" rel="stylesheet" type="text/css" />
<script src="scripts.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<div class="demo-container no-bg">
<div class="rotatorCont">
<div class="rotator">
<telerik:RadRotator RenderMode="Lightweight" ID="RadRotator1" runat="server" Skin="Silk" Width="470px" Height="364" ItemWidth="470px"
ItemHeight="230" ScrollDuration="500" RotatorType="Buttons" DataSourceID="SqlDataSource1"
OnDataBound="RadRotator1_DataBound" OnClientItemShown="OnClientItemShown" OnClientLoad="rotator_load">
<ItemTemplate>
<div class="itemTemplate">
<div class="imageStyle">
<asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("ProductID", "~/Img/Northwind/Products/{0}.jpg") %>'
AlternateText='<%# Eval("ProductID") %>'></asp:Image>
</div>
<div style="width: 200px; float: left; margin: 0 0 0 15px;">
<div style="padding-top: 20px;">
<asp:Label CssClass="info" ID="ProductName" runat="server" Style="font-size: 24px;"><%# Eval("ProductName") %></asp:Label>
<br />
<br />
<span class='title' style="color: #f00">Category:</span>
<asp:Label CssClass="info" ID="Category" runat="server"><%# Eval("CategoryName")%></asp:Label>
<br />
<span class='title' style="color: #f00">Unit Price:</span>
<asp:Label CssClass="info" ID="Label2" runat="server"><%# Eval("UnitPrice")%></asp:Label>
<br />
<span class='title' style="color: #f00">Units In Stock:</span>
<asp:Label CssClass="info" ID="Label3" runat="server"><%# Eval("UnitsInStock")%></asp:Label>
<br />
<span class='title' style="color: #f00">Supplier:</span>
<asp:Label CssClass="info" ID="Label6" runat="server"><%# Eval("CompanyName")%></asp:Label>
<br />
</div>
</div>
</div>
</ItemTemplate>
<ControlButtons LeftButtonID="leftBtn" RightButtonID="rightBtn"></ControlButtons>
</telerik:RadRotator>
<div class="links">
<asp:Panel ID="ButtonsContainer" CssClass="ButtonsContainer" runat="server" />
<a href="#" id="leftBtn" title="Rotate Left" class="leftButton"></a>
<a href="#" id="rightBtn" title="Rotate Right" class="rightButton"></a>
</div>
</div>
</div>
</div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
ProviderName="System.Data.SqlClient" SelectCommand="SELECT TOP(15) * FROM [Products] INNER JOIN [Suppliers] ON Products.SupplierID=Suppliers.SupplierID INNER JOIN [Categories] ON Products.CategoryID=Categories.CategoryID">
</asp:SqlDataSource>
<qsf:ConfiguratorPanel runat="server">
<Views>
<qsf:View runat="server">
<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
<asp:ListItem Selected="True" Text="Change on mouseclick" Value="Mouseclick"></asp:ListItem>
<asp:ListItem Text="Change on mouseover" Value="Mouseover"></asp:ListItem>
</asp:RadioButtonList>
</qsf:View>
</Views>
</qsf:ConfiguratorPanel>
</form>
</body>
</html>