# Digital Clock

**URL:** <https://forum.kirupa.com/t/digital-clock/1927>\
**Category:** flash\
**Created:** [April 21, 2002, 3:35am UTC](https://forum.kirupa.com/t/digital-clock/1927 "2002-04-21T03:35:06Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [April 21, 2002, 3:35am UTC](https://forum.kirupa.com/t/digital-clock/1927/1 "2002-04-21T03:35:06Z")

</div>

Here’s an example of a digital clock where the time is actually drawn on a movie clip using the lineTo() method. Sorry I have to only post a reference, but here’s the link:

[www.interintuit.com/DigClockMX.asp](http://www.interintuit.com/DigClockMX.asp) (swf)

and

[www.interintuit.com/DigClockMX.fla](http://www.interintuit.com/DigClockMX.fla) (Source)

Basically, the code is on one frame – so I’ll copy and paste here. I did this “off the cuff,” so I realize that the code could be streamlined significantly, but figured I’d post anyway.

– Shannon

* * *

var columns = new Array(100,125,150,175,200,225,250,275,300,325,350)//xOffsets for upper right corners of each column (34 points for number, 18 for colons)  
var yOffset = 100; //the y coord of top right of clock  
\_root.createEmptyMovieClip( “clock”, 1 );  
\_root.clock.lineStyle( 2, 0x00ff00, 100 );

function make1 (xOffset) {  
&nbsp &nbsp &nbsp &nbsp with (\_root.clock) {  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo(xOffset-24,yOffset+3)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo(xOffset-24,yOffset+13)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp  
&nbsp &nbsp &nbsp &nbsp }  
}  
function make2 (xOffset) {  
&nbsp &nbsp &nbsp &nbsp with (\_root.clock) {  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo (xOffset-22,yOffset)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo (xOffset-12,yOffset)  
&nbsp &nbsp &nbsp &nbsp }  
}  
function make3 (xOffset){  
&nbsp &nbsp &nbsp &nbsp with (\_root.clock){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo(xOffset-10,yOffset+2)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo(xOffset-10,yOffset+12)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp  
&nbsp &nbsp &nbsp &nbsp }  
}  
function make4 (xOffset) {  
&nbsp &nbsp &nbsp &nbsp with (\_root.clock) {  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo (xOffset-22,yOffset+13)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo (xOffset-12,yOffset+13)  
&nbsp &nbsp &nbsp &nbsp }  
}  
function make5 (xOffset) {  
&nbsp &nbsp &nbsp &nbsp with (\_root.clock){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo(xOffset-25,yOffset+15)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo(xOffset-25,yOffset+25)  
&nbsp &nbsp &nbsp &nbsp }  
}  
function make6 (xOffset){  
&nbsp &nbsp &nbsp &nbsp with ( \_root.clock ) {  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo(xOffset-10,yOffset+16)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo(xOffset-10,yOffset+26)  
&nbsp &nbsp &nbsp &nbsp }  
}  
function make7 (xOffset){  
&nbsp &nbsp &nbsp &nbsp with(\_root.clock){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo (xOffset-22,yOffset+27)  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo (xOffset-12,yOffset+27)  
&nbsp &nbsp &nbsp &nbsp }  
}  
function drawNum(num,col){  
&nbsp &nbsp &nbsp &nbsp start = columns[col];  
&nbsp &nbsp &nbsp &nbsp if(num==0){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make1(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make5(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make7(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==1){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==2){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make5(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make7(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==3){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make7(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==4){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make1(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==5){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make1(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make7(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==6){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make1(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make5(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make7(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==7){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==:cool: {  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make1(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make5(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make7(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
&nbsp &nbsp &nbsp &nbsp if(num==9){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make1(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make2(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make3(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make4(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp make6(start);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp return true;  
&nbsp &nbsp &nbsp &nbsp }  
}  
function drawColon(place){  
&nbsp &nbsp &nbsp &nbsp xO = columns[place];  
&nbsp &nbsp &nbsp &nbsp with(\_root.clock){  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo(xO-15,yOffset+10);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo(xO-15,yOffset+13);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp moveTo(xO-15,yOffset+23);  
&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp lineTo(xO-15,yOffset+26);  
&nbsp &nbsp &nbsp &nbsp }  
}

var now = new Date();  
hours = now.getHours().toString();  
if (hours.length\<2){  
&nbsp &nbsp &nbsp &nbsp h1 = 0;  
&nbsp &nbsp &nbsp &nbsp h2 = hours.charAt(0);  
}else{  
&nbsp &nbsp &nbsp &nbsp h1 = hours.charAt(0);  
&nbsp &nbsp &nbsp &nbsp h2 = hours.charAt(1);  
}  
drawNum(h1,0);  
drawNum(h2,1);  
drawColon(2);  
minutes = now.getMinutes().toString()  
if (minutes.length\<2){  
&nbsp &nbsp &nbsp &nbsp m1 = 0;  
&nbsp &nbsp &nbsp &nbsp m2 = minutes.charAt(0);  
}else{  
&nbsp &nbsp &nbsp &nbsp m1 = minutes.charAt(0);  
&nbsp &nbsp &nbsp &nbsp m2 = minutes.charAt(1);  
}  
drawNum(m1,3);  
drawNum(m2,4);  
drawColon(5);  
seconds = now.getSeconds().toString()  
if (seconds.length\<2){  
&nbsp &nbsp &nbsp &nbsp s1 = 0;  
&nbsp &nbsp &nbsp &nbsp s2 = seconds.charAt(0);  
}else{  
&nbsp &nbsp &nbsp &nbsp s1 = seconds.charAt(0);  
&nbsp &nbsp &nbsp &nbsp s2 = seconds.charAt(1);  
}  
drawNum(s1,6);  
drawNum(s2,7);  
drawColon(:cool: ;  
mseconds = now.getMilliseconds().toString()  
if (mseconds.length\<2){  
&nbsp &nbsp &nbsp &nbsp ms1 = 0;  
&nbsp &nbsp &nbsp &nbsp ms2 = mseconds.charAt(0);  
}else{  
&nbsp &nbsp &nbsp &nbsp ms1 = mseconds.charAt(0);  
&nbsp &nbsp &nbsp &nbsp ms2 = mseconds.charAt(1);  
}  
drawNum(ms1,9);  
drawNum(ms2,10);

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [April 21, 2002, 3:38am UTC](https://forum.kirupa.com/t/digital-clock/1927/2 "2002-04-21T03:38:19Z")

</div>

S$(T!!!

I meant to post this as a reply to the “digital clock” thread by timhlu.

Sorry, all – I’ll get this @#%$ web-based message board thing down one of these days, I promise!!!

Shannon

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [April 21, 2002, 3:44am UTC](https://forum.kirupa.com/t/digital-clock/1927/3 "2002-04-21T03:44:17Z")

</div>

Oh, and of course, to make it a 12-hour clock, replace the

hours = now.getHours().toString();

line with:

hours = now.getHours();  
if(hours\>12){hours-=12};  
hours = hours.toString();

- 

Shannon

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [April 21, 2002, 1:55pm UTC](https://forum.kirupa.com/t/digital-clock/1927/4 "2002-04-21T13:55:58Z")

</div>

that’s too much code. by using (multi-dimensional) arrays you could have one function, no conditional, and many less lines of code.  
🙂  
jeremy

p.s. i will write up a sample file if there is enough demand.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [April 21, 2002, 3:59pm UTC](https://forum.kirupa.com/t/digital-clock/1927/5 "2002-04-21T15:59:56Z")

</div>

TOTALLY too much code – I agree!!! about 1/2 way through, I realized that it could be done with one moveTo/lineTo function and the various coordinates in an array, but I wasn’t going to restart for an example. As Sin said (and I mentioned in the first post), the code could be streamlined significantly.

Shannon