fix: update image to relative path, code cleanup

Author: Shirajuki

src/scripts/babylon.js

@@ -57,7 +57,7 @@ class BabylonEngine extends Engine {
     // Spritemanager
     const spriteManager = new BABYLON.SpriteManager(
       'textures',
-      '/sprite.png',
+      'sprite.png',
       1000000,
       { width: 64, height: 64 },
       this.scene
@@ -83,6 +83,7 @@ class BabylonEngine extends Engine {
         circle.width = 64;
         circle.height = 64;
         circle.angle = Math.PI;
+        circle.invertU = true;
         circle.position.x = -x;
         circle.position.z = -y;
         circle.position.y = -i;

src/scripts/canvas.js

@@ -13,7 +13,7 @@ class CanvasEngine extends Engine {
 
     if (this.type === 'sprite') {
       this.sprite = new Image();
-      this.sprite.src = '/sprite.png';
+      this.sprite.src = 'sprite.png';
     }
 
     // Particle creation

src/scripts/dom.js

@@ -26,7 +26,7 @@ class DOMEngine extends Engine {
       let particle;
       if (this.type === 'sprite') {
         particle = document.createElement('img');
-        particle.src = '/sprite.png';
+        particle.src = 'sprite.png';
         particle.className = 'particle sprite';
       } else {
         particle = document.createElement('div');

src/scripts/kaboom.js

@@ -15,7 +15,7 @@ class KaboomEngine extends Engine {
       width: this.width,
       height: this.height,
     });
-    k.loadSprite('sprite', '/sprite.png');
+    k.loadSprite('sprite', 'sprite.png');
     this.k = k;
 
     // Clear the canvas

src/scripts/melon.js

@@ -95,7 +95,7 @@ class MelonEngine extends Engine {
         {
           name: 'sprite',
           type: 'image',
-          src: '/sprite.png',
+          src: 'sprite.png',
         },
       ],
       () => {

src/scripts/pixi.js

@@ -29,7 +29,7 @@ class PixiEngine extends Engine {
 
     // Particle creation
     if (this.type === 'sprite') {
-      this.texture = PIXI.Texture.from('/sprite.png');
+      this.texture = PIXI.Texture.from('sprite.png');
     }
     const particles = new Array(this.count);
     const rnd = [1, -1];

src/scripts/three.js

@@ -51,7 +51,7 @@ class ThreeEngine extends Engine {
       lineMaterial = new THREE.LineBasicMaterial({ color: 0x000000 });
 
     // Sprite texture
-    const map = new THREE.TextureLoader().load('/sprite.png');
+    const map = new THREE.TextureLoader().load('sprite.png');
     const material = new THREE.SpriteMaterial({ map: map });
 
     for (let i = 0; i < this.count; i++) {

src/scripts/two.js

@@ -38,7 +38,7 @@ class TwoEngine extends Engine {
       ];
       let circle;
       if (this.type === 'sprite') {
-        circle = new Two.Sprite('/sprite.png', x, y, 1, 1);
+        circle = new Two.Sprite('sprite.png', x, y, 1, 1);
         this.two.add(circle);
       } else {
         circle = this.two.makeCircle(0, 0, size);