# Clock Quiz

Here is a quick sunday quiz. Create some kind of clock with as little code as possible. Even just a textfield and the date object would cut it, but preferably try to do something a little more interesting. Post your results in the comments. I’ll post my version on monday EOD.

[EDIT: my clock can be found here which I'll count as tomorrows post]

The last clock post I did was about the 24 hour clock have a look at that here.

1. Posted March 14, 2010 at 11:39 am | Permalink

not as quick (or legible) as a textfield + date, but interesting…

var r:Rectangle = new Rectangle(0, 0, 0, 4);

var c:Bitmap = new Bitmap(new BitmapData(100, 12, false, 0));

c.bitmapData.fillRect(c.bitmapData.rect, 0);
var d:Date = new Date();
r.y = 0;
r.width = 100 * d.hours / 23;
c.bitmapData.fillRect(r, 0xFF0000);
r.y = 4;
r.width = 100 * d.minutes / 59;
c.bitmapData.fillRect(r, 0xFF00);
r.y = 8;
r.width = 100 * d.seconds / 59;
c.bitmapData.fillRect(r, 0xFF);
});

2. Posted March 14, 2010 at 1:12 pm | Permalink

Very cool Devon

3. Kishi
Posted March 14, 2010 at 4:34 pm | Permalink

This is gonna be messy..

[code]
package {
import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.display.Sprite;

import flash.geom.ColorTransform;
import flash.geom.Rectangle;
import flash.geom.Point;

import flash.events.Event;

[SWF(width="532",height="96")]
public class FlashTest extends Sprite {
private var bitmapData:BitmapData;
private var point:Point = new Point();

private static var data:Array;
{
(function():void{
data = [];

var charData:Array = []; charData[48] = [62,69,73,81,62];
charData[49] = [33,127,1]; charData[50] = [33,67,69,73,49];
charData[51] = [66,65,81,105,70]; charData[52] = [12,20,36,127,4];
charData[53] = [114,81,81,81,78]; charData[54] = [30,41,73,73,6];
charData[55] = [64,71,72,80,96]; charData[56] = [54,73,73,73,54];
charData[57] = [48,73,73,74,60]; charData[58] = [20];
charData[65] = [63,68,68,68,63]; charData[80] = [127,72,72,72,48];
charData[77] = [127,32,24,32,127]; charData[32] = [0];

var rect:Rectangle = new Rectangle(0, 0, 10, 10);

for (var char:String in charData) {
var columns:Array = charData[char];
var bmd:BitmapData = new BitmapData(columns.length*10+columns.length-1, 76, true, 0×00000000);

bmd.lock();
rect.x = 0;
for (var i:uint = 0; i < columns.length; i++, rect.x += 11) {
rect.y = 0;
for (var k:uint = 0; k > k))
bmd.fillRect(rect, 0xFF00DD00);
}
}
bmd.unlock();

data[char] = bmd;
}
})();
}

public function FlashTest() {
this.bitmapData = new BitmapData(this.stage.stageWidth, this.stage.stageHeight, false, 0xFF000000);

}

private function enterFrame(e:Event):void {
var time:String = new Date().toLocaleTimeString();
this.point.x = this.point.y = 10;

this.bitmapData.lock();
this.bitmapData.colorTransform(this.bitmapData.rect, new ColorTransform(0, 0, 0, .95, 0×80, 0×30, 0×00));
for (var i:uint = 0; i < time.length; i++) {;
var src:BitmapData = data[time.charCodeAt(i)];
this.bitmapData.copyPixels(src, src.rect, point, null, null, true);
point.x += src.rect.width + 5;
}
this.bitmapData.unlock();
}
}
}
[/code]

Oh, it’s actually gigantic. Bleh.

4. Posted March 14, 2010 at 6:33 pm | Permalink

That is very cool…. You should post it over at wonderfl.net and post a link. I may do that if I jump on wonderfl in the next day or so so that other people can see what you did.

5. Posted March 14, 2010 at 6:47 pm | Permalink

