Rewrite the renderer

[jakubg1]

This is a very big maintenance project, and a very big task which will be performed after #1, #39 and #95 have been implemented.

This issue will solve #108.

Right now, the ordering of various sprites is janky. Some bad habits have been introduced as a result of trying to patchwork the code so everything is rendered in the correct order. For example, the ball shadows and spheres in general are being rendered using shadow and hidden parameters which are being passed along, a very not elegant solution at all. And not flexible.

What's the solution?

The solution is to move all rendering to layers. The rendering order inside one layer does not matter at all. Right now, a similar system is being used by UI, but this system will be superseded by this new global layer system.

How is it going to work?

All primary objects which have a graphical representation (Sprites, Particles, Fonts, etc.) will take a mandatory layer parameter. This parameter will be, obviously, the layer name a particular object is going to be rendered on. Because Particles use Sprites to render themselves, the layer will be forwarded to all Sprites being rendered as part of that Particle. The Sprite class, on the other hand, will make a call to a new Renderer class to actually "draw" itself with given parameters. The object will be rendered onto a Canvas of a given layer. Once the main drawing pipeline finishes, the Renderer will render all layers (Canvases, one canvas per layer) onto the actual screen and clear the canvases in preparation for the next frame.

Example benefits

With ultimate flexibility when it comes to what is drawn on which layer, some extra flexibility will be possible to be added to some config files:

• Spheres and Shooters
  • Instead of hardcoded "main sprite" and "shadow sprite", a list of Sprites will be implemented, each of which can be configured independently.
  • Example:
  • Before:

    "sprite": "sprites/game/shooter.json",
    "spriteOffset": {"x": 0, "y": 0},
    "spriteAnchor": {"x": 0.5, "y": 0},
    "shadowSprite": "sprites/game/shooter_shadow.json",
    "shadowSpriteOffset": {"x": 4, "y": 4},
    "shadowSpriteAnchor": {"x": 0.5, "y": 0}

  • After:

    "sprites": [
      {
        "sprite": "sprites/game/shooter.json",
        "offset": {"x": 0, "y": 0},
        "anchor": {"x": 0.5, "y": 0},
        "layer": "shooter"
      },
      {
        "sprite": "sprites/game/shooter_shadow.json",
        "offset": {"x": 4, "y": 4},
        "anchor": {"x": 0.5, "y": 0},
        "layer": "shooter_shadow"
      }
    ]

• Maps
  • All map objects and potentially paths could have a layer defined, which would allow multi-layered tunnels and flexible map effects to be made.

[jakubg1]

A list of problems to overcome:

• Stencils (used by the Speed Shot beam) don't work with canvases - find a workaround.