Back in September 2000, I went to a parent teacher conference and clearly remember the teacher describing a math game she was playing with the children called “The Factors Game”. This game was a two player, paper based game where one player would choose a number, receiving those points but giving away all the factors of that number. Such a simple concept, and it got me thinking, “I can do that in JavaScript!” So, that night, I stayed up till 4am writing version 1.0 and was VERY proud to show off the result.
Fast forward 13 years. I hadn’t written much JavaScript in the mean time since I’d worked mostly as a manager of web development and mobile UX teams, but began dusting off my skills by necessity because I was starting my own business which required I develop once again. I’m extremely impressed with the jQuery framework, so in Feb 2013 as a learning aid I thought I’d rewrite the factors game again using jQuery, version 2.0. This time, I felt I was a lot smarter. In version 1.0, I didn’t write an algorithm to calculate whether x was a factor of y, but instead kept track via numerous arrays (Yuck!). And writing DHTML was quite involved and prone to cross-browser issues back in 2000, so I didn’t even bother (and probably didn’t even know how at the time).
Now, it’s Sept 2013. I’m preparing to write a cross-platform mobile app for FrogQuest using the Titanium framework. This framework exposes a JavaScript API then builds native Android and iOS apps from a common codebase. In reading up on how to go about this, they encouraged such best practices as not polluting the global namespace, which is not a best practice I employed in version 2.0. I didn’t know any better. I thought I was being pretty smart by using separate functions. I figured I had better study up, so I began working through John Resig’s book titled “Secrets of the JavaScript Ninja”. This book is amazing! It takes an intermediate JavaScript programmer and exposes him/her to advanced techniques, stepping through them systematically one-by-one starting with the function. This was just what I needed, and I was awestruck!
Finally, just 7 months after having rewritten version 2.0 of the Factors Game, I set about rewriting it yet again. Tonight, version 3.0 is complete (at least to the extent I feel is beneficial)
- Board is a single size (30)
- Pollutes the global namespace
- Does no math, using various explicitly defined arrays to keep track of which factors have been played, what the factors are of each number, and of image states.
- Graphical interface is in a table-based layout, with lots of bevels (it looks ugly now, but was consistent with design trends of the day! Seriously! Completely falls apart in today’s browsers)
- Board size is variable
- Pollutes the global namespace
- Factors are calculated by an algorithm
- Table based design
- Animations help to indicate which user’s turn it is
- Written in jQuery
- Board size is variable
- Does NOT pollute the global namespace
- Improved animations communicate which numbers were given away
- Log file describes the actions of each turn
- Mixture of JavaScript and jQuery used
- Advanced techniques used
There’s clearly still improvements that can be made, but I’m happy with my progress. It’s been a great exercise to rewrite the same application, adding features as your skills improve. Let me know what you think!