UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2025-12-20 17:26:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts] Minor demo updates.

Browse Source 
- Loading screen is never shown if demo loads completely while offscreen.
- HTML charset specified.
- Tabs, not spaces, you filthy animals. Each unminified JS reduced by ~80kb.
- Clean up.
This commit is contained in:
NathanSweet 2016-09-13 23:18:49 +02:00
parent 008bceef0a
commit b597aac9b9
26 changed files with 35270 additions and 35255 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
spine-ts/build.sh
View File

@ -6,3 +6,4 @@ tsc -p tsconfig.webgl.json
tsc -p tsconfig.canvas.json tsc -p tsconfig.canvas.json
tsc -p tsconfig.threejs.json tsc -p tsconfig.threejs.json
tsc -p tsconfig.widget.json tsc -p tsconfig.widget.json
ls build/*.js build/*.ts | awk '{print "unexpand -t 4 ", $0, " > /tmp/e; mv /tmp/e ", $0}' | sh

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

@ -5327,6 +5327,7 @@ var spine;
this.tempColor = new spine.Color(); this.tempColor = new spine.Color();
this.firstDraw = 0; this.firstDraw = 0;
this.renderer = renderer; this.renderer = renderer;
this.timeKeeper.maxDelta = 9;
if (LoadingScreen.logoImg === null) { if (LoadingScreen.logoImg === null) {
var isSafari = navigator.userAgent.indexOf("Safari") > -1; var isSafari = navigator.userAgent.indexOf("Safari") > -1;
LoadingScreen.logoImg = new Image(); LoadingScreen.logoImg = new Image();
@ -5367,7 +5368,11 @@ var spine;
} }
else { else {
this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1); this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1);
a = Math.max(0, 1 - this.fadeOut / LoadingScreen.FADE_SECONDS); if (this.fadeOut > LoadingScreen.FADE_SECONDS) {
renderer.camera.position.set(oldX, oldY, 0);
return;
}
a = 1 - this.fadeOut / LoadingScreen.FADE_SECONDS;
this.tempColor.setFromColor(this.backgroundColor); this.tempColor.setFromColor(this.backgroundColor);
this.tempColor.a = 1 - (a - 1) * (a - 1); this.tempColor.a = 1 - (a - 1) * (a - 1);
renderer.begin(); renderer.begin();

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

File diff suppressed because one or more lines are too long

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

@ -4904,6 +4904,7 @@ var spine;
this.tempColor = new spine.Color(); this.tempColor = new spine.Color();
this.firstDraw = 0; this.firstDraw = 0;
this.renderer = renderer; this.renderer = renderer;
this.timeKeeper.maxDelta = 9;
if (LoadingScreen.logoImg === null) { if (LoadingScreen.logoImg === null) {
var isSafari = navigator.userAgent.indexOf("Safari") > -1; var isSafari = navigator.userAgent.indexOf("Safari") > -1;
LoadingScreen.logoImg = new Image(); LoadingScreen.logoImg = new Image();
@ -4944,7 +4945,11 @@ var spine;
} }
else { else {
this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1); this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1);
a = Math.max(0, 1 - this.fadeOut / LoadingScreen.FADE_SECONDS); if (this.fadeOut > LoadingScreen.FADE_SECONDS) {
renderer.camera.position.set(oldX, oldY, 0);
return;
}
a = 1 - this.fadeOut / LoadingScreen.FADE_SECONDS;
this.tempColor.setFromColor(this.backgroundColor); this.tempColor.setFromColor(this.backgroundColor);
this.tempColor.a = 1 - (a - 1) * (a - 1); this.tempColor.a = 1 - (a - 1) * (a - 1);
renderer.begin(); renderer.begin();

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

File diff suppressed because one or more lines are too long

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

@ -4904,6 +4904,7 @@ var spine;
this.tempColor = new spine.Color(); this.tempColor = new spine.Color();
this.firstDraw = 0; this.firstDraw = 0;
this.renderer = renderer; this.renderer = renderer;
this.timeKeeper.maxDelta = 9;
if (LoadingScreen.logoImg === null) { if (LoadingScreen.logoImg === null) {
var isSafari = navigator.userAgent.indexOf("Safari") > -1; var isSafari = navigator.userAgent.indexOf("Safari") > -1;
LoadingScreen.logoImg = new Image(); LoadingScreen.logoImg = new Image();
@ -4944,7 +4945,11 @@ var spine;
} }
else { else {
this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1); this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1);
a = Math.max(0, 1 - this.fadeOut / LoadingScreen.FADE_SECONDS); if (this.fadeOut > LoadingScreen.FADE_SECONDS) {
renderer.camera.position.set(oldX, oldY, 0);
return;
}
a = 1 - this.fadeOut / LoadingScreen.FADE_SECONDS;
this.tempColor.setFromColor(this.backgroundColor); this.tempColor.setFromColor(this.backgroundColor);
this.tempColor.a = 1 - (a - 1) * (a - 1); this.tempColor.a = 1 - (a - 1) * (a - 1);
renderer.begin(); renderer.begin();

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

File diff suppressed because one or more lines are too long

1
spine-ts/webgl/demos/hoverboard.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>IK Constraints - Spine Demo</title> <title>IK Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/imagechanges.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Frame-by-frame - Spine Demo</title> <title>Frame-by-frame - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/meshes.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Meshes - Spine Demo</title> <title>Meshes - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/skins.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Skins - Spine Demo</title> <title>Skins - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/spritesheets.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Spine vs Sprite Sheets - Spine Demo</title> <title>Spine vs Sprite Sheets - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/stretchyman.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Strechyman - Spine Demo</title> <title>Strechyman - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/tank.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Tank - Spine Demo</title> <title>Tank - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/transforms.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Transform Constraints - Spine Demo</title> <title>Transform Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

1
spine-ts/webgl/demos/transitions.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Transitions - Spine Demo</title> <title>Transitions - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

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

@ -7,12 +7,12 @@ var spineDemos = {
demos: [], demos: [],
loopRunning: false loopRunning: false
}; };
(function() { (function () {
var timeKeeper = new spine.TimeKeeper(); var timeKeeper = new spine.TimeKeeper();
function loop () { function loop () {
timeKeeper.update(); timeKeeper.update();
if (spineDemos.log) console.log(timeKeeper.delta + ", " + timeKeeper.framesPerSecond); if (spineDemos.log) console.log(timeKeeper.delta + ", " + timeKeeper.framesPerSecond);
spineDemos.requestAnimationFrame(loop); requestAnimationFrame(loop);
var demos = spineDemos.demos; var demos = spineDemos.demos;
for (var i = 0; i < demos.length; i++) { for (var i = 0; i < demos.length; i++) {
var demo = demos[i]; var demo = demos[i];
@ -25,28 +25,7 @@ var spineDemos = {
} }
} }
function setupLoop () { function checkElementVisible (demo) {
if (!spineDemos.loopRunning) {
loop();
spineDemos.loopRunning = true;
}
}
spineDemos.setupRendering = function (canvas, renderFunc) {
var demo = {canvas: canvas, renderFunc: renderFunc, visible: false};
$(window).on('DOMContentLoaded load resize scroll', function() {
spineDemos.checkElementVisible(demo);
});
spineDemos.checkElementVisible(demo);
setupLoop();
spineDemos.demos.push(demo);
};
spineDemos.requestAnimationFrame = function(func) {
requestAnimationFrame(func);
};
spineDemos.checkElementVisible = function (demo) {
var rect = demo.canvas.getBoundingClientRect(); var rect = demo.canvas.getBoundingClientRect();
var x = 0, y = 0; var x = 0, y = 0;
var width = (window.innerHeight || document.documentElement.clientHeight); var width = (window.innerHeight || document.documentElement.clientHeight);
@ -54,13 +33,17 @@ var spineDemos = {
demo.visible = rect.left < x + width && rect.right > x && rect.top < y + height && rect.bottom > y; demo.visible = rect.left < x + width && rect.right > x && rect.top < y + height && rect.bottom > y;
}; };
spineDemos.setupWebGLContext = function (canvas) { spineDemos.setupRendering = function (canvas, renderFunc) {
config = { var demo = {canvas: canvas, renderFunc: renderFunc, visible: false};
alpha: false, $(window).on('DOMContentLoaded load resize scroll', function() {
depth: false, checkElementVisible(demo);
stencil: false });
checkElementVisible(demo);
if (!spineDemos.loopRunning) {
loop();
spineDemos.loopRunning = true;
} }
return gl = canvas.getContext("webgl", config) || canvas.getContext("experimental-webgl", config); spineDemos.demos.push(demo);
}; };
spineDemos.loadSliders = function () { spineDemos.loadSliders = function () {

1
spine-ts/webgl/demos/vine.html
View File

@ -1,4 +1,5 @@
<html> <html>
<meta charset="UTF-8">
<title>Path Constraints - Spine Demo</title> <title>Path Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css"> <link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script> <script src="../../build/spine-webgl.js"></script>

8
spine-ts/webgl/src/LoadingScreen.ts
View File

@ -23,6 +23,8 @@ module spine.webgl {
constructor (renderer: SceneRenderer) { constructor (renderer: SceneRenderer) {
this.renderer = renderer; this.renderer = renderer;
this.timeKeeper.maxDelta = 9;
if (LoadingScreen.logoImg === null) { if (LoadingScreen.logoImg === null) {
// thank you Apple Inc. // thank you Apple Inc.
let isSafari = navigator.userAgent.indexOf("Safari") > -1; let isSafari = navigator.userAgent.indexOf("Safari") > -1;
@ -66,7 +68,11 @@ module spine.webgl {
this.tempColor.a = 1; this.tempColor.a = 1;
} else { } else {
this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1); this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1);
a = Math.max(0, 1 - this.fadeOut / LoadingScreen.FADE_SECONDS); if (this.fadeOut > LoadingScreen.FADE_SECONDS) {
renderer.camera.position.set(oldX, oldY, 0);
return;
}
a = 1 - this.fadeOut / LoadingScreen.FADE_SECONDS;
this.tempColor.setFromColor(this.backgroundColor); this.tempColor.setFromColor(this.backgroundColor);
this.tempColor.a = 1 - (a - 1) * (a - 1); this.tempColor.a = 1 - (a - 1) * (a - 1);
renderer.begin(); renderer.begin();