smogon / pokemon-showdown-client

The client for Pokémon Showdown

Pokémon Showdown Client

Navigation: Website | Server repository | Client repository | Dex repository

Introduction

This is a repository for most of the client code for Pokémon Showdown.

This is what runs play.pokemonshowdown.com.

WARNING: You probably want the Pokémon Showdown server, if you're setting up a server.

Browser support

Pokémon Showdown currently supports, in order of preference:

• Chrome
• Firefox
• Opera
• Safari 5+
• IE11+
• Chrome/Firefox/Safari for various mobile devices

Pokémon Showdown is usable, but expect degraded performance and certain features not to work in:

• Safari 4+
• IE9+

Pokémon Showdown is mostly developed on Chrome, and Chrome or the desktop client is required for certain features like dragging-and-dropping teams from PS to your computer. However, bugs reported on any supported browser will usually be fixed pretty quickly.

Testing

Client testing now requires a build step! Install the latest Node.js (we require v14 or later) and Git, and run node build (on Windows) or ./build (on other OSes) to build.

You can make and test client changes simply by building after each change, and opening testclient.html. This will allow you to test changes to the client without setting up your own login server.

Test keys

For security reasons, browsers don't let other websites control PS, so they can't screw with your account, but it does make it harder to log in on the test client.

The default hack makes you copy/paste the data instead, but if you're refreshing a lot, just add a config/testclient-key.js file, with the contents:

const POKEMON_SHOWDOWN_TESTCLIENT_KEY = 'sid';

Replace sid with the contents of your actual PS sid cookie. You can quickly access this on Chrome through the URL bar:

(This is the only supported method of logging in on the beta Preact client.)

Other servers

You can connect to an arbitrary server by navigating to testclient.html?~~host:port. For example, to connect to a server running locally on port 8000, you can navigate to testclient.html?~~localhost:8000.

