mirror of
https://github.com/EsotericSoftware/spine-runtimes.git
synced 2025-12-21 09:46:02 +08:00
[ts] Fixed all demos with handles. Handles can no longer be dragged outside the canvas.
This commit is contained in:
parent
5994c347ea
commit
5ebb3db8b6
@ -88,12 +88,15 @@ var additiveBlendingDemo = function(canvas, bgColor) {
|
|||||||
function calculateBlend (x, y, isPageCoords) {
|
function calculateBlend (x, y, isPageCoords) {
|
||||||
if (isPageCoords) {
|
if (isPageCoords) {
|
||||||
var canvasBounds = canvas.getBoundingClientRect();
|
var canvasBounds = canvas.getBoundingClientRect();
|
||||||
console.log(canvasBounds.x + ", " + canvasBounds.y + ", " + x + ", " + y);
|
|
||||||
x = Math.max(0, Math.min(canvasBounds.width, x - canvasBounds.x));
|
x = Math.max(0, Math.min(canvasBounds.width, x - canvasBounds.x));
|
||||||
y = Math.max(0, Math.min(canvasBounds.height, y - canvasBounds.y));
|
y = Math.max(0, Math.min(canvasBounds.height, y - canvasBounds.y));
|
||||||
}
|
}
|
||||||
x = x / canvas.width;
|
x = x / canvas.width;
|
||||||
y = y / canvas.height;
|
y = y / canvas.height;
|
||||||
|
if (x > 1) x = 1;
|
||||||
|
if (x < 0) x = 0;
|
||||||
|
if (y > 1) y = 1;
|
||||||
|
if (y < 0) y = 0;
|
||||||
left.alpha = (Math.max(x, 0.5) - 0.5) * 2;
|
left.alpha = (Math.max(x, 0.5) - 0.5) * 2;
|
||||||
right.alpha = (0.5 - Math.min(x, 0.5)) * 2;
|
right.alpha = (0.5 - Math.min(x, 0.5)) * 2;
|
||||||
up.alpha = (0.5 - Math.min(y, 0.5)) * 2;
|
up.alpha = (0.5 - Math.min(y, 0.5)) * 2;
|
||||||
@ -119,7 +122,7 @@ var additiveBlendingDemo = function(canvas, bgColor) {
|
|||||||
dragging = false;
|
dragging = false;
|
||||||
},
|
},
|
||||||
dragged: function(x, y) {
|
dragged: function(x, y) {
|
||||||
if (dragging) {
|
if (dragging && x > 0 && x < canvas.width && y > 0 && y < canvas.height) {
|
||||||
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
||||||
handle.x = coords.x;
|
handle.x = coords.x;
|
||||||
handle.y = coords.y;
|
handle.y = coords.y;
|
||||||
|
|||||||
@ -117,7 +117,7 @@ var hoverboardDemo = function(canvas, bgColor) {
|
|||||||
target = null;
|
target = null;
|
||||||
},
|
},
|
||||||
dragged: function(x, y) {
|
dragged: function(x, y) {
|
||||||
if (target != null) {
|
if (target != null && x > 0 && x < canvas.width && y > 0 && y < canvas.height) {
|
||||||
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
||||||
if (target.parent !== null) {
|
if (target.parent !== null) {
|
||||||
target.parent.worldToLocal(temp2.set(coords.x, coords.y));
|
target.parent.worldToLocal(temp2.set(coords.x, coords.y));
|
||||||
|
|||||||
@ -91,7 +91,7 @@ var stretchymanDemo = function(canvas, bgColor) {
|
|||||||
target = null;
|
target = null;
|
||||||
},
|
},
|
||||||
dragged: function(x, y) {
|
dragged: function(x, y) {
|
||||||
if (target != null) {
|
if (target != null && x > 0 && x < canvas.width && y > 0 && y < canvas.height) {
|
||||||
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
||||||
if (target.parent !== null)
|
if (target.parent !== null)
|
||||||
target.parent.worldToLocal(temp2.set(coords.x - skeleton.x, coords.y - skeleton.y));
|
target.parent.worldToLocal(temp2.set(coords.x - skeleton.x, coords.y - skeleton.y));
|
||||||
|
|||||||
@ -110,7 +110,7 @@ var transformsDemo = function(canvas, bgColor) {
|
|||||||
target = null;
|
target = null;
|
||||||
},
|
},
|
||||||
dragged: function(x, y) {
|
dragged: function(x, y) {
|
||||||
if (target != null) {
|
if (target != null && x > 0 && x < canvas.width && y > 0 && y < canvas.height) {
|
||||||
if (target === rotateHandle) {
|
if (target === rotateHandle) {
|
||||||
var rotation = getRotation(x, y);
|
var rotation = getRotation(x, y);
|
||||||
var delta = rotation - lastRotation;
|
var delta = rotation - lastRotation;
|
||||||
|
|||||||
@ -108,7 +108,7 @@ var vineDemo = function(canvas, bgColor) {
|
|||||||
target = null;
|
target = null;
|
||||||
},
|
},
|
||||||
dragged: function(x, y) {
|
dragged: function(x, y) {
|
||||||
if (target != null) {
|
if (target != null && x > 0 && x < canvas.width && y > 0 && y < canvas.height) {
|
||||||
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
renderer.camera.screenToWorld(coords.set(x, y, 0), canvas.width, canvas.height);
|
||||||
if (target.parent !== null) {
|
if (target.parent !== null) {
|
||||||
target.parent.worldToLocal(temp2.set(coords.x - skeleton.x, coords.y - skeleton.y));
|
target.parent.worldToLocal(temp2.set(coords.x - skeleton.x, coords.y - skeleton.y));
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user