// Thank you so much @lolo // Now it's working on ios "use strict"; let H, W let {ceil, random, sqrt, sin, cos, atan2, pow, PI} = Math let T = {sx:0, sy:0, mx:0, my:0, ex:0, ey:0} let Ang=0, power=0, angr=0, aps=0, cur=0, Score=0, arocut=50, comt="" let hold=false ,anim=false ,End=false; let arrows=[], particals=[] let bow, san, target Array.prototype.sti=function(){ for(var i=0;ix&&X-Ry&&Y-R{ let plt=_.split(' ').sti(),pc=Tools.ctp(x,y,plt[0],plt[1],a,s),pe=Tools.ctp(x,y,plt[2],plt[3],a,s); san.quadraticCurveTo(pc[0],pc[1],pe[0],pe[1]); }) } } class Bow{ constructor(x,y){ this.x=x; this.y=y; this.a=0; this.aa; this.s=1.2 } draw(){ san.beginPath(); san.lineWidth=2; san.strokeStyle='gray'; let p1 = Tools.ctp(this.x,this.y,-180,-22,this.a,this.s); let p2 = Tools.ctp(this.x,this.y,0,-22-power,this.a,this.s); let p3 = Tools.ctp(this.x,this.y,180,-22,this.a,this.s); san.moveTo(p1[0],p1[1]); san.lineTo(p2[0],p2[1]); san.lineTo(p3[0],p3[1]); san.stroke(); san.closePath(); san.beginPath(); san.fillStyle='rgba(0,0,0,.05)'; san.arc(p2[0],p2[1],30,0,44/7); san.fill();san.closePath(); san.beginPath(); Tools.qct(this.x,this.y,this.s,this.a,'195 -15 195 -15,185 -30 160 -21,145 -12 95 5,70 8 60 8,55 12 51 13,25 13 10 13,0 25 -10 11,-80 20 -162 -21,-185 -29 -197 -15,-180 -23 -162 -16,-70 25 -40 27,-30 20 15 28,55 28 70 18,95 15 165 -17,180 -23 195 -15'); san.fillStyle="#013F69"; san.fill(); san.closePath(); } } class Target{ constructor(x,y){ this.x=x; this.y=y; this.v=0; this.vd=1; } draw(){ this.x+=this.v*this.vd; if(this.x-120<0||this.x+120>W){this.vd=-this.vd} san.beginPath(); san.fillStyle="gray"; san.ellipse(this.x,this.y,110,80,0,0,44/7); san.fill(); san.closePath(); san.beginPath(); san.fillStyle="rgb(300,180,0)"; san.ellipse(this.x,this.y,80,60,0,0,44/7); san.fill(); san.closePath(); san.beginPath(); san.fillStyle="red"; san.ellipse(this.x,this.y,50,40,0,0,44/7); san.fill(); san.closePath(); san.beginPath(); san.fillStyle="#013F69"; san.ellipse(this.x,this.y,20,20,0,0,44/7); san.fill(); san.closePath(); san.beginPath(); san.fillStyle="#013F69"; san.beginPath(); san.fillStyle="#013F69"; //san.fillRect(this.x-90,this.y-50,180,100);san.fill();san.closePath(); san.beginPath(); san.fillStyle="#013F69"; } } const Partical=function(x,y,r,c){ this.r=r; this.s=false; this.rv=Tools.rng(3,6); this.rs=.851; this.a=Tools.rng(-3,3); this.x=x+cos(this.a)*50; this.y=y+sin(this.a)*50; this.c=c; this.draw=function(){ this.x+=cos(this.a)*this.rv; this.y+=sin(this.a)*this.rv; this.r-=this.rs; this.r<1?this.s=true:''; san.beginPath(); san.arc(this.x,this.y,this.r,0,44/7); san.fillStyle=c; san.fill(); san.closePath(); } }; const Blast = function(x,y,r,c,t){ for(var i=0;i<25;i++){ particals.push(new Partical(x,y,r,c)) } } class Arrow{ constructor(){ this.x=bow.x; this.y=bow.y; this.a=0; this.s=1.2; this.p=0; this.v={x:0,y:0}; this.at=true; this.vis=true; this.tgt=false; this.cudn=0; this.one=true; this.col="silver"; this.act=true; this.suc=false } draw(){ if(this.cudn>300){this.vis=false;} let rpa=[],gvp=[[0,-22-this.p],[0,178-this.p],[-5,178-this.p],[5,178-this.p],[0,185-this.p],[-8,-30-this.p],[8,-30-this.p],[8,-15-this.p],[0,-7-this.p],[-8,-15-this.p]]; gvp.forEach(_=>rpa.push(Tools.ctp(this.x,this.y,_[0],_[1],this.a,this.s))); if(!this.at){this.p<20?this.vis=false:''; arocut-=this.act&&this.p>20?1:0; this.act=false; this.v.x=sin(this.a)*this.p; this.v.y=cos(this.a)*this.p; if(Tools.cd(rpa[4][0],rpa[4][1],1,target.x-90,target.y-50,180,100)){ this.suc=true;this.one?Score+=5:''; this.one?comt=["Nice!","Great!","Good!"][ceil(Tools.rng(0,3)-1)]:''; arocut==0&&this.cudn>150?End=true:''; if(Tools.ptd(target.x,target.y,rpa[4][0],rpa[4][1])<20){ this.col="gold"; this.one?Score+=5:''; } this.x+=target.v*target.vd; this.cudn++; if(this.one){ target.v<5.5?target.v+=.1:''; for(var i=0;i<5;i++){ new Blast(target.x,target.y,25,this.col,true) } this.one=false; this.tgt=true} }else{ this.x+=this.v.x; this.y+=this.v.y; this.v.x-=.5; } this.a=atan2(this.v.x,this.v.y)}else{this.a=bow.aa;this.p=aps;this.at=hold}; if(this.y>H+200||this.x>W+200||this.x<-200){Score-=2;this.vis=false;arocut==0?End=true:'';} san.beginPath(); san.lineWidth=7; san.moveTo(rpa[5][0],rpa[5][1]); san.lineTo(rpa[0][0],rpa[0][1]); san.lineTo(rpa[6][0],rpa[6][1]); san.lineTo(rpa[7][0],rpa[7][1]); san.lineTo(rpa[8][0],rpa[8][1]); san.lineTo(rpa[9][0],rpa[9][1]); san.closePath(); san.strokeStyle="silver"; san.fillStyle='#013F69' san.stroke(); san.fill() san.beginPath(); san.lineWidth=5; san.moveTo(rpa[0][0],rpa[0][1]); san.lineTo(rpa[1][0],rpa[1][1]); san.strokeStyle="silver" san.stroke(); san.closePath(); if(!this.tgt){ san.beginPath(); san.lineWidth=8; san.moveTo(rpa[2][0],rpa[2][1]); san.lineTo(rpa[3][0],rpa[3][1]); san.lineTo(rpa[4][0],rpa[4][1]); san.lineTo(rpa[2][0],rpa[2][1]); san.closePath(); san.strokeStyle="silver"; san.fillStyle='#013F69' san.stroke(); san.fill() } } } const Render=()=>{ particals.length==0?comt="":''; arocut<0?comt="":''; if(hold&&Ang<1&&Ang>-1&&!anim){ bow.a=Ang;bow.aa=Ang; let tpd = Tools.ptd(bow.x,bow.y,T.mx,T.my)-22; tpd<100&& tpd>0?power=tpd:''; tpd>100?power=100:''; tpd<0?power=0:''; } if(!hold&&!(bow.a<.1&&bow.a>-.1)&&anim){ bow.a-=angr; } else if(anim){ bow.a=0;anim=false } san.save(); san.translate(W*2,H/2) san.rotate(11/7); san.font = '150px Arail'; san.strokeStyle='black'; san.fillStyle="rgba(0,0,0,"+particals.length>0?.3:0+")"; san.fillText(comt,-200,W*1.6,500,20) if(End){ san.fillText("SCORE : "+Score,-325,W*1.4,650,20); san.fillText("Game Over",-325,W*1.6,650,20); san.font = '100px Arail'; san.fillText("Tap to RESET",-250,W*1.8,500,20);} san.restore(); san.closePath(); for(var i=0;i50?250-(power-50)*2.5:250)+','+(power*5)+',0)'; san.lineCap='round';san.lineWidth=15;san.moveTo(W-30,-100+H/2); san.lineTo(W-30,-100+H/2+power*2); san.stroke(); san.closePath(); san.save(); san.translate(W*2,H/2) san.rotate(11/7); san.font = '27px Arail';san.strokeStyle='black'; san.fillStyle="black"; san.lineWidth=2; san.strokeText('SCORE : '+Score,-300,W+45,150,20); san.strokeText("FPS : "+ceil(1000/(performance.now()-cur)),180,W+44); san.strokeText('× '+arocut,180-H/2,W+45) san.fillText('copyright © SAN',-230+H/2,W+42) san.fillText('SCORE : '+Score,-300,W+45,150,20); san.fillText("FPS : "+ceil(1000/(performance.now()-cur)),180,W+44); san.fillText('× '+arocut,180-H/2,W+45) cur=performance.now(); san.restore(); san.beginPath(); let aro =new Arrow(); aro.x=W-37; aro.y=35;aro.s=.7; aro.draw() } const init=()=>{ H = innerHeight*2; W = innerWidth*2; document.body.innerHTML="

