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 = 15;
this.groupPad = 15;
this.heightFrac = 0.45;
this.widthFrac = .5;

this.bgColor = [31, 31, 31];
this.baseColor = [  0, 250, 150 ];
this.partColor = { a:[ 200, 200, 200, 1], b:[ 250, 250, 250, 1]};
this.secondColor = this.baseColor;
this.colonColors = [ this.baseColor , this.baseColor ];

this.baseLineWidth = 0;
this.partLineWidth = 9;
this.colonRadius = 2;
this.beginAniTime = 0.5;
this.endAniTime = 1;

this.lineCap = 'butt';
this.showRightColons = false;

this.hoursScale= { val: 1 , pos: 'top' , offset:[1,-.45] };
this.minutesScale= { val: 1 , pos: 'top' , offset:[1,-.45] };
this.secondsScale= { val: .75 , pos: 'top' , offset:[-1,.750] };
this.baseInFront = true;
this.pulsate = false;
this.sevenSegment = false;
this.defaultTrans = { type:'flip', turns: 0, via:'lin'}
this.lineCap = 'round';
this.connected = false;
this.ampmShow = true;

var trans0={a:[ 200, 200, 200, .25], b:[ 150, 250, 150, .5 ]};

this.t = new Array();
for (var i=0;i<=50;i++)
this.t[i] = new Array();


this.t[0].push({ src: 0, type: 'shift', mov:0, via: 'occ', to: 0 });
this.t[0].push({ src: 1, type: 'flip', mov:1, via: 'occ', to: 0 });
this.t[0].push({ src: 1, type: 'loop', mov:1, via: 'occ', to: 0, col:trans0, turns:0 });

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

this.t[2].push({ src: 0, type: 'flip', via: 'occ', to: 1 });
this.t[2].push({ src: 1, type: 'flip', via: 'occ', to: 0 });
this.t[2].push({ src: 2, type: 'shrink', via: 'occ', to: 0 });
this.t[2].push({ src: 2, type: 'shrink', via: 'occ', to: 0 });
this.t[2].push({ src: 2, type: 'loop', via: 'occ', to: 1, col:trans0, turns:1 });


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

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

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

this.t[6].push({ src: 0, type: 'shift',to:0, via: 'accc', mov:0,t:[0,1]});
this.t[6].push({ src: 1, type: 'shift', to: 1, via: 'accc' , t:[0,1]});
this.t[6].push({ src: 2, type: 'flip', to: 1, via: 'accc' , t:[0,1]});
this.t[6].push({ src: 0, type: 'loop', to: 1, via: 'accc' , t:[0,1], col:trans0, turns:-1});

this.t[7].push({ src: 0, type: 'flip',to:0, via: 'lin', mov:0,t:[0,1]});
this.t[7].push({ src: 1, type: 'shift', to: 2, via: 'lin' , t:[0,1]});
this.t[7].push({ src: 1, type: 'flip', to: 3, via: 'lin' , t:[0,1]});
this.t[7].push({ src: 0, type: 'shift', to: 1, via: 'lin' , t:[0,1]});
this.t[7].push({ src: 1, type: 'loop', to: 2, via: 'lin' , t:[0,1], col:trans0, turns:1});


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


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

