Using Sitecore WebControl to Customize Google Calendar Reminder Button
WebControls allow the creation of reusable atomic components that fits well with the needs of semi-static HTML components. For this example of how to use WebControls in semi-static HTML components, we have created a Google Calendar Reminder button that can easily be reused/expanded. The code is a basic Sitecore WebControl with some custom parameters for setting the start/end times, location, details, title and item of the event.
Here is the code:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
using System;using System.Collections.Generic;using System.Linq;using System.Web;using Sitecore.Web.UI;using System.ComponentModel;using System.Collections.Specialized;using Sitecore.Data.Items;using Sitecore.Data.Fields;using Sitecore.Diagnostics;using Sitecore.Data;namespace Oshyn.Sitecore.WebControls{ public class GoogleCalendarReminder : WebControl { private readonly string googleCalendarReminderHtml = "<a href="http://www.google.com/calendar/event%7B0%7D"><img alt="" src="%7B1%7D"></a>"; private readonly string googleCalendarButton = "http://www.google.com/calendar/images/ext/gc_button2.gif"; private string startDateTime = string.Empty; private string endDateTime = string.Empty; private string title = string.Empty; private string location = string.Empty; private string details = string.Empty; private string itemId = string.Empty; [Category("Method"), Description("Start DateTime for the Event")] public String StartDateTime { get { return startDateTime; } set { startDateTime = value; } } [Category("Method"), Description("End DateTime for the Event")] public String EndDateTime { get { return endDateTime; } set { endDateTime = value; } } [Category("Method"), Description("Title for the Event")] public String Title { get { return title; } set { title = value; } } [Category("Method"), Description("Location for the Event")] public String Location { get { return location; } set { location = value; } } [Category("Method"), Description("Details of the Event")] public String Details { get { return details; } set { details = value; } } [Category("Method"), Description("Item Id of the Event")] public String ItemId { get { return itemId; } set { itemId = value; } } protected override void DoRender(System.Web.UI.HtmlTextWriter output) { NameValueCollection googleCalendarParams = new NameValueCollection(); if (string.IsNullOrEmpty(startDateTime)) //required value return; if (string.IsNullOrEmpty(endDateTime)) //required value return; if (string.IsNullOrEmpty(title)) //required value return; try { Item cEvent = GetItem(); if (!string.IsNullOrEmpty(itemId) && global::Sitecore.Data.ID.IsID(itemId)) cEvent = Sitecore.Context.Database.GetItem(new ID(itemId)); DateField start = cEvent.Fields[startDateTime]; DateField end = cEvent.Fields[endDateTime]; string gLocation = cEvent[location]; string gDetails = cEvent[details]; googleCalendarParams.Add("dates", string.Format("{0:yyyyMMdd'T'HHmmss'Z'}/{1:yyyyMMdd'T'HHmmss'Z'}", start.DateTime.ToUniversalTime(), end.DateTime.ToUniversalTime())); googleCalendarParams.Add("action", "TEMPLATE"); googleCalendarParams.Add("text", HttpUtility.HtmlEncode(cEvent[title])); googleCalendarParams.Add("sprop", Context.Request.Url.Host); if (!string.IsNullOrEmpty(gDetails)) googleCalendarParams.Add("details", HttpUtility.HtmlEncode(gDetails)); if (!string.IsNullOrEmpty(gLocation)) googleCalendarParams.Add("location", HttpUtility.HtmlEncode(gLocation)); var response = string.Format(googleCalendarReminderHtml, ToQueryString(googleCalendarParams), googleCalendarButton); output.Write(response); } catch (Exception ex) { Log.Error("Error on Google Calendar Reminder, method: DoRemder", ex, this); } } private string ToQueryString(NameValueCollection nvc) { return "?" + string.Join("&", Array.ConvertAll(nvc.AllKeys, key => string.Format("{0}={1}", HttpUtility.UrlEncode(key), HttpUtility.UrlEncode(nvc[key])))); } }} |
To use this code, add the registration section in your aspx/ascx file and then set the control with the necessary parameters for it to display the button. Once that is done, it will look something like this:
|
1
2
3
4
|
<%@ register tagprefix="gcal" namespace="Oshyn.Sitecore.WebControls" assembly="Oshyn.Sitecore"> <gcal:googlecalendarreminder details="Description" location="Location" title="Title" enddatetime="End Date" startdatetime="Start Date" itemid="{2A37207A-E546-4016-9ED5-1250B199C6DC}" runat="server"></gcal:googlecalendarreminder> |
For simple, semi-static HTML integrations, it is a good idea to use WebControls which give you the ability to be reuse them in multiple locations. To check out how to build more controls, check out these links:
- Sitecore Introduction (3 parts serie): http://sdn.sitecore.net/Articles/Web%20Controls/Building%20Web%20Controls%20-%20Part%201.aspx
- Stackoverflow : http://stackoverflow.com/questions/7070006/where-can-sitecore-webcontrol-examples-be-found
- Google Calendar Reminder Button: http://www.google.com/googlecalendar/event_publisher_guide_detail.html