Skip to content

Commit

Permalink
Support playing battles
Browse files Browse the repository at this point in the history 
This should be a much nicer architecture than the old
`client-battle.js`.

In particular, much of the logic of choosing moves/switches has been
moved into a new `battle-choices.ts`, with `panel-battle.tsx` only
covering the UI.
  • Loading branch information
@Zarel
Zarel committed Mar 23, 2020
1 parent 523d63a commit 40d0779
Show file tree
Hide file tree
Showing 15 changed files with 1,010 additions and 161 deletions.
1 change: 1 addition & 0 deletions .eslintignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ node_modules/
/js/battle.js
/js/battledata.js
/js/battle-log.js
/js/battle-choices.js
/js/battle-text-parser.js
/js/battle-dex.js
/js/battle-dex-data.js
Expand Down
1 change: 1 addition & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ package-lock.json
/js/battle.js
/js/battledata.js
/js/battle-log.js
/js/battle-choices.js
/js/battle-text-parser.js
/js/battle-dex.js
/js/battle-dex-data.js
Expand Down
14 changes: 7 additions & 7 deletions js/client-battle.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -570,7 +570,7 @@
} else if (!pokemon || pokemon.fainted) {
targetMenus[0] += '<button name="chooseMoveTarget" value="' + (i + 1) + '"><span class="picon" style="' + Dex.getPokemonIcon('missingno') + '"></span></button> ';
} else {
targetMenus[0] += '<button name="chooseMoveTarget" value="' + (i + 1) + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + (this.battle.ignoreOpponent || this.battle.ignoreNicks ? pokemon.species : BattleLog.escapeHTML(pokemon.name)) + '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
targetMenus[0] += '<button name="chooseMoveTarget" value="' + (i + 1) + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + (this.battle.ignoreOpponent || this.battle.ignoreNicks ? pokemon.species : BattleLog.escapeHTML(pokemon.name)) + '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
}
}
for (var i = 0; i < myActive.length; i++) {
Expand All @@ -590,7 +590,7 @@
} else if (!pokemon || pokemon.fainted) {
targetMenus[1] += '<button name="chooseMoveTarget" value="' + (-(i + 1)) + '"><span class="picon" style="' + Dex.getPokemonIcon('missingno') + '"></span></button> ';
} else {
targetMenus[1] += '<button name="chooseMoveTarget" value="' + (-(i + 1)) + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
targetMenus[1] += '<button name="chooseMoveTarget" value="' + (-(i + 1)) + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
}
}

Expand Down Expand Up @@ -701,9 +701,9 @@
pokemon.name = pokemon.ident.substr(4);
var tooltipArgs = 'switchpokemon|' + i;
if (pokemon.fainted || i < this.battle.mySide.active.length || this.choice.switchFlags[i]) {
switchMenu += '<button class="disabled has-tooltip" name="chooseDisabled" value="' + BattleLog.escapeHTML(pokemon.name) + (pokemon.fainted ? ',fainted' : i < this.battle.mySide.active.length ? ',active' : '') + '" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + (pokemon.hp ? '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') : '') + '</button> ';
switchMenu += '<button class="disabled has-tooltip" name="chooseDisabled" value="' + BattleLog.escapeHTML(pokemon.name) + (pokemon.fainted ? ',fainted' : i < this.battle.mySide.active.length ? ',active' : '') + '" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + (pokemon.hp ? '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') : '') + '</button> ';
} else {
switchMenu += '<button name="chooseSwitch" value="' + i + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
switchMenu += '<button name="chooseSwitch" value="' + i + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
}
}
if (this.finalDecisionSwitch && this.battle.gen > 2) {
Expand Down Expand Up @@ -751,11 +751,11 @@
var pokemon = this.battle.myPokemon[i];
var tooltipArgs = 'switchpokemon|' + i;
if (pokemon && !pokemon.fainted || this.choice.switchOutFlags[i]) {
controls += '<button disabled class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + (!pokemon.fainted ? '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') : '') + '</button> ';
controls += '<button disabled class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + (!pokemon.fainted ? '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') : '') + '</button> ';
} else if (!pokemon) {
controls += '<button disabled></button> ';
} else {
controls += '<button name="chooseSwitchTarget" value="' + i + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
controls += '<button name="chooseSwitchTarget" value="' + i + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '"><span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') + '</button> ';
}
}
controls += '</div>';
Expand All @@ -781,7 +781,7 @@
} else {
switchMenu += '<button name="chooseSwitch" value="' + i + '" class="has-tooltip" data-tooltip="' + BattleLog.escapeHTML(tooltipArgs) + '">';
}
switchMenu += '<span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + (!pokemon.fainted ? '<span class="hpbar' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') : '') + '</button> ';
switchMenu += '<span class="picon" style="' + Dex.getPokemonIcon(pokemon) + '"></span>' + BattleLog.escapeHTML(pokemon.name) + (!pokemon.fainted ? '<span class="' + pokemon.getHPColorClass() + '"><span style="width:' + (Math.round(pokemon.hp * 92 / pokemon.maxhp) || 1) + 'px"></span></span>' + (pokemon.status ? '<span class="status ' + pokemon.status + '"></span>' : '') : '') + '</button> ';
}

