Binary clocks are a family of ubiquitous geek toys which display each digit of the time using binary notation. If you do a search for "binary clock" in Google, you will see a nearly infinite number of implementations. The reason I like the whole genre is that a binary clock is an electronic system that claims to exist for the purpose of conveying information when in fact it's all about finding an obtuse excuse to make something blink. The delight of it is that it's completely impractical to read but the geeks don't care: the coolness of the blinky lights joyfully trumps any need to be practical.
Speaking of geeks, I've been wanting to look into this whole Angular.js framework thingy all those overly bearded tech-hipsters are talking about (when they are not crafting their own cheese or riding fixed wheeled bikes), and so I'm using this blog post as an excuse to program simple apps that illustrate the process I am talking about using Angular.
Displaying numbers in binary
You can see below how to calculate the value a binary number. It's pretty straight forward: a particular place can only be 0 or 1 and once you increment above that, you loop back to 0, add one onto the digit to the left, and if THAT one is already 1, it also loops back to 0 and the behavior ripples leftward.
| binary number | {{get8()}} | {{get4()}} | {{get2()}} | {{get1()}} | |||||
| x | x | x | x | ||||||
| place | 8 | 4 | 2 | 1 | |||||
| = | = | = | = | ||||||
| total | {{8*get8()}} | + | {{4*get4()}} | + | {{2*get2()}} | + | {{1*get1()}} | = | {{count}} |
Notice that the highest number we can represent a maximum of 16 values with 4 b(inary dig)its. 8 bits can represent 256, 10 bits, 1024, and so on...
Displaying the time in binary
| {{d}} |
From math to art
Not comfortable with numbers? Replace the 1's with teale and the 0's with burn sienna, on a background of deep emerald. Bam! Suddenly, you've become an artist, conjuring a playful visual dance of colors on an abstract rhythmic canvas. You're a fucking genius!
| {{d}} |
(Note that since the highest number for the hours is 23, the first column never has to go above 2 and we really only need the bottom two places to represent that number. Similarly, the value of minutes and seconds only goes to 59 so the third and fifth columns only to represent the value 5, which can be done with only 3 bits.)
What's next?
Stay tuned... Part 2 describes how to build your very own binary clock, using LED's, chips, electricity, obsession, and patience.