edit clock font - animaclock

animaclock.com | about | gallery | Graph-Based Visual Saliency
Click here for Tutorial
Edit the code below, then click anywhere outside of textarea to update:
var testfont=new function() {

this.digitPad = 4;
this.groupPad = 15;
this.heightFrac = 0.7;
this.widthFrac = 0.7;
this.secondsScale = {val:0.6, pos:'middle'};


this.bgColor = [60, 50, 80];
this.baseColor = [ 100, 100, 100 ];
this.partColor = { a:[ 250, 50, 250 ], b:[ 0, 200, 200 ]};
this.secondColor = this.bgColor;
this.colonColors = [ [200, 50, 200] , [0, 200, 200] ];

this.baseLineWidth = 7;
this.partLineWidth = 5;
this.colonRadius = 4;
this.beginAniTime = 0;
this.endAniTime = 1;

this.baseInFront = false;
this.pulsate = false;

this.disableSlowest = true;

this.sevenSegment = false;
this.strokes = [[[[145.5,126.48333740234375],[182.5,126.48333740234375],[207.5,125.48333740234375],[232.5,126.48333740234375]],[[144,249.23333740234375],[173,248.23333740234375],[196,249.23333740234375],[227,250.23333740234375]],[[158,124.23333740234375],[187.5,166.66666666666666],[187.5,208.33333333333331],[219,251.23333740234375]],[[158,125.23333740234375],[184,165.23333740234375],[193,209.23333740234375],[216,249.23333740234375]],[[221,125.23333740234375],[195,168.23333740234375],[177,211.23333740234375],[158,248.23333740234375]],[[158,124.23333740234375],[182,167.23333740234375],[193,208.23333740234375],[216,250.23333740234375]],[[218,126.23333740234375],[196,168.23333740234375],[175,208.23333740234375],[156,248.23333740234375]]],[[[147,126.23333740234375],[178,130.23333740234375],[198,129.23333740234375],[228,130.23333740234375]],[[148,246.23333740234375],[183,248.23333740234375],[200,247.23333740234375],[227,246.23333740234375]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]]],[[[146.75,122.73333740234375],[177.75,124.73333740234375],[199.75,124.73333740234375],[227.75,124.73333740234375]],[[147,251.23333740234375],[180,250.23333740234375],[200,252.23333740234375],[230,251.23333740234375]],[[174,125.73333740234375],[174,167.4000040690104],[174,209.06667073567706],[174,250.73333740234375]],[[204,123.73333740234375],[204,165.4000040690104],[204,207.06667073567706],[204,248.73333740234375]],[[174,124.73333740234375],[174,166.4000040690104],[174,208.06667073567706],[174,249.73333740234375]],[[204,124.73333740234375],[204,166.4000040690104],[204,208.06667073567706],[204,249.73333740234375]],[[174,123.73333740234375],[174,165.4000040690104],[174,207.06667073567706],[174,248.73333740234375]]],[[[147,127.23333740234375],[175,126.23333740234375],[202,128.23333740234375],[228,126.23333740234375]],[[147,249.23333740234375],[170,254.23333740234375],[207,247.23333740234375],[227,248.23333740234375]],[[162,125.73333740234375],[162,167.4000040690104],[162,209.06667073567706],[162,250.73333740234375]],[[211,124.73333740234375],[211,166.4000040690104],[211,208.06667073567706],[211,249.73333740234375]],[[187,124.73333740234375],[187,166.4000040690104],[187,208.06667073567706],[187,249.73333740234375]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]],[[187.5,125],[187.5,166.66666666666666],[187.5,208.33333333333331],[187.5,250]]],[[[146,126.23333740234375],[174,128.23333740234375],[202,126.23333740234375],[230,124.23333740234375]],[[149,249.23333740234375],[165,250.23333740234375],[210,248.23333740234375],[229,250.23333740234375]],[[161,126.73333740234375],[161,168.4000040690104],[161,210.06667073567706],[161,251.73333740234375]],[[166,126.23333740234375],[175,168.23333740234375],[181,210.23333740234375],[187.5,250]],[[216,124.23333740234375],[202,173.23333740234375],[195,208.23333740234375],[187.5,250]],[[217,122.23333740234375],[204,174.23333740234375],[192,214.23333740234375],[187.5,250]],[[218,122.23333740234375],[206,161.23333740234375],[192,213.23333740234375],[187.5,250]]],[[[146.5,126.48333740234375],[176.5,128.48333740234375],[196.5,127.48333740234375],[228.5,126.48333740234375]],[[148,251.23333740234375],[178,252.23333740234375],[200,250.23333740234375],[230,249.23333740234375]],[[159,129.23333740234375],[170,171.23333740234375],[175,211.23333740234375],[187.5,250]],[[212,126.23333740234375],[208,171.23333740234375],[203,210.23333740234375],[187.5,250]],[[213,124.23333740234375],[207,173.23333740234375],[201,223.23333740234375],[187.5,250]],[[212,128.23333740234375],[210,167.23333740234375],[201,219.23333740234375],[187.5,250]],[[213,125.23333740234375],[206,173.23333740234375],[201,213.23333740234375],[187.5,250]]],[[[147,124.23333740234375],[176,128.23333740234375],[199,127.23333740234375],[230,125.23333740234375]],[[151,250.23333740234375],[161,247.23333740234375],[211,251.23333740234375],[233,252.23333740234375]],[[155,125.23333740234375],[160,156.23333740234375],[172,203.23333740234375],[187.5,250]],[[211,125.23333740234375],[207,166.23333740234375],[199,213.23333740234375],[187.5,250]],[[211,126.23333740234375],[203,180.23333740234375],[197,217.23333740234375],[187.5,250]],[[212,125.23333740234375],[207,167.23333740234375],[197,207.23333740234375],[187.5,250]],[[222,123.73333740234375],[222,165.4000040690104],[222,207.06667073567706],[222,248.73333740234375]]],[[[139.25,125.73333740234375],[156.25,125.73333740234375],[203.25,124.73333740234375],[235,123.23333740234375]],[[153,245.23333740234375],[175,254.23333740234375],[201,246.23333740234375],[237,248.23333740234375]],[[154,127.23333740234375],[162,173.23333740234375],[172,214.23333740234375],[187.5,250]],[[217,123.23333740234375],[207,163.23333740234375],[200,213.23333740234375],[187.5,250]],[[218,123.23333740234375],[204,171.23333740234375],[200,219.23333740234375],[187.5,250]],[[219,122.73333740234375],[219,164.4000040690104],[219,206.06667073567706],[219,247.73333740234375]],[[227,122.73333740234375],[227,164.4000040690104],[227,206.06667073567706],[227,247.73333740234375]]],[[[141,124.23333740234375],[185,123.23333740234375],[197,125.23333740234375],[243,124.23333740234375]],[[143,252.23333740234375],[170,250.23333740234375],[202,251.23333740234375],[244,249.23333740234375]],[[150,123.23333740234375],[158,173.23333740234375],[176,219.23333740234375],[187.5,250]],[[213,125.23333740234375],[208,166.23333740234375],[200,212.23333740234375],[187.5,250]],[[218,125.73333740234375],[218,167.4000040690104],[218,209.06667073567706],[218,250.73333740234375]],[[227,123.73333740234375],[227,165.4000040690104],[227,207.06667073567706],[227,248.73333740234375]],[[234,124.73333740234375],[234,166.4000040690104],[234,208.06667073567706],[234,249.73333740234375]]],[[[140,124.23333740234375],[170,125.23333740234375],[201,125.23333740234375],[241,125.23333740234375]],[[143,250.23333740234375],[165,253.23333740234375],[202,245.23333740234375],[241,251.23333740234375]],[[151,125.23333740234375],[154,186.23333740234375],[152,213.23333740234375],[154,251.23333740234375]],[[159,124.23333740234375],[183,164.23333740234375],[201,208.23333740234375],[234,252.23333740234375]],[[160,126.23333740234375],[182,162.23333740234375],[197,207.23333740234375],[234,251.23333740234375]],[[228,124.23333740234375],[209,157.23333740234375],[187.5,208.33333333333331],[168,248.23333740234375]]]];

