6 ms·
Awesome idea. I took some time to rewrite in HTML5: http://brisy.info/colors/ http://brisy.info/colors/ Though the colours I'm getting are different. I wonder
by naz 16y ago
Awesome idea. I took some time to rewrite in HTML5: http://brisy.info/colors/ http://brisy.info/colors/
Though the colours I'm getting are different. I wonder why.
- leot 16y ago... 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) + ")"});
- naz 16y agoYes, just corrected this thanks.
- bkrausz 16y agoHaha, I just did the same thing: http://nerdlife.net/colorclock.html http://nerdlife.net/colorclock.html
- naz 16y agoGreat minds and all. If you replace the html file in the screensaver bundle you can use yours (or mine) instead of the flash one.
- ars 16y agoSmall bug: Single digit hex codes are showing without the leading zero - it's probably affecting the colors as well.
- bkrausz 16y agoFixed, thanks.
- deleted 16y ago[deleted]
- kaichanvong 16y agoGuys, get these on github. That way we can fork it & make it awesome as a team faster and better.
- naz 16y agoHere: https://github.com/briancollins/color-clock https://github.com/briancollins/color-clock
- deleted 16y ago[deleted]
- deleted 16y ago[deleted]
- kaichanvong 16y agoJust sent you a pull request! Lets make this awesome.
- flog 16y agohttps://github.com/adamburmister/colour-clock https://github.com/adamburmister/colour-clock HTML5, CSS3, webfonts, and jQuery
- kaichanvong 16y agoSimilar pull request sent to you too! :)
- kemayo 16y agoBehind the curve here: https://github.com/kemayo/colorclock https://github.com/kemayo/colorclock
- light3 16y agoI'm on a P4 3Ghz at the moment, whereby I can hear my CPU buzzing away when its under load. On the .co.uk site the buzzing is audible, its taking >70% of the CPU, whereas on your site its nice and quiet taking just 6% of the CPU.
- ars 16y agoI can not figure out how such a simple program can manage to take up 100% of my CPU, and despite that not be in sync with my actual clock (it's a random fraction of a second off). Has he not heard of sleep(1) ? Saying "it's flash" is no excuse, flash is perfectly capable of sleeping.
- ZoFreX 16y agoUpdating a clock to display the correct time is actually difficult and involved, sleep(1) will not work! The problem reminds me of this Intel article on syncing video output [1] Basically, sleep(1) won't always align with clock updates, so sometimes a given time will display for more or less time than a second. This can be observed by opening the clock widget on Windows XP for example, it's very noticeable. I don't actually know a nice way to do it, maybe updating 10 times per second or so? [1] http://software.intel.com/en-us/articles/video-frame-display-synchronization/ http://software.intel.com/en-us/articles/video-frame-display... - it's down right now, one of the diagrams illustrates the problem well though: http://software.intel.com/file/3984 http://software.intel.com/file/3984
- nitrogen 16y agoOn POSIX systems, clock_nanosleep() can accept an absolute time argument. // In a real program one would probably not use time() // Also, some older pre-release versions of the realtime // kernel patches had the clock_nanosleep() and time() // clocks out of sync by 0.5s (IIRC) for(;;) { struct timespec after_epoch = { .tv_sec = time(NULL) + 1, .tv_nsec = 0 }; // Check for EINTR in a real program clock_nanosleep(CLOCK_REALTIME, TIMER_ABSTIME, &after_epoch, NULL); printf("Tick\n"); } http://pubs.opengroup.org/onlinepubs/009695399/functions/clock_nanosleep.html http://pubs.opengroup.org/onlinepubs/009695399/functions/clo... Unfortunately, this probably doesn't help with Flash or JavaScript clock demos.
- axomhacker 16y agoHonest question - what is the HTML5 part in here (as opposed to I rewrote it in HTML+CSS+JS)?
- kemayo 16y agoI appreciate the pointlessness of being yet-another recreator, but hey, why not: http://davidlynch.org/toys/colorclock/ http://davidlynch.org/toys/colorclock/ :D My quirk is that you can stick a fragment on the end to change the mapping of time to hex. e.g. http://davidlynch.org/toys/colorclock/#smh http://davidlynch.org/toys/colorclock/#smh is seconds=red, minutes=green, hours=blue.
- bruceboughton 16y agoIt'd be great if you could add the necessary meta tags to make this fullscreen when saved to home screen on a iOS device. No need for an icon -- iOS already frames the time nicely.
- kemayo 16y agoHeh, sure, why not? It now has apple-mobile-web-app-capable=yes.
- lkozma 16y agoHere's a version that cycles through the colors continuously (without jumps). Now the numbers do not directly corespond to the color code anymore (they alternate going up-down). Also you can multiply by 256, as the maximum is not reached for any of the values. I uploaded it here: http://lkozma.net/colorclock/ http://lkozma.net/colorclock/ d = t.getTime()/(1000 * 60 * 60 * 24), ... body.animate({"background-color": "rgb(" + (((d%2)==1) ? parseInt((h / 24) * 256) : (255-parseInt((h / 24) * 256))) + "," + (((h%2)==1) ? parseInt((m / 60) * 256) : (255-parseInt((m / 60) * 256))) + "," + (((m%2)==1) ? parseInt((s / 60) * 256) : (255-parseInt((s / 60) * 256))) + ")"}); };
- tunaslut 16y agocool....I hacked in some timezones - 4 clocks on the page - local, london, new york, tokyo...if I got my maths right that is: http://www.coloringout.com/colorclock http://www.coloringout.com/colorclock someone should make the timezones selectable :)
- flog 16y agoThis seemed like a fun idea: Here's my remix of it, a bit more HTML5-ish: http://labs.flog.co.nz/clock/ http://labs.flog.co.nz/clock/
- flog 16y agoAnd by HTML5 I mean HTML5+CSS3
- flog 16y agoAdded source to github at https://github.com/adamburmister/colour-clock https://github.com/adamburmister/colour-clock
- angus77 16y agoIt's a bit wonky when you use a variable-width font.
- flog 16y agoYeah. I moved to ems, thinking that would help, but it's still an issue. If you don't set a width then you get awkward spacing reflow when the digits change.
- pedrokost 16y agoI did something very similar some time ago: http://pedro.si/experiments/color-clock/ http://pedro.si/experiments/color-clock/ It's CSS3 and some Javascript.
- deleted 16y ago[deleted]
- mikepurvis 16y agoSince we're sharing our HTML5 clocks which peg the processor: http://sandbox.mikepurvis.com/js/clock/ http://sandbox.mikepurvis.com/js/clock/
- apgwoz 16y agomaybe they literally encode 9:27:40 as #092740 edit: definitely not, but I think there's a gradient overlay, which is causing the colors to appear brighter in the center.
- Semiapies 16y agoYour solution, unlike the Flash one, utterly fails to spike my CPU. That's a new one on me for things labelled "HTML5". :D
- deleted 16y ago[deleted]