The Colour Clock • Hacker News Board

Re: The Colour Clock

#11

Post by thristian » Fri, Feb 25, 2011, 7:28 AM UTC

dshankar wrote: post #8

Simple & beautiful. Small criticism: Why Flash?

It should be simple enough to implement in HTML - it looks like it's just doing (seconds since midnight × 16777215 / 86400), converting to hex and using that as a colour. Toggling between "clock" and "colour" mode would be a bit more difficult, but doable.

Anyone feeling up to the challenge?

Re: The Colour Clock

#12

Post by kemayo » Fri, Feb 25, 2011, 7:28 AM UTC

dshankar wrote: post #8

Simple & beautiful. Small criticism: Why Flash?

That "full screen" button in the top-right.

Or, at least, that's the only thing I see there that you can't do with HTML/JS.

Re: The Colour Clock

#13

Post by wladimir » Fri, Feb 25, 2011, 7:30 AM UTC

th wrote: post #9

The hex clock seems to jump every once in a while, probably compensating for the large difference in the number of hexadecimal color values and seconds in a 24 hour day. How are the color values related to the seconds here?

As I understand: hours are red, minutes are green, seconds are blue. Simply formulated as HTML color #HHMMSS (and with each component scaled appropriately to 00..FF so that 00:00:00 is #000000, 23:59:59 is #FFFFFF)

Re: The Colour Clock

#14

Post by kevinburke » Fri, Feb 25, 2011, 7:33 AM UTC

I still like the Polar Clock best... http://blog.pixelbreaker.com/polarclock

Re: The Colour Clock

#15

Post by naz » Fri, Feb 25, 2011, 7:36 AM UTC

Awesome idea. I took some time to rewrite in HTML5: http://brisy.info/colors/

Though the colours I'm getting are different. I wonder why.

Re: The Colour Clock

#16

Post by joshes » Fri, Feb 25, 2011, 7:39 AM UTC

I wonder how well the color blind can detect second to second changes in hue? Not a complaint, just a genuine curiosity.

Any color blind out there care to comment?

Re: The Colour Clock

#17

Post by naz » Fri, Feb 25, 2011, 7:39 AM UTC

thristian wrote: post #11

dshankar wrote: post #8

Simple & beautiful. Small criticism: Why Flash?

It should be simple enough to implement in HTML - it looks like it's just doing (seconds since midnight × 16777215 / 86400), converting to hex and using that as a colour. Toggling between "clock" and "colour" mode would be a bit more difficult, but doable. Anyone feeling up to the challenge?

Here's my attempt: http://brisy.info/colors It treats each section of the time as a hex pair, see colors.js for implementation.

edit: Hours corrected. Thanks wladimir

Re: The Colour Clock

#18

Post by wladimir » Fri, Feb 25, 2011, 7:41 AM UTC

naz wrote: post #17

thristian wrote: post #11

Earlier quoted context omitted.

It should be simple enough to implement in HTML - it looks like it's just doing (seconds since midnight × 16777215 / 86400), converting to hex and using that as a colour. Toggling between "clock" and "colour" mode would be a bit more difficult, but doable. Anyone feeling up to the challenge?

Here's my attempt: http://brisy.info/colors It treats each section of the time as a hex pair, see colors.js for implementation. edit: Hours corrected. Thanks wladimir

Nice! One small correction: ((h / 60) * 255) should be ((h / 24) * 255) probably

Re: The Colour Clock

#19

Post by leot » Fri, Feb 25, 2011, 7:43 AM UTC

naz wrote: post #15

Awesome idea. I took some time to rewrite in HTML5: http://brisy.info/colors/ Though the colours I'm getting are different. I wonder why.

... perhaps because it should be h / 24 instead of h / 60 ?

  body.animate({"background-color":
                 "rgb(" + parseInt((h / 60) * 255) + "," +
                      parseInt((m / 60) * 255) + "," +
                      parseInt((s / 60) * 255) + ")"});

Re: The Colour Clock

#20

Post by naz » Fri, Feb 25, 2011, 7:43 AM UTC

leot wrote: post #19

naz wrote: post #15

Awesome idea. I took some time to rewrite in HTML5: http://brisy.info/colors/ Though the colours I'm getting are different. I wonder why.

... perhaps because it should be h / 24 instead of h / 60 ? body.animate({"background-color": "rgb(" + parseInt((h / 60) * 255) + "," + parseInt((m / 60) * 255) + "," + parseInt((s / 60) * 255) + ")"});

Yes, just corrected this thanks.