NOTE: Certain browsers will convert '?' to '%3F' when reading files off of the local filesystem. As a workaround, try using a different browser or serving the files locally first (ie. run npx http-server from the directory this README is in, then navigate in your browser to http://localhost:8080/testclient.html?~~localhost:8000).

Limitations

Even with a test key, the following things will fail in testclient.html:

• Registering
• Logging into other accounts (you can still switch to other unregistered accounts and back, though)

Everything else can be tested.

Warning

This repository is not "batteries included". It does NOT include instructions to run a full Pokémon Showdown login server, and we will not provide them. Please do not ask for help on this; you will be turned away.

If you make a mistake hosting a login server, your users' passwords can get stolen, so we do not want anyone to host a login server unless they can figure out how to do it without help.

It also doesn't include several resource files (namely, the /audio/ and /sprites/ directories) for size reasons.

On the other hand, as long as you don't want to run your own login server, this repository contains everything you need to test changes to the client; just see the "Testing" section above.

License

Pokémon Showdown's client is distributed under the terms of the AGPLv3.

The reason is mostly because I don't want low-effort proprietary forks that add bad code that steals everyone's passwords, or something like that.

If you're doing anything else other than forking, especially if you want to some client code files in your own open-source project that you want to release under a more permissive license (like, if you want to make your own multiplayer open-source game client for a different game), please ask at [email protected]. I hold all the copyright to the AGPLv3 parts and can relicense them to MIT for you.

WARNING: This is NOT the same license as Pokémon Showdown's server.

pokemon-showdown-client's Issues

XY-style pokemon icons in battle screen

XY icons are now everywhere except in the battle screen, where they don't fit.

The battle screen will need to be severely redesigned if we want them to fit.

I reject any 2x3 arrangements as really ugly. On the other hand, 1x6 and 6x1 designs (suggested in the Dev room) are promising.

Pokemon Showdown doesn't support ÜÄÖ and probably other special symbols

Sometimes I want to give my Pokemon German nicknames and sadly those symbols are not working with Pokemon Showdown. Would be great to get support for this for the international audience.

Mega Charizard X outspeeds Mega Lucario with max speed

Mega charizard X's max speed is said to be 328, yet when I am in a 1v1 against it with a Mega Lucario it outspeeds even if I have max speed (355). I think it is taking lucario's speed rather than Mega's as i chose Mega in the teambuilder.

Highlight other room tabs when there is activity in them

Maybe of which that gets disabled when the room has over 50 users.

Pokémon shown stuck in air when hitting itself

When a pokémon uses Fly (I guess it applies to other moves as well, didn't test it though) and, in the second turn, hits itself in confusion, it will still appear to be flying even though it's actually on ground. It's just a visual bug, so I guess it's not really high priority, but it can be misleading. It's visible on the replay as well: http://replay.pokemonshowdown.com/hackmonscup-377495505

Minor: Client can't differentiate between temporary ability changes.

"After using Entrainment on a pokemon, the pokemon switches out. When the same pokemon switches in, the ability on my screen shows the ability that it was given through entrainment (instead of listing possible abilities)."

http://www.smogon.com/forums/threads/bug-reports-v2-0-read-op-before-posting.3469932/page-178#post-5766389

Implement ability activation popups

Overdue from BW.

Need to update font-awesome.css

We are at 3.02, current is 4.4

From: #485 (comment)

Chat timestamps aren't activated in past

When user activates the timestamp in messages, this activated only in messages after the action, not in all messages.

Improve detection of U-turn switch-outs

The heuristic of checking pokemon.lastMove is -in addition to hacky- wrong, as a pokémon can in fact switch-out by "normal methods" after using U-turn and triggering foe's Eject Button.
Replay showing false positive for U-turn : http://replay.pokemonshowdown.com/ou-209269750

To fix this, the message displayed on switch-out POKEMON went back to PLAYER! should rely on a server message.

Other issues relevant to switching protocol:
#314
smogon/pokemon-showdown#1452

Locally keep track of chat and PMs

I was thinking it'd be interesting if the client could log chat from all chatrooms the user is in and all pms the user receives so that the next time the user opens the client there is a longer history of what is said in chat rooms than what is normally received from the server.

This is probably not as important for chatrooms as there is a lot of lines being said and there would be major gaps in the client's local history, but I think it would be a great thing for PMs. Right now, since PMs aren't logged by the client, they disappear when the client is closed, which can be frustrating if you accidentally navigate to another page or something while having a conversation with someone. It's useful to have a history of PMs with other people (I'm envisioning something like the way skype chat works) so you can refer to comments made in the past and so you don't accidentally lose the chat history like I mentioned above.

[hidden for security reasons]

[hidden for security reasons]

Sprite positioning exception needed for gen 3-4 doubles

http://i.imgur.com/cMg6vUn.png

just need an exception to get the bottom two on the same axis when using the past gen sprites. Having the opponents being more in center would be nice as well.

[Lint error] Duplicate identifier 'sandtomb' in data/graphics.js

In data/graphics.js, BattleMoveAnims.sandtomb properties are written at line 7186 and line 10901.

The former isn't used because the latter override the former in this case.
So I think one of those should be deleted.

An example is below:

var obj = {
    a: 10,
    b: 20,
    a: 30
};
console.log(obj.a); // => 30

A replay is below:

• http://replay.pokemonshowdown.com/1v1-337041825

Use nearest neighbor upscaling for backsprites

I think making browsers that support it use nearest neighbor scaling on sprites looks much better.
It turns into .

I'm not sure how to implement this as there's no simple way to style the sprites without adding to the inline css (here, I think).

Rules needed to do this in most browsers (source):

 image-rendering:optimizeSpeed;             /* Legal fallback                 */
 image-rendering:-moz-crisp-edges;          /* Firefox                        */
 image-rendering:-o-crisp-edges;            /* Opera                          */
 image-rendering:-webkit-optimize-contrast; /* Chrome (and eventually Safari) */
 image-rendering:optimize-contrast;         /* CSS3 Proposed                  */
 -ms-interpolation-mode:nearest-neighbor;   /* IE8+                           */

Hacky proof of concept as a userstyle: http://userstyles.org/styles/94140/showdown-scaling?r=1381995519

[Firefox] Login screen fails to bring up password prompt

When I click on 'Choose Name', 'Find Battle' or 'Join Chat', I get the 'Username' prompt and once I login with my account (Ads20000) I should get the 'Registered User: Enter Password' prompt but I don't. This happens fairly intermittently. Sometimes I can login, sometimes I can't.

Current Workaround:
Use Google Chrome 28 instead

Basic Software Specs:
Firefox 23.0
Ubuntu 12.04.2 LTS

Strawpoll embedding in HTML boxes and html declares

http://strawpoll.me/2382102

Cancel doesn't work if the only battle request is the own

There are some cases when it's evident that the battle has only a single request pending. Under such circumstances, the battle will proceed as soon as the player makes their choice, and any subsequent /undo messages will be invalid. As the option to cancel doesn't really exist then, it follows that (at least) for those circumstances, the cancel button should either be

• Removed or disabled
• Reworked (maybe implement a safety delay to choices so that the player may cancel their decision until the delay finishes and the decision is sent).

Which one?

PS occasionally freezes when 'Skip Turn' button is used

To reproduce:
Try pressing the 'Skip Turn' button when playing a game whenever possible. Pokemon Showdown should freeze at some point and you will have to copypaste the URL into a new tab to get it working again. Refresh doesn't work.

Browser:
Chromium 34 (outdated but there are other people with the same issue so I don't think it is the browser)

Linking to a non-existant room shows a blank client interface

For example, try this link: http://showdown-afd.psim.us/battle-doesntexist123

Weather remaining turns' tooltip is inaccurate

If the weather is set by an ability due to a switch-in at the end of a turn or beginning of the battle, the counter will be offset, and the tooltip will display data as if an additional turn had passed.

E.g.
http://replay.pokemonshowdown.com/customgame-189512953
Turn 4: Predicts 1 or 4 turns left.
Turn 5: Predicts 3 turns left. However, that turn rain stops.

Add generation specific substitute sprites

We have corresponding sprites on file for each gen:

https://play.pokemonshowdown.com/sprites/rby/substitute.png
https://play.pokemonshowdown.com/sprites/gsc/substitute.png
https://play.pokemonshowdown.com/sprites/rse/substitute.png
https://play.pokemonshowdown.com/sprites/dpp/substitute.png
https://play.pokemonshowdown.com/sprites/bw/substitute.png
https://play.pokemonshowdown.com/sprites/xyani/substitute.gif

right now the default is gen 5, but having it match the generation graphics being played would be ideal.

Generation 6 should be fine now with: #563

Error in config.js

if you join showdown and close the roomlist before the connection is ready, you'll get this error and you'll be unable to open the roomlist until you reload:

13:46:03.503 TypeError: app.rooms.rooms is undefined in config.js:89:0

Popup issues on mobile when searching for a user

Commit 42ddd81 seems to have broken the ''Find a user" option on the main menu on mobile devices. The window opens, but immediately closes afterwards. I've tested it on Android and iOS so it doesn't appear to be a browser-specific issue.

styling of download replay too different from upload & share replay button

This might be sort of opinionated, but it's really odd aesthetically that the download and upload buttons look so different on the site.

Unless there's a reason for it (I know one's an <a> tag and the other a <button>), then I think it'd make more sense from a UI standpoint to have them be similar.

Connecting to battles over HTTPS fails

Joining the Showdown server over a link like https://play.pokemonshowdown.com/battle-doublesrandombattledev-19541389 fails and results in nothing been shown like here: http://puu.sh/2Yc7E.jpg

Connecting to the Showdown server using https://play.pokemonshowdown.com/ is working without this issue.

Using Firefox 22 (beta) I get these errors in my console:

[19:53:14.181] Error: INVALID_STATE_ERR @ https://play.pokemonshowdown.com/js/lib/sockjs-0.3.min.js?18354975:27
[19:53:54.521] TypeError: self.curRoom is null @ https://play.pokemonshowdown.com/js/client.js?05f0f14a:279

Some Mega icons only showing base mon

Diancie
Audino
Lopuny
Gallade

From what I have known the mega icons are hard coded, but these for whatever reason do not change. See teambuilder for easy reference.

Yes they are there: http://play.pokemonshowdown.com/sprites/bwicons-sheet.png

Support for multiple languages

The translated text has already been ripped from XY, all that's left to do is an implementation method.

Timer in tournament challenge

Will be nice a timer in tour challenges that automatically disclassify inactive users.

Link to challenges

Having spontaneous battles would be a lot easier if you could make your challenges not restricted to who's in the showdown chatroom. A unique link to a challenge you've made that you can send to your friends in IM would make playing with friends a lot easier.

I would take up the project myself, but showdown's codebase is a bit daunting with it's large files and little documentation.

Clicking buttons in battle using the keyboard

I've run into a problem where I can no longer press the buttons to attack or switch when using the latest version of IE. This used to work, I played for the first time in a couple of weeks today and this is the first time I've had the problem. It still works on Firefox and Chrome for Windows, but I have a totally different issue in those browsers, which I'll post separately if this one can't be resolved. I can't see my computer screen, so I use a screen reader program to use it. For this reason I can't use the mouse, so that's why I need to use the keyboard. Right now I have to type either /move or /switch, which is a bit unwieldy, or use a keystroke to simulate a mouse click, which is really unwieldy.
Have there been any changes to event handlers or something similar for buttons in combat? Or is this something weird on my end?

Modularizing client js files with RequireJS?

Hey guys! I'm new here. Love this battle simulator so much!! :)

I realized that the javascript files are really massive. I'm interested in submitting a pull request to implement RequireJS. I'm wondering, are you guys openminded to that? Have you guys discussed this before?

BW replays don't load BW animation sizes

http://replay.pokemonshowdown.com/gen5ou-261435204

http://replay.pokemonshowdown.com/smogtours-gen5ou-62801

Most obvious with any flying mon.

I swore this was working fine before.

This is a replay only bug, works fine in battle.

Missing Manectric Mega sprite

http://i.imgur.com/Hc1THQi.png

Team select image does not update properly

I found a bug on the client that has to do with deleting teams. When a team is deleted, the index for the team selection stays the same, but the image previewing the team does not update. So say you have the following teams:
0 | Team A
1 | Team B <-
2 | Team C
In the "look for a battle" team selection, it is currently selecting team B. Then you delete team A and the selection is as follows:
0 | Team B
1 | Team C <-
However, the image displayed is still that of team B. So you can search for a battle thinking you are using team B, but you end up using team C. The image updates only after a battle is found, or the matchmaking is canceled.

Empty list element sticks to teamlist when dragging non-file entity

[image]

Dragging a non-file entity (like text or a hyperlink) while the Teambuilder is open will stick li.dragging to the teamlist.

This happens because the client assumes it's dragging a file and the entity's empty FileList bypasses these conditions.

li.dragging will remain on the teamlist until updateTeamList() is called.

CSS3 rules are deleted

Posting in the right repository this time I hope.
Well, I've never been able to use things like linear-gradient(), but other CSS3 things like border-radius and box-shadow are just removed too.
These are things added through custom.css. I think it would add a good amount of design possibilities if we could use these kinds of things.

Electro Ball ranges incorrect

This is because of the following code :
var minRatio = (myPokemon.stats['spe'] / this.getTemplateMinSpeed(template, target.level));
var maxRatio = (myPokemon.stats['spe'] / this.getTemplateMaxSpeed(template, target.level));

It should be the other way around.

Illusion, search IDs, and UI assistance

Illusion currently has a bug in the fact that it displays the level of the fake mon in the simulator, while in-game it displays the real level of the Pokémon with Illusion. This is -as an immediate cause- due to Pokémon getting identified client-side by their searchid, which is built from server-side details. As far as I can see, the overall server-side approach to Illusion in BattlePokemon.getDetails is sound (though I can see some room to improvement by taking advantage of the battle log |split| feature).

Currently, searchid includes.

• Species
• Nickname
• Gender
• Shinyness
• Level

Additionally to its not copying level, Illusion should -when it becomes possible- display the copied Poké Ball (related: #306). Similarly, searchid should include Poké Ball information, and it would be straightforward to remove the level data from searchid.

However, it stands that a different displayed level can be used in a metagame without Species Clause to discover that the opponent has 2 or more of a species (if there is no Team Preview), or associate items/moves/abilities to one or more of them. Similarly, it's theoretically possible to identify Pokémon based on whether they have a certain item or activate an ability on switch-in (or even afterwards, but its implementation is unrealistic imo). Automating the process of identifying different Pokémon on the basis of items/abilities would be potentially a very significant assistance in formats such as Hackmons.

Which concept would we like to implement?
Restrict details to the information conveyed by Illusion? If we don't do that, we would need to replace the level when Illusion is active. In that case, would we like to keep the amount of information in details the same (plus Poké Ball)? Or maybe expand it to obvious items and abilities? Something else?

COIL only for specific ladders

COIL should only show up for selected ladders, and each ladder should have unique values for "B." I'm not sure how to do this in php.

What I'm thinking would be optimal is to have ladder.php and client-chat.js consult a separate "COIL" file that's just a lookup table that looks something like:

oususpecttest:75
lcsuspecttest:43

and, if the formatid isn't present in the list, it doesn't make the column, and if it does, it uses the specified value for "B" for the COIL calculation. That way, instead of editing two files in two different languages any time we want a new coil for a new suspect test, we can just edit that one file.

Notification bug on Android devices with Google Chrome

The used Notification feature of Showdown, leads to following error in Google Chrome on Android devices:

Uncaught TypeError: Failed to construct 'Notification': Illegal constructor. Use ServiceWorkerRegistration.showNotification() instead. (client.js?c0d807c0:1768)

Using new Notification() with Google Chrome on Android devices isn't supported anymore

Relevant chromium issue: https://code.google.com/p/chromium/issues/detail?id=481856

Filter list of battles by rating

I like watching other people battle on Showdown, but I tire of picking a battle at random from the hundred or more going on in OU at any given moment only to be greeted with noncompetitive players or people who still think Electivire is worth using. Would it be possible to provide a way to filter by rating so I can limit myself to watching players who actually want to be competent?

Requesting missing files in order to get this client running

The AGPL states:

c) You must license the entire work, as a whole, under this License to anyone who comes into possession of a copy. This License will therefore apply, along with any applicable section 7 additional terms, to the whole of the work, and all its parts, regardless of how they are packaged. This License gives no permission to license the work in any other way, but it does not invalidate such permission if you have separately received it.

There are some files used in this project, but included in this repository, providing fundamental features of the client:

../pokemonshowdown.com/lib/ntbb-session.lib.php
../pokemonshowdown.com/config/servers.inc.php
../pokemonshowdown.com/news/include.php
../pokemonshowdown.com/news/embed.php
../replay.pokemonshowdown.com/replays.lib.php
../pokemonshowdown.com/lib/ntbb-database.lib.php

As these files are required to full run the client I request you to release these files in terms of the AGPL v3.

BW animations strech

http://i.imgur.com/MEDXPBD.png

299777f

Try switching to bw animated and go to a battle, still loading xy stuff.

I'm not sure what broke here but I know part of the original addition was that there would be a sprite reload every time we selected bw animations over xy stuff. If it is this commit that broke it can we get it reverted until it is fixed?

Redundant check in teambuilder

Lines 2587 and 2588 are doing the same checks.
if (stats.spa > stats.atk && moveCount['Special'] > 1) offenseBias = 'Special';
else if (stats.spa > stats.atk && moveCount['Special'] > 1) offenseBias = 'Special';

[Firefox] Health bar is wrong length

Just a random one-off bug. I clicked 'Skip Turn' and the below happened...

Modernizing the client code

(TBD)

---

Original OP:

Use es5-shim in the replay site.

Should allow us to drop Lodash, and keep (even gain!) all the compatibility we want to watch replays.

Team data gets deleted in Chrome when switching from HTTP to HTTPS

In Google Chrome, the teams stored in localStorage get deleted when the teams are created on the HTTP version of the website, then accessed via the HTTPS version. They remain deleted even after switching back to HTTP.

I've tested this scenario on Ubuntu/Chrome 40.0 and OS X 10.10/Chrome 44.0. According to a user in the help room, this occurs under Windows 7 as well, and performing a system restore causes the teams to be restored.

Desktop app allows PITM to execute arbitrary code

There are two separate PITM (person in the middle) issues with the desktop app. The first one is less important for reasons to be explained below.

1. Since the original download of the .exe/Mac app is over HTTP, a PITM can replace the binary by her own crafted version.
2. The index.html file of the app itself merely redirects to http://play.pokemonshowdown.com. A person in the middle can insert arbitrary content into the HTTP stream and execute arbitrary code on the user's computer using the node-webkit functions.

The second problem is actually notably bad because it means that running a safe program (Pokemon Showdown) on an unsafe network can result in the user's computer being totally compromised.

Recommendation: the desktop app should force loading over HTTPS. One issue is that if HTTPS connection fails, the client has always attempted to connect via alternative methods instead (although this was actually broken until my recent fix in @50d07a6020a54c1f6c). We may want to introduce some kind of special flag to indicate not to try HTTP connections, and make sure the desktop app signals that flag.

Regarding the first issue, there's no real solution because even if the binary is served over HTTPS, an attacker can just downgrade the connection to HTTP and serve his crafted binary. We may want to provide an optional cryptographic signature for the application, but that won't really help 99% of users; in order for it to be useful, the user would have to already know that that option exists (since a PITM could strip out the info) and would have to be careful to use it.

Indeed, the first issue is a general problem with downloading binaries over the Internet, except through a package management system. (Package management systems avoid this issue by distributing cryptographic keys as part of the OS.)

Anyway, the second issue is worth addressing by:

1. Making the app use the HTTPS site; and
2. Making the app use some kind of special parameter when loading the HTTPS site so that the client will never attempt to use a non-HTTPS connection (otherwise, an attacker could just block HTTPS traffic).

The chance of the second issue being exploited might seem remote, but we're talking about arbitrary code execution on users' computers so it's worth addressing.

Gooey shows the wrong name

When Gooey procs the effect text attributes the effect to the attacker's nonexistent Gooey rather than the target's.