let my={} let deg2rad=Math.PI/180.0 let w=726;let h=363;function solclockMain(mode='sun'){let version='0.64';my.mode=mode my.drag={onQ:false,lastTime:-1000000} my.lastTimeStr='' my.days=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];my.months=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];let s="";s+='' s+=`
` my.imgHome=(document.domain=='localhost')?'/mathsisfun/measure/images/':'/measure/images/' s+='';s+='';my.gs=[] for(let i=0;i<4;i++){s+=`` my.gs.push(i)} s+='
' s+='
' s+='
Local:
' s+='
' s+='
' s+='
' s+='
UTC:  
' s+='
' s+='
' s+='
' s+='
' s+='';s+='';s+='
' s+='
© 2020 MathsIsFun.com v'+version+'
';s+='
';document.write(s);let ratio=2;my.gs=my.gs.map(g=>{let el=document.getElementById('canvas'+g);el.width=w*ratio;el.height=h*ratio;el.style.width=w+"px";el.style.height=h+"px";g=el.getContext("2d");g.setTransform(ratio,0,0,ratio,0,0);return g}) my.mapType='mask' my.sol=new Sun('aaa',55,'yellow') my.sol.draw();if(my.mode=='sun'){my.solQ=true my.tzQ=false}else{my.solQ=false my.tzQ=true} my.solQ=!my.solQ toggleSol() my.tzQ=!my.tzQ toggleTz() window.addEventListener('mousemove',function(ev){mouseMove(ev)}) window.addEventListener('touchmove',function(ev){console.log('touchmove') let touch=ev.targetTouches[0];ev.clientX=touch.clientX;ev.clientY=touch.clientY;ev.touchQ=true;mouseMove(ev)}) window.addEventListener("keydown",key,false);my.xChg=0 my.yChg=0 my.sclChg=0 my.tzs=tzsGet() my.tzFracs=[{time:3.5,name:'',latMin:25,latMax:38},{time:4.5,name:'',latMin:23,latMax:35},{time:5.5,name:'India',latMin:5,latMax:31},{time:6.5,name:'Burma?',latMin:13,latMax:33},{time:9.5,name:'SA',latMin:-38,latMax:-10},] my.tzTime=0 tzLoop(my.gs[0]) let div=document.getElementById('nightImg') div.onload=function(){solPos(my.gs[1])};footerPlot(my.gs[2]) timeUpdate() setInterval(timeUpdate,1000)} function timeUpdate(){let dt=new Date() let dateStr=my.months[dt.getMonth()]+' '+dt.getDate() let timeStr=my.days[dt.getDay()]+' '+timeFmt(dt.getHours(),dt.getMinutes()) if(timeStr!=my.lastTimeStr){my.lastTimeStr=timeStr document.getElementById('locDate').innerHTML=dateStr document.getElementById('locTime').innerHTML=timeStr document.getElementById('UTCTime').innerHTML=my.days[dt.getUTCDay()]+' '+timeFmt(dt.getUTCHours(),dt.getUTCMinutes()) if(my.drag.lastTime+2000012)h-=12 if(h==0){hh='12'}else{hh=(h<10)?'0'+h:''+h}}else{if(h<10)hh='0'+h;} let mm=(m<10)?'0'+m:''+m let timeStr='' if(mode=='am'){timeStr=hh+mm;}else{timeStr=hh+':'+mm} return timeStr} function tzLoop(){let g=my.gs[3] g.clearRect(0,0,g.canvas.width,g.canvas.height) my.tzs.map(tz=>{if(tz.time==my.tzTime){tzPlot(g,tz,true)}else{}})} function footerPlot(g){g.strokeStyle='black' g.textAlign='center' for(let i=0;i<=24;i++){let x=(i-0.5)*(w/24)-1 let y=320 g.fillStyle='hsla(0,0%,0%,0.8)' g.beginPath() g.rect(x,y,w/24,35) g.fill() let hh=i-12 let ew='0' if(hh>0)ew=hh*15+'E' if(hh<0)ew=-hh*15+'W' g.fillStyle='white' g.font='11px Arial' g.fillText(ew,x+w/48,y+15) let hhStr=((hh>0)?'+':'')+hh g.fillStyle='yellow' g.font='14px Arial' g.fillText(hhStr,x+w/48,y+30)}} function tzPlot(g,tz,chgQ){let poly1=tz.poly g.strokeStyle='black' g.fillStyle=chgQ?'hsla(240,100%,90%,0.5)':'hsla(60,100%,90%,0.05)' g.beginPath() g.moveTo(1,1) let xStt=tz.xStt let yStt=tz.yStt let xScl=tz.xScl let yScl=tz.yScl if(chgQ){xStt+=my.xChg yStt+=my.yChg xScl+=my.sclChg yScl+=my.sclChg} let sttQ=false poly1.map(pt=>{let xp=xStt+pt[0]*xScl let yp=yStt+pt[1]*yScl if(!sttQ){g.moveTo(xp,yp) sttQ=true} g.lineTo(xp,yp)}) g.fill();} function solChg(x,y){let lon=intToLon(x) let lat=intToLat(y) console.log('solChg',x,y,lat,lon) polyDo(my.gs[1],lat,lon)} function mouseMove(ev){if(my.drag.onQ){my.drag.lastTime=performance.now() let div=my.drag.div let lt=parseFloat(div.style.left)+ev.clientX-my.drag.x div.style.left=lt+'px' my.drag.x=ev.clientX let tp=parseFloat(div.style.top)+ev.clientY-my.drag.y div.style.top=tp+'px' my.drag.y=ev.clientY}else{let el=document.getElementById('canvas0') var bRect=el.getBoundingClientRect();let ratio=2 let mouseX=(ev.clientX-bRect.left)*(el.width/ratio/bRect.width);let mouseY=(ev.clientY-bRect.top)*(el.height/ratio/bRect.height);let time=Math.round(24*mouseX/w)-12 let lon=intToLon(mouseX) let lat=intToLat(mouseY) let tzFrac=null my.tzFracs.map(tz=>{if(tz.time>time&&tz.timetz.latMin&&lat90){lat=lat-180;} console.log('solPos lon,lat:',lon,lat) my.sol.setxy(lonToInt(lon),latToInt(lat)) polyDo(g,lat,lon)} function polyDo(g,lat,lon){let poly=shadowPoly(lat,lon,-0.01) if(my.mapType=="mask"){let g2=my.gs[1] let el=g2.canvas let ratio=1 el.width=w*ratio;el.height=h*ratio;el.style.width=w+"px";el.style.height=h+"px";g2.beginPath();let ptN=0;while(ptN{if(pt[1]==0)pt[1]=h else if(pt[1]==h)pt[1]=0}) g.clearRect(0,0,g.canvas.width,g.canvas.height) g.fillStyle='hsla(60,100%,90%,0.2)' g.beginPath() polyPlot(g,poly,true,w,h);g.fill();}} function shadowPoly(solLat,solLon,svWanted){let poly1=[];let poly2=[];let delta=w/50 let i=0;while(i<=w){let pLon=intToLon(i);let latLo=solLatFind(solLat,solLon,pLon,solLat,intToLat(h),svWanted);let latHi=solLatFind(solLat,solLon,pLon,intToLat(0),solLat,svWanted);if(latLo==-1000&&latHi==-1000){if(solLat>0){poly1.push([i,h]) poly2.push([i,h])}else{poly1.push([i,0]) poly2.push([i,0])} i=i+delta;continue} if(latLo==-1000){if(solLat>0){poly1.push([i,latToInt(latHi)]) poly2.push([i,h])}else{poly1.push([i,0]) poly2.push([i,latToInt(latHi)])} i=i+delta;continue} if(latHi==-1000){if(solLat>0){poly1.push([i,latToInt(latLo)]) poly2.push([i,h])}else{poly1.push([i,0]) poly2.push([i,latToInt(latLo)])} i=i+delta;continue} if(true){let lat=0 if(latLo>-1000){lat=latLo;}else{lat=latHi;} if(solLat>0){poly1.push([i,latToInt(lat)]) poly2.push([i,h])}else{poly1.push([i,0]) poly2.push([i,latToInt(lat)])}} i=i+delta;} if(poly1.length>0){poly2.reverse();poly1=poly1.concat(poly2);return poly1} return[]} function polyPlot(g,poly,shadedPolyQ,outerW,outerH){let ptN=0;while(ptNaWanted&&sv2>aWanted)return-1000 let svSign=sv1>sv2?-1:1 let latMid=0 while(true){latMid=(lat1+lat2)/2;let svMid=solVal(solLat,solLon,latMid,pLon);if(svMid==aWanted){break;} if(svMid*svSign