This post will concentrate on the technical side of things behind Drive:Activated 2.0.
As I mentioned in the previous post, I upgraded to Community Server 2007 for Drive:Activated 2.0. The first thing I noticed was that although it threw out a lot of the stuff I had learnt previously, theming was so much easier, faster and customisable than Community Server 2.1 which I used for Drive:Activated 1.0 (the initial version).
There are things I did here that would not have been possible in CS 2.1 without significant CS code changes, e.g. separation of comments and trackbacks in blog posts. Also there is now basically no hard-coded HTML code anymore - all the controls emit no code unless specified, so you have full control over your design. The new theme engine alone is worth upgrading for I reckon. The docs, as well as Ben Tiedt's blog are worth reading for info on the new theme engine.
But of course, there were things that I wanted to do that weren't supported, so out came Visual Studio and some custom code:
-
DataSourceListCount & DataSourceListCountValueComparison (included)
When I did the comments and trackback separation, it turned out there was no way of finding out the number of comments and trackbacks separately, even though the data was in the system, so I wrote DataSourceListCount to display it. DataSourceListCountValueComparison allows you to use it as a condition - for example, I used it so if there was a singular trackback, it would write out 'trackback', not 'trackbacks'. These controls are in fact usable in any CS Chameleon list control - it pulls out the number of records retrieved by the list control, including any QueryOverrides - and conform to the standard behaviour of a CS Chameleon single-value control.
-
EmailSubscribeAction (not included)
This action handler jumps in when a blog comment is submitted, and if an email address is provided, it'll set up a user account if one doesn't exist already, and track that blog post's comments. I didn't include it because it was specially designed for this blog and probably won't be much use to other people. Let me know otherwise and I'll release it.
-
ExtendedWeblogRssHandler (not included)
This extends the standard weblog rss handler, and splices in my tumblelog into the blog RSS feed, and publishes the project RSS feed correctly. Again, this is specific to this blog so I didn't see much point in releasing it, but if you're interested in the code, let me know.
-
PostHumanDate (included)
This control takes the date of the post, and transforms it into a human-form date, e.g. 21 minutes ago instead of the actual date. See the bottom of the date box in the top right corner of this post (if you're reading this from the website of course). It's a standard CS single-value control, so it's usable within any post object, so inside blog posts, blog post lists, comments, forum post lists, forum posts etc. The text is hard-coded unfortunately (as there were no usable strings in the language files), and it is designed to list the largest unit up to 'months', so if under 1 minute it'll say x seconds ago, if under 1 hour it'll say under x minutes ago and so on.
-
SectionHumanDate (included) - added 06/08/2007
This control acts like the PostHumanDate control, except instead of grabbing data from a post object in CS, it grabs data from a section object. It is used to get dates from information on a forum, blog, gallery or folder itself - not the items within them. For example, it can be used to replace the 'most recent post date' in forums, which is a section object property.
-
RssFeedItemsList (included)This control lets you drag in any RSS feed and display it on your blog, without having to mirror it. Like the others, it is a full on CS list control, so you can set pagers, page sizes etc. and have complete control over the layout too. I've used it for the tumblelog, where it is housed in a
CallBackPager control. It caches each RSS feed for 30 minutes. One difference is that I couldn't be bothered making a data control, so to get the data out from each feed item, you have to use the standard ASP.NET code - instructions inside.
The source code and compiled module can be downloaded here - Sam's CS2007 Mods - with instructions inside.
CS theming aside, I also had to dust off my rusty javascript skills to do the animations for the popup 'sidebar' menus. I accounted for the fact that some may have javascript turned off, so only when javascript is turned on are the menus turned into popups - otherwise they appear as normal content at the bottom of the page. I've never been much good at javascript animations, so my current animation code is only active in Firefox and Safari (which is the fastest browser surprisingly); it is too slow to be useful in other browsers, so it is disabled and the popups just pop up. My coding is lacking clearly, as it has been done before in all sorts of websites; maybe I'll fix it one day.
I also had to use some javascript for my 'hi there!' welcome message for all first time visitors. Once you've visited once, a cookie is left behind telling me that so the message doesn't appear. Of course I considered if cookies were disabled, and if they are, the message never appears - don't want to annoy the hell out of my visitors.
The background image loader was javascript as well - just detects the browser window size on load and resize, and loads the appropriately sized one.
During the design stage, I designed with all the popular browsers in mind - IE7, Firefox, Safari and Opera - so the full experience is enabled on all of them. But there are still numerous computers out there running the ancient IE6, which among other things doesn't support PNG transparency (used for the translucent effects behind this post), but I didn't want that to prevent me from delivering on my design, so I ignored that up until the end - I'd rather send it an inferior version than have all the other browsers suffer. It ended up quite easily done - some nice conditional commenting sent it a stylesheet that overrode the appropriate elements, wiping out the bits that confused it. I also used ASP.NET's browser detection function to send IE6 viewers an upgrade message. As I don't have IE6 installed anymore, I used the virtual machine image Microsoft provides for testing purposes to test.
Designing this website however reminded me of my general dislike of javascript, in fact, the whole HTML/CSS/JS model, mainly because there are so many hacks needed to make things work anywhere near universally. I'm sick of the blame game - I mean not even the open-sourced and supposedly standards-based browsers, Firefox and Safari (based on WebKit), are identical in execution. The lack of native vector graphic support sucks too - I'm sick of having to use graphical hacks to get gradient backgrounds. Where's the SVG support? Bring it on Flash/Flex, Silverlight, whatever - as long as it runs the same on all platforms and has basic vector graphic support.
Once the coding and designing was all done, it was time to upload. The file upgrading process was a simple switch - out the old, in the new. The database upgrade process was painless as well, but trying to backup and restore a SQL Server 2005 over the internet wasn't. I ended up having to re-create the database schema, turn off all constraints, import the data from my web host (excluding static tables), and turn on the constraints again (replace NOCHECK with CHECK in the previous set of instructions).
A nice trick to make the upgrading process smoother for your visitors is to create an App_Offline.htm file with a nice informative 'maintenance' message in it and place it in the root of the website. ASP.NET will pick that up, shut down the web app, and return that file for all requests until it is removed again. More info here.
Overall, the upgrading the website went surprisingly smooth - in fact, all it took was about an hour of downtime while the database was upgraded and the files were FTP'd across.
So what will the fate of the old design be? Well, I've backed it up and recreated it in a virtual machine on my desktop, so everything's still there. Some have called for it to be turned into a WordPress template, so that will probably be the eventual fate once I can be bothered learning WP. Let me know if you're interested in it.
Alright, that's enough Drive:Activated 2.0 talk - back to regular programming, whatever that is.
UPDATE (02/08/2007): I released a new version of my CS mods; main difference is that PostHumanDate now supports units up to months (amended above), and is more flexible in which date to use.
UPDATE (06/08/2007): Alright, another new version, v1.2. This time round I've added a SectionHumanDate control - see about for explanation.