Sometimes in ASP.NET development you need just a little different functionality than what the built in controls have. Often you can inherit the control and extend functionality on top of the original version, but sometimes you wish you could just make a small change to the inner workings of the control. One option is to borrow the Mono implementation and modify it to meet your needs.
So today I wanted to implement an Ad Rotator so I could alternate the banner ad on mojoPortal.com to switch between my add for Event Calendar Pro and Form Wizard Pro. There is a built in AdRotator control in ASP.NET, so I read a few articles about it, here and here. In those articles they suggest click tracking by using a redirect page, but I wanted to track it in google Analytics since we already have it integrated in mojoPortal. To do this I need to add an onclick to the rendered link to call the tracking code and then navigate to the href. So an example onclick for tracking is like this:
onclick="mojoPageTracker._trackPageview('/EventCalendarProBanner.aspx');window.open(this.href,'_self');return false;"
This just tracks a made up url (/EventCalendarProBanner.aspx) before navigating to the linked product page.
The ASP.NET AdRotator control can consume an xml file in this format:
<?xml version="1.0" encoding="utf-8" ?>
<Advertisements>
<Ad>
<ImageUrl>~/images/Contoso_ad.gif</ImageUrl>
<NavigateUrl>http://www.contoso.com</NavigateUrl>
<AlternateText>Ad for Contoso.com</AlternateText>
</Ad>
<Ad>
<ImageUrl>~/images/ASPNET_ad.gif</ImageUrl>
<NavigateUrl>http://www.asp.net</NavigateUrl>
<AlternateText>Ad for ASP.NET Web site</AlternateText>
</Ad>
</Advertisements>
But I wanted to add another property to store my OnClick code, so my new format is like this:
<?xml version="1.0" encoding="utf-8" ?>
<Advertisements>
<Ad>
<ImageUrl>~/Data/Sites/1/skins/mojosite-brightside/eventcalpro-banner.gif</ImageUrl>
<NavigateUrl>~/event-calendar-pro-offer.aspx</NavigateUrl>
<AlternateText>A better event calendar for mojoportal</AlternateText>
<OnClientClick>mojoPageTracker._trackPageview('/EventCalendarProBanner.aspx');window.open(this.href,'_self');return false;</OnClientClick>
</Ad>
<Ad>
<ImageUrl>~/Data/Sites/1/skins/mojosite-brightside/formwizardpro-leaderboard.gif</ImageUrl>
<NavigateUrl>~/form-wizard-pro-single-installation-license-offer.aspx</NavigateUrl>
<AlternateText>Form Wizard Pro - Easy Forms for mojoPortal</AlternateText>
<OnClientClick>mojoPageTracker._trackPageview('/FormWizardProBanner.aspx');window.open(this.href,'_self');return false;</OnClientClick>
</Ad>
</Advertisements>
Since I don't really have access to the internal workings of the ASP.NET AdRotator, I decided to have a look at the source code for the Mono project implementation of this control. I downloaded the 3 files AdRotator.cs, AdCreatedEventArgs.cs, and AdCreatedEventHandler.cs, added them into my mojoPortal.Web.Controls project and changed the namespace so it wouldn't clash with the built in ASP.NET version. I had to modify a few small things where it was using some internal Mono stuff but not much. I added the OnClientClick property to AdCreatedEventArgs.cs and added on line of code to the render method of AdRotator.cs:
if (e.OnClientClick != null && e.OnClientClick.Length > 0)
w.AddAttribute(HtmlTextWriterAttribute.Onclick, e.OnClientClick);
I add it to my layout.master (Master Page) and configure it to read the xml file with my ads:
<mp:AdRotator id="ads1" runat="server" AdvertisementFile="~/App_Data/mojoads.ads" />
And voila, it works and only took about 20 minutes to implement.