RotatorTemplate Control
Life With Nate
Nate's Poetry Page
Resume (PDF)
Nate's Code
ASP.NET 2.0/3.5
ButtonExtensions
CheckBoxValidator
ConditionalRequiredTextValidator
CSSImageMap
CustomStyle
DateTimePicker
DateTimePickerTemplated
LengthValidator
RestrictInputTextBox
RestrictInputValidator
Rollovers
RotatedTextHandler
RotatedTextImage
Rotators
AdRotator
ImageRotator
TemplateRotator
RotatorAd
RotatorImage
RotatorTemplate
Sample Rotator XML File
Rotators DTD
SelectedCountValidator
SlideIntoView
StatesDropDownList
UniqueValueValidatorBase
VB.NET 2.0/3.5
Just For Fun
Windows Phone 7
Description
The RotatorTemplate control is used to enter a template that will be included in the
TemplateRotator
.
Properties & Methods
RotatorTemplate
The RotatorTemplate control is used to enter a template that will be included in the
TemplateRotator
control
LayoutTemplate
- The ITemplate that that will be used in the
TemplateRotator
control
StyleValue
- A String of CSS styles that will be applied to the div for this template
Source Code
TemplateRotator.vb:
Namespace NathanSokalski <ParseChildren(True, "Items")> Public Class TemplateRotator : Inherits System.Web.UI.Control : Implements INamingContainer Private divids As New Collections.Generic.List(Of String) Private _rotatorwidth As Integer = 500 Private _rotatorheight As Integer = 300 Private _items As New Collections.Generic.List(Of RotatorTemplate) Private _randomorder As Boolean = False Private _interval As Long = 1750 Private _stylevalue As String <DefaultValue(500), Description("The width of the div that will wrap each template")> Public Property RotatorWidth() As Integer Get Return Me._rotatorwidth End Get Set(ByVal value As Integer) Me._rotatorwidth = value End Set End Property <DefaultValue(300), Description("The height of the div that will wrap each template")> Public Property RotatorHeight() As Integer Get Return Me._rotatorheight End Get Set(ByVal value As Integer) Me._rotatorheight = value End Set End Property <Browsable(False), Description("The List of RotatorTemplates that will be rotated")> _ Public ReadOnly Property Items() As Collections.Generic.List(Of RotatorTemplate) Get Return Me._items End Get End Property <DefaultValue(False), _ Description("A Boolean value specifying whether the RotatorTemplates should be displayed sequentially or in random order")> _ Public Property RandomOrder() As Boolean Get Return Me._randomorder End Get Set(ByVal value As Boolean) Me._randomorder = value End Set End Property <DefaultValue(1750), Description("The amount of time, in milliseconds, between rotations")> Public Property Interval() As Long Get Return Me._interval End Get Set(ByVal value As Long) Me._interval = value End Set End Property <Description("A String of CSS styles that will be applied to the divs for all templates")> Public Property StyleValue() As String Get Return Me._stylevalue End Get Set(ByVal value As String) Me._stylevalue = value End Set End Property Protected Overrides Sub CreateChildControls() Dim div As HtmlGenericControl For Each rt As RotatorTemplate In Me._items div = New HtmlGenericControl("div") div.ID = String.Concat("divRotatorTemplate", Me._items.IndexOf(rt)) div.Attributes("class") = "TemplateRotator" If Me._items.IndexOf(rt) = 0 Then div.Style.Value = "display:block;" If Not String.IsNullOrEmpty(Me._stylevalue) Then div.Style.Value &= Me._stylevalue If Not String.IsNullOrEmpty(rt.StyleValue) Then div.Style.Value &= rt.StyleValue rt.LayoutTemplate.InstantiateIn(div) Me.Controls.Add(div) Me.divids.Add(div.ClientID) Next End Sub Private Sub Ctrl_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender Me.EnsureChildControls() Me.Page.Header.StyleSheet.CreateStyleRule(New NathanSokalski.CustomStyle(String.Format("width:{0}px;height:{1}px;margin:0px;padding:0px;border-width:0px;overflow:hidden;display:none;", Me._rotatorwidth, Me._rotatorheight)), Nothing, "div.TemplateRotator") If Not Me.Page.ClientScript.IsClientScriptBlockRegistered("TemplateRotator") Then Me.Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "TemplateRotator", "function TemplateRotator(ctrlid){document.getElementById(ctrlid.divlist[ctrlid.currindex]).style.display='none';ctrlid.currindex=(ctrlid.randomorder?Math.floor(Math.random()*ctrlid.divlist.length):++ctrlid.currindex%ctrlid.divlist.length);document.getElementById(ctrlid.divlist[ctrlid.currindex]).style.display='block';}", True) Dim datascript As New System.Text.StringBuilder() datascript.AppendFormat("var {0}_data={{", Me.ClientID()) datascript.Append("currindex:0,") datascript.AppendFormat("randomorder:{0},", Me._randomorder.ToString().ToLower()) datascript.Append("divlist:[") For Each divid As String In divids datascript.AppendFormat("""{0}"",", divid) Next datascript.AppendLine("]};").Replace(",]", "]") datascript.AppendFormat("window.setInterval(""TemplateRotator({0}_data)"",{1});", Me.ClientID(), Me._interval.ToString().TrimStart("-"c)).AppendLine() Me.Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), Me.ClientID(), datascript.ToString(), True) End Sub End Class Public Class RotatorTemplate : Inherits System.Web.UI.WebControls.CompositeControl Private _layouttemplate As ITemplate Private _stylevalue As String <TemplateContainer(GetType(RotatorTemplate)), _ PersistenceMode(PersistenceMode.InnerProperty), _ Description("The ITemplate that that will be used in the TemplateRotator control")> _ Public Property LayoutTemplate() As ITemplate Get Return Me._layouttemplate End Get Set(ByVal value As ITemplate) Me._layouttemplate = value End Set End Property <Description("A String of CSS styles that will be applied to the div for this template")> Public Property StyleValue() As String Get Return Me._stylevalue End Get Set(ByVal value As String) Me._stylevalue = value End Set End Property End Class End Namespace
Remarks
When creating your RotatorTemplates, it is a good idea to keep in mind the values of the
TemplateRotator
's RotatorHeight and RotatorWidth properties. The div that wraps each RotatorTemplate uses a CSS class that, along with the height and width specified by RotatorHeight and RotatorWidth, has the values {margin:0px;padding:0px;border-width:0px;overflow:hidden;}. Although the values specified by the StyleValue property will override these, I recommend taking caution when doing this in order to keep the dimensions of all RotatorTemplates equal.