UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-02-12 10:08:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts] Refactored the way we render multiple demos. All rendering is coalesced into a single rendering loop. Eats less CPU

Browse Source
This commit is contained in:
badlogic 2016-09-03 01:13:02 +02:00
parent 8faba2cdec
commit 73b5617b81
16 changed files with 84 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
spine-ts/build/spine-all.d.ts vendored
View File

@ -757,10 +757,10 @@ declare module spine {
static BLUE: Color;
static MAGENTA: Color;
constructor(r?: number, g?: number, b?: number, a?: number);
set(r: number, g: number, b: number, a: number): void;
setFromColor(c: Color): void;
setFromString(hex: string): void;
add(r: number, g: number, b: number, a: number): void;
set(r: number, g: number, b: number, a: number): this;
setFromColor(c: Color): this;
setFromString(hex: string): this;
add(r: number, g: number, b: number, a: number): this;
clamp(): this;
}
class MathUtils {
@ -1319,6 +1319,7 @@ declare module spine.webgl {
boneOriginColor: Color;
attachmentLineColor: Color;
triangleLineColor: Color;
pathColor: Color;
aabbColor: Color;
drawBones: boolean;
drawRegionAttachments: boolean;

7
spine-ts/build/spine-all.js
View File

@ -4118,12 +4118,14 @@ var spine;
this.b = b;
this.a = a;
this.clamp();
return this;
};
Color.prototype.setFromColor = function (c) {
this.r = c.r;
this.g = c.g;
this.b = c.b;
this.a = c.a;
return this;
};
Color.prototype.setFromString = function (hex) {
hex = hex.charAt(0) == '#' ? hex.substr(1) : hex;
@ -4131,6 +4133,7 @@ var spine;
this.g = parseInt(hex.substr(2, 2), 16) / 255.0;
this.b = parseInt(hex.substr(4, 2), 16) / 255.0;
this.a = (hex.length != 8 ? 255 : parseInt(hex.substr(6, 2), 16)) / 255.0;
return this;
};
Color.prototype.add = function (r, g, b, a) {
this.r += r;
@ -4138,6 +4141,7 @@ var spine;
this.b += b;
this.a += a;
this.clamp();
return this;
};
Color.prototype.clamp = function () {
if (this.r < 0)
@ -6745,6 +6749,7 @@ var spine;
this.boneOriginColor = new spine.Color(0, 1, 0, 1);
this.attachmentLineColor = new spine.Color(0, 0, 1, 0.5);
this.triangleLineColor = new spine.Color(1, 0.64, 0, 0.5);
this.pathColor = new spine.Color().setFromString("FF7F00");
this.aabbColor = new spine.Color(0, 1, 0, 0.5);
this.drawBones = true;
this.drawRegionAttachments = true;
@ -6855,7 +6860,7 @@ var spine;
var nn = path.worldVerticesLength;
var world = this.temp = spine.Utils.setArraySize(this.temp, nn, 0);
path.computeWorldVertices(slot, world);
var color = path.color;
var color = this.pathColor;
var x1 = world[2], y1 = world[3], x2 = 0, y2 = 0;
if (path.closed) {
shapes.setColor(color);

2
spine-ts/build/spine-all.js.map
View File

File diff suppressed because one or more lines are too long

8
spine-ts/build/spine-core.d.ts vendored
View File

@ -731,10 +731,10 @@ declare module spine {
static BLUE: Color;
static MAGENTA: Color;
constructor(r?: number, g?: number, b?: number, a?: number);
set(r: number, g: number, b: number, a: number): void;
setFromColor(c: Color): void;
setFromString(hex: string): void;
add(r: number, g: number, b: number, a: number): void;
set(r: number, g: number, b: number, a: number): this;
setFromColor(c: Color): this;
setFromString(hex: string): this;
add(r: number, g: number, b: number, a: number): this;
clamp(): this;
}
class MathUtils {

4
spine-ts/build/spine-core.js
View File

@ -3941,12 +3941,14 @@ var spine;
this.b = b;
this.a = a;
this.clamp();
return this;
};
Color.prototype.setFromColor = function (c) {
this.r = c.r;
this.g = c.g;
this.b = c.b;
this.a = c.a;
return this;
};
Color.prototype.setFromString = function (hex) {
hex = hex.charAt(0) == '#' ? hex.substr(1) : hex;
@ -3954,6 +3956,7 @@ var spine;
this.g = parseInt(hex.substr(2, 2), 16) / 255.0;
this.b = parseInt(hex.substr(4, 2), 16) / 255.0;
this.a = (hex.length != 8 ? 255 : parseInt(hex.substr(6, 2), 16)) / 255.0;
return this;
};
Color.prototype.add = function (r, g, b, a) {
this.r += r;
@ -3961,6 +3964,7 @@ var spine;
this.b += b;
this.a += a;
this.clamp();
return this;
};
Color.prototype.clamp = function () {
if (this.r < 0)

2
spine-ts/build/spine-core.js.map
View File

File diff suppressed because one or more lines are too long

8
spine-ts/build/spine-threejs.d.ts vendored
View File

@ -731,10 +731,10 @@ declare module spine {
static BLUE: Color;
static MAGENTA: Color;
constructor(r?: number, g?: number, b?: number, a?: number);
set(r: number, g: number, b: number, a: number): void;
setFromColor(c: Color): void;
setFromString(hex: string): void;
add(r: number, g: number, b: number, a: number): void;
set(r: number, g: number, b: number, a: number): this;
setFromColor(c: Color): this;
setFromString(hex: string): this;
add(r: number, g: number, b: number, a: number): this;
clamp(): this;
}
class MathUtils {

4
spine-ts/build/spine-threejs.js
View File

@ -3941,12 +3941,14 @@ var spine;
this.b = b;
this.a = a;
this.clamp();
return this;
};
Color.prototype.setFromColor = function (c) {
this.r = c.r;
this.g = c.g;
this.b = c.b;
this.a = c.a;
return this;
};
Color.prototype.setFromString = function (hex) {
hex = hex.charAt(0) == '#' ? hex.substr(1) : hex;
@ -3954,6 +3956,7 @@ var spine;
this.g = parseInt(hex.substr(2, 2), 16) / 255.0;
this.b = parseInt(hex.substr(4, 2), 16) / 255.0;
this.a = (hex.length != 8 ? 255 : parseInt(hex.substr(6, 2), 16)) / 255.0;
return this;
};
Color.prototype.add = function (r, g, b, a) {
this.r += r;
@ -3961,6 +3964,7 @@ var spine;
this.b += b;
this.a += a;
this.clamp();
return this;
};
Color.prototype.clamp = function () {
if (this.r < 0)

2
spine-ts/build/spine-threejs.js.map
View File

File diff suppressed because one or more lines are too long

2
spine-ts/build/spine-webgl.js.map
View File

File diff suppressed because one or more lines are too long

9
spine-ts/build/spine-widget.d.ts vendored
View File

@ -731,10 +731,10 @@ declare module spine {
static BLUE: Color;
static MAGENTA: Color;
constructor(r?: number, g?: number, b?: number, a?: number);
set(r: number, g: number, b: number, a: number): void;
setFromColor(c: Color): void;
setFromString(hex: string): void;
add(r: number, g: number, b: number, a: number): void;
set(r: number, g: number, b: number, a: number): this;
setFromColor(c: Color): this;
setFromString(hex: string): this;
add(r: number, g: number, b: number, a: number): this;
clamp(): this;
}
class MathUtils {
@ -1249,6 +1249,7 @@ declare module spine.webgl {
boneOriginColor: Color;
attachmentLineColor: Color;
triangleLineColor: Color;
pathColor: Color;
aabbColor: Color;
drawBones: boolean;
drawRegionAttachments: boolean;

7
spine-ts/build/spine-widget.js
View File

@ -3941,12 +3941,14 @@ var spine;
this.b = b;
this.a = a;
this.clamp();
return this;
};
Color.prototype.setFromColor = function (c) {
this.r = c.r;
this.g = c.g;
this.b = c.b;
this.a = c.a;
return this;
};
Color.prototype.setFromString = function (hex) {
hex = hex.charAt(0) == '#' ? hex.substr(1) : hex;
@ -3954,6 +3956,7 @@ var spine;
this.g = parseInt(hex.substr(2, 2), 16) / 255.0;
this.b = parseInt(hex.substr(4, 2), 16) / 255.0;
this.a = (hex.length != 8 ? 255 : parseInt(hex.substr(6, 2), 16)) / 255.0;
return this;
};
Color.prototype.add = function (r, g, b, a) {
this.r += r;
@ -3961,6 +3964,7 @@ var spine;
this.b += b;
this.a += a;
this.clamp();
return this;
};
Color.prototype.clamp = function () {
if (this.r < 0)
@ -6322,6 +6326,7 @@ var spine;
this.boneOriginColor = new spine.Color(0, 1, 0, 1);
this.attachmentLineColor = new spine.Color(0, 0, 1, 0.5);
this.triangleLineColor = new spine.Color(1, 0.64, 0, 0.5);
this.pathColor = new spine.Color().setFromString("FF7F00");
this.aabbColor = new spine.Color(0, 1, 0, 0.5);
this.drawBones = true;
this.drawRegionAttachments = true;
@ -6432,7 +6437,7 @@ var spine;
var nn = path.worldVerticesLength;
var world = this.temp = spine.Utils.setArraySize(this.temp, nn, 0);
path.computeWorldVertices(slot, world);
var color = path.color;
var color = this.pathColor;
var x1 = world[2], y1 = world[3], x2 = 0, y2 = 0;
if (path.closed) {
shapes.setColor(color);

2
spine-ts/build/spine-widget.js.map
View File

File diff suppressed because one or more lines are too long

2
spine-ts/core/src/Utils.ts
View File

@ -247,7 +247,7 @@ module spine {
update () {
var now = Date.now() / 1000;
this.delta = now -this.lastTime;
this.delta = now - this.lastTime;
this.frameTime += this.delta;
this.totalTime += this.delta;
if (this.delta > this.maxDelta) this.delta = this.maxDelta;

2
spine-ts/webgl/demos/tank.js
View File

@ -125,7 +125,7 @@ var tankDemo = function(loadingComplete, bgColor) {
renderer.begin();
renderer.drawSkeleton(skeleton, true);
renderer.drawSkeletonDebug(skeleton, true);
renderer.end();
renderer.end();
}
init();

57
spine-ts/webgl/demos/utils.js
View File

@ -5,34 +5,55 @@ var spineDemos;
spineDemos.NON_HOVER_COLOR_INNER = new spine.Color(0.478, 0, 0, 0.5);
spineDemos.NON_HOVER_COLOR_OUTER = new spine.Color(1, 0, 0, 0.8);
spineDemos.assetManager = new spine.SharedAssetManager("http://esotericsoftware.com/demos/exports/");
spineDemos.setupRendering = function (canvas, renderFunc) {
var isVisible = false;
spineDemos.demos = [];
spineDemos.loopRunning = false;
function render () {
renderFunc();
if (isVisible) requestAnimationFrame(render);
};
function viewportCheck () {
var old = isVisible
isVisible = spineDemos.isElementInViewport(canvas);
if (isVisible && old != isVisible) requestAnimationFrame(render);
var timeKeeper = new spine.TimeKeeper();
var loop = function() {
timeKeeper.update();
if (spineDemos.log) console.log(timeKeeper.delta + ", " + timeKeeper.framesPerSecond);
spineDemos.requestAnimationFrame(loop);
var demos = spineDemos.demos;
for (var i = 0; i < demos.length; i++) {
var canvas = demos[i].canvas;
var renderFunc = demos[i].renderFunc;
if (spineDemos.isElementInViewport(canvas)) {
if (spineDemos.log) console.log("Rendering " + canvas.id);
renderFunc();
};
}
}
window.addEventListener("DOMContentLoaded", viewportCheck, false);
window.addEventListener("load", viewportCheck, false);
window.addEventListener("resize", viewportCheck, false);
window.addEventListener("scroll", viewportCheck, false);
var setupLoop = function() {
if (!spineDemos.loopRunning) {
loop();
spineDemos.loopRunning = true;
}
}
viewportCheck();
requestAnimationFrame(render);
spineDemos.setupRendering = function (canvas, renderFunc) {
setupLoop();
spineDemos.demos.push({canvas: canvas, renderFunc: renderFunc});
};
spineDemos.requestAnimationFrame = function(func) {
requestAnimationFrame(func);
}
spineDemos.isElementInViewport = function (canvas) {
var rect = canvas.getBoundingClientRect();
var x = 0, y = 0;
var width = (window.innerHeight || document.documentElement.clientHeight);
var height = (window.innerWidth || document.documentElement.clientWidth);
return rect.left < x + width && rect.right > x && rect.top < y + height && rect.bottom > y;
};
};
spineDemos.setupWebGLContext = function (canvas) {
config = {
alpha: false,
depth: false,
stencil: false
}
return gl = canvas.getContext("webgl", config) || canvas.getContext("experimental-webgl", config);
}
})(spineDemos || (spineDemos = { }));