IWMBrowser/iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Merge branch 'main' of gitea.iwm-tuebingen.de:IWMBrowser/iwmlib into main

Browse Source 
* 'main' of gitea.iwm-tuebingen.de:IWMBrowser/iwmlib:
  Removed console.logs
  Fixed timestamp name mismatch.
  Updated iwmlib and removed log statement.
  Added pluggable throw behavior.
  Replaced requestAnimationFrame with setInterval
  Moved throws to a single loop.
  Added cancelAnimationFrame
  update code block to reflect current state
  Fixed html double code
  Fixed problem with scrolling text in card drawers.
  added fix for viewBox rotation bug
  fixed rollup
  documented/ solved svg rotation bug

# Conflicts:
#	package.json
This commit is contained in:
Uwe Oestermeier
2024-02-12 14:15:58 +01:00
parent 8d8090cdde 80355ea636
commit 57d6e8b461
10 changed files with 1049 additions and 845 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/iwmlib.js
Vendored
+129 -67
View File
@@ -3213,6 +3213,40 @@
*
* @constructor
*/
class RequestFrameThrower {
/** Implemenents the standard throw behavior. */
animateThrow(throwable) {
/*** Calls the animateThrow method in sync with the display link. */
requestAnimationFrame(throwable.animateThrow.bind(throwable));
}
}
class TimeoutThrower {
constructor(delay=20) {
this.throwables = new Set();
this.delay = delay;
setTimeout(this.animateStep.bind(this), this.delay);
}
animateThrow(throwable) {
this.throwables.add(throwable);
}
animateStep() {
let active = [...this.throwables];
this.throwables.clear();
for(let throwable of active) {
throwable.animateThrow();
}
setTimeout(this.animateStep.bind(this), this.delay);
}
}
let thrower = new RequestFrameThrower();
class Throwable {
constructor({
movableX = true,
@@ -3220,7 +3254,7 @@
throwVisibility = 44,
throwDamping = 0.95,
autoThrow = true,
onThrowFinished = null,
onThrowFinished = null
} = {}) {
this.movableX = movableX;
this.movableY = movableY;
@@ -3229,9 +3263,16 @@
this.autoThrow = autoThrow;
this.velocities = [];
this.velocity = null;
this.timestamp = null;
this.lastframe = null;
this.onThrowFinished = onThrowFinished;
//console.log("onThrowFinished", onThrowFinished)
}
static defaultThrow() {
thrower = new RequestFrameThrower();
}
static timeoutThrow() {
thrower = new TimeoutThrower();
}
observeVelocity() {
@@ -3253,7 +3294,7 @@
t: t,
dt: dt,
dx: delta.x / number,
dy: delta.y / number,
dy: delta.y / number
};
this.velocities.push(velocity);
while (this.velocities.length > buffer) {
@@ -3262,8 +3303,23 @@
}
}
addTestVelocity(delta, dt=20, buffer = 5) {
let t = performance.now();
this.lastframe = t;
let velocity = {
t: t,
dt: dt,
dx: delta.x ,
dy: delta.y
};
for(let i=0; i<buffer; i++) {
velocity.t += dt;
this.velocities.push(velocity);
}
}
meanVelocity(milliseconds = 30) {
this.addVelocity({ x: 0, y: 0, number: 1 });
// this.addVelocity({ x: 0, y: 0, number: 1 })
let sum = { x: 0, y: 0 };
let count = 0;
let t = 0;
@@ -3284,6 +3340,7 @@
killAnimation() {
this.velocity = null;
this.velocities = [];
this.lastframe = null;
}
startThrow() {
@@ -3305,6 +3362,10 @@
return dt
}
recurseAnimateThrow() {
ThrowableObjects.add(this);
}
animateThrow(time) {
if (this.velocity != null) {
let dt = this._throwDeltaTime();
@@ -3315,7 +3376,7 @@
if (nextLength > prevLength) {
let factor = nextLength / prevLength;
next = Points$1.multiplyScalar(next, 1 / factor);
console.log('Prevent acceleration', factor, this.velocity, next);
// console.log('Prevent acceleration', factor, this.velocity, next)
}
this.velocity = next;
let d = Points$1.multiplyScalar(this.velocity, dt);
@@ -3323,11 +3384,11 @@
this.onDragUpdate(d);
if (dt == 0 || this.needsAnimation()) {
requestAnimationFrame(this.animateThrow.bind(this));
thrower.animateThrow(this);
return
} else {
if (this.isOutside()) {
requestAnimationFrame(this.animateThrow.bind(this));
thrower.animateThrow(this);
return
}
}
@@ -3351,7 +3412,7 @@
let next = Points$1.multiplyScalar(velocity, this.throwDamping);
return {
x: this.movableX ? next.x : 0,
y: this.movableY ? next.y : 0,
y: this.movableY ? next.y : 0
}
}
@@ -3396,7 +3457,7 @@
scaleCloseBuffer = 0.05,
maxRotation = Angle.degree2radian(5),
minInteractionDistance = 0,
useLowPassFilter = false,
useLowPassFilter = false
} = {}) {
if (rotationDegrees != null && rotation != null) {
throw new Error('Use rotationDegrees or rotation but not both')
@@ -3411,7 +3472,7 @@
throwVisibility,
throwDamping,
autoThrow,
onThrowFinished,
onThrowFinished
});
/**
@@ -3486,7 +3547,7 @@
_callCloseCallbacks() {
if (this.onClose) {
this.onClose.forEach((callback) => callback(this));
this.onClose.forEach(callback => callback(this));
}
}
@@ -3506,6 +3567,9 @@
let delta = interaction.delta();
if (delta != null) {
/* uo: Is this the best place to add velocity? It works with scrollable text in card drawers but
has to be tested */
this.addVelocity(delta);
let rotate = delta.rotate;
let zoom = delta.zoom;
if (this.maxRotation != null) {
@@ -3524,9 +3588,10 @@
zoomDelta *= ratio;
zoom = 1 + zoomDelta;
}
this.transform(delta, zoom, rotate, delta.about);
this.addVelocity(delta); // uo: reverted commit fa0256d782dd498c6d3e51321260ca375ca9f855
/* uo: This is too late an dangerous. transform sometimes modifies delta
this.addVelocity(delta) // uo: reverted commit fa0256d782dd498c6d3e51321260ca375ca9f855
*/
if (zoom != 1) this.interactionAnchor = delta.about;
}
@@ -3637,11 +3702,11 @@
if (this.scale < this.minScale + this.scaleCloseThreshold - this.scaleCloseBuffer) {
this.zoom(this.minScale, {
animate: 0.2,
onComplete: this.close.bind(this),
onComplete: this.close.bind(this)
});
} else if (this.scale < this.minScale + this.scaleCloseThreshold) {
this.zoom(this.minScale + this.scaleCloseThreshold, {
animate: 0.4,
animate: 0.4
});
}
}
@@ -3663,12 +3728,12 @@
x: '+=' + d.x,
y: '+=' + d.y,
/* scale: scale, uo: not defined, why was this here? */
onUpdate: (e) => {
onUpdate: e => {
let p = this.position;
let dx = p.x - startPos.x;
let dy = p.x - startPos.y;
this.onMoved(dx, dy);
},
}
});
} else {
this._move(d);
@@ -3697,7 +3762,7 @@
scale: scale,
delay: delay,
onComplete: onComplete,
onUpdate: this.onZoomed.bind(this),
onUpdate: this.onZoomed.bind(this)
});
} else {
this.scale = scale;
@@ -3715,7 +3780,7 @@
transform(translate, zoom, rotate, anchor) {
let delta = {
x: this.movableX ? translate.x : 0,
y: this.movableY ? translate.y : 0,
y: this.movableY ? translate.y : 0
};
if (this.resizable) var vzoom = zoom;
if (!this.translatable) delta = { x: 0, y: 0 };
@@ -3730,9 +3795,9 @@
rotate: 0,
about: anchor,
fast: false,
type: UPDATE,
type: UPDATE
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3761,9 +3826,9 @@
translate: delta,
scale: newScale,
rotate: rotate,
about: anchor,
about: anchor
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3829,7 +3894,7 @@
if (this.scale > this.maxScale) zoom = 1 - amount;
if (zoom != 1) {
this.transform({ x: 0, y: 0 }, zoom, 0, this.zoomAnchor);
requestAnimationFrame((dt) => {
requestAnimationFrame(dt => {
this.animateZoomBounce(dt);
});
return
@@ -3886,9 +3951,9 @@
rotate: 0,
about: null,
fast: false,
type: START,
type: START
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3904,13 +3969,13 @@
}
onEnd(event, interaction) {
console.log('Scatter.onEnd', this.dragging);
//console.log('Scatter.onEnd', this.dragging)
if (interaction.isFinished()) {
this.endGesture(interaction);
this.dragging = false;
for (let key of interaction.ended.keys()) {
if (interaction.isTap(key)) {
console.log('Scatter.isTap');
//console.log('Scatter.isTap')
let point = interaction.ended.get(key);
this.onTap(event, interaction, point);
}
@@ -3922,9 +3987,9 @@
rotate: 0,
about: null,
fast: false,
type: END,
type: END
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3938,7 +4003,7 @@
//onTap(event, interaction, point) {}
onTap(event, interaction, point) {
console.log('AbstractScatter.onTap', this.tapDelegate, interaction);
//console.log('AbstractScatter.onTap', this.tapDelegate, interaction)
if (this.tapDelegate) {
Events.stop(event);
this.tapDelegate.tap(event, 'scatter');
@@ -3952,9 +4017,9 @@
translate: delta,
scale: this.scale,
about: this.currentAbout,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3966,9 +4031,9 @@
scale: this.scale,
about: this.currentAbout,
fast: false,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3980,9 +4045,9 @@
translate: { x: dx, y: dy },
about: about,
fast: true,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -3993,9 +4058,9 @@
let event = new ScatterEvent(this, {
scale: this.scale,
fast: false,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -4009,9 +4074,9 @@
scale: this.scale,
about: about,
fast: false,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -4043,7 +4108,7 @@
useCapture = true,
capturePointerEvents = true,
touchAction = 'none',
debugCanvas = null,
debugCanvas = null
} = {}
) {
this.onCapture = null;
@@ -4055,7 +4120,7 @@
movement of scatter objects, the touchmove event has to be bound again.
*/
if (Capabilities.isSafari) {
document.addEventListener('touchmove', (event) => this.preventPinch(event), false);
document.addEventListener('touchmove', event => this.preventPinch(event), false);
stopEvents = false;
} else {
stopEvents = true;
@@ -4070,11 +4135,11 @@
this.delegate = new InteractionMapper$1(element, this, {
useCapture,
capturePointerEvents,
mouseWheelElement: window,
mouseWheelElement: window
});
if (debugCanvas !== null) {
requestAnimationFrame((dt) => {
requestAnimationFrame(dt => {
this.showTouches(dt, debugCanvas);
});
}
@@ -4096,7 +4161,7 @@
context.fill();
context.stroke();
}
requestAnimationFrame((dt) => {
requestAnimationFrame(dt => {
this.showTouches(dt, canvas);
});
}
@@ -4238,7 +4303,7 @@
scaleCloseBuffer = 0.05,
useLowPassFilter = false,
maxRotation = Angle.degree2radian(15),
minInteractionDistance = 200,
minInteractionDistance = 200
} = {}
) {
super({
@@ -4265,7 +4330,7 @@
onClose,
useLowPassFilter,
maxRotation,
minInteractionDistance,
minInteractionDistance
});
if (container == null || width == null || height == null) {
throw new Error('Invalid value: null')
@@ -4293,7 +4358,7 @@
height: height,
scale: startScale,
rotation: this.startRotationDegrees,
transformOrigin: transformOrigin,
transformOrigin: transformOrigin
};
this.tapNodes = new Map();
@@ -4315,15 +4380,15 @@
button.className = 'interactiveElement';
this.element.appendChild(button);
button.addEventListener('pointerdown', (e) => {
button.addEventListener('pointerdown', e => {
this.startResize(e);
});
button.addEventListener('pointermove', (e) => {
button.addEventListener('pointermove', e => {
this.resize(e);
});
button.addEventListener('pointerup', (e) => {
button.addEventListener('pointerup', e => {
this.stopResize(e);
});
this.resizeButton = button;
@@ -4340,7 +4405,7 @@
scale: this.scale,
x: this.x,
y: this.y,
rotation: this.rotation,
rotation: this.rotation
}
}
@@ -4391,7 +4456,7 @@
top: rect.top - stage.top,
left: rect.left - stage.left,
width: rect.width,
height: rect.height,
height: rect.height
}
}
@@ -4432,7 +4497,7 @@
set scale(scale) {
TweenLite.set(this.element, {
scale: scale,
transformOrigin: this.transformOrigin,
transformOrigin: this.transformOrigin
});
this._scale = scale;
}
@@ -4464,9 +4529,9 @@
hide() {
TweenLite.to(this.element, 0.1, {
display: 'none',
onComplete: (e) => {
onComplete: e => {
this.element.parentNode.removeChild(this.element);
},
}
});
}
@@ -4480,7 +4545,7 @@
x: p.x,
y: p.y,
rotation: rotationDegrees,
transformOrigin: this.transformOrigin,
transformOrigin: this.transformOrigin
});
}
@@ -4541,7 +4606,7 @@
let oldPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
this.bringToFront();
@@ -4549,7 +4614,7 @@
let newPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
let offset = Points$1.subtract(oldPostition, newPostition);
@@ -4594,7 +4659,7 @@
)
TweenLite.to(this.element, 0, {
width: this.element.offsetWidth + resizeW / this.scale,
height: this.element.offsetHeight + resizeH / this.scale,
height: this.element.offsetHeight + resizeH / this.scale
});
this.oldX = e.clientX;
@@ -4611,12 +4676,12 @@
let event = new CustomEvent('resizeEnded');
let oldPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
this.element.style.transformOrigin = '50% 50%';
let newPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
let offset = Points$1.subtract(oldPostition, newPostition);
@@ -4789,7 +4854,6 @@
tap(event, calledBy = 'unknown') {
if (event.isTrusted) {
let node = this.nearestActive(event);
console.log('tap', node);
this.nodeTapped(node, event);
/* let node = document.elementFromPoint(event.clientX, event.clientY)
@@ -8195,7 +8259,6 @@
image,
});
let center = this._calculateCenterRelativeTo(target, image);
console.log('_calculateCenterRelativeTo', center);
TweenLite.set(maskImage, {
transformOrigin: `${center.x} ${center.y}`,
});
@@ -9099,7 +9162,6 @@
}
static _calculateCenterRelativeTo(target, image) {
// console.log('_calculateCenterRelativeTo', target, image)
let bbox = image.getBBox();
let width = bbox.width;
let height = bbox.height;
dist/iwmlib.pixi.js
Vendored
+124 -60
View File
@@ -6778,6 +6778,40 @@
*
* @constructor
*/
class RequestFrameThrower {
/** Implemenents the standard throw behavior. */
animateThrow(throwable) {
/*** Calls the animateThrow method in sync with the display link. */
requestAnimationFrame(throwable.animateThrow.bind(throwable));
}
}
class TimeoutThrower {
constructor(delay=20) {
this.throwables = new Set();
this.delay = delay;
setTimeout(this.animateStep.bind(this), this.delay);
}
animateThrow(throwable) {
this.throwables.add(throwable);
}
animateStep() {
let active = [...this.throwables];
this.throwables.clear();
for(let throwable of active) {
throwable.animateThrow();
}
setTimeout(this.animateStep.bind(this), this.delay);
}
}
let thrower = new RequestFrameThrower();
class Throwable {
constructor({
movableX = true,
@@ -6785,7 +6819,7 @@
throwVisibility = 44,
throwDamping = 0.95,
autoThrow = true,
onThrowFinished = null,
onThrowFinished = null
} = {}) {
this.movableX = movableX;
this.movableY = movableY;
@@ -6794,9 +6828,16 @@
this.autoThrow = autoThrow;
this.velocities = [];
this.velocity = null;
this.timestamp = null;
this.lastframe = null;
this.onThrowFinished = onThrowFinished;
//console.log("onThrowFinished", onThrowFinished)
}
static defaultThrow() {
thrower = new RequestFrameThrower();
}
static timeoutThrow() {
thrower = new TimeoutThrower();
}
observeVelocity() {
@@ -6818,7 +6859,7 @@
t: t,
dt: dt,
dx: delta.x / number,
dy: delta.y / number,
dy: delta.y / number
};
this.velocities.push(velocity);
while (this.velocities.length > buffer) {
@@ -6827,8 +6868,23 @@
}
}
addTestVelocity(delta, dt=20, buffer = 5) {
let t = performance.now();
this.lastframe = t;
let velocity = {
t: t,
dt: dt,
dx: delta.x ,
dy: delta.y
};
for(let i=0; i<buffer; i++) {
velocity.t += dt;
this.velocities.push(velocity);
}
}
meanVelocity(milliseconds = 30) {
this.addVelocity({ x: 0, y: 0, number: 1 });
// this.addVelocity({ x: 0, y: 0, number: 1 })
let sum = { x: 0, y: 0 };
let count = 0;
let t = 0;
@@ -6849,6 +6905,7 @@
killAnimation() {
this.velocity = null;
this.velocities = [];
this.lastframe = null;
}
startThrow() {
@@ -6870,6 +6927,10 @@
return dt
}
recurseAnimateThrow() {
ThrowableObjects.add(this);
}
animateThrow(time) {
if (this.velocity != null) {
let dt = this._throwDeltaTime();
@@ -6880,7 +6941,7 @@
if (nextLength > prevLength) {
let factor = nextLength / prevLength;
next = Points.multiplyScalar(next, 1 / factor);
console.log('Prevent acceleration', factor, this.velocity, next);
// console.log('Prevent acceleration', factor, this.velocity, next)
}
this.velocity = next;
let d = Points.multiplyScalar(this.velocity, dt);
@@ -6888,11 +6949,11 @@
this.onDragUpdate(d);
if (dt == 0 || this.needsAnimation()) {
requestAnimationFrame(this.animateThrow.bind(this));
thrower.animateThrow(this);
return
} else {
if (this.isOutside()) {
requestAnimationFrame(this.animateThrow.bind(this));
thrower.animateThrow(this);
return
}
}
@@ -6916,7 +6977,7 @@
let next = Points.multiplyScalar(velocity, this.throwDamping);
return {
x: this.movableX ? next.x : 0,
y: this.movableY ? next.y : 0,
y: this.movableY ? next.y : 0
}
}
@@ -6961,7 +7022,7 @@
scaleCloseBuffer = 0.05,
maxRotation = Angle.degree2radian(5),
minInteractionDistance = 0,
useLowPassFilter = false,
useLowPassFilter = false
} = {}) {
if (rotationDegrees != null && rotation != null) {
throw new Error('Use rotationDegrees or rotation but not both')
@@ -6976,7 +7037,7 @@
throwVisibility,
throwDamping,
autoThrow,
onThrowFinished,
onThrowFinished
});
/**
@@ -7051,7 +7112,7 @@
_callCloseCallbacks() {
if (this.onClose) {
this.onClose.forEach((callback) => callback(this));
this.onClose.forEach(callback => callback(this));
}
}
@@ -7071,6 +7132,9 @@
let delta = interaction.delta();
if (delta != null) {
/* uo: Is this the best place to add velocity? It works with scrollable text in card drawers but
has to be tested */
this.addVelocity(delta);
let rotate = delta.rotate;
let zoom = delta.zoom;
if (this.maxRotation != null) {
@@ -7089,9 +7153,10 @@
zoomDelta *= ratio;
zoom = 1 + zoomDelta;
}
this.transform(delta, zoom, rotate, delta.about);
this.addVelocity(delta); // uo: reverted commit fa0256d782dd498c6d3e51321260ca375ca9f855
/* uo: This is too late an dangerous. transform sometimes modifies delta
this.addVelocity(delta) // uo: reverted commit fa0256d782dd498c6d3e51321260ca375ca9f855
*/
if (zoom != 1) this.interactionAnchor = delta.about;
}
@@ -7202,11 +7267,11 @@
if (this.scale < this.minScale + this.scaleCloseThreshold - this.scaleCloseBuffer) {
this.zoom(this.minScale, {
animate: 0.2,
onComplete: this.close.bind(this),
onComplete: this.close.bind(this)
});
} else if (this.scale < this.minScale + this.scaleCloseThreshold) {
this.zoom(this.minScale + this.scaleCloseThreshold, {
animate: 0.4,
animate: 0.4
});
}
}
@@ -7228,12 +7293,12 @@
x: '+=' + d.x,
y: '+=' + d.y,
/* scale: scale, uo: not defined, why was this here? */
onUpdate: (e) => {
onUpdate: e => {
let p = this.position;
let dx = p.x - startPos.x;
let dy = p.x - startPos.y;
this.onMoved(dx, dy);
},
}
});
} else {
this._move(d);
@@ -7262,7 +7327,7 @@
scale: scale,
delay: delay,
onComplete: onComplete,
onUpdate: this.onZoomed.bind(this),
onUpdate: this.onZoomed.bind(this)
});
} else {
this.scale = scale;
@@ -7280,7 +7345,7 @@
transform(translate, zoom, rotate, anchor) {
let delta = {
x: this.movableX ? translate.x : 0,
y: this.movableY ? translate.y : 0,
y: this.movableY ? translate.y : 0
};
if (this.resizable) var vzoom = zoom;
if (!this.translatable) delta = { x: 0, y: 0 };
@@ -7295,9 +7360,9 @@
rotate: 0,
about: anchor,
fast: false,
type: UPDATE,
type: UPDATE
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7326,9 +7391,9 @@
translate: delta,
scale: newScale,
rotate: rotate,
about: anchor,
about: anchor
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7394,7 +7459,7 @@
if (this.scale > this.maxScale) zoom = 1 - amount;
if (zoom != 1) {
this.transform({ x: 0, y: 0 }, zoom, 0, this.zoomAnchor);
requestAnimationFrame((dt) => {
requestAnimationFrame(dt => {
this.animateZoomBounce(dt);
});
return
@@ -7451,9 +7516,9 @@
rotate: 0,
about: null,
fast: false,
type: START,
type: START
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7469,13 +7534,13 @@
}
onEnd(event, interaction) {
console.log('Scatter.onEnd', this.dragging);
//console.log('Scatter.onEnd', this.dragging)
if (interaction.isFinished()) {
this.endGesture(interaction);
this.dragging = false;
for (let key of interaction.ended.keys()) {
if (interaction.isTap(key)) {
console.log('Scatter.isTap');
//console.log('Scatter.isTap')
let point = interaction.ended.get(key);
this.onTap(event, interaction, point);
}
@@ -7487,9 +7552,9 @@
rotate: 0,
about: null,
fast: false,
type: END,
type: END
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7503,7 +7568,7 @@
//onTap(event, interaction, point) {}
onTap(event, interaction, point) {
console.log('AbstractScatter.onTap', this.tapDelegate, interaction);
//console.log('AbstractScatter.onTap', this.tapDelegate, interaction)
if (this.tapDelegate) {
Events$1.stop(event);
this.tapDelegate.tap(event, 'scatter');
@@ -7517,9 +7582,9 @@
translate: delta,
scale: this.scale,
about: this.currentAbout,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7531,9 +7596,9 @@
scale: this.scale,
about: this.currentAbout,
fast: false,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7545,9 +7610,9 @@
translate: { x: dx, y: dy },
about: about,
fast: true,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7558,9 +7623,9 @@
let event = new ScatterEvent(this, {
scale: this.scale,
fast: false,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7574,9 +7639,9 @@
scale: this.scale,
about: about,
fast: false,
type: null,
type: null
});
this.onTransform.forEach(function (f) {
this.onTransform.forEach(function(f) {
f(event);
});
}
@@ -7623,7 +7688,7 @@
scaleCloseBuffer = 0.05,
useLowPassFilter = false,
maxRotation = Angle.degree2radian(15),
minInteractionDistance = 200,
minInteractionDistance = 200
} = {}
) {
super({
@@ -7650,7 +7715,7 @@
onClose,
useLowPassFilter,
maxRotation,
minInteractionDistance,
minInteractionDistance
});
if (container == null || width == null || height == null) {
throw new Error('Invalid value: null')
@@ -7678,7 +7743,7 @@
height: height,
scale: startScale,
rotation: this.startRotationDegrees,
transformOrigin: transformOrigin,
transformOrigin: transformOrigin
};
this.tapNodes = new Map();
@@ -7700,15 +7765,15 @@
button.className = 'interactiveElement';
this.element.appendChild(button);
button.addEventListener('pointerdown', (e) => {
button.addEventListener('pointerdown', e => {
this.startResize(e);
});
button.addEventListener('pointermove', (e) => {
button.addEventListener('pointermove', e => {
this.resize(e);
});
button.addEventListener('pointerup', (e) => {
button.addEventListener('pointerup', e => {
this.stopResize(e);
});
this.resizeButton = button;
@@ -7725,7 +7790,7 @@
scale: this.scale,
x: this.x,
y: this.y,
rotation: this.rotation,
rotation: this.rotation
}
}
@@ -7776,7 +7841,7 @@
top: rect.top - stage.top,
left: rect.left - stage.left,
width: rect.width,
height: rect.height,
height: rect.height
}
}
@@ -7817,7 +7882,7 @@
set scale(scale) {
TweenLite.set(this.element, {
scale: scale,
transformOrigin: this.transformOrigin,
transformOrigin: this.transformOrigin
});
this._scale = scale;
}
@@ -7849,9 +7914,9 @@
hide() {
TweenLite.to(this.element, 0.1, {
display: 'none',
onComplete: (e) => {
onComplete: e => {
this.element.parentNode.removeChild(this.element);
},
}
});
}
@@ -7865,7 +7930,7 @@
x: p.x,
y: p.y,
rotation: rotationDegrees,
transformOrigin: this.transformOrigin,
transformOrigin: this.transformOrigin
});
}
@@ -7926,7 +7991,7 @@
let oldPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
this.bringToFront();
@@ -7934,7 +7999,7 @@
let newPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
let offset = Points.subtract(oldPostition, newPostition);
@@ -7979,7 +8044,7 @@
)
TweenLite.to(this.element, 0, {
width: this.element.offsetWidth + resizeW / this.scale,
height: this.element.offsetHeight + resizeH / this.scale,
height: this.element.offsetHeight + resizeH / this.scale
});
this.oldX = e.clientX;
@@ -7996,12 +8061,12 @@
let event = new CustomEvent('resizeEnded');
let oldPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
this.element.style.transformOrigin = '50% 50%';
let newPostition = {
x: this.element.getBoundingClientRect().left,
y: this.element.getBoundingClientRect().top,
y: this.element.getBoundingClientRect().top
};
let offset = Points.subtract(oldPostition, newPostition);
@@ -8174,7 +8239,6 @@
tap(event, calledBy = 'unknown') {
if (event.isTrusted) {
let node = this.nearestActive(event);
console.log('tap', node);
this.nodeTapped(node, event);
/* let node = document.elementFromPoint(event.clientX, event.clientY)