var canvas; var ctx; var menu; var accuracy=1; var victory ; var bestioles=[]; var shadows =[]; var spice=0; var colors =[ "red", "yellow", "orange", "green", "blue", "violet", "lime" ]; var quotes=[ "By will alone I set my mind in motion.", "The sleeper must awaken", "I must not fear. Fear is the mind-killer." ]; alert("My name is Paul. Here is my planet Arrakis. Also known as \"Dune\". Home of the spice mélange... and other things."); /* In continuation of my serie of OOP models. Author is me. I am Paul Caron. Nice to meet you. This is my creatures morphed into dune worms. See Sci Fi Frank Herbert Novels Dune or see David Lynch movie, so underrated. */ class Bestiole{ constructor(x,y){ this.xPos = x; this.yPos = y; this.xSpeed = Math.random()*4-2; this.ySpeed = Math.random()*4-2; this.target = [canvas.width/2,canvas.height/2]; this.width = 5+Math.random()*5; //this.color = colors[Math.floor(Math.random()*7)]; this.mmove = 0; //mouth move this.mincrement =0.2; } draw(){ ctx.beginPath(); ctx.arc(this.xPos, this.yPos, this.width, 0, Math.PI*2); // var grd=ctx.createRadialGradient(this.xPos,this.yPos,this.width/4,this.xPos,this.yPos,this.width); grd.addColorStop(0,"black"); grd.addColorStop(1,"orange"); // Fill with gradient ctx.fillStyle=grd; ctx.fill(); ctx.stroke(); ctx.closePath(); //teeth ctx.beginPath(); ctx.arc(this.xPos,-this.mmove+this.yPos-this.width/2,this.width/3,0,Math.PI*2); ctx.fillStyle="orange"; ctx.fill(); ctx.closePath(); ctx.beginPath(); ctx.arc(this.xPos+Math.cos(Math.PI/6)*(this.width/2+this.mmove),this.yPos+Math.sin(Math.PI/6)*(this.width/2+this.mmove),this.width/3,0,Math.PI*2); ctx.fillStyle="orange"; ctx.fill(); ctx.closePath(); ctx.beginPath(); ctx.arc(this.xPos-Math.cos(Math.PI/6)*(this.width/2+this.mmove),this.yPos+Math.sin(Math.PI/6)*(this.width/2+this.mmove),this.width/3,0,Math.PI*2); ctx.fillStyle="orange"; ctx.fill(); ctx.closePath(); shadows.push([this.xPos,this.yPos,this.width]); } update(){ this.xPos = this.xPos+this.xSpeed; this.yPos = this.yPos+this.ySpeed; var distx = this.xPos-this.target[0]; var disty = this.yPos - this.target[1]; var angle = Math.PI+Math.atan(Math.abs(disty)/Math.abs(distx)); if(distx<0){ if(disty<0){ angle += Math.PI; }else{ angle = (Math.PI)-angle; } }else{ if(disty<0){ angle = 2*Math.PI-angle; }else{ //angle=angle; } } var acc = 0.075; this.xSpeed = this.xSpeed + acc*Math.cos(angle); this.ySpeed = this.ySpeed + acc*Math.sin(angle); this.width =Math.abs(this.width+Math.random()*1-0.5); this.mmove += this.mincrement; if(this.mmove>this.width/12&&this.mincrement >0){ this.mincrement *= -1; }else if(this.mmove<-this.width/4&& this.mincrement <0){ this.mincrement *= -1; } } } function init(){ canvas = document.getElementById("canvas"); ctx = canvas.getContext("2d"); canvas.width= window.innerWidth<1000? window.innerWidth:1000; canvas.height = window.innerHeight<1000?window.innerHeight:1000; // event.preventDefault(); victory=document.getElementById("victory"); victory.style.width=canvas.width+"px"; victory.style.height = canvas.height+"px"; menu = document.getElementById("upgrades"); menu.style.width = canvas.width+"px"; menu.style.height = canvas.height+"px"; //create some monsters for(let b of "hhh89"){ bestioles.push(new Bestiole( Math.random()*canvas.width, Math.random()*canvas.height)); ; } //add click listener canvas.addEventListener("click", function(evt) { var pos=getMousePos(evt);document.getElementById("audio").play();checkHit(pos.x,pos.y); },false); window.requestAnimationFrame(loop); function loop(){ clearCanvas(); if(shadows.length>200){ for(let a=0; a<(shadows.length-200);a++){ shadows.shift(); } } for(shadow in shadows){ drawShadow(shadows[shadow], shadow); } for(let b of bestioles){ b.draw(); b.update(); } window.requestAnimationFrame(loop); } } function getMousePos(event) { var rect = canvas.getBoundingClientRect(); var x = Number(event.clientX) - Number(rect.left); var y = Number(event.clientY) - Number(rect.top); if(isNaN(x) ||isNaN(y)){}else{ return{x: x ,y:y}; } } function clearCanvas(){ ctx.clearRect(0,0,canvas.width,canvas.height); } function drawShadow([x,y,size], index){ ctx.beginPath(); ctx.arc(x, y, size*(index/200), 0, Math.PI*2); ctx.fillStyle = "orange"; ctx.fill();ctx.stroke(); ctx.closePath(); } function checkHit(x,y){ for(let a=0;a=10){ spice-=10; spiceCountUpdate(); accuracy +=0.2; }else{ alert("Not enough spice."); } } } function seismicVibrationClick(){ if(confirm("Buy Seismic Vibrator for 50 spice?")){ if(spice>=50){ spice-=50;spiceCountUpdate(); bestioles.push(new Bestiole( Math.random()*canvas.width, Math.random()*canvas.height)); }else{ alert("Not enough spice."); } } } function waterOfLifeClick(){ if(confirm("Buy water of life for 100 spice?")){ if(spice>=100){ canvas.addEventListener("touchmove", touchMove ,false); spice-=100;spiceCountUpdate(); }else{alert("not enough spice.")} } } function rideTheWorm(){ if(confirm("Ride the worm for 500 spice?")){ if(spice>=500){ spice-=500;spiceCountUpdate(); victory.style.display="block"; closeUpgradeMenu(); }else{ alert("Not enough spice."); } } } function touchMove(e) { arr=getTouchPos(e); checkHit(arr[0],arr[1]); event.preventDefault(); } function getTouchPos(e) { if (!e){ var e = event; } if(e.touches) { if (e.touches.length == 1) { var touch = e.touches[0]; var touchX=touch.pageX-touch.target.offsetLeft; var touchY=touch.pageY-touch.target.offsetTop; return [touchX,touchY ]; } } }

DuneX-Spice Harvest- game