Skip to content

Instantly share code, notes, and snippets.

@tyrcho
Forked from imehr/fiddle.css
Last active July 3, 2016 20:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tyrcho/e36b39b8c2a0c1bdaf8810dc4ab1dae1 to your computer and use it in GitHub Desktop.
Save tyrcho/e36b39b8c2a0c1bdaf8810dc4ab1dae1 to your computer and use it in GitHub Desktop.
<input type="submit" onClick="plusOne()" value="+1"/>
<input type="submit" onClick="minusOne()" value="-1"/>
<input type="submit" onClick="reset()" value="reset"/>
<table width="200" border="0" align="center">
<tbody style="display:flex"><tr>
<td><img src="on.png" name="C1" width="50" height="50" id="C1" alt=""></td>
<td><img src="on.png" name="C2" width="50" height="50" id="C2" alt=""></td>
<td><img src="on.png" name="C3" width="50" height="50" id="C3" alt=""></td>
<td><img src="off.png" name="C4" width="50" height="50" id="C4" alt=""></td>
</tr>
<tr>
<td><img src="off.png" name="C5" width="50" height="50" id="C5" alt=""></td>
<td><img src="on.png" name="C6" width="50" height="50" id="C6" alt=""></td>
<td><img src="on.png" name="C7" width="50" height="50" id="C7" alt=""></td>
<td><img src="off.png" name="C8" width="50" height="50" id="C8" alt=""></td>
</tr>
<tr>
<td><img src="on.png" name="C9" width="50" height="50" id="C9" alt=""></td>
<td><img src="off.png" name="C10" width="50" height="50" id="C10" alt=""></td>
<td><img src="off.png" name="C11" width="50" height="50" id="C11" alt=""></td>
<td><img src="off.png" name="C12" width="50" height="50" id="C12" alt=""></td>
</tr>
<tr>
<td><img src="off.png" name="C13" width="50" height="50" id="C13" alt=""></td>
<td><img src="off.png" name="C14" width="50" height="50" id="C14" alt=""></td>
<td><img src="on.png" name="C15" width="50" height="50" id="C15" alt=""></td>
<td><img src="on.png" name="C16" width="50" height="50" id="C16" alt=""></td>
</tr>
</tbody></table>
<script language="javascript"> reset();</script>
function updateClock() {
setTimeout("binaryize()", 82);
}
function binaryize() {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
var milli = now.getMilliseconds();
var fract = hours / 24 + minutes / 1440 + seconds / 86400 + milli / 86400000;
display(fract);
updateClock();
}
var num=0;
function plusOne() {
num ++;
display(num);
}
function minusOne() {
num --;
display(num);
}
function reset() {
num =0;
display(num);
}
function display(n) {
var number=n;
with(Math) {
for (i = 16; i >= 1; i--) {
var p=16-i;
var j = number%2;
var img = document.getElementById("C" + i);
if (j > 0) {
img.src = 'http://www.abulsme.com/binarytime/on.png';
} else {
img.src = 'http://www.abulsme.com/binarytime/off.png';
}
number = floor(number/2);
}
}
}
name: Binary counting demo
description: jsFiddle demo hosted on Gist
authors:
- Michel Daviot
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment