<html>
<head>
<title>Colour Wheel - RJM Programming - July, 2019</title>
<link href='//www.rjmprogramming.com.au/PHP/emboss_h1.css' rel='stylesheet' type='text/css'>
<script type='text/javascript'>

//var ideas = ["circle", "sector", "square", "rectangle", "triangle", "parallelogram", "kite", "trapezium", "rhombus", "rectangle_hsector", "rectangle_lsector", "parallelogram_rectangle_cutout"];
//var rnum = Math.floor(Math.random() * 1000) + 1;
//var hint = 'Hint: A = ' + Math.PI + ' * r * r';
//var score = 0;
//var goes = 0;
var done = 0;
//var snum = Math.floor(Math.random() * ideas.length) + 0;
//if (snum == 2) { snum=3; }

var elem=null;
var context=null;
var cwidth=0;
var cheight=0;
var factor=1.0;
var hfactor=1.0, mfactor, sfactor=1.0;
var cf = "12px Verdana";
var path=null;
var paths=[];
var onedegree=eval(eval(1.0 / 180.0) * Math.PI);
var alldegree=eval(2 * Math.PI);
var letter=['1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'];
var cone='f',ctwo='f', cthree='f';
var rnum=100;
var adate=new Date();
var hang=0, mang=0, sang=0;
var bcol=(location.search.split('bcol=')[1] ? decodeURIComponent(location.search.split('bcol=')[1].split('&')[0]) : 'white').split(';')[0]; //'white';

function getFactor(wis, lis) {
var proposedfactor=eval(Math.max(cwidth, cheight) / Math.max(wis, lis));
if (eval(Math.min(cwidth, cheight) / Math.min(wis, lis)) < proposedfactor) {
proposedfactor=eval(-1 * eval(Math.min(cwidth, cheight) / Math.min(wis, lis)));
}
if (proposedfactor > 0.0) {
if (eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cwidth || eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cheight) {
while (eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cwidth || eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cheight) {
proposedfactor*=0.8;
}
proposedfactor=-proposedfactor;
}
// alert('normal');
} else {
if (eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cwidth || eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cheight) {
proposedfactor=-proposedfactor;
while (eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cwidth || eval(25 + eval(Math.abs(proposedfactor) * Math.round(eval('' + rnum)))) > cheight) {
proposedfactor*=0.8;
}
}

// alert('abnormal');
}
return proposedfactor;
}

