What time is it?

Question

I really hate looking up to the top right of the screen to look at the time on OS X's clock widget; I'd much rather keep my eyes at least somewhere near my workspace to check the time. I also hate other people using my clock to check the time as they walk by -- after all, it's called a personal computer, right? But we've got a great community here that can surely help me out, right? So here's my really really so much very hard challenge for you guys that would help me so much: write me a clock app. It can be analog or digital or whatever other amazing forms you can think of. Minimum requirements:

• It should be very visible
• It should display the time in a format that not many people would comprehend (the less people, the better)

This is a popularity contest, so fulfill these requirements creatively, and go above and beyond! Ready... Set... Go!

Answer 1

Bash

#!/bin/bash

T="The time is now:"

case $1 in
--12)    F=82;M=0;S=%r;;
--24)    F=120;M=100;S=%R;;
--ipv6)  F=112;M=0;S=%H::%M:%S;T="Started download from:";;
--posix) F=82;M=0;S=%s;;
esac

watch 'notify-send "'"$T"'" "<div style=\"font-size:'"$F"'px;margin-left:'"$M"'px;\">
    $(date +'"$S"')</div>"'

Displays the current time as a desktop notification, updating every two seconds.

Usage

whattimeisit FORMAT

--12     May be understood by Australians, Chinese and North Americans.
--24     May be understood by everyone else.
--ipv6   May be understood by illiterates.
--posix  May be understood by nerds.

Example output

Answer 2

Javascript

This encodes the hours, minutes, and seconds, as hex, and sets the background color of the page to the concatenation of the string. For example, for the time 9:18:13 PM, the background color would be set to #15120D. It is right on a webpage for you, all you have to do is drag a little bit of the window to a different place on the screen or flip tabs. Here is a JSFiddle demo.

To tell the time, you can use your handy color-picking and base changing skills.

function hex(number) {
    return number.toString(16).length == 1 ? "0" + number.toString(16): number.toString(16);
}
var display = function() {

    var now = new Date();
    var base = "00"
    var hours = hex(now.getHours());   
    var minutes = hex(now.getMinutes());
    var seconds = hex(now.getSeconds());
    document.body.style.background = "#" + hours + minutes + seconds;
    console.log("#" + hours + minutes + seconds)
}

setInterval(display, 1000);

Answer 3

HTML + CSS + JavaScript

I made a binary clock, pretty self-explanatory. I have a binary watch and even those who know what binary numbers are may have a hard time telling what time it is sometimes. Like scrblnrd3 said in his answer, all you have to do is position your browser window properly to make it visible. Here's a fiddle of clock in action.

P.S.: The hour part has 5 positions in order to support 24 hour format.

JavaScript

function pad(number, digits) {
    return Array(Math.max(digits - String(number).length + 1, 0)).join(0) + number;
}

var updateClock = function() {
    var date = new Date();

    var childDivs = [
        document.getElementsByClassName('hours')[0].children,
        document.getElementsByClassName('minutes')[0].children,
        document.getElementsByClassName('seconds')[0].children
    ];

    var binaryTime = [
        pad(date.getHours().toString(2), 5),   
        pad(date.getMinutes().toString(2), 6),
        pad(date.getSeconds().toString(2), 6)        
    ];    

    for(i=0; i < childDivs.length; i++) { 
        for(j=0; j < childDivs[i].length; j++) {
            childDivs[i][j].className = binaryTime[i][j] == '1' ? 'highlight' : '';
        }
     }    
}

setInterval(updateClock, 1000);

CSS

.wrapper div {
    width: 30px;
    height: 30px;
    border-radius: 50px; 
    border: 1px solid black;
    display: inline-block;
    margin: auto;
}

.highlight {
    background-color: green;   
}

HTML

<div class="wrapper hours">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div class="wrapper minutes">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div class="wrapper seconds">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>

Answer 4

C

I have been finding it annoying, that though computers can easily keep time with an accuracy of a few ms by using NTP, some software displaying time haven't bothered with updating it at the right time. For example if you display time with hours and minutes by simply displaying the time and then sleep for 60 seconds in a loop, the displayed clock will on average be 30 seconds behind.

Here is my suggestion on how to implement a highly accurate clock (which displays time as seconds since midnight GMT in octal).

#include <stdio.h>
#include <time.h>
#include <sys/time.h>

int main()
{
  struct timeval tv;
  struct timespec ts;
  while (1) {
    do {
      gettimeofday(&tv,NULL);
    } while ((ts.tv_nsec=((999999-tv.tv_usec)*1000)-1)<1);
    printf("\x0d%lo    ", tv.tv_sec%86400);
    fflush(stdout);
    ts.tv_sec=0;
    nanosleep(&ts,NULL);
  }
}

Replace the printf with s=ctime(&tv.tv_sec); c=strchr(s,'\n'); if (c) *c=0; printf("\x0d%s ",s); if you want human readable output.

Answer 5

Javascript

This is an ASCII clock with A=0.

<body onload="tick()">
    <p id="p">0</p>
    <script>        
        function tick() {
            console.log("tick");
            var a = "A";
            var i = a.charCodeAt(0);
            var dt = new Date();
            var h = String.fromCharCode(i+dt.getHours());
            var m = String.fromCharCode(i+dt.getMinutes());
            var s = String.fromCharCode(i+dt.getSeconds());
            var t = h+":"+m+":"+s;
            document.getElementById("p").innerHTML = t;
            setTimeout('tick()',1000);
        }
    </script>
</body>