var trans0={a:[ 250, 50, 250 ], b:[ 150, 0, 150 ]};

this.t = new Array();
for (var i=0;i<=50;i++)
this.t[i] = new Array();
this.t[0].push({ src: 0, type: 'loop', turns: 2, via: 'acc', to: 2, col:trans0 });
this.t[0].push({ src: 6, type: 'loop', turns: 2, via: 'acc', to: 5, col:trans0  });
this.t[0].push({ src: 1, type: 'shrink', mov: 0  });
this.t[0].push({ src: 4, type: 'shrink', mov: 1  });
this.t[0].push({ src: 2, type: 'shrink', mov: 1  });
this.t[0].push({ src: 5, type: 'shrink', mov: 0  }); 

this.t[1].push({ src: 2, type: 'loop', turns: 0, via: 'acc', to: 0, col:trans0  });    
this.t[1].push({ src: 5, type: 'loop', turns: 0, via: 'acc', to: 6, col:trans0  });    
this.t[1].push({ src: 2, type: 'grow', mov: 1 });
this.t[1].push({ src: 4, type: 'grow', mov: 1 });
this.t[1].push({ src: 3, type: 'grow', mov: 1 }); 

this.t[2].push({ src: 0, type: 'loop', turns: 1, via: 'acc', to: 0 });    
this.t[2].push({ src: 6, type: 'loop', turns: 1, via: 'acc', to: 6 });    
this.t[2].push({ src: 3, type: 'shift', to: 3 });
this.t[2].push({ src: 2, type: 'shift', to: 2 });
this.t[2].push({ src: 5, type: 'grow', mov: 0 });
this.t[2].push({ src: 4, type: 'shrink', mov: 0 }); 