function eachsecond() {
setTimeout(eachsecond, 1000);
context.clearRect(0,0,elem.width,elem.height);
adate=new Date();
var his=eval('' + adate.getHours());
var mis=eval('' + adate.getMinutes());
var sis=eval('' + adate.getSeconds());
var ssuff='';
if (('' + sis).indexOf('.') != -1) { ssuff='.' + ('' + sis).split('.')[1]; }
hang=eval(eval(270 + Math.round(eval(eval(his % 12) + eval(mis / 60) + eval(sis / 3600)) * 30)) % 360);
mang=eval(eval(270 + Math.round(eval(mis + eval(sis / 60)) * 6)) % 360);
sang=eval(eval(270 + Math.round(sis * 6)) % 360);
elem.title=('0' + his).slice(-2) + ':' + ('0' + mis).slice(-2) + ':' + ('0' + sis).split('.')[0].slice(-2) + ssuff;
//document.title='' + his + ':' + mis + ':' + sis + ' ' + hang + ';' + mang + ';' + sang;
if (document.getElementById('sele').value != '' && paths.length == 0) {
for (var ii=0; ii<360; ii++) { //360
paths.push(new Path2D());
}
}
context.globalAlpha = 1.0;
context.beginPath();
context.arc(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))), eval(rnum * Math.abs(factor)), 0, alldegree);
//context.fillStyle = "#ffffff"; //'#40FF20';
if (his >= 12) {
context.fillStyle = "#f2f2f2"; //'#40FF20';
} else {
context.fillStyle = "#f9f9f9"; //'#40FF20';
}
context.fill();
//alert('' + context.lineWidth);
context.lineCap = "round";
context.lineJoin = "round";
for (var i=0; i<360; i++) { //360
//context.font = cf;
//context.strokeStyle = '#FF0000';
cone=letter[Math.floor(Math.random() * letter.length)];
ctwo=letter[Math.floor(Math.random() * letter.length)];
cthree=letter[Math.floor(Math.random() * letter.length)];
//context.fillStyle = "#" + cone + "0" + ctwo + "0" + cthree + "0"; //'#40FF20';
//context.fill();
if (i == hang || i == mang || i == sang) {
if (i == hang) {
context.beginPath();
context.moveTo(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))));
context.globalAlpha = 1.0;
context.strokeStyle = "#000000"; //'#40FF20';
context.lineWidth=3;
context.lineTo(Math.round(eval(25 + eval(cwidth / 2)) + eval(eval(rnum * Math.abs(hfactor)) * (Math.cos(onedegree * i)))), Math.round(eval(25 + eval(cheight / 2)) + eval(eval(rnum * Math.abs(hfactor)) * (Math.sin(onedegree * i)))));
}
if (i == sang) {
context.beginPath();
context.moveTo(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))));
context.globalAlpha = 1.0;
context.strokeStyle = "#ff0000"; //'#40FF20';
context.lineWidth=1;
context.lineTo(Math.round(eval(25 + eval(cwidth / 2)) + eval(eval(rnum * Math.abs(sfactor)) * (Math.cos(onedegree * i)))), Math.round(eval(25 + eval(cheight / 2)) + eval(eval(rnum * Math.abs(sfactor)) * (Math.sin(onedegree * i)))));
}
if (i == mang) {
context.beginPath();
context.moveTo(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))));
context.globalAlpha = 1.0;
context.strokeStyle = "#000000"; //'#40FF20';
context.lineWidth=2;
context.lineTo(Math.round(eval(25 + eval(cwidth / 2)) + eval(eval(rnum * Math.abs(mfactor)) * (Math.cos(onedegree * i)))), Math.round(eval(25 + eval(cheight / 2)) + eval(eval(rnum * Math.abs(mfactor)) * (Math.sin(onedegree * i)))));
}
context.closePath();
context.stroke();
//alert('' + cone + ctwo + cthree);
context.beginPath();
context.lineWidth=1;
context.moveTo(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))));
context.lineTo(Math.round(eval(25 + eval(cwidth / 2)) + eval(eval(rnum * Math.abs(factor)) * (Math.cos(onedegree * i)))), Math.round(eval(25 + eval(cheight / 2)) + eval(eval(rnum * Math.abs(factor)) * (Math.sin(onedegree * i)))));
context.closePath();
context.globalAlpha = 0.2;
context.strokeStyle = "#" + cone + "0" + ctwo + "0" + cthree + "0"; //'#40FF20';
context.stroke();
} else {
//alert('' + cone + ctwo + cthree);
context.beginPath();
context.lineWidth=1;
context.moveTo(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))));
context.lineTo(Math.round(eval(25 + eval(cwidth / 2)) + eval(eval(rnum * Math.abs(factor)) * (Math.cos(onedegree * i)))), Math.round(eval(25 + eval(cheight / 2)) + eval(eval(rnum * Math.abs(factor)) * (Math.sin(onedegree * i)))));
context.closePath();
context.globalAlpha = 0.2;
context.strokeStyle = "#" + cone + "0" + ctwo + "0" + cthree + "0"; //'#40FF20';
context.stroke();
}
}
context.globalAlpha = 1.0;
context.beginPath();
context.arc(Math.round(eval(25 + eval(cwidth / 2))), Math.round(eval(25 + eval(cheight / 2))), eval(rnum * Math.abs(factor)), 0, alldegree);
if (his >= 12) {
context.strokeStyle = "#000000"; //'#40FF20';
} else {
context.strokeStyle = "#ffff00"; //'#40FF20';
}
context.stroke();
//setTimeout(eachsecond, 1000);
}

