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

[ts][player] Click on canvas will now pause/resume player ala YouTube.

Browse Source
This commit is contained in:
badlogic 2018-12-17 18:17:18 +01:00
parent d5ee59558a
commit 43227961ce
7 changed files with 67 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1872,6 +1872,7 @@ declare module spine {
drawFrame(requestNextFrame?: boolean): void;
scale(sourceWidth: number, sourceHeight: number, targetWidth: number, targetHeight: number): Vector2;
loadSkeleton(): void;
private cancelId;
setupInput(): void;
private play();
private pause();

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

@ -10235,6 +10235,7 @@ var spine;
this.currentViewport = null;
this.previousViewport = null;
this.viewportTransitionStart = 0;
this.cancelId = 0;
if (typeof parent === "string")
parent = document.getElementById(parent);
parent.appendChild(this.render());
@ -10796,7 +10797,15 @@ var spine;
}
},
up: function (x, y) {
target = null;
if (target) {
target = null;
}
else {
if (_this.paused)
_this.play();
else
_this.pause();
}
},
dragged: function (x, y) {
if (target != null) {
@ -10829,7 +10838,6 @@ var spine;
});
var mouseOverControls = true;
var mouseOverCanvas = false;
var cancelId = 0;
parent.addEventListener("mousemove", function (ev) {
if (ev instanceof MouseEvent) {
if (!_this.config.showControls)
@ -10837,22 +10845,20 @@ var spine;
var popup = findWithClass(_this.dom, "spine-player-popup");
mouseOverControls = overlap(ev, _this.playerControls.getBoundingClientRect());
mouseOverCanvas = overlap(ev, _this.canvas.getBoundingClientRect());
clearTimeout(cancelId);
clearTimeout(_this.cancelId);
var hide = popup.length == 0 && !mouseOverControls && !mouseOverCanvas && !_this.paused;
if (hide) {
console.log("hidding");
_this.playerControls.classList.add("spine-player-controls-hidden");
}
else {
console.log("showing");
_this.playerControls.classList.remove("spine-player-controls-hidden");
}
if (!mouseOverControls && popup.length == 0 && !_this.paused) {
var remove = function () {
console.log("hidding timeout");
_this.playerControls.classList.add("spine-player-controls-hidden");
if (!_this.paused)
_this.playerControls.classList.add("spine-player-controls-hidden");
};
cancelId = setTimeout(remove, 500);
_this.cancelId = setTimeout(remove, 500);
}
}
});
@ -10863,7 +10869,13 @@ var spine;
};
};
SpinePlayer.prototype.play = function () {
var _this = this;
this.paused = false;
var remove = function () {
if (!_this.paused)
_this.playerControls.classList.add("spine-player-controls-hidden");
};
this.cancelId = setTimeout(remove, 500);
this.playButton.classList.remove("spine-player-button-icon-play");
this.playButton.classList.add("spine-player-button-icon-pause");
if (this.config.animation) {
@ -10874,6 +10886,8 @@ var spine;
};
SpinePlayer.prototype.pause = function () {
this.paused = true;
this.playerControls.classList.remove("spine-player-controls-hidden");
clearTimeout(this.cancelId);
this.playButton.classList.remove("spine-player-button-icon-pause");
this.playButton.classList.add("spine-player-button-icon-play");
};

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

File diff suppressed because one or more lines are too long

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

@ -1782,6 +1782,7 @@ declare module spine {
drawFrame(requestNextFrame?: boolean): void;
scale(sourceWidth: number, sourceHeight: number, targetWidth: number, targetHeight: number): Vector2;
loadSkeleton(): void;
private cancelId;
setupInput(): void;
private play();
private pause();

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

@ -9572,6 +9572,7 @@ var spine;
this.currentViewport = null;
this.previousViewport = null;
this.viewportTransitionStart = 0;
this.cancelId = 0;
if (typeof parent === "string")
parent = document.getElementById(parent);
parent.appendChild(this.render());
@ -10133,7 +10134,15 @@ var spine;
}
},
up: function (x, y) {
target = null;
if (target) {
target = null;
}
else {
if (_this.paused)
_this.play();
else
_this.pause();
}
},
dragged: function (x, y) {
if (target != null) {
@ -10166,7 +10175,6 @@ var spine;
});
var mouseOverControls = true;
var mouseOverCanvas = false;
var cancelId = 0;
parent.addEventListener("mousemove", function (ev) {
if (ev instanceof MouseEvent) {
if (!_this.config.showControls)
@ -10174,22 +10182,20 @@ var spine;
var popup = findWithClass(_this.dom, "spine-player-popup");
mouseOverControls = overlap(ev, _this.playerControls.getBoundingClientRect());
mouseOverCanvas = overlap(ev, _this.canvas.getBoundingClientRect());
clearTimeout(cancelId);
clearTimeout(_this.cancelId);
var hide = popup.length == 0 && !mouseOverControls && !mouseOverCanvas && !_this.paused;
if (hide) {
console.log("hidding");
_this.playerControls.classList.add("spine-player-controls-hidden");
}
else {
console.log("showing");
_this.playerControls.classList.remove("spine-player-controls-hidden");
}
if (!mouseOverControls && popup.length == 0 && !_this.paused) {
var remove = function () {
console.log("hidding timeout");
_this.playerControls.classList.add("spine-player-controls-hidden");
if (!_this.paused)
_this.playerControls.classList.add("spine-player-controls-hidden");
};
cancelId = setTimeout(remove, 500);
_this.cancelId = setTimeout(remove, 500);
}
}
});
@ -10200,7 +10206,13 @@ var spine;
};
};
SpinePlayer.prototype.play = function () {
var _this = this;
this.paused = false;
var remove = function () {
if (!_this.paused)
_this.playerControls.classList.add("spine-player-controls-hidden");
};
this.cancelId = setTimeout(remove, 500);
this.playButton.classList.remove("spine-player-button-icon-play");
this.playButton.classList.add("spine-player-button-icon-pause");
if (this.config.animation) {
@ -10211,6 +10223,8 @@ var spine;
};
SpinePlayer.prototype.pause = function () {
this.paused = true;
this.playerControls.classList.remove("spine-player-controls-hidden");
clearTimeout(this.cancelId);
this.playButton.classList.remove("spine-player-button-icon-pause");
this.playButton.classList.add("spine-player-button-icon-play");
};

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

File diff suppressed because one or more lines are too long

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

@ -952,6 +952,7 @@
this.loaded = true;
}
private cancelId = 0;
setupInput () {
let controlBones = this.config.controlBones;
let selectedBones = this.selectedBones = new Array<Bone>(this.config.controlBones.length);
@ -975,7 +976,14 @@
}
},
up: (x, y) => {
target = null;
if (target) {
target = null;
} else {
if (this.paused)
this.play()
else
this.pause();
}
},
dragged: (x, y) => {
if (target != null) {
@ -1012,7 +1020,6 @@
// area :/
var mouseOverControls = true;
var mouseOverCanvas = false;
let cancelId = 0;
parent.addEventListener("mousemove", (ev: UIEvent) => {
if (ev instanceof MouseEvent) {
if (!this.config.showControls) return;
@ -1020,21 +1027,18 @@
let popup = findWithClass(this.dom, "spine-player-popup");
mouseOverControls = overlap(ev, this.playerControls.getBoundingClientRect());
mouseOverCanvas = overlap(ev, this.canvas.getBoundingClientRect());
clearTimeout(cancelId);
clearTimeout(this.cancelId);
let hide = popup.length == 0 && !mouseOverControls && !mouseOverCanvas && !this.paused;
if (hide) {
console.log("hidding");
this.playerControls.classList.add("spine-player-controls-hidden");
} else {
console.log("showing");
this.playerControls.classList.remove("spine-player-controls-hidden");
}
if (!mouseOverControls && popup.length == 0 && !this.paused) {
let remove = () => {
console.log("hidding timeout");
this.playerControls.classList.add("spine-player-controls-hidden");
if (!this.paused) this.playerControls.classList.add("spine-player-controls-hidden");
};
cancelId = setTimeout(remove, 500);
this.cancelId = setTimeout(remove, 500);
}
}
});
@ -1048,6 +1052,10 @@
private play () {
this.paused = false;
let remove = () => {
if (!this.paused) this.playerControls.classList.add("spine-player-controls-hidden");
};
this.cancelId = setTimeout(remove, 500);
this.playButton.classList.remove("spine-player-button-icon-play");
this.playButton.classList.add("spine-player-button-icon-pause");
@ -1060,6 +1068,9 @@
private pause () {
this.paused = true;
this.playerControls.classList.remove("spine-player-controls-hidden");
clearTimeout(this.cancelId);
this.playButton.classList.remove("spine-player-button-icon-pause");
this.playButton.classList.add("spine-player-button-icon-play");
}