<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 done = 0;
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 xlongis=-999.0;
var ylatis=-999.0;
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';
var bthickness=(location.search.split('bthickness=')[1] ? decodeURIComponent(location.search.split('bthickness=')[1].split('&')[0]) : '1').split('.')[0]; //'white';
var tplace=(location.search.split('tplace=')[1] ? decodeURIComponent(location.search.split('tplace=')[1].split('&')[0]) : '').split(';')[0]; //'white';
var ytidea='//www.rjmprogramming.com.au/HTMLCSS/karaoke_youtube_api.htm?youtubeid=++++++++++++San+Francisco&minimize=y&youtube_duration=&email=&emoji=on';
var gmidea='//www.google.com/maps/place/Kaliningrad,+Kaliningrad+Oblast,+Russia/@54.7115288,20.324448,11z/'; //data=!3m1!4b1!4m5!3m4!1s0x46e33d8d4b7c21a9:0x5050960016126ed3!8m2!3d54.7104264!4d20.4522144';
var lastone='';
var avatar_at=''; //&avatar=y';
var nw='';
var oocom=null;
var na='noavatar';
var allowed=false;
function athn() {
allowed=true;
}
function changemode(selo) {
if (selo.value != '') {
document.getElementById('tzi').src=document.getElementById('tzi').src.split('?')[0] + '?tzexact=' + encodeURIComponent(selo.value) + '&tznickname=' + encodeURIComponent(selo.value.split('/')[eval(-1 + selo.value.split('/').length)].replace(/_/g,' ')) + avatar_at;
if (window.parent && allowed) { // maybe get_tz.php supervising
if (parent.document.getElementById('tz')) {
if (parent.document.getElementById('tz').value != selo.value.split('/')[eval(-1 + selo.value.split('/').length)].replace(/\_/g,' ')) {
parent.document.getElementById('tz').value=selo.value.split('/')[eval(-1 + selo.value.split('/').length)].replace(/\_/g,' ');
if (parent.obit) {
parent.obit();
}
}
}
}
}
document.getElementById('divideo').innerHTML="";
document.getElementById('divmap').innerHTML="";
lookforstz();
}
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() {
var dow=['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
setTimeout(eachsecond, 1000);
context.clearRect(0,0,elem.width,elem.height);
if (document.getElementById('addthis').value == '-0.0') {
adate=new Date();
} else {
var now = new Date();
adate=new Date(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), now.getUTCHours(), now.getUTCMinutes(), now.getUTCSeconds(), now.getUTCMilliseconds());
adate.setTime(adate.getTime() + (eval(document.getElementById('addthis').value) * 60 * 60 * 1000));
}
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=dow[eval('' + adate.getDay())] + ', ' + ('0' + adate.getDate()).slice(-2) + '-' + ('0' + eval(1 + eval('' + adate.getMonth()))).slice(-2) + '-' + ('' + adate.getFullYear()) + ' ' + ('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());
}
}
if (avatar_at == '') {
context.globalAlpha = 1.0;
} else {
context.globalAlpha = 0.6;
}
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=eval(2 + eval(bthickness));
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=eval(bthickness);
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=eval(1 + eval(bthickness));
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=eval(bthickness);
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();
if (eval((i + 1) % 30) == 1) {
context.globalAlpha = 0.5;
} else {
context.globalAlpha = 0.2;
}
context.strokeStyle = "#" + cone + "0" + ctwo + "0" + cthree + "0"; //'#40FF20';
context.stroke();
} else {
//alert('' + cone + ctwo + cthree);
context.beginPath();
context.lineWidth=eval(bthickness);
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();
if (eval((i + 1) % 30) == 1) {
context.globalAlpha = 0.5;
} else {
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 lookforstz() {
var gmi=gmidea;
if (document.getElementById('stz').innerHTML != '' && document.getElementById('stz').innerHTML != lastone) {
lastone=document.getElementById('stz').innerHTML;
document.getElementById('divideo').innerHTML="<iframe title=\"YouTube videos about " + (document.getElementById('stz').innerText || document.getElementById('stz').contentWindow || document.getElementById('stz').contentDocument) + "\" id=ivideo style='display:inline-block;width:40px;height:30px;overflow:hidden;' src='" + ytidea.replace('San+Francisco',encodeURIComponent('' + (document.getElementById('stz').innerText || document.getElementById('stz').contentWindow || document.getElementById('stz').contentDocument))) + '&ir=' + Math.floor(Math.random() * 198765342) + "'></iframe>";
gmi=gmi.replace("Kaliningrad,+Kaliningrad+Oblast,+Russia", ('' + (document.getElementById('stz').innerText || document.getElementById('stz').contentWindow || document.getElementById('stz').contentDocument)).replace(/\ /g, '+'));
if (xlongis < -900) {
document.getElementById('divmap').innerHTML="<a onclick=\"window.open('" + gmi.split('@')[0] + "','_blank','top=20,left=20,width=700,height=500');\" style=\"cursor:pointer;\" title=\"Google Maps\">🗺</a>";
} else {
gmi=gmi.replace("54.7115288", ylatis);
gmi=gmi.replace("20.324448", xlongis);
document.getElementById('divmap').innerHTML="<a onclick=\"" + gmi + "\" title=\"Google Maps\">🗺</a>";
}
} else {
setTimeout(lookforstz, 1000);
}
}
function onl() {
var atend=false;
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) {
if (document.URL.indexOf('mode=') != -1) {
if (document.getElementById('addthis').value == '-0.0') {
document.getElementById('addthis').value == '0.0';
setTimeout(lookforstz, 1000); // document.getElementById('divideo').innerHTML="<iframe id=ivideo style='display:inline-block;width:30px;height:30px' src='" + ytidea.replace('San+Francisco','') + "'></iframe>";
}
atend=true;
}
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);
if (tplace != '') {
setTimeout(setplace, 1500);
}
if (atend) { changemode(document.getElementById('sele')); }
}
function setplace() {
document.getElementById('selo').value=tplace;
tplace='';
changemode(document.getElementById('selo'));
}
function showmap() {
if (('' + document.getElementById('ourcanvas').getAttribute('data-geo')) != '') {
window.open("//www.rjmprogramming.com.au/PHP/Map/map.php?title=" + encodeURIComponent((document.getElementById('stz').innerText || document.getElementById('stz').contentWindow || document.getElementById('stz').contentDocument)) + "&onclick=y&label=['Lat',&value='Lon','Name']&data=,[" + document.getElementById('ourcanvas').getAttribute('data-geo') + ",~" + encodeURIComponent((document.getElementById('stz').innerText || document.getElementById('stz').contentWindow || document.getElementById('stz').contentDocument)) + "~]","_blank","top=50,left=50,width=500,height=500");
}
}
function datageo(inv) {
if (('' + document.getElementById('ourcanvas').getAttribute('data-geo')) != '') {
if (('' + document.getElementById('ourcanvas').getAttribute('data-geo')).indexOf(',') != -1) {
ylatis=eval(('' + document.getElementById('ourcanvas').getAttribute('data-geo')).split(',')[0]);
xlongis=eval(('' + document.getElementById('ourcanvas').getAttribute('data-geo')).split(',')[1]);
} else {
xlongis=-999.0;
ylatis=-999.0;
}
setTimeout(showmap, 1000);
}
return inv;
}
function toggleavatar(ocom) {
oocom=document.getElementById('sele');
if (avatar_at != '') {
avatar_at='';
if (document.getElementById('sele').value != '') {
location.href=document.URL.split('#')[0].split('?')[0] + '?mode=' + encodeURIComponent(document.getElementById('sele').value) + '&x=' + Math.floor(Math.random() * 12895643);
} else{
changemode(document.getElementById('sele'));
}
} else {
ocom.innerHTML='<select onclick="event.stopPropagation();" style="width:40px;padding-left:15px;padding-right:15px;" title="background-blend-mode:multiply" onchange="if (this.value == na) { toggleavatar(null); } else { avatar_at=avatar_at.substring(0,8) + this.value; this.title=this.title.substring(0,22) + this.value; this.value=nw; } changemode(oocom);"><option value="">,</option><option value=normal>normal</option><option value=multiply>multiply</option><option value=screen>screen</option><option value=overlay>overlay</option><option value=darken>darken</option><option value=lighten>lighten</option><option value=color-dodge>color-dodge</option><option value=saturation>saturation</option><option value=color>color</option><option value=luminosity>luminosity</option><option value=' + na + '>Non Avatar Mode</option></select>';
avatar_at='&avatar=multiply';
changemode(document.getElementById('sele'));
}
}
</script>
<style>
.glow {
-webkit-animation: glow 1s ease-in-out infinite alternate;
-moz-animation: glow 1s ease-in-out infinite alternate;
animation: glow 1s ease-in-out infinite alternate;
}
/* Thanks to https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_glowing_text */
@-webkit-keyframes glow {
from {
box-shadow: 0 0 3px #fff, 0 0 5px #fff, 0 0 37px #e60073, 0 0 9px #e60073, 0 0 11px #e60073, 0 0 13px #e60073, 0 0 15px #e60073;
}
to {
box-shadow: 0 0 24px #fff, 0 0 6px #ff4da6, 0 0 8px #ff4da6, 0 0 10px #ff4da6, 0 0 12px #ff4da6, 0 0 14px #ff4da6, 0 0 16px #ff4da6;
}
}
</style>
</head>
<body align="center" style="background-color: lightblue;" onload=" setTimeout(athn, 5000); 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> <span id=stz></span> <div title='Google Maps' id=divmap style='display:inline-block;margin-top:20px;width:40px;height:30px;overflow:hidden;'></div> <div title='YouTube videos' id=divideo style='display:inline-block;margin-top:28px;width:40px;height:28px;overflow:hidden;'></div></h1>
<h4 align="center">RJM Programming <a onclick="document.getElementById('dtop').style.display='none';" style="text-decoration:underline;cursor:pointer;">-</a> July <a id=iavatar title='Toggle Emoji avatar transparent background mode' style='text-decoration:underline;cursor:pointer;' onclick='toggleavatar(this);' class=glow>,</a> 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><div id=dc><canvas title="" onclick="document.getElementById(' + "'" + 'dtop' + "'" + ').style.display=datageo(' + "'" + '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></div>');
} 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><div id=dc><canvas title="" onclick="document.getElementById(' + "'" + 'dtop' + "'" + ').style.display=datageo(' + "'" + '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></div>');
} else {
document.write('<br><br><div id=dc><canvas title="" onclick="document.getElementById(' + "'" + 'dtop' + "'" + ').style.display=datageo(' + "'" + '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></div>');
}
</script>
<iframe style='display:none;' id=tzi src='../PHP/fgc/?tzlist=y'></iframe>
<input type=hidden id=addthis value='-0.0'></input>
</body>
</html>