Binary Clock in ECMA/JS
The binary-clock was probably reinvented many times, but this version has some new features, like additional date information (DMY, MDY), 24, am/pm switch and setting of visual apperance 01, graphical or both.
Decimal to Binary and Backwards
At first it's not bad to know how to convert decimals in binary numbers and backwards.
decimal to binary:
You have to calculate the remainder of 2 (it's always 0 or 1) of a certain decimal, the calculation continues until >0. The appended 01 results from bottom to top is the binary number.
binary to decimal:
Fill the table of each time unit (binary) from right to left.
For the backward conversion you have to look at each position in the table that contains an 1 and add with the powers of 2 numbers like shown in the first row. You can ignore the zeroes because everything multiplied with 0 is 0.
Simplified MVC
It's a kind of simplified "MVC".
Model(s): Conversion from decimal to binary, Clock that returns time and date in certain format
View: Every visual feedback is returned to the Document Object Model (DOM)
Controller: User interacts with app, the model delivers the desired result and finally to the view.
BinaryTable
The set of the unicodes describes the exponents for the powers of 2.
The binary table consists the powers of 2 description (first row), decimals for time units - h,m,s,d,m,y (first column), and the binary number per time unit.
Clock Unit
The class provides the output of time and date in Dateformats (GB, US) .
Each timeunit has 2 digits, 4 digits eg. for year would result a too long binary number.
Controller
Creates a new instance of clock and calls the timeDate method every second with the view. The output of the model is the argument for the view and visuals.
View
The view transmits to the DOM and returns the visual feedback as HTML. Some elements can be enabled or disabled (invisible), dependent on the settings of the checkboxes
The Finished App
I created a new repository on github follow this link:
https://github.com/RSTeam02/Binary-Clock
Small update:
the 2^6 column is only used when the year is greater equals 64, so it will be added between 64 and 99.