var controls = (
Expand Down
16 changes: 10 additions & 6 deletions preactalpha.template.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ <h3><button class="closebutton" tabindex="-1" aria-label="Close"><i class="fa fa
<script defer src="/js/client-core.js?"></script>

<script defer src="/js/battle-dex.js?"></script>
<script defer src="/js/battle-text-parser.js"></script>
<script defer src="/js/battle-text-parser.js?"></script>
<script defer src="/js/client-main.js?"></script>
<script defer src="/js/lib/sockjs-1.4.0-nwjsfix.min.js?"></script>
<script defer src="/js/client-connection.js?"></script>
Expand All @@ -71,11 +71,12 @@ <h3><button class="closebutton" tabindex="-1" aria-label="Close"><i class="fa fa

<script defer src="/js/lib/soundmanager2-nodebug-jsmin.js"></script>
<script defer src="/js/lib/jquery-2.1.4.min.js"></script>
<script defer src="/data/graphics.js"></script>
<script defer src="/data/text.js"></script>
<script defer src="/data/graphics.js?"></script>
<script defer src="/data/text.js?"></script>
<script defer src="/js/battle-tooltips.js"></script>
<script defer src="/js/battle.js"></script>
<script defer src="/js/panel-battle.js"></script>
<script defer src="/js/battle.js?"></script>
<script defer src="/js/battle-choices.js?"></script>
<script defer src="/js/panel-battle.js?"></script>

<script defer src="/js/battle-dex-data.js?"></script>
<script defer src="/data/pokedex.js?"></script>
Expand All @@ -84,10 +85,13 @@ <h3><button class="closebutton" tabindex="-1" aria-label="Close"><i class="fa fa
<script defer src="/data/abilities.js?"></script>
<script defer src="/data/search-index.js?"></script>
<script defer src="/data/teambuilder-tables.js?"></script>
<script defer src="/js/panel-teamdropdown.js"></script>
<script defer src="/js/panel-teamdropdown.js?"></script>
<script defer src="/js/panel-teambuilder.js?"></script>
<script defer src="/js/battle-search.js?"></script>
<script defer src="/js/battle-searchresults.js?"></script>
<script defer src="/js/panel-teambuilder-team.js?"></script>

<script defer src="/data/pokedex-mini.js?"></script>
<script defer src="/data/pokedex-mini-bw.js?"></script>

</body></html>
12 changes: 9 additions & 3 deletions src/battle-animations.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1314,7 +1314,7 @@ class BattleScene {

let $hp = pokemon.sprite.$statbar.find('div.hp');
let w = pokemon.hpWidth(150);
let hpcolor = pokemon.getHPColor();
let hpcolor = BattleScene.getHPColor(pokemon);
let callback;
if (hpcolor === 'y') {
callback = () => { $hp.addClass('hp-yellow'); };
Expand All @@ -1337,7 +1337,7 @@ class BattleScene {

let $hp = pokemon.sprite.$statbar.find('div.hp');
let w = pokemon.hpWidth(150);
let hpcolor = pokemon.getHPColor();
let hpcolor = BattleScene.getHPColor(pokemon);
let callback;
if (hpcolor === 'g') {
callback = () => { $hp.removeClass('hp-yellow hp-red'); };
Expand Down Expand Up @@ -1553,6 +1553,12 @@ class BattleScene {
}
this.battle = null!;
}
static getHPColor(pokemon: {hp: number, maxhp: number}) {
let ratio = pokemon.hp / pokemon.maxhp;
if (ratio > 0.5) return 'g';
if (ratio > 0.2) return 'y';
return 'r';
}
}

interface ScenePos {
Expand Down Expand Up @@ -2485,7 +2491,7 @@ class PokemonSprite extends Sprite {
}
let hpcolor;
if (updatePrevhp || updateHp) {
hpcolor = pokemon.getHPColor();
hpcolor = BattleScene.getHPColor(pokemon);
let w = pokemon.hpWidth(150);
let $hp = this.$statbar.find('.hp');
$hp.css({
Expand Down
Loading

0 comments on commit 40d0779

Please sign in to comment.