this.t[3].push({ src: 0, type: 'loop', turns: 0, via: 'acc', to: 1, col:trans0  });    
this.t[3].push({ src: 6, type: 'loop', turns: 0, via: 'acc', to: 1, col:trans0  });    
this.t[3].push({ src: 3, type: 'shift', to: 3});
this.t[3].push({ src: 5, type: 'shift', to: 5});
this.t[3].push({ src: 2, type: 'shift', to: 2});

this.t[4].push({ src: 1, type: 'loop', turns: 0, via: 'acc', to: 0, col:trans0  });    
this.t[4].push({ src: 1, type: 'loop', turns: 0, via: 'acc', to: 6, col:trans0  });    
this.t[4].push({ src: 3, type: 'shift', to: 3});
this.t[4].push({ src: 5, type: 'shift', to: 5});
this.t[4].push({ src: 2, type: 'shrink', mov: 0});
this.t[4].push({ src: 1, type: 'grow', mov: 0}); 

this.t[5].push({ src: 0, type: 'loop', turns: 1, via: 'acc', to: 0, col:trans0  });    
this.t[5].push({ src: 6, type: 'loop', turns: 1, via: 'acc', to: 6, col:trans0  });    
this.t[5].push({ src: 5, type: 'shift', to: 5});
this.t[5].push({ src: 3, type: 'shift', to: 3});
this.t[5].push({ src: 1, type: 'shift', to: 1});
this.t[5].push({ src: 4, type: 'grow', mov: 1});

this.t[50].push({ src: 0, type: 'loop', turns: 1, via: 'acc', to: 0, col:trans0  });    
this.t[50].push({ src: 6, type: 'loop', turns: 1, via: 'acc', to: 6, col:trans0  });    
this.t[50].push({ src: 5, type: 'shift', to: 5});
this.t[50].push({ src: 1, type: 'shift', to: 1});
this.t[50].push({ src: 4, type: 'grow', mov: 1});
this.t[50].push({ src: 3, type: 'shrink', mov: 1});
this.t[50].push({ src: 2, type: 'grow', mov: 0 });