this.strokes = [[[[300,100],[100,100],[100,495.6091065491803],[300,495.6091065491803]],[[300,495.6091065491803],[500,495.6091065491803],[500,100],[300,100]],[[234.23638916015625,189.36684799194336],[182.23638916015625,197.36684799194336],[162.23638916015625,330.36684799194336],[221.23638916015625,328.36684799194336]],[[234.23638916015625,189.36684799194336],[283.85116596877606,206.87038826900852],[278.8423409302948,341.27244060353905],[221.23638916015625,328.36684799194336]],[[356.1385803222656,184.36684799194336],[304.1385803222656,192.36684799194336],[284.13858032226557,325.36684799194336],[343.1385803222656,323.36684799194336]],[[356.1385803222656,184.36684799194336],[405.75335713088543,201.87038826900852],[400.7445320924042,336.27244060353905],[343.1385803222656,323.36684799194336]],[[342.8885803222656,440.36684799194336],[463.8885803222656,354.36684799194336],[96.88858032226562,339.36684799194336],[256.8885803222656,443.36684799194336]],[[31.888580322265625,51.36684799194336],[278.8885803222656,31.36684799194336],[373.8885803222656,445.36684799194336],[522.8885803222656,522.3668479919434]],[[542.5407562255859,46.36684799194336],[278.88858032226557,31.366847991943384],[255.54075622558594,323.36684799194336],[46.54075622558594,515.3668479919434]]],[[[366.1041564941406,200],[353.1041564941406,243.06514890846992],[353.1041564941406,374.93485109153],[353.1041564941406,506.80455327459015]],[[305,500.6091065491803],[305,368.73940436612014],[305,236.86970218306007],[282.1041564941406,190]],[[227.10415649414062,73],[285.1041564941406,100],[391.1041564941406,125],[409.1041564941406,46]],[[409.1041564941406,46],[494.1041564941406,6],[558.1041564941406,162],[371.1041564941406,201]],[[282.1041564941406,190],[141.10415649414062,172],[59.104156494140625,25],[223.10415649414062,73]],[[353.1041564941406,506.80455327459015],[427.1041564941406,460],[506.1041564941406,428],[437.1041564941406,554]],[[438.1041564941406,553],[407.1041564941406,594],[279.1041564941406,556],[97.10415649414062,569]],[[97.10415649414062,569],[14.104156494140625,488],[241.10415649414062,497],[302.1041564941406,498]]],[[[198.46153846153845,112.76158408223162],[604.6153846153846,55.334455712189325],[300,363.73940436612014],[186.15384615384616,495.6091065491803]],[[186.15384615384616,495.6091065491803],[223.0769230769231,495.6091065491803],[263.0769230769231,495.6091065491803],[423.0769230769231,495.6091065491803]]],[[[210.76923076923077,109.57118806167372],[407.6923076923077,87.23841591776838],[506.1538461538462,192.52148459617925],[210.76923076923077,275.4717811306848]],[[210.76923076923077,275.4717811306848],[460,256.32940500733736],[447.69230769230774,537.084254816433],[210.76923076923077,495.6091065491803]]],[[[207.69230769230768,112.76158408223162],[140,342.47009756240084],[306.1538461538462,307.37574133626384],[398.46153846153845,300.99494929514805]],[[395.38461538461536,100],[395.38461538461536,231.86970218306007],[395.38461538461536,363.73940436612014],[395.38461538461536,495.6091065491803]]],[[[401.53846153846155,100],[300,100],[300,100],[213.84615384615384,100]],[[216.9230769230769,103.1903960205579],[127.6923076923077,447.7531662408117],[404.61538461538464,141.47514826725276],[404.61538461538464,406.2780179735589]],[[404.61538461538464,406.2780179735589],[413.84615384615387,533.8938587958751],[201.53846153846155,524.3226707342014],[195.3846153846154,419.0396020557905]]],[[[312.3076923076923,106.38079204111581],[158.46153846153845,74.47683183553676],[56.92307692307692,463.7051463436012],[300,495.6091065491803]],[[300,495.6091065491803],[444.61538461538464,495.6091065491803],[447.69230769230774,285.0429691923585],[300,297.80455327459015]],[[300,297.80455327459015],[235.3846153846154,307.37574133626384],[192.30769230769232,339.2797015418429],[176.92307692307693,409.4684139941168]]],[[[183.0769230769231,100],[300,100],[300,100],[401.53846153846155,100]],[[401.53846153846155,100],[367.69230769230774,166.998316431716],[333.84615384615387,230.8062368428741],[183.0769230769231,495.6091065491803]]],[[[330.7692307692308,307.37574133626384],[278.46153846153845,278.6621771512427],[121.53846153846153,115.95198010278952],[303.0769230769231,106.38079204111581]],[[303.0769230769231,106.38079204111581],[503.0769230769231,115.95198010278952],[263.0769230769231,259.51980102789526],[235.3846153846154,316.94692939793754]],[[237.69230769230768,313.7565333773797],[130,412.6588100146747],[260,540.274650836991],[333.84615384615387,482.84752246694865]],[[333.84615384615387,482.84752246694865],[395.38461538461536,444.5627702202538],[410.7692307692308,367.993265726864],[330.7692307692308,307.37574133626384]]],[[[223.0769230769231,450.9435622613696],[450.7692307692308,645.5577195154018],[506.1538461538462,144.6655442878107],[361.53846153846155,106.38079204111581]],[[361.53846153846155,106.38079204111581],[173.84615384615384,84.04801989721048],[149.23076923076923,326.5181174596113],[315.38461538461536,316.94692939793754]],[[312.3076923076923,316.94692939793754],[386.1538461538462,316.94692939793754],[447.69230769230774,256.32940500733736],[435.3846153846154,218.0446527606425]]]];
}
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