Pro-Fish

The wonderful world of Chris Fisher

Pro-Fish CMS
JQuery Timer

JQuery Timer

JQuery JavaScript Azure

Not only was this my first project to feature JQuery but it was also the first time I'd ever used JavaScript in a meaningful way, as well as my first use of cookies AND my first site to use the excellent Windows Azure!

The goal was to create a simple web page that displays a continuously updating counter that tracks the number of times an event has occurred since arriving at the site. This was later expanded to use cookies to record the arrival time. Check the link in the top right if you want to see it in action

The project was inspired by the 'products chosen' counter on BicWorld.com; I'd been meaning to learn some JQuery for a while and it seemed like a perfect entry level challenge. Fortunatly, a friend of mine was more than happy to supply me with a statistic:

@ProFishChris 18.7 Spelunking sessions per day.

— Daniel Scales (@DanielCake) March 2, 2014

Cookie Handling

The amount of JQuery used is actually fairly minimal, so most of the learning time was spent getting to grips with JavaScript regulars such as document.onLoad, with some focus on how JQuery helps handle browser quirks. Handling JavaScript Date() objects proved to be fairly straight forward but I count myself lucky for coming across this post on Date() formats as it added much needed insight into the myriad of formats available.

Handling cookies took the largest amount of time on this project. This was partially down to trying to create flexible and reusable logic and partially down to a small but unforgiving error: cookie values are separated by '; ' not ';' (note the space!). An inordinate amount of time was spent trying to figure out why only the first properties added to cookieBatch could be queried due to this almost invisible character.

Quick and Easy

Ultimately this was a straight forward project that contained enough new elements to keep me entertained. I found JQuery pleasant to use and it contains a ton of useful functions for simplifying syntax and dealing with browser quirks. It was great to finally put cookies to good use and I'm pleased with having formulated a generic way in which to handle them. Be sure to check the links in the top right if you want to see the source code!