this.t[6].push({ src: 0, type: 'loop', turns: 1, via: 'acc', to: 2, col:trans0  });    
this.t[6].push({ src: 6, type: 'loop', turns: 1, via: 'acc', to: 5, col:trans0  });    
this.t[6].push({ src: 3, type: 'shrink', mov: 1});
this.t[6].push({ src: 0, type: 'grow', mov: 1});
this.t[6].push({ src: 5, type: 'shrink', mov: 0});
this.t[6].push({ src: 1, type: 'shrink', mov: 0});
this.t[6].push({ src: 4, type: 'shrink', mov: 1});


this.t[7].push({ src: 2, type: 'loop', turns: 1, via: 'acc', to: 0, col:trans0  });    
this.t[7].push({ src: 5, type: 'loop', turns: 1, via: 'acc', to: 6, col:trans0  });    
this.t[7].push({ src: 3, type: 'grow', mov: 1 });    
this.t[7].push({ src: 1, type: 'grow', mov: 0 });    
this.t[7].push({ src: 4, type: 'grow', mov: 1 });    
this.t[7].push({ src: 5, type: 'grow', mov: 0 });    
this.t[7].push({ src: 2, type: 'grow', mov: 1 });    
this.t[7].push({ src: 0, type: 'shrink', mov: 0 });

this.t[8].push({ src: 0, type: 'loop', turns: 1, via: 'acc', to: 0, col:trans0  });    
this.t[8].push({ src: 6, type: 'loop', turns: 1, via: 'acc', to: 6, col:trans0  });  
this.t[8].push({ src: 2, type: 'shift', to: 2 });    
this.t[8].push({ src: 5, type: 'shift', to: 5 });    
this.t[8].push({ src: 3, type: 'shift', to: 3 });    
this.t[8].push({ src: 1, type: 'shift', to: 1 });    
this.t[8].push({ src: 4, type: 'shrink', mov: 1 });  

this.t[9].push({ src: 0, type: 'loop', turns: 1, via: 'acc', to: 6, col:trans0  });    
this.t[9].push({ src: 6, type: 'loop', turns: 1, via: 'acc', to: 0, col:trans0  });
this.t[9].push({ src: 1, type: 'shift', to: 1 });        
this.t[9].push({ src: 2, type: 'shift', to: 2 });   
this.t[9].push({ src: 5, type: 'shift', to: 5 }); 
this.t[9].push({ src: 3, type: 'shrink', mov: 1 });      
this.t[9].push({ src: 4, type: 'grow', mov: 1 });      

this.t[10].push({ src: 2, type: 'shrink', mov: 0 });
this.t[10].push({ src: 5, type: 'shrink', mov: 0 });

this.t[21].push({ src: 0, type: 'loop', to: 2 });
this.t[21].push({ src: 3, type: 'loop', to: 2 });
this.t[21].push({ src: 4, type: 'loop', to: 5 });
this.t[21].push({ src: 6, type: 'loop', to: 5 });
this.t[21].push({ src: 2, type: 'shift', to: 2 });


this.t[20].push({ src: 0, type: 'shrink', mov: 0 });
this.t[20].push({ src: 2, type: 'shrink', mov: 0 });
this.t[20].push({ src: 3, type: 'shrink', mov: 0 });
this.t[20].push({ src: 4, type: 'shrink', mov: 0 });
this.t[20].push({ src: 6, type: 'shrink', mov: 0 });
this.t[30].push({ src: 3, type: 'flip', to: 1 });
this.t[30].push({ src: 3, type: 'flip', to: 4 });
this.t[11].push({ src: 5, type: 'grow', mov: 0, t:[.9,.95]});
this.t[11].push({ src: 2, type: 'grow', mov: 0, t:[.95,1]}); 
}
TO SAVE WORK:
font name: (new or previous) letters/numbers, no spaces
author username: (create now OR recall) letters/numbers, no spaces
password: (create now OR recall) remember what you type here - it creates an instant account
(nothing is saved till you hit save) see previous versions of this font