function onl() {
document.getElementById('sele').value=(location.search.split('mode=')[1] ? decodeURIComponent(location.search.split('mode=')[1].split('&')[0]) : '');
if (bcol != 'white' && bcol.toLowerCase() == 'transparent') { document.getElementById('ourcanvas').style.border='1px solid ' + bcol.toLowerCase(); }
if (done == 0) {
done = 1;
elem=document.getElementById('ourcanvas');
context=elem.getContext('2d');
cwidth=eval(-70 + eval(('' + elem.width).replace('px','')));
cheight=eval(-90 + eval(('' + elem.height).replace('px','')));
//alert('' + cwidth + ',' + cheight);
}
factor=getFactor(eval(rnum * 2), eval(rnum * 2));
hfactor=eval(factor / 2.0);
mfactor=eval(factor * 0.9);
sfactor=eval(factor * 0.7);
setTimeout(eachsecond, 1000);
}

function changemode(selo) {
}

</script>
</head>
<body align="center" style="background-color: lightblue;" onload=" onl();" onresize="if (document.URL.indexOf('&') != -1) { location.href=document.URL.replace('?x=','?xx=').split('#')[0].split('&x=')[0] + '&x=' + Math.floor(Math.random() * 12895643); } else if (document.URL.indexOf('?') != -1) { location.href=document.URL.split('#')[0].split('&')[0] + '&x=' + Math.floor(Math.random() * 12895643); } else { location.href=document.URL.split('#')[0].split('?')[0] + '?x=' + Math.floor(Math.random() * 12895643); }">
<div id=dtop><h1 align="center">Colour Wheel <select id=sele onchange="changemode(this);"><option value=''>Local Time Analogue Clock</option></select></h1>
<h4 align="center">RJM Programming <a onclick="document.getElementById('dtop').style.display='none';" style="text-decoration:underline;cursor:pointer;">-</a> July, 2019</h4></div>
<script type='text/javascript'>
var pw='', ph='';
if (window.parent) {
var fitinto=(location.search.split('fitinto=')[1] ? decodeURIComponent(location.search.split('fitinto=')[1].split('&')[0]) : '');
if (fitinto != '') {
if (parent.document.getElementById(fitinto)) {
var rectis=parent.document.getElementById(fitinto).getBoundingClientRect();
if (('' + rectis.width).replace('px','').replace(/0/g,'') != '' && ('' + rectis.height).replace('px','').replace(/0/g,'') != '') {
pw=('' + rectis.width).replace('px','');
ph=('' + rectis.height).replace('px','');
}
}
}
}
if (pw != '' && ph != '') {
document.write('<br><br><canvas title="" onclick="document.getElementById(' + "'" + 'dtop' + "'" + ').style.display=' + "'" + 'block' + "'" + ';" id=ourcanvas width=' + ('' + eval(-15 + eval(pw)) + 'px').replace('pxpx','').replace('px','') + ' height=' + eval(-15 + eval(ph)) + ' style="width:' + ('' + eval(-15 + eval(pw)) + 'px').replace('pxpx','px') + ';height:' + eval(-15 + eval(ph)) + 'px;border:1px solid red;background-color:' + bcol + ';"></canvas>');
} else if (window.outerHeight == window.innerHeight && window.innerHeight == screen.height) { // thanks to https://stackoverflow.com/questions/16162639/difference-between-screen-and-window-property
document.write('<br><br><canvas title="" onclick="document.getElementById(' + "'" + 'dtop' + "'" + ').style.display=' + "'" + 'block' + "'" + ';" id=ourcanvas width=' + ('' + eval(-15 + (window.orientation == 0 ? window.screen.height: window.screen.width)) + 'px').replace('pxpx','').replace('px','') + ' height=660 style="width:' + ('' + eval(-15 + (window.orientation == 0 ? window.screen.height: window.screen.width)) + 'px').replace('pxpx','px') + ';height:660px;border:1px solid red;background-color:' + bcol + ';"></canvas>');
} else {
document.write('<br><br><canvas title="" onclick="document.getElementById(' + "'" + 'dtop' + "'" + ').style.display=' + "'" + 'block' + "'" + ';" id=ourcanvas width=' + ('' + eval(-15 + (window.orientation == 0 ? window.innerHeight: window.innerWidth)) + 'px').replace('pxpx','').replace('px','') + ' height=660 style="width:' + ('' + eval(-15 + (window.orientation == 0 ? window.innerHeight: window.innerWidth)) + 'px').replace('pxpx','px') + ';height:660px;border:1px solid red;background-color:' + bcol + ';"></canvas>');
}
</script>
</body>
</html>