diff --git a/Code/public/js/app.min.js b/Code/public/js/app.min.js index a62315c..0cf60c3 100644 --- a/Code/public/js/app.min.js +++ b/Code/public/js/app.min.js @@ -1 +1 @@ -var EnemyBots=new Array(5),myself=new Robot(5,5);EnemyBots.push(new Robot(1,1)),console.log(myself.height);const WIDTH_WINDOW=$(document).width()-30,HEIGHT_WINDOW=$(document).height()-30;var config={type:Phaser.AUTO,width:WIDTH_WINDOW,height:HEIGHT_WINDOW,parent:"all",backgroundColor:"#35363A"},game=new Phaser.Game(config);game.scene.add("Boot",Boot),game.scene.add("Type",Type),game.scene.add("Game",new Game(game)),game.scene.start("Boot"); \ No newline at end of file +const WIDTH_WINDOW=$(document).width()-30,HEIGHT_WINDOW=$(document).height()-30,WIDTH_MAP=WIDTH_WINDOWt.setFrame(0)),t.on("pointerover",()=>t.setFrame(1)),t.on("pointerdown",()=>this.clickPlay(t))}clickPlay(t){t.setFrame(2),console.log("Play"),this.scene.start("Type")}}class Game extends Phaser.Scene{constructor(t){super("Game"),this.game=t}preload(){this.gm=new GamingBoard,this.game.scene.add("GamingBoard",this.gm)}create(){let t=this.add.sprite(WIDTH_WINDOW/1.5,HEIGHT_WINDOW/3*2,"btn_play").setOrigin(.5,.5).setInteractive();t.on("pointerout",()=>t.setFrame(0)),t.on("pointerover",()=>t.setFrame(1)),t.on("pointerdown",()=>this.clickPlay(t)),this.scene.launch("GamingBoard"),this.scene.pause("GamingBoard")}clickPlay(t){this.scene.isPaused("GamingBoard")?this.scene.resume("GamingBoard"):this.scene.pause("GamingBoard")}}class GamingBoard extends Phaser.Scene{constructor(){super("GamingBoard")}preload(){WIDTH_WINDOWt.setFrame(0)),t.on("pointerover",()=>t.setFrame(1)),t.on("pointerdown",()=>this.clickPlay(t))}clickPlay(t){this.scene.start("Game")}} \ No newline at end of file +class Boot extends Phaser.Scene{constructor(){super("Boot")}preload(){this.load.spritesheet("btn_play","assets/btnPlay.png",{frameWidth:650,frameHeight:170}),this.load.spritesheet("btn_duel","assets/btnDuel.png",{frameWidth:269,frameHeight:262}),this.load.spritesheet("btn_last","assets/btnLast.png",{frameWidth:269,frameHeight:262}),this.load.spritesheet("btn_team","assets/btnTeam.png",{frameWidth:269,frameHeight:262}),this.load.spritesheet("btn_flag","assets/btnFlag.png",{frameWidth:269,frameHeight:262}),this.load.spritesheet("btn_map","assets/btnMap.png",{frameWidth:269,frameHeight:262}),this.load.image("background","assets/background.png")}create(){this.add.text(WIDTH_WINDOW/2,HEIGHT_WINDOW/3,"WARIA",{font:"200px stencil",fill:"#e2e2e2"}).setOrigin(.5,.5);let t=this.add.sprite(WIDTH_WINDOW/2,HEIGHT_WINDOW/3*2,"btn_play").setInteractive();t.on("pointerout",()=>t.setFrame(0)),t.on("pointerover",()=>t.setFrame(1)),t.on("pointerdown",()=>this.clickPlay(t))}clickPlay(t){t.setFrame(2),console.log("Play"),this.scene.start("Type")}}class Game extends Phaser.Scene{constructor(t){super("Game"),this.game=t}preload(){this.gm=new GamingBoard,this.game.scene.add("GamingBoard",this.gm)}create(){let t=this.add.sprite(WIDTH_WINDOW/1.5,HEIGHT_WINDOW/3*2,"btn_play").setOrigin(.5,.5).setInteractive();t.on("pointerout",()=>t.setFrame(0)),t.on("pointerover",()=>t.setFrame(1)),t.on("pointerdown",()=>this.clickPlay(t)),this.scene.launch("GamingBoard"),this.scene.pause("GamingBoard")}clickPlay(t){this.scene.isPaused("GamingBoard")?this.scene.resume("GamingBoard"):this.scene.pause("GamingBoard")}}class GamingBoard extends Phaser.Scene{constructor(){super("GamingBoard")}preload(){this.cameras.main.setViewport(WIDTH_WINDOW/10,HEIGHT_WINDOW/10,WIDTH_MAP,WIDTH_MAP)}create(){this.add.image(0,0,"background").alpha=.1,this.enemy=new Robot(.1*WIDTH_MAP,.1*WIDTH_MAP,.9*WIDTH_MAP,.9*WIDTH_MAP,6711039,this),this.myself=new Robot(.1*WIDTH_MAP,.1*WIDTH_MAP,.1*WIDTH_MAP,.1*WIDTH_MAP,16724940,this),this.myself2=new Robot(.1*WIDTH_MAP,.1*WIDTH_MAP,.1*WIDTH_MAP,.9*WIDTH_MAP,16777215,this),this.myself.setTarget(this.enemy),this.myself2.setTarget(this.enemy),this.events.on("resume",()=>this.resume())}update(t,e){super.update(t,e),null!=this.myself.target&&this.myself.target.isAlive()&&(this.myself.isTargetInRange()?this.myself.attackTarget():this.myself.advanceToTarget()),null!=this.myself2.target&&this.myself2.target.isAlive()&&(this.myself2.isTargetInRange()?this.myself2.attackTarget():this.myself2.advanceToTarget(),console.log(this.enemy.life))}resume(){this.myself2.updateTarget()}}class Robot{constructor(t,e,s,i,a,h){this.height=t,this.width=e,this.x=s,this.y=i,this.color=a,this.range=WIDTH_MAP/2,this.damage=DAMAGE,this.life=LIFE,this.shield=SHIELD,this.addScene(h)}addScene(t){this.scene=t,this.circle=this.scene.add.circle(this.x,this.y,this.width/2,this.color)}setX(t){this.x=t,this.circle.setX(this.x)}setY(t){this.y=t,this.circle.setY(this.y)}setTarget(t){this.target=t,null!=this.target&&this.updateTarget()}updateTarget(){this.setTargetPos(this.target.x,this.target.y)}setTargetPos(t,e){let s=this.target.x-this.x,i=this.target.y-this.y,a=Math.hypot(s,i);this.velocityX=s/a*WIDTH_MAP/1e3*SPEED,this.velocityY=i/a*WIDTH_MAP/1e3*SPEED}advanceToTarget(){this.velocityX>=0&&this.x>=this.target.x||this.velocityX<=0&&this.x<=this.target.x?this.setX(this.target.x):this.setX(this.x+this.velocityX),this.velocityY>=0&&this.y>=this.target.y||this.velocityY<=0&&this.y<=this.target.y?this.setY(this.target.y):this.setY(this.y+this.velocityY)}fleeFromTarget(){this.velocityX>=0&&this.x-this.width/2<=0?this.setX(this.width/2):this.velocityX<=0&&this.x+this.width/2>=WIDTH_MAP?this.setX(WIDTH_MAP-this.width/2):this.setX(this.x-this.velocityX),this.velocityY>=0&&this.y-this.width/2<=0?this.setY(this.height/2):this.velocityY<=0&&this.y+this.width/2>=WIDTH_MAP?this.setY(WIDTH_MAP-this.height/2):this.setY(this.y-this.velocityY)}attackTarget(){return this.isTargetInRange()&&this.attack(this.target),!1}attack(t){t.beAttack(this.damage)&&this.setTarget(null)}beAttack(t){return this.shield=this.shield-t,this.shield<0&&(this.life+=this.shield,this.shield=0),this.life<=0&&(this.life=0),this.die()}isTargetInRange(){return Math.hypot(this.target.x-this.x,this.target.y-this.y)0}die(){return 0===this.life&&(this.circle.destroy(),!0)}}class Type extends Phaser.Scene{constructor(){super("Type")}preload(){}create(){this.add.text(WIDTH_WINDOW/2,HEIGHT_WINDOW/4,"WARIA",{font:"200px stencil",fill:"#e2e2e2"}).setOrigin(.5,1);let t=this.add.sprite(WIDTH_WINDOW/8*3,HEIGHT_WINDOW/4*2,"btn_duel").setInteractive();this.createbutton(t);let e=this.add.sprite(WIDTH_WINDOW/8*5,HEIGHT_WINDOW/4*2,"btn_last").setInteractive();this.createbutton(e);let s=this.add.sprite(WIDTH_WINDOW/8*2,HEIGHT_WINDOW/4*3,"btn_team").setInteractive();this.createbutton(s);let i=this.add.sprite(WIDTH_WINDOW/8*4,HEIGHT_WINDOW/4*3,"btn_flag").setInteractive();this.createbutton(i);let a=this.add.sprite(WIDTH_WINDOW/8*6,HEIGHT_WINDOW/4*3,"btn_map").setInteractive();this.createbutton(a)}createbutton(t){t.displayHeight=HEIGHT_WINDOW/4,t.scaleX=t.scaleY,t.on("pointerout",()=>t.setFrame(0)),t.on("pointerover",()=>t.setFrame(1)),t.on("pointerdown",()=>this.clickPlay(t))}clickPlay(t){this.scene.start("Game")}} \ No newline at end of file diff --git a/Code/src/js/Init.js b/Code/src/js/Init.js index e1bd8e2..e9a5e99 100644 --- a/Code/src/js/Init.js +++ b/Code/src/js/Init.js @@ -1,9 +1,18 @@ -var EnemyBots = new Array(5); -var myself = new Robot(5, 5); +/*var EnemyBots = new Array(5); +//var myself = new Robot(5, 5); EnemyBots.push(new Robot(1, 1)); console.log(myself.height); +*/ + const WIDTH_WINDOW = $(document).width() - 30; const HEIGHT_WINDOW = $(document).height() - 30; +const WIDTH_MAP = WIDTH_WINDOW < HEIGHT_WINDOW ? WIDTH_WINDOW * 0.8 : HEIGHT_WINDOW * 0.8; +const SPEED = 2; +const LIFE = 100; +const DAMAGE = 40; +const SHIELD = 100; +const RANGE = WIDTH_MAP / 2; + var config = { type: Phaser.AUTO, diff --git a/Code/src/js/classes/GamingBoard.js b/Code/src/js/classes/GamingBoard.js index 5870e81..bb863e4 100644 --- a/Code/src/js/classes/GamingBoard.js +++ b/Code/src/js/classes/GamingBoard.js @@ -4,33 +4,45 @@ class GamingBoard extends Phaser.Scene { } preload() { - if (WIDTH_WINDOW < HEIGHT_WINDOW) - this.width = WIDTH_WINDOW * 0.8; - - else - this.width = HEIGHT_WINDOW * 0.8; - this.cameras.main.setViewport(WIDTH_WINDOW / 10, HEIGHT_WINDOW / 10, this.width, this.width); + this.cameras.main.setViewport(WIDTH_WINDOW / 10, HEIGHT_WINDOW / 10, WIDTH_MAP, WIDTH_MAP); } create() { this.add.image(0, 0, 'background').alpha = 0.1; - this.enemy = this.add.circle(this.width * 0.1, this.width * 0.1, this.width * 0.05, 0x6666ff); - this.myself = this.add.circle(this.width * 0.9, this.width * 0.9, this.width * 0.05, 0xff33cc); + this.enemy = new Robot(WIDTH_MAP * 0.1, WIDTH_MAP * 0.1, WIDTH_MAP * 0.9, WIDTH_MAP * 0.9, 0x6666ff, this); + //this.myself = this.add.circle(this.width * 0.1, this.width * 0.1, this.width * 0.05, 0x6666ff); + this.myself = new Robot(WIDTH_MAP * 0.1, WIDTH_MAP * 0.1, WIDTH_MAP * 0.1, WIDTH_MAP * 0.1, 0xff33cc, this); + this.myself2 = new Robot(WIDTH_MAP * 0.1, WIDTH_MAP * 0.1, WIDTH_MAP * 0.1, WIDTH_MAP * 0.9, 0xffffff, this); + + this.myself.setTarget(this.enemy); + this.myself2.setTarget(this.enemy); + this.events.on('resume', () => this.resume()); } update(time, delta) { super.update(time, delta); - if (this.enemy.x < this.myself.x) - this.myself.setX(this.myself.x - 0.5); - else if (-0.5 < this.enemy.x - this.myself.x < 0.5) - this.myself.setX(this.myself.x + 0.5); - - if (this.enemy.y < this.myself.y) - this.myself.setY(this.myself.y - 0.5); - else if (-0.5 < this.enemy.y - this.myself.y < 0.5) - this.myself.setY(this.myself.y - 0.5); + if (this.myself.target != null && this.myself.target.isAlive()) { + if (!this.myself.isTargetInRange()) + this.myself.advanceToTarget(); + else + this.myself.attackTarget(); + } + + if (this.myself2.target != null && this.myself2.target.isAlive()) { + if (!this.myself2.isTargetInRange()) + this.myself2.advanceToTarget(); + else + this.myself2.attackTarget(); + console.log(this.enemy.life); + } + } + + resume() { + this.myself2.updateTarget(); } + + } \ No newline at end of file diff --git a/Code/src/js/classes/Robot.js b/Code/src/js/classes/Robot.js index 6ef508f..2bcc357 100644 --- a/Code/src/js/classes/Robot.js +++ b/Code/src/js/classes/Robot.js @@ -1,6 +1,120 @@ class Robot { - constructor(height, width) { - this.height = height; - this.width = width; - } + constructor(height, width, posX, posY, color, scene) { + this.height = height; + this.width = width; + this.x = posX; + this.y = posY; + this.color = color; + this.range = WIDTH_MAP / 2; + this.damage = DAMAGE; + this.life = LIFE; + this.shield = SHIELD; + this.addScene(scene); + } + + addScene(scene) { + this.scene = scene; + this.circle = this.scene.add.circle(this.x, this.y, this.width / 2, this.color); + } + + setX(x) { + this.x = x; + this.circle.setX(this.x); + } + + setY(y) { + this.y = y; + this.circle.setY(this.y); + } + + setTarget(target) { + this.target = target; + if (this.target != null) + this.updateTarget(); + } + + updateTarget() { + this.setTargetPos(this.target.x, this.target.y); + } + + setTargetPos(x, y) { + let diffX = this.target.x - this.x; + let diffY = this.target.y - this.y; + let hypot = Math.hypot(diffX, diffY); + this.velocityX = diffX / hypot * WIDTH_MAP / 1000 * SPEED; + this.velocityY = diffY / hypot * WIDTH_MAP / 1000 * SPEED; + } + + advanceToTarget() { + if ((this.velocityX >= 0 && this.x >= this.target.x) || (this.velocityX <= 0 && this.x <= this.target.x)) + this.setX(this.target.x); + else + this.setX(this.x + this.velocityX); + + if ((this.velocityY >= 0 && this.y >= this.target.y) || (this.velocityY <= 0 && this.y <= this.target.y)) + this.setY(this.target.y); + else + this.setY(this.y + this.velocityY); + + } + + fleeFromTarget() { + if (this.velocityX >= 0 && this.x - this.width / 2 <= 0) + this.setX(this.width / 2); + else if (this.velocityX <= 0 && this.x + this.width / 2 >= WIDTH_MAP) + this.setX(WIDTH_MAP - this.width / 2); + else + this.setX(this.x - this.velocityX); + + if (this.velocityY >= 0 && this.y - this.width / 2 <= 0) + this.setY(this.height / 2); + else if (this.velocityY <= 0 && this.y + this.width / 2 >= WIDTH_MAP) + this.setY(WIDTH_MAP - this.height / 2); + else + this.setY(this.y - this.velocityY); + } + + + attackTarget() { + if (this.isTargetInRange()) { + this.attack(this.target); + } + return false; + } + + attack(target) { + if (target.beAttack(this.damage)) { + this.setTarget(null); + } + } + + beAttack(damage) { + this.shield = this.shield - damage; + if (this.shield < 0) { + this.life += this.shield; + this.shield = 0; + } + if (this.life <= 0) { + this.life = 0; + } + return this.die(); + } + + isTargetInRange() { + let hypot = Math.hypot(this.target.x - this.x, this.target.y - this.y); + return hypot < this.range; + + } + + isAlive() { + return this.life > 0; + } + + die() { + if (this.life === 0) { + this.circle.destroy(); + return true; + } + return false; + } }