Honestly, the CSS solution was really cool. It was just incompatible
with the new system. It also had enough other flaws (like, bad
accessibility) that I don't feel _too_ bad about ripping it out.
The new version is less code, anyway, although it does have the flaw of
needing to replay the battle if you turn nicknames on or off.
Fortunately, that should be a rare enough occurrence not to be a big
deal.
battle.js is probably PS's oldest code. It's received minor touch-ups:
a refactor to prototypes early on, and then a refactor to TypeScript
and classes recently, but otherwise it's had basically zero maintenance
until now.
That's probably why this refactor took me over a week.
The biggest change is that the animation engine strewn around
Pokemon, Side, and Battle has been broken out into a new class named
BattleScene.
Pokemon, Side, and Battle now only track state; all animation is now
done in BattleScene and PokemonSprite.
The fates of major classes:
battle.ts:Pokemon - animation has been moved, mostly to PokemonSprite
battle.ts:Side - animation has been moved, to PokemonSprite/BattleScene
battle.ts:Battle - animation has been moved, mostly to BattleScene
Major changes:
- Many many variables have been renamed to be much clearer about what
they mean. For instance, `animationDelay` is now `timeOffset`, and
`activityDelay` is now `minWait`. A few bugs relating to me mixing
up these two variables have also been fixed. jQuery variables named
like `fooElem` have been renamed like `$foo`.
- The unnecessarily complicated queue1/queue2/activeQueue system,
previously used for telling the animation engine to stop after Pause
was pressed, has been replaced with a simple `interruptionCount`
counter.
- The entire scene can now be reconstructed from scratch, which means
that the `fastForward` system no longer needs to touch the DOM
outside of the battle log. "Prev turn" and "Skip to turn" should be
faster in 1000-turn battles now.
- The animation engine now supports displaying weather and terrain
simultaneously.
- During a replay, Team Preview is shown for a second (instead of
immediately skipping to the battle).
- Various aspects of the animation engine should be much less brittle
now.
- Many bugs were fixed (and new ones were introduced).
jslider was incredibly buggy, and most likely the cause of the problems
with the teambuilder on mobile, and required some pretty ridiculous
hacks, and leaked memory.
We're now using HTML5 sliders, like we are with the volume controls.
HTML5 sliders aren't supported by IE9, but they're supported by most
other browsers PS cares about. If not, well, they won't look too ugly
probably...
Previously, both Volume sliders and EV sliders use an outdated jQuery
slider library with no mobile support or accessibility.
Volume sliders are now HTML5, which means better accessibility and
mobile support.
We unfortunately can't move EV sliders to HTML5 because they do some
magic to constrain them to 510 total EVs, but EV sliders are
fortunately still accessible because they come with a textbox as an
alternate input.
Fixes the slider part of #954
Since real custom elements still have very limited availability, this is the most proper way to do it, and results in a more predictable HTML parsing.
Adds support for custom styles and classes.
Example: <psicon pokemon="meloetta" class="pixelated" style="opacity:0.4" />
The highlight color is now blue to match notifying tab colors. People
were complaining about the previous highlight color, so this should be
better.
Notifying PMs are still orange, though. I haven't been able to find a
nicer-looking blue for it.
Honestly, though, if night mode is supposed to help you sleep, you want
more orange and less blue... Maybe one day we'll be able to find a color
combination that actually looks good.
This commit consolidates all Pokemon icons in 'picon'.
Perhaps now we'll be able to rename picon -> pokemonicon now that the
old name is no longer used... but I guess that can be reserved for a
future commit.
The timer was always kind of ugly and text-based, which is awkward on
non-wide screens, where you couldn't see it at all without switching
into the battle log.
The new version gives the timer a home at the upper right of the battle
choice screen (where the active Pokémon's HP used to be) (the active
Pokémon's HP has been moved next to "What will [pokemon] do?").
The spectator UI has also been updated, and now supports jumping to the
beginning/end of the battle, as well as forward/backward 1 turn,
regardless of whether the battle has ended.
In addition, a lot of other button layouts/appearances have been
improved.
