diff --git a/fight.js b/fight.js new file mode 100644 index 0000000..cd680ab --- /dev/null +++ b/fight.js @@ -0,0 +1,201 @@ +let Fight = { + data() { + return { + loaded: false, + action: null, + step: 'choose', + sounds: { + battle: null, + victory: null + }, + player: { + name: 'Ash', + team: [ + { + species: 'Pikachu', + nickname: 'Pikachu', + status: null, + hp: 100, + hpLeft: 100, + level: 5, + sprites: { + idle: 'https://www.pokewiki.de/images/thumb/0/0a/Pok%C3%A9monsprite_025_SWSH.gif/128px-Pok%C3%A9monsprite_025_SWSH.gif', + back: 'https://www.pokewiki.de/images/thumb/7/7c/Pok%C3%A9monsprite_025_R%C3%BCckseite_Schillernd_LGPE.png/100px-Pok%C3%A9monsprite_025_R%C3%BCckseite_Schillernd_LGPE.png' + }, + moves: [ + { + name: 'Tackle', + strength: 35, + types: ['normal'], + class: 'physical', + ap: 15 + } + ] + } + ] + }, + enemy: { + name: 'Gary', + team: [ + { + species: 'Evoli', + nickname: 'Evoli', + status: null, + hp: 100, + hpLeft: 100, + level: 5, + sprites: { + idle: 'https://www.pokewiki.de/images/thumb/a/a5/Pok%C3%A9monsprite_133_SWSH.gif/128px-Pok%C3%A9monsprite_133_SWSH.gif', + back: '' + }, + moves: [ + { + name: 'Tackle', + strength: 35, + types: ['normal'], + class: 'physical', + ap: 15 + } + ] + } + ] + } + } + }, + mounted() { + this.start(); + + this.sounds.battle = new Audio('snd/battle.mp3'); + this.sounds.victory = new Audio('snd/victory.mp3'); + }, + methods: { + start() { + this.player.currentFighter = this.player.team[0]; + this.enemy.currentFighter = this.enemy.team[0]; + this.loaded = true; + }, + playerAttack(move) { + if (this.sounds.battle.paused) { + this.sounds.battle.play(); + } + this.attack(move, this.player.currentFighter, this.enemy.currentFighter); + this.step = 'playerAttacked'; + this.action = 'message'; + this.currentMessage = this.player.currentFighter.nickname + ' setzt ' + move.name + ' ein!'; + }, + enemyAttack() { + if (this.enemy.currentFighter.hpLeft <= 0) { + this.currentMessage = this.enemy.currentFighter.nickname + ' wurde besiegt!' + this.action = 'message'; + this.step = 'enemyPokemonDefeated'; + } else { + let move = this.enemy.currentFighter.moves[Math.floor(Math.random() * this.enemy.currentFighter.moves.length)]; + this.attack(move, this.enemy.currentFighter, this.player.currentFighter); + this.action = 'message'; + + this.step = 'enemyAttacked'; + this.currentMessage = 'Enemy ' + this.enemy.currentFighter.nickname + ' setzt ' + move.name + ' ein!'; + } + }, + enemyPokemonDefeated() { + this.enemy.currentFighter.status = 'defeated'; + let nextFighter = this.getNextFighterFromTeam(this.enemy.team); + console.log(nextFighter); + if (!nextFighter) { + this.enemy.currentFighter = null; + this.step = 'playerWon'; + this.fightWon() + } else { + this.enemy.currentFighter = this.enemy.team[nextFighter]; + } + }, + // playerPokemonDefeated() { + // this.player.currentFighter.status = 'defeated'; + // let nextFighter = this.getNextFighterFromTeam(this.player.team); + // + // if (!nextFighter) { + // this.step = 'playerWon'; + // this.currentMessage = this.enemy.name + ' wurde besiegt!'; + // } else { + // alert('lol'); + // this.enemy.currentFighter = this.enemy.team[nextFighter]; + // } + // }, + getNextFighterFromTeam(team) { + let nextFighterIndex = false; + team.forEach((member, teamPosition) => { + if (member.status !== 'defeated') { + nextFighterIndex = teamPosition; + } + }) + + return nextFighterIndex; + }, + attack(move, attacker, enemy) { + let newHpLeft = enemy.hpLeft - this.calculateDamageForAttack(move.strength, attacker.level); + enemy.hpLeft = newHpLeft; + }, + calculateDamageForAttack(strength, level) { + return strength / 10 * level; + }, + getLeftHpPercent(character) { + return character.currentFighter.hpLeft / 100 * character.currentFighter.hp; + }, + getColorForHealthBar(percent) { + if (percent > 52) { + return 'success'; + } + + if (percent > 17) { + return 'warning' + } + + return 'danger'; + }, + fightWon() { + this.sounds.battle.pause(); + this.sounds.victory.play(); + this.currentMessage = this.enemy.name + ' wurde besiegt!'; + }, + fightLost() { + + }, + continueRound() { + switch (this.step) { + case 'playerAttacked': + this.enemyAttack(); + break; + case 'enemyAttacked': + this.action = null; + break; + case 'enemyPokemonDefeated': + this.enemyPokemonDefeated(); + this.currentMessage = this.enemy.name + ' wurde besiegt!'; + break; + case 'playerPokemonDefeated': + // this.fightWon(); + break; + case 'playerWon': + this.fightWon(); + break; + case 'enemyWon': + this.fightLost(); + break; + default: + break; + } + + this.$forceUpdate(); + } + }, + watch: { + step() { + console.log(this.step); + }, + action() { + console.log(this.action); + } + } +} + +Vue.createApp(Fight).mount('#fight'); \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..e315b4d --- /dev/null +++ b/index.html @@ -0,0 +1,104 @@ + + + + + Fight + + + + + +
+
+
+
+
+
+ {{ enemy.currentFighter.nickname }} + + Lvl {{ enemy.currentFighter.level }} + +
+
+
+
+
+
+
+ +
+
+
+ +
+
+
+ +
+
+
+
+ {{ player.currentFighter.nickname }} + + Lvl {{ player.currentFighter.level }} + +
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ move.name }} +
+
+
+ +
+
+ Angriff + Zurück +
+
+ +
+
+ {{ currentMessage }} +
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/snd/battle.mp3 b/snd/battle.mp3 new file mode 100644 index 0000000..9c34660 Binary files /dev/null and b/snd/battle.mp3 differ diff --git a/snd/victory.mp3 b/snd/victory.mp3 new file mode 100644 index 0000000..8fe9c6f Binary files /dev/null and b/snd/victory.mp3 differ