package {
import flash.display.Sprite;
import flash.events.Event;
import flash.utils.getTimer;
[SWF (width=465, height=465)]
public class Clock extends Sprite {
public function Clock () {
super (); x = y = 465/2;
var d:Date = new Date;
var s:Number = -(Math.PI + d.getSeconds () * 2 * Math.PI / 60);
var m:Number = -(Math.PI + d.getMinutes () * 2 * Math.PI / 60);
var h:Number = -(Math.PI + d.getHours () * 2 * Math.PI / 12);
graphics.clear (); graphics.lineStyle (2);
graphics.lineTo (200 * Math.sin (s), 200 * Math.cos (s)); graphics.moveTo (0, 0);
graphics.lineTo (150 * Math.sin (m), 150 * Math.cos (m)); graphics.moveTo (0, 0);
graphics.lineTo (100 * Math.sin (h), 100 * Math.cos (h));
});
}
}
}

6. Posted March 14, 2010 at 6:55 pm | Permalink

got rid of that -(Math.PI+ nonsense [url=http://wonderfl.net/code/d2a386fbb4d8803fc108df2f055fa0aa27ad0d51]here[/url]

7. Posted March 14, 2010 at 6:56 pm | Permalink

awww no bbcode

8. Posted March 14, 2010 at 7:23 pm | Permalink

very cool makc3d

9. Kishi
Posted March 14, 2010 at 8:50 pm | Permalink

I’ve posted it to wonderfl. (:
I guess I didn’t use a ‘wonderfl-compatible’ aspect ratio though. The lower “pixels” stuck together. Not a big deal.

http://wonderfl.net/code/bdc8a0b4983553de10db12d7be2d12b8dc0bbef4

10. Posted March 14, 2010 at 10:30 pm | Permalink

I took “as little code as possible” literally and came up with a 150 byte version:

package{import flash.display.*;import flash.text.*;public class C extends Sprite{function C(){var t = new TextField;t.text=”"+new Date;addChild(t)}}}

It has two drawbacks: you get a compiler warning for not typing the TextField variable and you can’t see all of the Date string without scrolling due to TextField defaulting to a rather narrow width.

11. Posted March 15, 2010 at 1:33 am | Permalink

@Jackson it also does not update

12. Posted March 15, 2010 at 2:40 am | Permalink

I don’t post code, but I have a question, is it better to put the code in EnterFrame, or in a Timer ? I guess the 2nd choice is less “computer consuming” ?

13. Posted March 15, 2010 at 6:24 am | Permalink

@jackson nicely done

14. Posted March 15, 2010 at 9:58 am | Permalink

15. Toby
Posted March 15, 2010 at 10:18 am | Permalink

Hmmm…

function enter(e:Event):void {
var g:Graphics=graphics;
var d:Date = new Date();
var b,i,j,k:int;
var a,t:Array;
b=0;

a=[[59,d.seconds],[59,d.minutes],[23,d.hours]];
while (a.length) {
t=a.shift();
i=t[0];
k=t[1];
j=0;
while (j=k ? 0xCCCCCC:0);
g.drawRect(j+(j*(600-i)/i), b, (600-i)/i, 16);
j++;
}
b+=17;
}
}

16. Toby
Posted March 15, 2010 at 11:22 am | Permalink

Hmmm… too stupid to copy and paste from my editor. Here goes again:

function enter(e:Event):void {
var g:Graphics=graphics;
var d:Date = new Date();
var b,i,j,k:int;
var w:Number;
var a,t:Array;
b=0;

a=[[60,d.seconds],[60,d.minutes],[24,d.hours]];
g.clear();
while (a.length) {
t=a.shift();
i=t[0];
k=t[1];
j=0;

while (jk ? 0xdddddd:0);
g.drawCircle(250+(200-b)*Math.sin(w), 250+(200-b)*Math.cos(w), 8);
j++;
}
b+=30;
}
}

=====

And a variation:

function enter(e:Event):void {
var g:Graphics=graphics;
var d:Date = new Date();
var b,i,j,k:int;
var w:Number;
var a,t:Array;
b=0;

a=[[60,d.seconds],[60,d.minutes],[24,d.hours]];
g.clear();
while (a.length) {
t=a.shift();
i=t[0];
k=t[1];
j=0;

while (jk ? 0xdddddd:0);
g.drawCircle(250+(200-b)*Math.sin(w), 250+(200-b)*Math.cos(w), 8);
j++;
}
b+=30;
}
}

17. Kishi
Posted March 15, 2010 at 12:41 pm | Permalink

Oh, we could go that way, lol.

setInterval is kinda shorter:

18. Posted March 15, 2010 at 5:56 pm | Permalink

@makc3d - Sure it does. Hit refresh.

19. Posted March 16, 2010 at 8:08 am | Permalink

really nice snippets here …. didn’t expect so many.