Spritesheet rework

[pogo-excalibur]

Description

This moves all* of the images used by the project into a single spritesheet.

* 'all' doesn't include:

• cluster markers - as markercluster.js doesn't support this
• the 'loading' gif - as it's a gif
• the favicons/app icons - as these (as far as I'm aware) have to be individual files

Motivation and Context

The current sprite system requires a lot of manual work in order to issue new sprites. This PR aims to make the process for generating sprites much easier.

Additionally, this should make using custom (potentially map-specific) icons much easier.

Shoutout to @sirlindqvist for their help and advice throughout putting this together 🥇 .

How Has This Been Tested?

Small local map.

Screenshots (if appropriate):

Types of changes

• New feature (non-breaking change which adds functionality)

Checklist:

• My code follows the code style of this project.

[friscoMad]

This shouldn't be in the PR.

[friscoMad]

It should be static/sass/sprite.scss
Missing static/data/sprites_map.json and static/spritesheet.png

[sirlindqvist]

Can we use just a "?" on unknown raid boss in same font/size/style as the standard circles/numbers?

[sirlindqvist]

Using 'rebuild = true' in 'static/js/build_icons.js' overwrite custom icons with default numbers/circles.

[fosJoddie]

This is a very "needed" feature, and the amount of work that has been put into this is tremendous. Well done.

My system:

Windows Server 2012
Intel i5-3570 3.4 GHz 16 GB of downloaded RAMs

npm install adds about 4000 more files to node-modules over the current RocketMap install. This is an increase from 11552 to 15164 files. I have not done any considerations into whether or not all the new imported modules are strictly needed or just fluff that could have been replaced by own code etc.

The sprites are generated in a timely (I guess) fashion and is also replaced by custom ones in the spritesheet if you put custom ones in.

The resulting spritesheet for some custom images is 19,697 kB - this feels like a lot when the current one is sitting around 2,256kB for icons-large-sprite.png

Lastly there seems to be some antialiasing/resizing issues going on if you use large high quality source images:

For normal icon size the map sprites are quite a bit fuzzier than before

This could be an artifact of the raw size of the icons - but there's a absolutely a difference from current spritesheet quality.

Using smaller icons to generate the spritesheet gives a better quality for normal sized sprites:

[pogo-excalibur]

Apparently I forgot the 'karp.

(Cheers @sirlindqvist 😄 )

[sirlindqvist]

Yopp, now rebase proper!

[billyjbryant]

does this handle pokemon forms for spritegen? is it possible to also pull in the sprites for costume from #2461

[pogo-excalibur]

It adds support for Pokemon forms, but it doesn't add support for costumes.

That's a possible addition - I'll consider adding it to the PR. But this PR is already quite large (and behind schedule) so that may get delegated to a followup PR.