Home Explore Help
Sign In
archive
/
spine-runtimes
mirror of https://github.com/EsotericSoftware/spine-runtimes.git
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

[phaser] Closes #2356, only instantiate a single SceneRenderer for the whole game.

Mario Zechner 2 years ago
parent
96e25be436
commit
2f33d326a8
3 changed files with 53 additions and 4 deletions
Split View Show Diff Stats
  1. 3 0
      spine-ts/index.html
  2. 43 0
      spine-ts/spine-phaser/example/add-existing.html
  3. 7 4
      spine-ts/spine-phaser/src/SpinePlugin.ts

+ 3 - 0
spine-ts/index.html
View File 

@@ -86,6 +86,9 @@
 
         <li>
 
           <a href="/spine-phaser/example/custom-spine-object-type.html">Custom object factory name</a>
 
         </li>
 
+        <li>
 
+          <a href="/spine-phaser/example/add-existing.html">Add existing object</a>
 
+        </li>
 
       </ul>
 
       <li>Player</li>
 
       <ul>

+ 43 - 0
spine-ts/spine-phaser/example/add-existing.html
View File 

@@ -0,0 +1,43 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/phaser.js"></script>
 
+    <script src="../dist/iife/spine-phaser.js"></script>
 
+    <title>Spine Phaser Example</title>
 
+</head>
 
+
 
+<body>
 
+    <h1>Add existing object</h1>
 
+</body>
 
+<script>
 
+    class BasicExample extends Phaser.Scene {
 
+        preload() {
 
+            this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
 
+            this.load.spineAtlas("spineboy-atlas", "assets/spineboy-pma.atlas");
 
+        }
 
+
 
+        create() {
 
+            const spineboy = this.add.spine(200, 500, "spineboy-data", "spineboy-atlas");
 
+            const spineboy2 = this.add.existing(new spine.SpineGameObject(this, this.spine, 500, 500, 'spineboy-data', "spineboy-atlas"));
 
+        }
 
+    }
 
+
 
+    new Phaser.Game({
 
+        type: Phaser.AUTO,
 
+        width: 800,
 
+        height: 600,
 
+        type: Phaser.WEBGL,
 
+        scene: [BasicExample],
 
+        plugins: {
 
+            scene: [
 
+                { key: "spine.SpinePlugin", plugin: spine.SpinePlugin, mapping: "spine" }
 
+            ]
 
+        }
 
+    });
 
+</script>
 
+
 
+</html>

+ 7 - 4
spine-ts/spine-phaser/src/SpinePlugin.ts
View File 

@@ -75,7 +75,10 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
 
 	game: Phaser.Game;
 
 	private isWebGL: boolean;
 
 	gl: WebGLRenderingContext | null;
 
-	webGLRenderer: SceneRenderer | null;
 
+	static gameWebGLRenderer: SceneRenderer | null = null;
 
+	get webGLRenderer(): SceneRenderer | null {
 
+		return SpinePlugin.gameWebGLRenderer;
 
+	}
 
 	canvasRenderer: SkeletonRenderer | null;
 
 	phaserRenderer: Phaser.Renderer.Canvas.CanvasRenderer | Phaser.Renderer.WebGL.WebGLRenderer;
 
 	private skeletonDataCache: Phaser.Cache.BaseCache;
 
@@ -87,7 +90,6 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
 
 		this.isWebGL = this.game.config.renderType === 2;
 
 		this.gl = this.isWebGL ? (this.game.renderer as Phaser.Renderer.WebGL.WebGLRenderer).gl : null;
 
 		this.phaserRenderer = this.game.renderer;
 
-		this.webGLRenderer = null;
 
 		this.canvasRenderer = null;
 
 		this.skeletonDataCache = this.game.cache.addCustom(SPINE_SKELETON_DATA_CACHE_KEY);
 
 		this.atlasCache = this.game.cache.addCustom(SPINE_ATLAS_CACHE_KEY);
 
@@ -141,11 +143,12 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
 
 		pluginManager.registerGameObject((window as any).SPINE_GAME_OBJECT_TYPE ? (window as any).SPINE_GAME_OBJECT_TYPE : SPINE_GAME_OBJECT_TYPE, addSpineGameObject, makeSpineGameObject);
 
 	}
 
 
+	static rendererId = 0;
 
 	boot () {
 
 		Skeleton.yDown = true;
 
 		if (this.isWebGL) {
 
-			if (!this.webGLRenderer) {
 
-				this.webGLRenderer = new SceneRenderer((this.game.renderer! as Phaser.Renderer.WebGL.WebGLRenderer).canvas, this.gl!, true);
 
+			if (!SpinePlugin.gameWebGLRenderer) {
 
+				SpinePlugin.gameWebGLRenderer = new SceneRenderer((this.game.renderer! as Phaser.Renderer.WebGL.WebGLRenderer).canvas, this.gl!, true);
 
 			}
 
 			this.onResize();
 
 			this.game.scale.on(Phaser.Scale.Events.RESIZE, this.onResize, this);