"; c.height = H; c.width = W; bow = new Bow(W/2,200); target = new Target(W/2,H-130) let dh=+getComputedStyle(c).height.slice(0,-2),dw=+getComputedStyle(c).width.slice(0,-2); c.setAttribute('height',dh*2); c.setAttribute('width',dw*2); san=c.getContext('2d'); let _=()=>{ san.clearRect(0,0,W,H);Render(); webkitRequestAnimationFrame(_); }; webkitRequestAnimationFrame(_); c.ontouchstart=e=>{ e.cancelable?e.preventDefault():''; T.sx=e.touches[0].pageX*2; T.sy=e.touches[0].pageY*2; Ang=atan2(bow.x-T.sx,bow.y-T.sy); if(Tools.ptd(W/2,177,T.sx,T.sy)<30){ hold=true;arocut>0?arrows.push(new Arrow()):'' } if(End){ arocut=50; Score=0; End=false } } c.ontouchmove=e=>{ e.cancelable?e.preventDefault():''; T.mx=e.touches[0].pageX*2; T.my=e.touches[0].pageY*2; aps=power Ang=atan2(bow.x-T.mx,bow.y-T.my) } c.ontouchend=e=>{ e.cancelable?e.preventDefault():''; T.ex=e.changedTouches[0].pageX*2; T.ey=e.changedTouches[0].pageY*2; aps=power; angr=bow.a/60; anim=true;hold=false;power=0; } } onload=init;

My Archery | Game | SAN