To create the Testimonials frontend view, perform the following:

1. In the context menu of the Testimonials folder, click Add » New Item...

2. In the left pane, select Visual C# » Web.

3. Click Web User Control and in the Name input field, enter TestimonialsView.

4. Open the newly created file and clear its content.

5. Define the markup by pasting the following code:

   <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="TestimonialsView.ascx.cs" Inherits="SitefinityWebApp.Modules.Testimonials.TestimonialsView" %>

    

   <asp:MultiView ID="TestimonialsMultiView" runat="server"ActiveViewIndex="0">

       <asp:View ID="ListView" runat="server">

           <h1>Testimonials</h1>

           <asp:Repeater ID="TestimonialsRepeater" runat="server">

               <ItemTemplate>

                   <h2><%# Eval("Name") %></h2>

                   <p><%# Eval("Summary") %> <a href="<%= ResolveUrl(DetailsPageUrl()) %>/<%# Eval("UrlName") %>">Read More »</a></p>

                   <telerik:RadRating ID="RadRating1"runat="server" Value='<%# Eval("Rating") %>' Precision="Half" ItemCount="5" ReadOnly="true" />

               </ItemTemplate>

           </asp:Repeater>

    

           <p>Have something to add? <a href="<%= ResolveUrl("~/Submit") %>">Submit your own testimonial</a></p>

       </asp:View>

       <asp:View ID="DetailsView" runat="server">

           <h1><asp:Literal ID="Name" runat="server" /></h1>

           <asp:Label ID="Text" runat="server" />

           <telerik:RadRating ID="Rating" runat="server"Precision="Item" ItemCount="5" ReadOnly="true" />

           <p><em>Posted: <asp:Literal ID="DatePosted"runat="server" /></em></p>

           <p><a href="<%= ResolveUrl(Telerik.Sitefinity.Web.SiteMapBase.GetActualCurrentNode().Url) %>">« All Testimonials</a></p>

       </asp:View>

   </asp:MultiView>

6. Open the code-behind file TestimonialsView.ascx.cs in Visual Studio and add the following namespaces:

   using SitefinityWebApp.Modules.Testimonials.ControlDesigners;

   using SitefinityWebApp.Modules.Testimonials.Data;

   using Telerik.Sitefinity;

   using Telerik.Sitefinity.Modules.Pages;

   using Telerik.Sitefinity.Web;

   using Telerik.Sitefinity.Web.UI.ControlDesign;

7. Add the following attribute to the class definition:

   [ControlDesigner(typeof(TestimonialsViewDesigner)), PropertyEditorTitle("Testimonials")]

8. Add the following constant:

   public static readonly string ViewName = "TestimonialsView";

9. Provide instances for the TestimonialsContext and the count property by pasting the following code:

   private int _count = 10;

   private TestimonialsContext context = TestimonialsContext.Get();

    

   public int Count

   {

       get { return _count; }

       set { _count = value; }

   }

10. Create the fields that control the mode of the view by pasting the following code:

    public enum ControlMode

    {

        List,

        Details

    }

     

    public ControlMode Mode

    {

        get { return TestimonialID == Guid.Empty ? ControlMode.List : ControlMode.Details; }

    }

     

    private Guid testimonialID = Guid.Empty;

     

    protected Guid TestimonialID

    {

        get

        {

            if (testimonialID == Guid.Empty)

            {

                var param = Request.RequestContext.RouteData.Values["Params"] as string[];

                if (param == null) return Guid.Empty;

     

                var url = param[0];

                var testimonial = context.Testimonials.FirstOrDefault(t => t.UrlName == url);

                testimonialID = (testimonial == null) ? Guid.Empty : testimonial.Id;

            }

            return testimonialID;

        }

    }

11. Retrieve the testimonials and bind to the view by pasting the following code:

    private void ShowList()

    {

        var testimonials = context.Testimonials.Where(t=> t.Published).Take(Count);

        TestimonialsRepeater.DataSource = testimonials;

        TestimonialsRepeater.DataBind();

        TestimonialsMultiView.SetActiveView(ListView);

    }

     

    private void ShowDetails()

    {

        var testimonial = context.Testimonials.Where(t => t.Id == TestimonialID && t.Published).FirstOrDefault();

        if (testimonial == null) return; // new default 404 response

     

        RouteHelper.SetUrlParametersResolved();

     

        Name.Text = testimonial.Name;

        Text.Text = testimonial.Text;

        Rating.Value = testimonial.Rating;

        DatePosted.Text = testimonial.DatePosted.ToLongDateString();

        TestimonialsMultiView.SetActiveView(DetailsView);

     

        Page.Title = string.Concat("Testimonials: ", testimonial.Name);

    }

12. Implement the Page_Load method by pasting the following code:

    protected void Page_Load(object sender, EventArgs e)

    {

        if (IsPostBack) return;

     

        switch (Mode)

        {

            // List View

            case ControlMode.List:

                ShowList();

                break;

     

            // Details View

            case ControlMode.Details:

                ShowDetails();

                break;

        }

    }

13. Provide reference to the details page url, by pasting the following code:

    public Guid DetailsPageID { get; set; }

     

    protected string DetailsPageUrl()

    {

        // check for custom details page

        var currentPageUrl = SiteMapBase.GetActualCurrentNode().Url;

                if (this.DetailsPageID == Guid.Empty)

                    return currentPageUrl;

     

        // make sure page exists

        var page = App.WorkWith().Pages().Where(p => p.Id ==this.DetailsPageID).Get().FirstOrDefault();

        if (page == null) return currentPageUrl;

     

        // return page url

        return page.GetFullUrl();

    }

14. Override the OnUnload method:

    protected override void OnUnload(EventArgs e)

    {

        base.OnUnload(e);

        if (context != null)

            context.Dispose();

    }

In the markup, you create a ListView to visualize all testimonials. In TestimonialsView.ascx.cs, you set the control designer that the control uses. You do this by the ControlDesigner attribute. You define the control designer in Creating the Testimonials view control designer. Then, you define the necessary properties and methods to retrieve and show the testimonials and the details page.