From 5529c72570323d88366d8119f353ba60131a3eb2 Mon Sep 17 00:00:00 2001
From: Cristiano Magro <cristiano.magro@vola.it>
Date: Fri, 27 Dec 2024 00:02:28 +0100
Subject: [PATCH] implement special attack
---
04 - monster slayer game/prj-monster-01-starting-setup/index.html | 14 +++++---------
04 - monster slayer game/prj-monster-01-starting-setup/app.js | 32 +++++++++++++++++++++-----------
2 files changed, 26 insertions(+), 20 deletions(-)
diff --git a/04 - monster slayer game/prj-monster-01-starting-setup/app.js b/04 - monster slayer game/prj-monster-01-starting-setup/app.js
index 75dc449..d7283b0 100644
--- a/04 - monster slayer game/prj-monster-01-starting-setup/app.js
+++ b/04 - monster slayer game/prj-monster-01-starting-setup/app.js
@@ -1,33 +1,43 @@
-function getRandomValue(min, max){
- return Math.floor(Math.random() * (max - min)) + min;
+function getRandomValue(min, max) {
+ return Math.floor(Math.random() * (max - min)) + min;
}
-
const app = Vue.createApp({
data() {
return {
playerHealth: 100,
monsterHealth: 100,
+ currentRound: 0,
};
},
computed: {
- monsterBarStyle(){
- return {width: this.monsterHealth + '%'}
+ monsterBarStyle() {
+ return { width: this.monsterHealth + "%" };
},
- playerBarStyle(){
- return {width: this.playerHealth + '%'}
+ playerBarStyle() {
+ return { width: this.playerHealth + "%" };
+ },
+ mayUseSpecialAttack() {
+ return this.currentRound % 3 !== 0;
},
},
watch: {},
methods: {
attackMonster() {
- const attackValue = getRandomValue(5,12);
+ this.currentRound++;
+ const attackValue = getRandomValue(5, 12);
this.monsterHealth -= attackValue;
this.attackPlayer();
},
- attackPlayer(){
- const attackValue = getRandomValue(8,15);
- this.playerHealth -= attackValue;
+ attackPlayer() {
+ const attackValue = getRandomValue(8, 15);
+ this.playerHealth -= attackValue;
+ },
+ specialAttackMonster() {
+ this.currentRound++;
+ const attackValue = getRandomValue(10, 20);
+ this.monsterHealth -= attackValue;
+ this.attackPlayer();
},
},
});
diff --git a/04 - monster slayer game/prj-monster-01-starting-setup/index.html b/04 - monster slayer game/prj-monster-01-starting-setup/index.html
index 5532162..4233b72 100644
--- a/04 - monster slayer game/prj-monster-01-starting-setup/index.html
+++ b/04 - monster slayer game/prj-monster-01-starting-setup/index.html
@@ -20,24 +20,20 @@
<section id="monster" class="container">
<h2>Monster Health</h2>
<div class="healthbar">
- <div
- class="healthbar__value"
- :style="monsterBarStyle"
- ></div>
+ <div class="healthbar__value" :style="monsterBarStyle"></div>
</div>
</section>
<section id="player" class="container">
<h2>Your Health</h2>
<div class="healthbar">
- <div
- class="healthbar__value"
- :style="playerBarStyle"
- ></div>
+ <div class="healthbar__value" :style="playerBarStyle"></div>
</div>
</section>
<section id="controls">
<button @click="attackMonster">ATTACK</button>
- <button>SPECIAL ATTACK</button>
+ <button @click="specialAttackMonster" :disabled="mayUseSpecialAttack">
+ SPECIAL ATTACK
+ </button>
<button>HEAL</button>
<button>SURRENDER</button>
</section>
--
Gitblit v1.8.0