User:Manetta/rgb-clock: Difference between revisions
No edit summary |
No edit summary |
||
Line 1: | Line 1: | ||
[http://test.manettaberends.nl/rgb-clock.html rgb-clock] | [http://test.manettaberends.nl/rgb-clock.html rgb-clock] | ||
<source lang="html4strict"> | |||
<script> | |||
function GetClock(){ | |||
d = new Date(); | |||
nhour = d.getHours(); | |||
nmin = d.getMinutes(); | |||
nsec = d.getSeconds(); | |||
if(nhour == 0) {ap = " AM";nhour = 12;} | |||
else if(nhour <= 11) {ap = " AM";} | |||
else if(nhour == 12) {ap = " PM";} | |||
else if(nhour >= 13) {ap = " PM";nhour -= 0;} | |||
if(nhour <= 9) {nhour = "0" +nhour;} | |||
if(nmin <= 9) {nmin = "0" +nmin;} | |||
if(nsec <= 9) {nsec = "0" +nsec;} | |||
document.getElementById('clockbox').innerHTML=""+nhour+" "+nmin+" "+nsec+""; | |||
setTimeout("GetClock()", 1000); | |||
var values = [nhour, nmin, nsec]; | |||
console.log(values); | |||
if(nsec == 1) { fns.secone(); } | |||
if(nsec == 2) { fns.sectwo(); } | |||
if(nsec == 3) { fns.secthree(); } | |||
if(nsec == 4) { fns.secfour(); } | |||
if(nsec == 5) { fns.secfive(); } | |||
if(nsec == 6) { fns.secsix(); } | |||
if(nsec == 7) { fns.secseven(); } | |||
if(nsec == 8) { fns.seceight(); } | |||
if(nsec == 9) { fns.secnine(); } | |||
if(nsec == 10) { fns.secten(); } | |||
if(nsec == 11) { fns.seceleven(); } | |||
if(nsec == 12) { fns.sectwelve(); } | |||
if(nsec == 13) { fns.secthirteen(); } | |||
if(nsec == 14) { fns.secfourteen(); } | |||
if(nsec == 15) { fns.secfifteen(); } | |||
if(nsec == 16) { fns.secsixteen(); } | |||
if(nsec == 17) { fns.secseventeen(); } | |||
if(nsec == 18) { fns.seceighteen(); } | |||
if(nsec == 19) { fns.secnineteen(); } | |||
if(nsec == 20) { fns.sectwenty(); } | |||
if(nsec == 21) { fns.sectwentyone(); } | |||
if(nsec == 22) { fns.sectwentytwo(); } | |||
if(nsec == 23) { fns.sectwentythree(); } | |||
if(nsec == 24) { fns.sectwentyfour(); } | |||
if(nsec == 25) { fns.sectwentyfive(); } | |||
if(nsec == 26) { fns.sectwentysix(); } | |||
if(nsec == 27) { fns.sectwentyseven(); } | |||
if(nsec == 28) { fns.sectwentyeight(); } | |||
if(nsec == 29) { fns.sectwentynine(); } | |||
if(nsec == 30) { fns.secthirty(); } | |||
if(nsec == 31) { fns.secthirtyone(); } | |||
if(nsec == 32) { fns.secthirtytwo(); } | |||
if(nsec == 33) { fns.secthirtythree(); } | |||
if(nsec == 34) { fns.secthirtyfour(); } | |||
if(nsec == 35) { fns.secthirtyfive(); } | |||
if(nsec == 36) { fns.secthirtysix(); } | |||
if(nsec == 37) { fns.secthirtyseven(); } | |||
if(nsec == 38) { fns.secthirtyeight(); } | |||
if(nsec == 39) { fns.secthirtynine(); } | |||
if(nsec == 40) { fns.secforty(); } | |||
if(nsec == 41) { fns.secfortyone(); } | |||
if(nsec == 42) { fns.secfortytwo(); } | |||
if(nsec == 43) { fns.secfortythree(); } | |||
if(nsec == 44) { fns.secfortyfour(); } | |||
if(nsec == 45) { fns.secfortyfive(); } | |||
if(nsec == 46) { fns.secfortysix(); } | |||
if(nsec == 47) { fns.secfortyseven(); } | |||
if(nsec == 48) { fns.secfortyeight(); } | |||
if(nsec == 49) { fns.secfortynine(); } | |||
if(nsec == 50) { fns.secfifty(); } | |||
if(nsec == 51) { fns.secfiftyone(); } | |||
if(nsec == 52) { fns.secfiftytwo(); } | |||
if(nsec == 53) { fns.secfiftythree(); } | |||
if(nsec == 54) { fns.secfiftyfour(); } | |||
if(nsec == 55) { fns.secfiftyfive(); } | |||
if(nsec == 56) { fns.secfiftysix(); } | |||
if(nsec == 57) { fns.secfiftyseven(); } | |||
if(nsec == 58) { fns.secfiftyeight(); } | |||
if(nsec == 59) { fns.secfiftynine(); } | |||
if(nsec == 00) { fns.seczero(); } | |||
function fill() { | |||
var a = Math.floor(4.25*nhour); | |||
var b = Math.floor(4.25*nmin); | |||
var c = Math.floor(4.25*nsec); | |||
var d = "1"; | |||
var fillcolor = "rgba("+a+","+b+","+c+","+d+")"; | |||
return fillcolor; | |||
} | |||
function stroke() { | |||
var a = Math.floor(4.25*nmin); | |||
var b = Math.floor(4.25*nsec); | |||
var c = Math.floor(4.25*nhour); | |||
var d = "1"; | |||
var strokecolor = "rgba("+a+","+b+","+c+","+d+")"; | |||
return strokecolor; | |||
} | |||
function background() { | |||
var a = Math.floor(4.25*nsec); | |||
var b = Math.floor(4.25*nhour); | |||
var c = Math.floor(4.25*nmin); | |||
var d = "1"; | |||
var color = "rgba("+a+","+b+","+c+","+d+")"; | |||
return color; | |||
} | |||
function strokewidth() { | |||
var a = Math.floor(2*nsec); | |||
var width = a+"px"; | |||
return width; | |||
} | |||
console.log("stroke color: (red = sec, green = hour, blue = min) * 4.25 = "+stroke()); | |||
console.log("fill color: (red = hour, green = min, blue = sec) * 4.25 = "+fill()); | |||
console.log("stroke color: (red = min, green = sec, blue = hour) * 0.167 = "+stroke()); | |||
// this is the place | |||
function radius(){ | |||
var a = Math.floor(10*nsec); | |||
var size = a+"px"; | |||
return size; | |||
} | |||
$("#seconds").css("background", background()); | |||
$("#one").css("background", fill()); | |||
$("#one").css({ | |||
"border-color": stroke(), | |||
"border-width": strokewidth(), | |||
"border-style":"solid", | |||
"border-radius": radius(), | |||
}); | |||
} | |||
window.onload=GetClock; | |||
fns = {} | |||
fns.secone = function(){ | |||
$("#seconds").css("background", "black"); | |||
console.log("function one") | |||
} | |||
fns.sectwo = function(){ | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthree = function(){ | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfour = function(){ | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfive = function(){ | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secsix = function(){ | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secseven = function(){ | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.seceight = function(){ | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secnine = function(){ | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secten = function(){ | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.seceleven = function(){ | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.sectwelve = function(){ | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthirteen = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfourteen = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfifteen = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secsixteen = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secseventeen = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.seceighteen = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secnineteen = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.sectwenty = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.sectwentyone = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.sectwentytwo = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.sectwentythree = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.sectwentyfour = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.sectwentyfive = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.sectwentysix = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.sectwentyseven = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.sectwentyeight = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.sectwentynine = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secthirty = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthirtyone = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secthirtytwo = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthirtythree = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secthirtyfour = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthirtyfive = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secthirtysix = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthirtyseven = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secthirtyeight = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secthirtynine = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secforty = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfortyone = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfortytwo = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfortythree = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfortyfour = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfortyfive = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfortysix = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfortyseven = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfortyeight = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfortynine = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfifty = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfiftyone = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfiftytwo = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfiftythree = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfiftyfour = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfiftyfive = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfiftysix = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfiftyseven = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.secfiftyeight = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
fns.secfiftynine = function () { | |||
$("#seconds").css("background", "black"); | |||
} | |||
fns.seczero = function () { | |||
$("#seconds").css("background", "transparent") | |||
} | |||
</script> | |||
</source> |
Revision as of 16:18, 7 October 2014
<script>
function GetClock(){
d = new Date();
nhour = d.getHours();
nmin = d.getMinutes();
nsec = d.getSeconds();
if(nhour == 0) {ap = " AM";nhour = 12;}
else if(nhour <= 11) {ap = " AM";}
else if(nhour == 12) {ap = " PM";}
else if(nhour >= 13) {ap = " PM";nhour -= 0;}
if(nhour <= 9) {nhour = "0" +nhour;}
if(nmin <= 9) {nmin = "0" +nmin;}
if(nsec <= 9) {nsec = "0" +nsec;}
document.getElementById('clockbox').innerHTML=""+nhour+" "+nmin+" "+nsec+"";
setTimeout("GetClock()", 1000);
var values = [nhour, nmin, nsec];
console.log(values);
if(nsec == 1) { fns.secone(); }
if(nsec == 2) { fns.sectwo(); }
if(nsec == 3) { fns.secthree(); }
if(nsec == 4) { fns.secfour(); }
if(nsec == 5) { fns.secfive(); }
if(nsec == 6) { fns.secsix(); }
if(nsec == 7) { fns.secseven(); }
if(nsec == 8) { fns.seceight(); }
if(nsec == 9) { fns.secnine(); }
if(nsec == 10) { fns.secten(); }
if(nsec == 11) { fns.seceleven(); }
if(nsec == 12) { fns.sectwelve(); }
if(nsec == 13) { fns.secthirteen(); }
if(nsec == 14) { fns.secfourteen(); }
if(nsec == 15) { fns.secfifteen(); }
if(nsec == 16) { fns.secsixteen(); }
if(nsec == 17) { fns.secseventeen(); }
if(nsec == 18) { fns.seceighteen(); }
if(nsec == 19) { fns.secnineteen(); }
if(nsec == 20) { fns.sectwenty(); }
if(nsec == 21) { fns.sectwentyone(); }
if(nsec == 22) { fns.sectwentytwo(); }
if(nsec == 23) { fns.sectwentythree(); }
if(nsec == 24) { fns.sectwentyfour(); }
if(nsec == 25) { fns.sectwentyfive(); }
if(nsec == 26) { fns.sectwentysix(); }
if(nsec == 27) { fns.sectwentyseven(); }
if(nsec == 28) { fns.sectwentyeight(); }
if(nsec == 29) { fns.sectwentynine(); }
if(nsec == 30) { fns.secthirty(); }
if(nsec == 31) { fns.secthirtyone(); }
if(nsec == 32) { fns.secthirtytwo(); }
if(nsec == 33) { fns.secthirtythree(); }
if(nsec == 34) { fns.secthirtyfour(); }
if(nsec == 35) { fns.secthirtyfive(); }
if(nsec == 36) { fns.secthirtysix(); }
if(nsec == 37) { fns.secthirtyseven(); }
if(nsec == 38) { fns.secthirtyeight(); }
if(nsec == 39) { fns.secthirtynine(); }
if(nsec == 40) { fns.secforty(); }
if(nsec == 41) { fns.secfortyone(); }
if(nsec == 42) { fns.secfortytwo(); }
if(nsec == 43) { fns.secfortythree(); }
if(nsec == 44) { fns.secfortyfour(); }
if(nsec == 45) { fns.secfortyfive(); }
if(nsec == 46) { fns.secfortysix(); }
if(nsec == 47) { fns.secfortyseven(); }
if(nsec == 48) { fns.secfortyeight(); }
if(nsec == 49) { fns.secfortynine(); }
if(nsec == 50) { fns.secfifty(); }
if(nsec == 51) { fns.secfiftyone(); }
if(nsec == 52) { fns.secfiftytwo(); }
if(nsec == 53) { fns.secfiftythree(); }
if(nsec == 54) { fns.secfiftyfour(); }
if(nsec == 55) { fns.secfiftyfive(); }
if(nsec == 56) { fns.secfiftysix(); }
if(nsec == 57) { fns.secfiftyseven(); }
if(nsec == 58) { fns.secfiftyeight(); }
if(nsec == 59) { fns.secfiftynine(); }
if(nsec == 00) { fns.seczero(); }
function fill() {
var a = Math.floor(4.25*nhour);
var b = Math.floor(4.25*nmin);
var c = Math.floor(4.25*nsec);
var d = "1";
var fillcolor = "rgba("+a+","+b+","+c+","+d+")";
return fillcolor;
}
function stroke() {
var a = Math.floor(4.25*nmin);
var b = Math.floor(4.25*nsec);
var c = Math.floor(4.25*nhour);
var d = "1";
var strokecolor = "rgba("+a+","+b+","+c+","+d+")";
return strokecolor;
}
function background() {
var a = Math.floor(4.25*nsec);
var b = Math.floor(4.25*nhour);
var c = Math.floor(4.25*nmin);
var d = "1";
var color = "rgba("+a+","+b+","+c+","+d+")";
return color;
}
function strokewidth() {
var a = Math.floor(2*nsec);
var width = a+"px";
return width;
}
console.log("stroke color: (red = sec, green = hour, blue = min) * 4.25 = "+stroke());
console.log("fill color: (red = hour, green = min, blue = sec) * 4.25 = "+fill());
console.log("stroke color: (red = min, green = sec, blue = hour) * 0.167 = "+stroke());
// this is the place
function radius(){
var a = Math.floor(10*nsec);
var size = a+"px";
return size;
}
$("#seconds").css("background", background());
$("#one").css("background", fill());
$("#one").css({
"border-color": stroke(),
"border-width": strokewidth(),
"border-style":"solid",
"border-radius": radius(),
});
}
window.onload=GetClock;
fns = {}
fns.secone = function(){
$("#seconds").css("background", "black");
console.log("function one")
}
fns.sectwo = function(){
$("#seconds").css("background", "transparent")
}
fns.secthree = function(){
$("#seconds").css("background", "black");
}
fns.secfour = function(){
$("#seconds").css("background", "transparent")
}
fns.secfive = function(){
$("#seconds").css("background", "black");
}
fns.secsix = function(){
$("#seconds").css("background", "transparent")
}
fns.secseven = function(){
$("#seconds").css("background", "black");
}
fns.seceight = function(){
$("#seconds").css("background", "transparent")
}
fns.secnine = function(){
$("#seconds").css("background", "black");
}
fns.secten = function(){
$("#seconds").css("background", "transparent")
}
fns.seceleven = function(){
$("#seconds").css("background", "black");
}
fns.sectwelve = function(){
$("#seconds").css("background", "transparent")
}
fns.secthirteen = function () {
$("#seconds").css("background", "black");
}
fns.secfourteen = function () {
$("#seconds").css("background", "transparent")
}
fns.secfifteen = function () {
$("#seconds").css("background", "black");
}
fns.secsixteen = function () {
$("#seconds").css("background", "transparent")
}
fns.secseventeen = function () {
$("#seconds").css("background", "black");
}
fns.seceighteen = function () {
$("#seconds").css("background", "transparent")
}
fns.secnineteen = function () {
$("#seconds").css("background", "black");
}
fns.sectwenty = function () {
$("#seconds").css("background", "transparent")
}
fns.sectwentyone = function () {
$("#seconds").css("background", "black");
}
fns.sectwentytwo = function () {
$("#seconds").css("background", "transparent")
}
fns.sectwentythree = function () {
$("#seconds").css("background", "black");
}
fns.sectwentyfour = function () {
$("#seconds").css("background", "transparent")
}
fns.sectwentyfive = function () {
$("#seconds").css("background", "black");
}
fns.sectwentysix = function () {
$("#seconds").css("background", "transparent")
}
fns.sectwentyseven = function () {
$("#seconds").css("background", "black");
}
fns.sectwentyeight = function () {
$("#seconds").css("background", "transparent")
}
fns.sectwentynine = function () {
$("#seconds").css("background", "black");
}
fns.secthirty = function () {
$("#seconds").css("background", "transparent")
}
fns.secthirtyone = function () {
$("#seconds").css("background", "black");
}
fns.secthirtytwo = function () {
$("#seconds").css("background", "transparent")
}
fns.secthirtythree = function () {
$("#seconds").css("background", "black");
}
fns.secthirtyfour = function () {
$("#seconds").css("background", "transparent")
}
fns.secthirtyfive = function () {
$("#seconds").css("background", "black");
}
fns.secthirtysix = function () {
$("#seconds").css("background", "transparent")
}
fns.secthirtyseven = function () {
$("#seconds").css("background", "black");
}
fns.secthirtyeight = function () {
$("#seconds").css("background", "transparent")
}
fns.secthirtynine = function () {
$("#seconds").css("background", "black");
}
fns.secforty = function () {
$("#seconds").css("background", "transparent")
}
fns.secfortyone = function () {
$("#seconds").css("background", "black");
}
fns.secfortytwo = function () {
$("#seconds").css("background", "transparent")
}
fns.secfortythree = function () {
$("#seconds").css("background", "black");
}
fns.secfortyfour = function () {
$("#seconds").css("background", "transparent")
}
fns.secfortyfive = function () {
$("#seconds").css("background", "black");
}
fns.secfortysix = function () {
$("#seconds").css("background", "transparent")
}
fns.secfortyseven = function () {
$("#seconds").css("background", "black");
}
fns.secfortyeight = function () {
$("#seconds").css("background", "transparent")
}
fns.secfortynine = function () {
$("#seconds").css("background", "black");
}
fns.secfifty = function () {
$("#seconds").css("background", "transparent")
}
fns.secfiftyone = function () {
$("#seconds").css("background", "black");
}
fns.secfiftytwo = function () {
$("#seconds").css("background", "transparent")
}
fns.secfiftythree = function () {
$("#seconds").css("background", "black");
}
fns.secfiftyfour = function () {
$("#seconds").css("background", "transparent")
}
fns.secfiftyfive = function () {
$("#seconds").css("background", "black");
}
fns.secfiftysix = function () {
$("#seconds").css("background", "transparent")
}
fns.secfiftyseven = function () {
$("#seconds").css("background", "black");
}
fns.secfiftyeight = function () {
$("#seconds").css("background", "transparent")
}
fns.secfiftynine = function () {
$("#seconds").css("background", "black");
}
fns.seczero = function () {
$("#seconds").css("background", "transparent")
}
</script>