v1.004


shortcut keys
esc / enter / p = pause / unpause
del = restart
> = fast forward
home or h = home
m = mute / unmute
enter = next screen
1-5 q-t a-g z-b = select defenses

click to dismiss
Welcome to Kaleidoscope
Create your own amazing kaleidoscope shows, still images, or sit back and enjoy the show
You'll find over one hundred brushes and tools on the left, a large palette of colors up top, layers on the right, options below and lots to explore everywhere
Open file dialog
'; windowContent += ''; windowContent += '';//style="height:'+dh+';width:'+dw+';" windowContent += ''; windowContent += ''; const printWin = window.open('', '', 'width=' + screen.availWidth + ',height=' + screen.availHeight); printWin.document.open(); printWin.document.write(windowContent); printWin.document.addEventListener('load', function() { printWin.focus(); printWin.print(); printWin.document.close(); printWin.close(); }, true); //clear print1ctx.clearRect(0,0,canvassize,canvassize); print2ctx.clearRect(0,0,print2ctx.canvas.width,print2ctx.canvas.height); } //alert(left+" : "+top+" : "+sw+" : "+sh+" : "+dl+" : "+dt+" : "+dw+" : "+dh); //document.getElementById('testdiv').innerHTML=redosteps;//sh+" : "+sw;//+" : "+recentnc1+" : "+recentnc2+" : "+recentnc3+" : "+recentnc4;// + " : " + framevis;//+" : "+brushtype; document.getElementById('processingdiv').style.visibility='hidden'; } /* function print5() { var win=window.open(); win.document.write("
"); win.print(); win.location.reload(); if(tempspin==1){pause();} if(menuvis){closemenu();} request=""; } */ function drawgrayscalesquare(canv) { //if(spin==1){reqest="pause";} var dist = Math.hypot(drawX+offsetX-chs,drawY+offsetY-chs); var sang = Math.atan2(drawY+offsetY - chs, drawX+offsetX - chs) * DivPie; if(canv!='brushctx' && canv!='main1ctx' && canv!='main2ctx'){sang-=window['l'+activelayer+'ang'];} for(var ang=0;ang<360;ang+=kalang) { sang+=kalang; var x = chs + Math.cos(sang * torad) * dist - hbs; var y = chs + Math.sin(sang * torad) * dist - hbs; //get data var imageData = window[canv].getImageData(x, y, brushsize, brushsize); var data = imageData.data; for(var i = 0; i < data.length; i += 4) { var c=Math.round((data[i] + data[i+1] + data[i+2])/3); data[i] = c; // red data[i + 1] = c; // green data[i + 2] = c; // blue } window[canv].putImageData(imageData, x, y); } } function drawgrayscalecircle(canv) { //if(spin==1){reqest="pause";} var dist = Math.hypot(drawX+offsetX-chs,drawY+offsetY-chs); var sang = Math.atan2(drawY+offsetY - chs, drawX+offsetX - chs) * DivPie; if(canv!='brushctx' && canv!='main1ctx' && canv!='main2ctx'){sang-=window['l'+activelayer+'ang'];} for(var ang=0;ang<360;ang+=kalang) { sang+=kalang; var dx = chs + Math.cos(sang * torad) * dist - hbs; var dy = chs + Math.sin(sang * torad) * dist - hbs; //get data var imageData = window[canv].getImageData(dx, dy, brushsize, brushsize); var data = imageData.data; if(ang==0){var dw=imageData.width;} for(var i = 0; i < data.length; i += 4) { var y = Math.floor(i/(dw*4)); var x = (i-y*dw*4)*.25; if(y<=hbs){y=hbs-y;} else{y-=hbs;} if(x<=hbs){x=hbs-x;} else{x-=hbs;} if(Math.hypot(x,y)<=hbs) { var c=Math.round((data[i] + data[i+1] + data[i+2])/3); data[i] = c;// r data[i + 1] = c;// g data[i + 2] = c;// b } } window[canv].putImageData(imageData, dx, dy); } } function drawblendsquare(canv) { //if(spin==1){reqest="pause";} var dist = Math.hypot(drawX+offsetX-chs,drawY+offsetY-chs); var sang = Math.atan2(drawY+offsetY - chs, drawX+offsetX - chs) * DivPie; if(canv!='brushctx' && canv!='main1ctx' && canv!='main2ctx'){sang-=window['l'+activelayer+'ang'];} for(var ang=0;ang<360;ang+=kalang) { sang+=kalang; var dx = chs + Math.cos(sang * torad) * dist - hbs; var dy = chs + Math.sin(sang * torad) * dist - hbs; //get data var imageData = window[canv].getImageData(dx, dy, brushsize, brushsize); var data = imageData.data; if(ang==0){var dw=imageData.width;} var rate = timeelapsed*.0058; var r=0; var g=0; var b=0; var n=0; for(var i = 0; i < data.length; i += 4) { r+=data[i]; g+=data[i+1]; b+=data[i+2]; n++; } r/=n; g/=n; b/=n; for(var i = 0; i < data.length; i += 4) { if(data[i]r){data[i]-=Math.max(1,Math.min(data[i]-r,rate));} if(data[i+1]g){data[i+1]-=Math.max(1,Math.min(data[i]-g,rate));} if(data[i+2]b){data[i+2]-=Math.max(1,Math.min(data[i]-b,rate));} } window[canv].putImageData(imageData, dx, dy); } } function drawblendcircle(canv) { //if(spin==1){reqest="pause";} var dist = Math.hypot(drawX+offsetX-chs,drawY+offsetY-chs); var sang = Math.atan2(drawY+offsetY - chs, drawX+offsetX - chs) * DivPie; if(canv!='brushctx' && canv!='main1ctx' && canv!='main2ctx'){sang-=window['l'+activelayer+'ang'];} for(var ang=0;ang<360;ang+=kalang) { sang+=kalang; var dx = chs + Math.cos(sang * torad) * dist - hbs; var dy = chs + Math.sin(sang * torad) * dist - hbs; //get data var imageData = window[canv].getImageData(dx, dy, brushsize, brushsize); var data = imageData.data; if(ang==0){var dw=imageData.width;} var rate = timeelapsed*.0058; var r=0; var g=0; var b=0; var n=0; for(var i = 0; i < data.length; i += 4) { var y = Math.floor(i/(dw*4)); var x = (i-y*dw*4)*.25; if(y<=hbs){y=hbs-y;} else{y-=hbs;} if(x<=hbs){x=hbs-x;} else{x-=hbs;} if(Math.hypot(x,y)<=hbs) { r+=data[i]; g+=data[i+1]; b+=data[i+2]; n++; } } r/=n; g/=n; b/=n; for(var i = 0; i < data.length; i += 4) { var y = Math.floor(i/(dw*4)); var x = (i-y*dw*4)*.25; if(y<=hbs){y=hbs-y;} else{y-=hbs;} if(x<=hbs){x=hbs-x;} else{x-=hbs;} if(Math.hypot(x,y)<=hbs) { if(data[i]r){data[i]-=Math.max(1,Math.min(data[i]-r,rate));} if(data[i+1]g){data[i+1]-=Math.max(1,Math.min(data[i]-g,rate));} if(data[i+2]b){data[i+2]-=Math.max(1,Math.min(data[i]-b,rate));} } } window[canv].putImageData(imageData, dx, dy); } } function drawmorebluecircle(canv) { var imageData = window[canv].getImageData(drawX+offsetX-hbs,drawY+offsetY-hbs, brushsize,brushsize); var data = imageData.data; var dw = imageData.width; var rate = timeelapsed*.0058; for(var i = 0; i < data.length; i += 4) { var y = Math.floor(i/(dw*4)); var x = (i-y*dw*4)*.25; if(y<=hbs){y=hbs-y;} else{y-=hbs;} if(x<=hbs){x=hbs-x;} else{x-=hbs;} if(Math.hypot(x,y)<=hbs) { data[i]-=Math.max(1,rate); data[i+1]-=Math.max(1,rate); data[i+2]+=Math.max(1,rate); } } window[canv].putImageData(imageData,drawX+offsetX-hbs,drawY+offsetY-hbs); } function layerinvert() { if(menuvis){closemenu();} if(pal1vis){showpalette1();} if(brushmenuvis){showbrushes();} var imageData = window['l'+activelayer+'ctx'].getImageData(0, 0, canvassize, canvassize); var data = imageData.data; for(var i = 0; i < data.length; i += 4) { data[i] = 255 - data[i]; // red data[i + 1] = 255 - data[i + 1]; // green data[i + 2] = 255 - data[i + 2]; // blue } window['l'+activelayer+'ctx'].putImageData(imageData, 0, 0); needlastundo=1; createundopoint(); } function layerbw() { if(menuvis){closemenu();} if(pal1vis){showpalette1();} if(brushmenuvis){showbrushes();} var imageData = window['l'+activelayer+'ctx'].getImageData(0, 0, canvassize, canvassize); var data = imageData.data; for(var i = 0; i < data.length; i += 4) { var c=data[i] + data[i+1] + data[i+2]; if(c<381){c=0;}//half of 256*3 shifted down 3 for counting from zero else{c=255;} data[i] = c; // red data[i + 1] = c; // green data[i + 2] = c; // blue } window['l'+activelayer+'ctx'].putImageData(imageData, 0, 0); needlastundo=1; createundopoint(); } function layergrayscale() { if(menuvis){closemenu();} if(pal1vis){showpalette1();} if(brushmenuvis){showbrushes();} var imageData = window['l'+activelayer+'ctx'].getImageData(0, 0, canvassize, canvassize); var data = imageData.data; for(var i = 0; i < data.length; i += 4) { var c=Math.round((data[i] + data[i+1] + data[i+2])/3); data[i] = c; // red data[i + 1] = c; // green data[i + 2] = c; // blue } window['l'+activelayer+'ctx'].putImageData(imageData, 0, 0); needlastundo=1; createundopoint(); } function layersepia() { if(menuvis){closemenu();} if(pal1vis){showpalette1();} if(brushmenuvis){showbrushes();} var imageData = window['l'+activelayer+'ctx'].getImageData(0, 0, canvassize, canvassize); var data = imageData.data; for(var i = 0; i < data.length; i += 4) { var r=data[i]; var g=data[i+1]; var b=data[i+2]; data[i] = Math.min(255,r*.393 + g*.769 + b*.189);// r data[i+1] = Math.min(255,r*.349 + g*.686 + b*.168);// g data[i+2] = Math.min(255,r*.272 + g*.534 + b*.131);// b } window['l'+activelayer+'ctx'].putImageData(imageData, 0, 0); needlastundo=1; createundopoint(); } function drawsepiacircle(canv) { //if(spin==1){reqest="pause";} var imageData = window[canv].getImageData(drawX+offsetX-hbs,drawY+offsetY-hbs, brushsize,brushsize); var data = imageData.data; var dw=imageData.width; for(var i = 0; i < data.length; i += 4) { var match=""; for(var m=0;m0;i--) { x=Math.random()*(brushsize-rad*2)+rad; y=Math.random()*brushsize*.8+hbs*1.2; workingctx.beginPath(); workingctx.moveTo(x, hbs); workingctx.lineTo(x, hbs+y); workingctx.stroke(); workingctx.beginPath(); workingctx.arc(x, hbs + y-1, rad, 0, Math.PI); workingctx.fill(); } //copy to all locations for(var ang=0;ang<360;ang+=kalang) { window[canv].drawImage(w1, 0, 0, brushsize, brushsize*2, -chs + drawX+offsetX-hbs, -chs + drawY+offsetY-hbs, brushsize, brushsize*2); if(ang<360){window[canv].rotate(kalang*torad);} } } function drawcopy(canv) { customctx.strokeStyle = 'rgba(0,0,0,0)'; if(canv!='brushctx' && canv!='main1ctx' && canv!='main2ctx')//draw { //copy layer to custom customctx.clearRect(0, 0,601,601); customctx.save(); customctx.beginPath(); customctx.arc(300, 300, 300, 0, 2 * Math.PI); customctx.closePath(); customctx.clip(); customctx.drawImage(window['l'+activelayer],drawX+offsetX-hbs, drawY+offsetY-hbs, brushsize, brushsize, 0, 0, 600, 600); customctx.restore(); } /* if(canv=='brushctx' || canv=='main1ctx' || canv=='main2ctx')//brush { //outer line window[canv].strokeStyle = 'rgba('+color1R+','+color1G+','+color1B+',1)'; window[canv].globalAlpha=1; window[canv].beginPath(); window[canv].arc(-chs + drawX+offsetX, -chs + drawY+offsetY, hbs, 0, 2 * Math.PI, false); window[canv].stroke(); } */ } function drawpaste(canv) { for(var ang=0;ang<360;ang+=kalang) { //copy to layer window[canv].drawImage(customcanvas, 0, 0, 600, 600, -chs+drawX+offsetX-hbs, -chs+drawY+offsetY-hbs, brushsize, brushsize); if(ang<360){window[canv].rotate(kalang*torad);} } } function drawsmudge(canv) { for(var ang=0;ang<360;ang+=kalang) { if(canv!='brushctx' && canv!='main1ctx' && canv!='main2ctx')//draw { workingctx.strokeStyle = 'rgba(0,0,0,0)'; window[canv].globalAlpha=brushopac*.01*.08; //copy layer to working above workingctx.clearRect(0, 0, brushsize+1, brushsize+1) workingctx.save(); workingctx.beginPath(); workingctx.arc(hbs, hbs, hbs, 0, 2 * Math.PI); workingctx.closePath(); workingctx.clip(); workingctx.drawImage(window['l'+activelayer],drawX+offsetX-hbs, drawY+offsetY-hbs, brushsize, brushsize, 0, 0, brushsize, brushsize); workingctx.restore(); //copy below to layer window[canv].drawImage(workingcanvas, 0, brushsize+10, brushsize, brushsize, -chs+drawX+offsetX-hbs, -chs+drawY+offsetY-hbs, brushsize, brushsize); //copy above to working below workingctx.clearRect(0, brushsize+10, brushsize+1, brushsize+1); workingctx.save(); workingctx.beginPath(); workingctx.arc(hbs, hbs+brushsize+10, hbs, 0, 2 * Math.PI); workingctx.closePath(); workingctx.clip(); workingctx.drawImage(workingcanvas, 0, 0, brushsize, brushsize, 0, brushsize+10, brushsize, brushsize); workingctx.restore(); } /* if(canv=='brushctx' || canv=='main1ctx' || canv=='main2ctx')//brush { //outer line window[canv].strokeStyle = 'rgba('+color1R+','+color1G+','+color1B+',1)'; window[canv].globalAlpha=1; window[canv].beginPath(); window[canv].arc(-chs + drawX+offsetX, -chs + drawY+offsetY, hbs, 0, 2 * Math.PI, false); window[canv].stroke(); } */ if(ang<360){window[canv].rotate(kalang*torad);} } } function draweyedropper(canv) { if(canv=='brushctx' || canv=='main1ctx' || canv=='main2ctx') { window[canv].strokeStyle = 'rgba('+toolR+','+toolG+','+toolB+',1)'; window[canv].beginPath(); window[canv].arc(-chs + drawX+offsetX, -chs + drawY+offsetY, 2, 0, 2 * Math.PI); window[canv].stroke(); } else { var imageData = window['l'+activelayer+'ctx'].getImageData(drawX+offsetX,drawY+offsetY, 4, 4); var data = imageData.data; if(data[3]>0)//test alpha to see if you actually clicked on color instead of just background { var r=data[0]; var g=data[1]; var b=data[2]; var a=data[3]/2.55;//alert(a) changebrushcolor("rgba("+r+","+g+","+b+",1)"); //brushopac=data[3]*100; //opacadj(a); brushopac=Math.max(0,Math.min(100,Math.round(a))); document.getElementById('opacdiv').value=brushopac; } } } /* function eyedropper() { //if(spin==1){reqest="pause";} var imageData = window['l'+activelayer+'ctx'].getImageData(drawX+offsetX,drawY+offsetY, 4000, 4000); var data = imageData.data; if(data[3]>0)//test alpha to see if you actually clicked on color instead of just background { var r=data[0]; var g=data[1]; var b=data[2]; changebrushcolor("rgba("+r+","+g+","+b+",1)"); repeat=1; } } */ /* function invert() { //if(spin==1){reqest="pause";} var imageData = window['l'+activelayer+'ctx'].getImageData(0, 0, canvassize,canvassize); var data = imageData.data; for(var i = 0; i < data.length; i += 4) { data[i] = 255 - data[i]; // red data[i + 1] = 255 - data[i + 1]; // green data[i + 2] = 255 - data[i + 2]; // blue } window['l'+activelayer+'ctx'].putImageData(imageData,0, 0); needlastundo=1; createundopoint(); } */ /* window['l'+activelayer+'ctx'].save(); window['l'+activelayer+'ctx'].globalCompositeOperation='difference'; window['l'+activelayer+'ctx'].fillStyle='white'; window['l'+activelayer+'ctx'].fillRect(0,0,canvassize,canvassize); window['l'+activelayer+'ctx'].restore(); */ function clearlayer() { if(menuvis){closemenu();} if(!programstatus && window['displayer'+activelayer]) { window['l'+activelayer+'ctx'].clearRect(0,0,canvassize,canvassize); needlastundo=1; createundopoint(); window['displayer'+activelayer]=""; } } /* if(menuvis){closemenu();} brushmenuvis=1; document.getElementById('brushdiv').style.visibility='visible'; document.getElementById('screenblackdiv').style.visibility='visible'; document.getElementById('brushdiv').style.pointerEvents='auto'; } } function showpalette1() { if(pal1vis) { pal1vis=""; document.getElementById('palettediv1').style.visibility='hidden'; document.getElementById('screenblackdiv').style.visibility='hidden'; document.getElementById('palettediv1').style.pointerEvents='none'; } else { if(menuvis){closemenu();} */ function menu() { if(programstatus && programstatus!="endkal"){endkal();} if(menuvis){closemenu();} else{openmenu();} } function openmenu() { if(pal1vis){showpalette1();} if(brushmenuvis){showbrushes();} var temp=""; temp+="
close menu (x)
"; temp+="
"; temp+="
print at dot size
"; temp+="
"; temp+="
save project (download folder)
"; temp+="
export flattened image (download folder)
"; temp+="
load project
"; temp+="
load image to layer
"; temp+="
load image to brush
"; temp+="
run kaleidoscope show
"; temp+="
"; temp+="
rotate layer clockwise
"; temp+="
rotate layer counterclockwise
"; temp+="
flip layer horizontally
"; temp+="
flip layer vertically
"; temp+="
"; temp+="
invert colors on layer (i)
"; temp+="
change layer to black & white
"; temp+="
change layer to grayscale
"; temp+="
change layer to sepia
"; temp+="
"; temp+="
delete layer
"; temp+="
delete all layers
"; temp+="
"; if(!hideframe){temp+="
hide frame when inactive
";} else{temp+="
show frame at all times
";} temp+="
reverse spin (r)
"; temp+="
"; temp+="tips:
"; temp+="
"; temp+="Use the arrow keys to move the brush in straight lines and the ctrl key to toggle between draw and move."; temp+="
"; temp+="Press the (Q) key to precisely draw one touch of the brush."; document.getElementById("mainmenu").innerHTML=temp; document.getElementById("mainmenu").style.visibility='visible'; menuvis=1; } function reversespin(){spindir*=-1;closemenu();if(spin==0){pause();}} function closeallmenus() { if(programstatus && programstatus!="endkal"){endkal();} document.getElementById('topmessagediv').style.visibility='hidden'; document.getElementById('bottommessagediv').style.visibility='hidden'; menuvis=""; document.getElementById("mainmenu").style.visibility='hidden'; brushmenuvis=""; document.getElementById('brushdiv').style.visibility='hidden'; document.getElementById('screenblackdiv').style.visibility='hidden'; document.getElementById('brushdiv').style.pointerEvents='none'; document.getElementById('brushmessagediv').style.visibility="hidden"; pal1vis=""; document.getElementById('palettediv1').style.visibility='hidden'; document.getElementById('screenblackdiv').style.visibility='hidden'; document.getElementById('palettediv1').style.pointerEvents='none'; } function closemenu() { document.getElementById("mainmenu").style.visibility='hidden'; menuvis=""; } function pressdot() { if(programstatus && programstatus!="endkal"){endkal();} if(toolmode=="destination-out"){pressdraw();} else{presserase();} } function pressdraw() { if(menuvis){closemenu();} if(pal1vis){showpalette1();} if(brushmenuvis){showbrushes();} if(programstatus && programstatus!="endkal"){endkal();} toolmode=lastdraw; var sel = document.getElementById('toolmodeselect'); var opts = sel.options; for (var opt, i = 0; opt = opts[i]; i++) { if (opt.value == lastdraw) { sel.selectedIndex = i; break; } } document.getElementById('dot').style.backgroundColor="green"; } function presserase() { toolmode="destination-out"; document.getElementById("toolmodeselect").selectedIndex = "0"; document.getElementById('dot').style.backgroundColor="red"; } function setgamekeys() { document.body.onkeyup = function(e) { key="up"; } document.body.onkeydown = function(e) { //print //if(e.keyCode == 192){print();} //loadtolayer //if(e.keyCode == 112){openmenu();} //if(e.keyCode == 79){loadtolayer();} if(e.keyCode == 17) { if(drawkey){drawkey="";} else{drawkey=1;} } if(e.keyCode == 68 || e.keyCode == 45){pressdraw();} if(e.keyCode == 69 || e.keyCode == 46){presserase();} if(e.keyCode == 70){fullscreen();}/* { if(hideframe){showframes();} else{hideframes();} }*/ if(e.keyCode == 66){showbrushes();} if(e.keyCode == 67){showpalette1();} if(e.keyCode == 82){reversespin();} if(e.keyCode == 88){closeallmenus();} //save //if(e.keyCode == 192){save();} //layers //if(e.keyCode>48 && e.keyCode<=48+maxlayers){setlayer(e.keyCode-48);} //layers if(e.keyCode == 82){changecolormode();}//window['colormode'+selectedcolor]=="rainbow";} /*ssssssss //center if(e.keyCode == 67 && key=="up") { drawX=chs-offsetX-drawX; drawY=chs-offsetY-drawY; neonX=""; neonY=""; draw("draw"); } */ //snap if(e.keyCode == 83){changesnap();} //mode //if(e.keyCode == 77 && key=="up"){request="changetoolmode";} //right if(e.keyCode == 39) { if(snap=="on") { drawX=Math.round(lastdrawX/brushsize)*brushsize+brushsize; drawY=Math.round(lastdrawY/brushsize)*brushsize; } else { drawX=lastdrawX+hbs*.2; drawY=lastdrawY; } neonX=""; neonY=""; if(drawkey){draw("draw");} mousetime=timenow; lastdrawX=drawX; lastdrawY=drawY; mouseX=drawX; mouseY=drawY; } //left if(e.keyCode == 37) { if(snap=="on") { drawX=Math.round(lastdrawX/brushsize)*brushsize-brushsize; drawY=Math.round(lastdrawY/brushsize)*brushsize; } else { drawX=lastdrawX-hbs*.2; drawY=lastdrawY; } neonX=""; neonY=""; if(drawkey){draw("draw");} mousetime=timenow; lastdrawX=drawX; lastdrawY=drawY; mouseX=drawX; mouseY=drawY; } //up if(e.keyCode == 38) { if(snap=="on") { drawX=Math.round(lastdrawX/brushsize)*brushsize; drawY=Math.round(lastdrawY/brushsize)*brushsize-brushsize; } else { drawX=lastdrawX; drawY=lastdrawY-hbs*.2; } neonX=""; neonY=""; if(drawkey){draw("draw");} mousetime=timenow; lastdrawX=drawX; lastdrawY=drawY; mouseX=drawX; mouseY=drawY; } //down if(e.keyCode == 40) { if(snap=="on") { drawX=Math.round(lastdrawX/brushsize)*brushsize; drawY=Math.round(lastdrawY/brushsize)*brushsize+brushsize; } else { drawX=lastdrawX; drawY=lastdrawY+hbs*.2; } neonX=""; neonY=""; if(drawkey){draw("draw");} mousetime=timenow; lastdrawX=drawX; lastdrawY=drawY; mouseX=drawX; mouseY=drawY; } if(e.keyCode == 81){draw("draw");} //size if(e.keyCode == 107){sizeup();} if(e.keyCode == 109){sizedown();} //opacity if(e.keyCode == 33){opacup();} if(e.keyCode == 34){opacdown();} //stop & reset angle if(e.keyCode == 48){rotatezero();} //if(e.keyCode == 190){l1spin=Math.min(60,l1spin+.0004);}//clockwise //if(e.keyCode == 188){l1spin=Math.max(-60,l1spin-.0004);}//counter clockwise //invert if(e.keyCode == 73){request="layerinvert";} //clear current layer //if(e.keyCode == 46){request="clearlayer";} if(e.keyCode == 80){request="pause";} if(e.keyCode == 89 || e.keyCode == 190){request="redo";} if(e.keyCode == 90 || e.keyCode == 188 || e.keyCode == 8){request="undo";} key="down"; } } /* function setupspin() { var s=-.00012; for(var i=1;i<=maxlayers;i++) { window['l'+i+'spin']=s; s*=-.5; } } */ function setupspin() { var s=.06; for(var i=1;i<=maxlayers;i++) { window['l'+i+'spin']=s; s*=-.65; } } function loadlogos() { var companylogo = new Image(); companylogo.onload = function() { var publisherlogo = new Image(); publisherlogo.onload = function() { startup(); } publisherlogo.src='publisher.png'; } companylogo.src='company.gif'; } function startup() { sizefixed(); resizeElements(); document.getElementById('color1div').style.backgroundImage="linear-gradient(to bottom right, #FF0000, #00FF00, #0000FF)"; document.getElementById('color2div').style.backgroundImage="linear-gradient(to bottom right, #FF0000, #00FF00, #0000FF)"; //loadingscreen(); //loadsaved(); setgamekeys(); //preloadgame(); setupspin(); drawX=dispW*.5; drawY=dispH*.5; restartcompanylogoscreen(); } /* function preloadgif() { var loader = new Image(); loader.onload = function() { loadpoints++; var thing=document.getElementById('companylogopic'); thing.style.height=dispH; thing.style.width=dispW; } if(errorpoints<600){loader.onerror = function() {errorpoints++;preloadgif();};}; loader.src = "rglogo1.gif"; } function loadpnghandle(c) { window[c+"img"] = new Image(); window[c+"img"].addEventListener("load", function(){loadpoints++;}, false);//.onload = function() {loadpoints++;}//. window[c+"img"].addEventListener("error", function(){if(errorpoints<600){errorpoints++;loadpnghandle(c);}}, false);//.onerror = function() {loadpnghandle(c);}// window[c+"img"].src = c + ".png"; //DrawArray.push(c+"img"); } */ /* function preloadgame() { totalloadpoints = pnghandlearray.length; //draw progress bar document.getElementById('loadingbar').style.width=Math.min(100,Math.floor(loadpoints*(100/totalloadpoints))-1)+"%"; if(loadarr==1 && loadpoints==loadgoal){preloadgif();loadarr++;loadgoal++;} if(loadarr==2 && loadpoints==loadgoal){for (let c of pnghandlearray){loadpnghandle(c);}loadarr++;loadgoal+=pnghandlearray.length;} if(loadpoints==totalloadpoints) { //for (let c of drawarray){fishctx.drawImage(window[c],0,0,20,20);}//predraw all loaded images restartcompanylogoscreen(); } else if(errorpoints<600){requestAnimationFrame(preloadgame);} else if(errorpoints>=600) { //levelsong.pause(); document.getElementById("blackdiv").style.visibility='visible'; } } */ function resizeWindow() { windowresized=1; resizeElements(); } function touch() {/* x = touch.pageX; y = touch.pageY; mouseX=Math.round(x); mouseY=Math.round(y); drawX=mouseX; drawY=mouseY; mousebutton="down"; */ if(programstatus && programstatus!="endkal"){endkal();} else if(!programstatus) { //lastdrawX=drawX; //lastdrawY=drawY; var touch = event.touches[0]; var x = touch.pageX; var y = touch.pageY; mouseX=Math.round(x); mouseY=Math.round(y); drawX=mouseX; drawY=mouseY; //mousebutton="down"; draw("draw"); } mousetime=timenow; //stop page scroll return false; } function touchevent() { if(e.type == 'touchstart' || e.type == 'touchmove' || e.type == 'touchend' || e.type == 'touchcancel') { //var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; x = touch.pageX; y = touch.pageY; mouseX=Math.round(x); mouseY=Math.round(y); drawX=mouseX; drawY=mouseY; mousebutton="down"; } /* else if (e.type == 'mousedown' || e.type == 'mouseup' || e.type == 'mousemove' || e.type == 'mouseover'|| e.type=='mouseout' || e.type=='mouseenter' || e.type=='mouseleave') { x = e.clientX; y = e.clientY; } */ //if(!mouse){document.body.style.cursor = 'auto';} mousetime=timenow; } window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame || function(f){return setTimeout(f, 1000/60)} window.cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame || function(requestID){clearTimeout(requestID)} window.addEventListener("mousemove", mousemove); window.addEventListener("mousedown", mousedown); window.addEventListener("mouseup", mouseup); /* var e = document.getElementById("maincanvas2"); e.addEventListener("touchstart", touchevent, false); e.addEventListener("touchend", touchevent, false); //el.addEventListener("touchcancel", handleCancel, false); e.addEventListener("touchmove", touchevent, false); */ window.onresize = resizeWindow; //window.onorientationchange = resizeWindow; window.onload = loadlogos;