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

[player] Added Player.stopRendering() to interrupt the requestAnimationFrame loop.

Browse Source
This commit is contained in:
badlogic 2019-12-14 02:19:22 +01:00
parent a5428585e2
commit 121467572c
9 changed files with 46 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1949,6 +1949,7 @@ declare module spine {
private viewportTransitionStart;
private selectedBones;
private parent;
private stopRequestAnimationFrame;
constructor(parent: HTMLElement | string, config: SpinePlayerConfig);
validateConfig(config: SpinePlayerConfig): SpinePlayerConfig;
showError(error: string): void;
@ -1968,6 +1969,7 @@ declare module spine {
setAnimation(animation: string): void;
private percentageToWorldUnit;
private calculateAnimationViewport;
stopRendering(): void;
}
}
declare function CodeMirror(el: Element, config: any): void;

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

@ -11580,6 +11580,7 @@ var spine;
this.currentViewport = null;
this.previousViewport = null;
this.viewportTransitionStart = 0;
this.stopRequestAnimationFrame = false;
this.cancelId = 0;
if (typeof parent === "string")
this.parent = document.getElementById(parent);
@ -11919,7 +11920,7 @@ var spine;
SpinePlayer.prototype.drawFrame = function (requestNextFrame) {
var _this = this;
if (requestNextFrame === void 0) { requestNextFrame = true; }
if (requestNextFrame)
if (requestNextFrame && !this.stopRequestAnimationFrame)
requestAnimationFrame(function () { return _this.drawFrame(); });
var ctx = this.context;
var gl = ctx.gl;
@ -12379,6 +12380,9 @@ var spine;
height: size.y
};
};
SpinePlayer.prototype.stopRendering = function () {
this.stopRequestAnimationFrame = true;
};
SpinePlayer.HOVER_COLOR_INNER = new spine.Color(0.478, 0, 0, 0.25);
SpinePlayer.HOVER_COLOR_OUTER = new spine.Color(1, 1, 1, 1);
SpinePlayer.NON_HOVER_COLOR_INNER = new spine.Color(0.478, 0, 0, 0.5);

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

File diff suppressed because one or more lines are too long

2
spine-ts/build/spine-player.d.ts vendored
View File

@ -1857,6 +1857,7 @@ declare module spine {
private viewportTransitionStart;
private selectedBones;
private parent;
private stopRequestAnimationFrame;
constructor(parent: HTMLElement | string, config: SpinePlayerConfig);
validateConfig(config: SpinePlayerConfig): SpinePlayerConfig;
showError(error: string): void;
@ -1876,6 +1877,7 @@ declare module spine {
setAnimation(animation: string): void;
private percentageToWorldUnit;
private calculateAnimationViewport;
stopRendering(): void;
}
}
declare function CodeMirror(el: Element, config: any): void;

6
spine-ts/build/spine-player.js
View File

@ -10895,6 +10895,7 @@ var spine;
this.currentViewport = null;
this.previousViewport = null;
this.viewportTransitionStart = 0;
this.stopRequestAnimationFrame = false;
this.cancelId = 0;
if (typeof parent === "string")
this.parent = document.getElementById(parent);
@ -11234,7 +11235,7 @@ var spine;
SpinePlayer.prototype.drawFrame = function (requestNextFrame) {
var _this = this;
if (requestNextFrame === void 0) { requestNextFrame = true; }
if (requestNextFrame)
if (requestNextFrame && !this.stopRequestAnimationFrame)
requestAnimationFrame(function () { return _this.drawFrame(); });
var ctx = this.context;
var gl = ctx.gl;
@ -11694,6 +11695,9 @@ var spine;
height: size.y
};
};
SpinePlayer.prototype.stopRendering = function () {
this.stopRequestAnimationFrame = true;
};
SpinePlayer.HOVER_COLOR_INNER = new spine.Color(0.478, 0, 0, 0.25);
SpinePlayer.HOVER_COLOR_OUTER = new spine.Color(1, 1, 1, 1);
SpinePlayer.NON_HOVER_COLOR_INNER = new spine.Color(0.478, 0, 0, 0.5);

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

File diff suppressed because one or more lines are too long

24
spine-ts/player/example/generator/index.html
View File

@ -53,6 +53,8 @@ body {
#config {
width: 100%;
height: 100%;
padding: 1em;
background: #f0f0f0;
}
</style>
@ -68,6 +70,8 @@ body {
<script>
var UI;
var Loader;
var dropZone = document.getElementById("dropzone");
var editor = document.getElementById("editor")
function showError(errorMessage) {
alert(errorMessage);
@ -89,7 +93,7 @@ body {
Loader.loadStyle(cssUrl, function () {
Loader.loadJavaScript(playerUrl, function () {
UI.hide(dropZone)
setupEditor(document.getElementById("editor"), data);
setupEditor(editor, data);
});
}, showError);
}, showError);
@ -123,7 +127,23 @@ body {
}
function setupConfig(editor, player, data) {
var configElement = UI.createElement(editor, `<div id="config"></div>`);
var cfg = UI.createElement(editor, `<div id="config"></div>`);
var topBar = UI.createElement(cfg, /*html*/`
<div style="display: flex; flex-direction: row;">
<button type="button">New</button>
<button type="button">Download HTML</button>
</div>
`);
var newButton = topBar.children[0];
newButton.onclick = function() {
UI.show(dropZone);
UI.hide(editor);
}
var downloadButton = topBar.children[1];
UI.createElement(cfg, `<h3>General</h3>`);
}
</script>
</body>

2
spine-ts/player/example/generator/ui.js
View File

@ -7,7 +7,7 @@ var spineGenerator;
UI.createElement = function (parent, html) {
parent.insertAdjacentHTML("beforeend", html);
return parent.lastChild;
return parent.lastElementChild;
}
UI.clear = function(element) {

8
spine-ts/player/src/Player.ts
View File

@ -320,6 +320,8 @@ module spine {
private selectedBones: Bone[];
private parent: HTMLElement;
private stopRequestAnimationFrame = false;
constructor(parent: HTMLElement | string, private config: SpinePlayerConfig) {
if (typeof parent === "string") this.parent = document.getElementById(parent);
else this.parent = parent;
@ -717,7 +719,7 @@ module spine {
}
drawFrame (requestNextFrame = true) {
if (requestNextFrame) requestAnimationFrame(() => this.drawFrame());
if (requestNextFrame && !this.stopRequestAnimationFrame) requestAnimationFrame(() => this.drawFrame());
let ctx = this.context;
let gl = ctx.gl;
@ -1232,6 +1234,10 @@ module spine {
height: size.y
};
}
public stopRendering() {
this.stopRequestAnimationFrame = true;
}
}
function isContained(dom: HTMLElement, needle: HTMLElement): boolean {