leafer-ui 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -2
- package/dist/web.esm.js +58 -39
- package/dist/web.esm.min.js +1 -1
- package/dist/web.js +142 -81
- package/dist/web.min.js +1 -1
- package/dist/web.module.js +142 -81
- package/dist/web.module.min.js +1 -1
- package/package.json +11 -11
package/dist/web.js
CHANGED
|
@@ -51,6 +51,8 @@ var LeaferUI = (function (exports) {
|
|
|
51
51
|
const { round, pow: pow$1, PI: PI$4 } = Math;
|
|
52
52
|
const MathHelper = {
|
|
53
53
|
within(value, min, max) {
|
|
54
|
+
if (typeof min === 'object')
|
|
55
|
+
max = min.max, min = min.min;
|
|
54
56
|
if (min !== undefined && value < min)
|
|
55
57
|
value = min;
|
|
56
58
|
if (max !== undefined && value > max)
|
|
@@ -153,10 +155,10 @@ var LeaferUI = (function (exports) {
|
|
|
153
155
|
t.e += x;
|
|
154
156
|
t.f += y;
|
|
155
157
|
},
|
|
156
|
-
translateInner(t, x, y,
|
|
158
|
+
translateInner(t, x, y, hasOrigin) {
|
|
157
159
|
t.e += t.a * x + t.c * y;
|
|
158
160
|
t.f += t.b * x + t.d * y;
|
|
159
|
-
if (
|
|
161
|
+
if (hasOrigin)
|
|
160
162
|
t.e -= x, t.f -= y;
|
|
161
163
|
},
|
|
162
164
|
scale(t, scaleX, scaleY = scaleX) {
|
|
@@ -315,7 +317,7 @@ var LeaferUI = (function (exports) {
|
|
|
315
317
|
to.y -= (f * a - e * b) * s;
|
|
316
318
|
}
|
|
317
319
|
},
|
|
318
|
-
setLayout(t, layout, origin, bcChanged) {
|
|
320
|
+
setLayout(t, layout, origin, around, bcChanged) {
|
|
319
321
|
const { x, y, scaleX, scaleY } = layout;
|
|
320
322
|
if (bcChanged === undefined)
|
|
321
323
|
bcChanged = layout.rotation || layout.skewX || layout.skewY;
|
|
@@ -347,10 +349,10 @@ var LeaferUI = (function (exports) {
|
|
|
347
349
|
}
|
|
348
350
|
t.e = x;
|
|
349
351
|
t.f = y;
|
|
350
|
-
if (origin)
|
|
351
|
-
M$6.translateInner(t, -origin.x, -origin.y,
|
|
352
|
+
if (origin = origin || around)
|
|
353
|
+
M$6.translateInner(t, -origin.x, -origin.y, !around);
|
|
352
354
|
},
|
|
353
|
-
getLayout(t, origin, firstSkewY) {
|
|
355
|
+
getLayout(t, origin, around, firstSkewY) {
|
|
354
356
|
const { a, b, c, d, e, f } = t;
|
|
355
357
|
let x = e, y = f, scaleX, scaleY, rotation, skewX, skewY;
|
|
356
358
|
if (b || c) {
|
|
@@ -379,9 +381,11 @@ var LeaferUI = (function (exports) {
|
|
|
379
381
|
scaleY = d;
|
|
380
382
|
rotation = skewX = skewY = 0;
|
|
381
383
|
}
|
|
382
|
-
if (origin) {
|
|
384
|
+
if (origin = around || origin) {
|
|
383
385
|
x += origin.x * a + origin.y * c;
|
|
384
386
|
y += origin.x * b + origin.y * d;
|
|
387
|
+
if (!around)
|
|
388
|
+
x -= origin.x, y -= origin.y;
|
|
385
389
|
}
|
|
386
390
|
return { x, y, scaleX, scaleY, rotation, skewX, skewY };
|
|
387
391
|
},
|
|
@@ -709,12 +713,12 @@ var LeaferUI = (function (exports) {
|
|
|
709
713
|
toInnerPoint(outer, to, distance) {
|
|
710
714
|
MatrixHelper.toInnerPoint(this, outer, to, distance);
|
|
711
715
|
}
|
|
712
|
-
setLayout(data, origin) {
|
|
713
|
-
MatrixHelper.setLayout(this, data, origin);
|
|
716
|
+
setLayout(data, origin, around) {
|
|
717
|
+
MatrixHelper.setLayout(this, data, origin, around);
|
|
714
718
|
return this;
|
|
715
719
|
}
|
|
716
|
-
getLayout(origin, firstSkewY) {
|
|
717
|
-
return MatrixHelper.getLayout(this, origin, firstSkewY);
|
|
720
|
+
getLayout(origin, around, firstSkewY) {
|
|
721
|
+
return MatrixHelper.getLayout(this, origin, around, firstSkewY);
|
|
718
722
|
}
|
|
719
723
|
withScale(scaleX, scaleY) {
|
|
720
724
|
return MatrixHelper.withScale(this, scaleX, scaleY);
|
|
@@ -2002,7 +2006,7 @@ var LeaferUI = (function (exports) {
|
|
|
2002
2006
|
DataHelper.copyAttrs(this.size, size, canvasSizeAttrs);
|
|
2003
2007
|
this.size.pixelRatio || (this.size.pixelRatio = 1);
|
|
2004
2008
|
this.bounds = new Bounds(0, 0, this.width, this.height);
|
|
2005
|
-
if (!this.unreal) {
|
|
2009
|
+
if (this.context && !this.unreal) {
|
|
2006
2010
|
this.updateViewSize();
|
|
2007
2011
|
this.smooth = this.config.smooth;
|
|
2008
2012
|
}
|
|
@@ -2175,7 +2179,7 @@ var LeaferUI = (function (exports) {
|
|
|
2175
2179
|
this.manager ? this.manager.recycle(this) : this.destroy();
|
|
2176
2180
|
}
|
|
2177
2181
|
}
|
|
2178
|
-
updateRender() { }
|
|
2182
|
+
updateRender(_bounds) { }
|
|
2179
2183
|
unrealCanvas() { }
|
|
2180
2184
|
destroy() {
|
|
2181
2185
|
this.manager = this.view = this.parentView = null;
|
|
@@ -4069,8 +4073,13 @@ var LeaferUI = (function (exports) {
|
|
|
4069
4073
|
zoomOfLocal(t, origin, scaleX, scaleY = scaleX, resize) {
|
|
4070
4074
|
copy$7(matrix$1, t.__localMatrix);
|
|
4071
4075
|
scaleOfOuter$2(matrix$1, origin, scaleX, scaleY);
|
|
4072
|
-
|
|
4073
|
-
|
|
4076
|
+
if (t.origin || t.around) {
|
|
4077
|
+
L.setTransform(t, matrix$1, resize);
|
|
4078
|
+
}
|
|
4079
|
+
else {
|
|
4080
|
+
moveByMatrix(t, matrix$1);
|
|
4081
|
+
t.scaleResize(scaleX, scaleY, resize !== true);
|
|
4082
|
+
}
|
|
4074
4083
|
},
|
|
4075
4084
|
rotateOfWorld(t, origin, angle) {
|
|
4076
4085
|
L.rotateOfLocal(t, getTempLocal(t, origin), angle);
|
|
@@ -4078,8 +4087,13 @@ var LeaferUI = (function (exports) {
|
|
|
4078
4087
|
rotateOfLocal(t, origin, angle) {
|
|
4079
4088
|
copy$7(matrix$1, t.__localMatrix);
|
|
4080
4089
|
rotateOfOuter$2(matrix$1, origin, angle);
|
|
4081
|
-
|
|
4082
|
-
|
|
4090
|
+
if (t.origin || t.around) {
|
|
4091
|
+
L.setTransform(t, matrix$1);
|
|
4092
|
+
}
|
|
4093
|
+
else {
|
|
4094
|
+
moveByMatrix(t, matrix$1);
|
|
4095
|
+
t.rotation = MathHelper.formatRotation(t.rotation + angle);
|
|
4096
|
+
}
|
|
4083
4097
|
},
|
|
4084
4098
|
skewOfWorld(t, origin, skewX, skewY, resize) {
|
|
4085
4099
|
L.skewOfLocal(t, getTempLocal(t, origin), skewX, skewY, resize);
|
|
@@ -4102,7 +4116,7 @@ var LeaferUI = (function (exports) {
|
|
|
4102
4116
|
L.setTransform(t, matrix$1, resize);
|
|
4103
4117
|
},
|
|
4104
4118
|
setTransform(t, transform, resize) {
|
|
4105
|
-
const layout = getLayout(transform);
|
|
4119
|
+
const layout = getLayout(transform, t.origin && L.getInnerOrigin(t, t.origin), t.around && L.getInnerOrigin(t, t.around));
|
|
4106
4120
|
if (resize) {
|
|
4107
4121
|
const scaleX = layout.scaleX / t.scaleX;
|
|
4108
4122
|
const scaleY = layout.scaleY / t.scaleY;
|
|
@@ -4115,13 +4129,19 @@ var LeaferUI = (function (exports) {
|
|
|
4115
4129
|
t.set(layout);
|
|
4116
4130
|
}
|
|
4117
4131
|
},
|
|
4132
|
+
getFlipTransform(t, axis) {
|
|
4133
|
+
const m = getMatrixData();
|
|
4134
|
+
const sign = axis === 'x' ? 1 : -1;
|
|
4135
|
+
scaleOfOuter$2(m, L.getLocalOrigin(t, 'center'), -1 * sign, 1 * sign);
|
|
4136
|
+
return m;
|
|
4137
|
+
},
|
|
4118
4138
|
getLocalOrigin(t, origin) {
|
|
4119
4139
|
return PointHelper.tempToOuterOf(L.getInnerOrigin(t, origin), t.localTransform);
|
|
4120
4140
|
},
|
|
4121
4141
|
getInnerOrigin(t, origin) {
|
|
4122
|
-
|
|
4123
|
-
|
|
4124
|
-
return
|
|
4142
|
+
const innerOrigin = {};
|
|
4143
|
+
AroundHelper.toPoint(origin, t.boxBounds, innerOrigin);
|
|
4144
|
+
return innerOrigin;
|
|
4125
4145
|
},
|
|
4126
4146
|
getRelativeWorld(t, relative, temp) {
|
|
4127
4147
|
copy$7(matrix$1, t.worldTransform);
|
|
@@ -4548,7 +4568,10 @@ var LeaferUI = (function (exports) {
|
|
|
4548
4568
|
on(type, listener, options) {
|
|
4549
4569
|
let capture, once;
|
|
4550
4570
|
if (options) {
|
|
4551
|
-
if (
|
|
4571
|
+
if (options === 'once') {
|
|
4572
|
+
once = true;
|
|
4573
|
+
}
|
|
4574
|
+
else if (typeof options === 'boolean') {
|
|
4552
4575
|
capture = options;
|
|
4553
4576
|
}
|
|
4554
4577
|
else {
|
|
@@ -4579,7 +4602,7 @@ var LeaferUI = (function (exports) {
|
|
|
4579
4602
|
if (listener) {
|
|
4580
4603
|
let capture;
|
|
4581
4604
|
if (options)
|
|
4582
|
-
capture = typeof options === 'boolean' ? options : options.capture;
|
|
4605
|
+
capture = typeof options === 'boolean' ? options : (options === 'once' ? false : options.capture);
|
|
4583
4606
|
let events, index;
|
|
4584
4607
|
const map = __getListenerMap(this, capture);
|
|
4585
4608
|
typeList.forEach(type => {
|
|
@@ -4881,7 +4904,7 @@ var LeaferUI = (function (exports) {
|
|
|
4881
4904
|
const layout = this.__layout, local = this.__local, data = this.__;
|
|
4882
4905
|
if (layout.affectScaleOrRotation) {
|
|
4883
4906
|
if (layout.scaleChanged || layout.rotationChanged) {
|
|
4884
|
-
setLayout(local, data, null, layout.affectRotation);
|
|
4907
|
+
setLayout(local, data, null, null, layout.affectRotation);
|
|
4885
4908
|
layout.scaleChanged = layout.rotationChanged = false;
|
|
4886
4909
|
}
|
|
4887
4910
|
}
|
|
@@ -4889,7 +4912,7 @@ var LeaferUI = (function (exports) {
|
|
|
4889
4912
|
local.f = data.y + data.offsetY;
|
|
4890
4913
|
if (data.around || data.origin) {
|
|
4891
4914
|
toPoint$3(data.around || data.origin, layout.boxBounds, tempPoint$1);
|
|
4892
|
-
translateInner(local, -tempPoint$1.x, -tempPoint$1.y, data.
|
|
4915
|
+
translateInner(local, -tempPoint$1.x, -tempPoint$1.y, !data.around);
|
|
4893
4916
|
}
|
|
4894
4917
|
}
|
|
4895
4918
|
this.__layout.matrixChanged = false;
|
|
@@ -5118,7 +5141,7 @@ var LeaferUI = (function (exports) {
|
|
|
5118
5141
|
const { toInnerPoint, toOuterPoint, multiplyParent } = MatrixHelper;
|
|
5119
5142
|
const { toOuterOf } = BoundsHelper;
|
|
5120
5143
|
const { copy: copy$4 } = PointHelper;
|
|
5121
|
-
const { moveLocal, zoomOfLocal, rotateOfLocal, skewOfLocal, moveWorld, zoomOfWorld, rotateOfWorld, skewOfWorld, transform, transformWorld, setTransform, getLocalOrigin, getRelativeWorld, drop } = LeafHelper;
|
|
5144
|
+
const { moveLocal, zoomOfLocal, rotateOfLocal, skewOfLocal, moveWorld, zoomOfWorld, rotateOfWorld, skewOfWorld, transform, transformWorld, setTransform, getFlipTransform, getLocalOrigin, getRelativeWorld, drop } = LeafHelper;
|
|
5122
5145
|
exports.Leaf = class Leaf {
|
|
5123
5146
|
get tag() { return this.__tag; }
|
|
5124
5147
|
set tag(_value) { }
|
|
@@ -5144,6 +5167,8 @@ var LeaferUI = (function (exports) {
|
|
|
5144
5167
|
get __ignoreHitWorld() { return (this.__hasMask || this.__hasEraser) && this.__.hitChildren; }
|
|
5145
5168
|
get __inLazyBounds() { const { leafer } = this; return leafer && leafer.created && leafer.lazyBounds.hit(this.__world); }
|
|
5146
5169
|
get pathInputed() { return this.__.__pathInputed; }
|
|
5170
|
+
set event(map) { let event; for (let key in map)
|
|
5171
|
+
event = map[key], event instanceof Array ? this.on(key, event[0], event[1]) : this.on(key, event); }
|
|
5147
5172
|
constructor(data) {
|
|
5148
5173
|
this.innerId = create(LEAF);
|
|
5149
5174
|
this.reset(data);
|
|
@@ -5403,6 +5428,9 @@ var LeaferUI = (function (exports) {
|
|
|
5403
5428
|
skewOfWorld(worldOrigin, skewX, skewY, resize) {
|
|
5404
5429
|
skewOfWorld(this, worldOrigin, skewX, skewY, resize);
|
|
5405
5430
|
}
|
|
5431
|
+
flip(axis) {
|
|
5432
|
+
transform(this, getFlipTransform(this, axis));
|
|
5433
|
+
}
|
|
5406
5434
|
scaleResize(scaleX, scaleY = scaleX, _noResize) {
|
|
5407
5435
|
this.scaleX *= scaleX;
|
|
5408
5436
|
this.scaleY *= scaleY;
|
|
@@ -5760,7 +5788,7 @@ var LeaferUI = (function (exports) {
|
|
|
5760
5788
|
}
|
|
5761
5789
|
}
|
|
5762
5790
|
|
|
5763
|
-
const version = "1.0.
|
|
5791
|
+
const version = "1.0.1";
|
|
5764
5792
|
const inviteCode = {};
|
|
5765
5793
|
|
|
5766
5794
|
const debug$7 = Debug.get('LeaferCanvas');
|
|
@@ -5784,7 +5812,8 @@ var LeaferUI = (function (exports) {
|
|
|
5784
5812
|
}
|
|
5785
5813
|
}
|
|
5786
5814
|
init() {
|
|
5787
|
-
const {
|
|
5815
|
+
const { config } = this;
|
|
5816
|
+
const view = config.view || config.canvas;
|
|
5788
5817
|
view ? this.__createViewFrom(view) : this.__createView();
|
|
5789
5818
|
const { style } = this.view;
|
|
5790
5819
|
style.display || (style.display = 'block');
|
|
@@ -5799,7 +5828,7 @@ var LeaferUI = (function (exports) {
|
|
|
5799
5828
|
}
|
|
5800
5829
|
this.__createContext();
|
|
5801
5830
|
if (!this.autoLayout)
|
|
5802
|
-
this.resize(
|
|
5831
|
+
this.resize(config);
|
|
5803
5832
|
}
|
|
5804
5833
|
set backgroundColor(color) { this.view.style.backgroundColor = color; }
|
|
5805
5834
|
get backgroundColor() { return this.view.style.backgroundColor; }
|
|
@@ -5855,26 +5884,37 @@ var LeaferUI = (function (exports) {
|
|
|
5855
5884
|
this.clientBounds = this.view.getBoundingClientRect();
|
|
5856
5885
|
}
|
|
5857
5886
|
startAutoLayout(autoBounds, listener) {
|
|
5858
|
-
this.autoBounds = autoBounds;
|
|
5859
5887
|
this.resizeListener = listener;
|
|
5860
|
-
|
|
5861
|
-
this.
|
|
5862
|
-
|
|
5863
|
-
|
|
5864
|
-
this.
|
|
5865
|
-
|
|
5866
|
-
|
|
5867
|
-
|
|
5868
|
-
this.
|
|
5869
|
-
|
|
5888
|
+
if (autoBounds) {
|
|
5889
|
+
this.autoBounds = autoBounds;
|
|
5890
|
+
try {
|
|
5891
|
+
this.resizeObserver = new ResizeObserver((entries) => {
|
|
5892
|
+
this.updateClientBounds();
|
|
5893
|
+
for (const entry of entries)
|
|
5894
|
+
this.checkAutoBounds(entry.contentRect);
|
|
5895
|
+
});
|
|
5896
|
+
const parent = this.parentView;
|
|
5897
|
+
if (parent) {
|
|
5898
|
+
this.resizeObserver.observe(parent);
|
|
5899
|
+
this.checkAutoBounds(parent.getBoundingClientRect());
|
|
5900
|
+
}
|
|
5901
|
+
else {
|
|
5902
|
+
this.checkAutoBounds(this.view);
|
|
5903
|
+
debug$7.warn('no parent');
|
|
5904
|
+
}
|
|
5870
5905
|
}
|
|
5871
|
-
|
|
5872
|
-
this.
|
|
5873
|
-
debug$7.warn('no parent');
|
|
5906
|
+
catch (_a) {
|
|
5907
|
+
this.imitateResizeObserver();
|
|
5874
5908
|
}
|
|
5875
5909
|
}
|
|
5876
|
-
|
|
5877
|
-
|
|
5910
|
+
else {
|
|
5911
|
+
window.addEventListener('resize', () => {
|
|
5912
|
+
const pixelRatio = Platform.devicePixelRatio;
|
|
5913
|
+
if (this.pixelRatio !== pixelRatio) {
|
|
5914
|
+
const { width, height } = this;
|
|
5915
|
+
this.emitResize({ width, height, pixelRatio });
|
|
5916
|
+
}
|
|
5917
|
+
});
|
|
5878
5918
|
}
|
|
5879
5919
|
}
|
|
5880
5920
|
imitateResizeObserver() {
|
|
@@ -5887,17 +5927,12 @@ var LeaferUI = (function (exports) {
|
|
|
5887
5927
|
checkAutoBounds(parentSize) {
|
|
5888
5928
|
const view = this.view;
|
|
5889
5929
|
const { x, y, width, height } = this.autoBounds.getBoundsFrom(parentSize);
|
|
5890
|
-
|
|
5930
|
+
const size = { width, height, pixelRatio: Platform.devicePixelRatio };
|
|
5931
|
+
if (!this.isSameSize(size)) {
|
|
5891
5932
|
const { style } = view;
|
|
5892
|
-
const { pixelRatio } = this;
|
|
5893
5933
|
style.marginLeft = x + 'px';
|
|
5894
5934
|
style.marginTop = y + 'px';
|
|
5895
|
-
|
|
5896
|
-
const oldSize = {};
|
|
5897
|
-
DataHelper.copyAttrs(oldSize, this, canvasSizeAttrs);
|
|
5898
|
-
this.resize(size);
|
|
5899
|
-
if (this.width !== undefined)
|
|
5900
|
-
this.resizeListener(new ResizeEvent(size, oldSize));
|
|
5935
|
+
this.emitResize(size);
|
|
5901
5936
|
}
|
|
5902
5937
|
}
|
|
5903
5938
|
stopAutoLayout() {
|
|
@@ -5908,6 +5943,13 @@ var LeaferUI = (function (exports) {
|
|
|
5908
5943
|
this.resizeObserver = null;
|
|
5909
5944
|
}
|
|
5910
5945
|
}
|
|
5946
|
+
emitResize(size) {
|
|
5947
|
+
const oldSize = {};
|
|
5948
|
+
DataHelper.copyAttrs(oldSize, this, canvasSizeAttrs);
|
|
5949
|
+
this.resize(size);
|
|
5950
|
+
if (this.width !== undefined)
|
|
5951
|
+
this.resizeListener(new ResizeEvent(size, oldSize));
|
|
5952
|
+
}
|
|
5911
5953
|
unrealCanvas() {
|
|
5912
5954
|
if (!this.unreal && this.parentView) {
|
|
5913
5955
|
const view = this.view;
|
|
@@ -5988,7 +6030,7 @@ var LeaferUI = (function (exports) {
|
|
|
5988
6030
|
Platform.name = 'web';
|
|
5989
6031
|
Platform.isMobile = 'ontouchstart' in window;
|
|
5990
6032
|
Platform.requestRender = function (render) { window.requestAnimationFrame(render); };
|
|
5991
|
-
Platform
|
|
6033
|
+
defineKey(Platform, 'devicePixelRatio', { get() { return Math.max(1, devicePixelRatio); } });
|
|
5992
6034
|
const { userAgent } = navigator;
|
|
5993
6035
|
if (userAgent.indexOf("Firefox") > -1) {
|
|
5994
6036
|
Platform.conicGradientRotate90 = true;
|
|
@@ -6485,14 +6527,14 @@ var LeaferUI = (function (exports) {
|
|
|
6485
6527
|
if (Debug.showRepaint)
|
|
6486
6528
|
this.canvas.strokeWorld(bounds, 'red');
|
|
6487
6529
|
this.target.__render(this.canvas, options);
|
|
6488
|
-
this.renderBounds = realBounds || bounds;
|
|
6530
|
+
this.renderBounds = realBounds = realBounds || bounds;
|
|
6489
6531
|
this.renderOptions = options;
|
|
6490
|
-
this.totalBounds.isEmpty() ? this.totalBounds =
|
|
6532
|
+
this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
|
|
6491
6533
|
if (Debug.showHitView)
|
|
6492
6534
|
this.renderHitView(options);
|
|
6493
6535
|
if (Debug.showBoundsView)
|
|
6494
6536
|
this.renderBoundsView(options);
|
|
6495
|
-
this.canvas.updateRender();
|
|
6537
|
+
this.canvas.updateRender(realBounds);
|
|
6496
6538
|
}
|
|
6497
6539
|
renderHitView(_options) { }
|
|
6498
6540
|
renderBoundsView(_options) { }
|
|
@@ -7814,7 +7856,7 @@ var LeaferUI = (function (exports) {
|
|
|
7814
7856
|
this.__controllers.push(this.renderer = Creator.renderer(this, canvas, config), this.watcher = Creator.watcher(this, config), this.layouter = Creator.layouter(this, config));
|
|
7815
7857
|
if (this.isApp)
|
|
7816
7858
|
this.__setApp();
|
|
7817
|
-
this.__checkAutoLayout(config);
|
|
7859
|
+
this.__checkAutoLayout(config, parentApp);
|
|
7818
7860
|
this.view = canvas.view;
|
|
7819
7861
|
if (parentApp) {
|
|
7820
7862
|
this.__bindApp(parentApp);
|
|
@@ -7915,9 +7957,10 @@ var LeaferUI = (function (exports) {
|
|
|
7915
7957
|
this.leafer = leafer;
|
|
7916
7958
|
this.__level = 1;
|
|
7917
7959
|
}
|
|
7918
|
-
__checkAutoLayout(config) {
|
|
7919
|
-
if (!
|
|
7920
|
-
|
|
7960
|
+
__checkAutoLayout(config, parentApp) {
|
|
7961
|
+
if (!parentApp) {
|
|
7962
|
+
if (!config.width || !config.height)
|
|
7963
|
+
this.autoLayout = new AutoBounds(config);
|
|
7921
7964
|
this.canvas.startAutoLayout(this.autoLayout, this.__onResize.bind(this));
|
|
7922
7965
|
}
|
|
7923
7966
|
}
|
|
@@ -8052,7 +8095,9 @@ var LeaferUI = (function (exports) {
|
|
|
8052
8095
|
list.push(item);
|
|
8053
8096
|
}
|
|
8054
8097
|
}
|
|
8055
|
-
zoom(_zoomType, _padding, _fixedScale) {
|
|
8098
|
+
zoom(_zoomType, _padding, _fixedScale) {
|
|
8099
|
+
return debug$3.error('need @leafer-in/view');
|
|
8100
|
+
}
|
|
8056
8101
|
getValidMove(moveX, moveY) { return { x: moveX, y: moveY }; }
|
|
8057
8102
|
getValidScale(changeScale) { return changeScale; }
|
|
8058
8103
|
getWorldPointByClient(clientPoint, updateClient) {
|
|
@@ -8579,8 +8624,7 @@ var LeaferUI = (function (exports) {
|
|
|
8579
8624
|
destroy() {
|
|
8580
8625
|
if (this.canvas) {
|
|
8581
8626
|
this.canvas.destroy();
|
|
8582
|
-
this.canvas = null;
|
|
8583
|
-
this.context = null;
|
|
8627
|
+
this.canvas = this.context = null;
|
|
8584
8628
|
}
|
|
8585
8629
|
super.destroy();
|
|
8586
8630
|
}
|
|
@@ -8933,11 +8977,13 @@ var LeaferUI = (function (exports) {
|
|
|
8933
8977
|
this.renderer.update();
|
|
8934
8978
|
}
|
|
8935
8979
|
__render(canvas, options) {
|
|
8936
|
-
if (
|
|
8937
|
-
|
|
8938
|
-
|
|
8980
|
+
if (canvas.context) {
|
|
8981
|
+
if (options.matrix) {
|
|
8982
|
+
const { a, b, c, d, e, f } = options.matrix;
|
|
8983
|
+
canvas.setTransform(a, b, c, d, e, f);
|
|
8984
|
+
}
|
|
8985
|
+
this.children.forEach(leafer => canvas.copyWorld(leafer.canvas));
|
|
8939
8986
|
}
|
|
8940
|
-
this.children.forEach(leafer => canvas.copyWorld(leafer.canvas));
|
|
8941
8987
|
}
|
|
8942
8988
|
__onResize(event) {
|
|
8943
8989
|
this.children.forEach(leafer => leafer.resize(event));
|
|
@@ -9304,11 +9350,14 @@ var LeaferUI = (function (exports) {
|
|
|
9304
9350
|
};
|
|
9305
9351
|
|
|
9306
9352
|
class Transformer {
|
|
9353
|
+
get transforming() { return !!(this.moveData || this.zoomData || this.rotateData); }
|
|
9307
9354
|
constructor(interaction) {
|
|
9308
9355
|
this.interaction = interaction;
|
|
9309
9356
|
}
|
|
9310
9357
|
move(data) {
|
|
9311
9358
|
const { interaction } = this;
|
|
9359
|
+
if (!data.moveType)
|
|
9360
|
+
data.moveType = 'move';
|
|
9312
9361
|
if (!this.moveData) {
|
|
9313
9362
|
const { path } = interaction.selector.getByPoint(data, interaction.hitRadius);
|
|
9314
9363
|
data.path = path;
|
|
@@ -9473,8 +9522,10 @@ var LeaferUI = (function (exports) {
|
|
|
9473
9522
|
return;
|
|
9474
9523
|
}
|
|
9475
9524
|
if (!this.moving && canDrag) {
|
|
9476
|
-
if (this.moving = interaction.canMove(this.downData) || interaction.isHoldRightKey || interaction.isMobileDragEmpty)
|
|
9525
|
+
if (this.moving = interaction.canMove(this.downData) || interaction.isHoldRightKey || interaction.isMobileDragEmpty) {
|
|
9526
|
+
this.dragData.moveType = 'drag';
|
|
9477
9527
|
interaction.emit(exports.MoveEvent.START, this.dragData);
|
|
9528
|
+
}
|
|
9478
9529
|
}
|
|
9479
9530
|
if (!this.moving) {
|
|
9480
9531
|
this.dragStart(data, canDrag);
|
|
@@ -9513,6 +9564,7 @@ var LeaferUI = (function (exports) {
|
|
|
9513
9564
|
this.dragData.throughPath = throughPath;
|
|
9514
9565
|
this.dragData.path = path;
|
|
9515
9566
|
if (this.moving) {
|
|
9567
|
+
this.dragData.moveType = 'drag';
|
|
9516
9568
|
interaction.emit(exports.MoveEvent.BEFORE_MOVE, this.dragData);
|
|
9517
9569
|
interaction.emit(exports.MoveEvent.MOVE, this.dragData);
|
|
9518
9570
|
}
|
|
@@ -9579,6 +9631,7 @@ var LeaferUI = (function (exports) {
|
|
|
9579
9631
|
endDragData.path = path;
|
|
9580
9632
|
if (this.moving) {
|
|
9581
9633
|
this.moving = false;
|
|
9634
|
+
endDragData.moveType = 'drag';
|
|
9582
9635
|
interaction.emit(exports.MoveEvent.END, endDragData);
|
|
9583
9636
|
}
|
|
9584
9637
|
if (this.dragging) {
|
|
@@ -9637,7 +9690,7 @@ var LeaferUI = (function (exports) {
|
|
|
9637
9690
|
totalY += moveY;
|
|
9638
9691
|
PointHelper.move(downData, moveX, moveY);
|
|
9639
9692
|
PointHelper.move(this.dragData, moveX, moveY);
|
|
9640
|
-
interaction.move(Object.assign(Object.assign({}, data), { moveX, moveY, totalX, totalY }));
|
|
9693
|
+
interaction.move(Object.assign(Object.assign({}, data), { moveX, moveY, totalX, totalY, moveType: 'drag' }));
|
|
9641
9694
|
interaction.pointerMoveReal(data);
|
|
9642
9695
|
}, 10);
|
|
9643
9696
|
}
|
|
@@ -9757,9 +9810,11 @@ var LeaferUI = (function (exports) {
|
|
|
9757
9810
|
const { pathHasEventType, getMoveEventData: getMoveEventData$1, getZoomEventData: getZoomEventData$1, getRotateEventData: getRotateEventData$1 } = InteractionHelper;
|
|
9758
9811
|
class InteractionBase {
|
|
9759
9812
|
get dragging() { return this.dragger.dragging; }
|
|
9813
|
+
get transforming() { return this.transformer.transforming; }
|
|
9760
9814
|
get moveMode() { return this.config.move.drag || this.isHoldSpaceKey || this.isHoldMiddleKey || (this.isHoldRightKey && this.dragger.moving) || this.isDragEmpty; }
|
|
9815
|
+
get canHover() { return this.config.pointer.hover && !this.config.mobile; }
|
|
9761
9816
|
get isDragEmpty() { return this.config.move.dragEmpty && this.isRootPath(this.hoverData) && (!this.downData || this.isRootPath(this.downData)); }
|
|
9762
|
-
get isMobileDragEmpty() { return this.config.move.dragEmpty && !this.
|
|
9817
|
+
get isMobileDragEmpty() { return this.config.move.dragEmpty && !this.canHover && this.downData && this.isTreePath(this.downData); }
|
|
9763
9818
|
get isHoldMiddleKey() { return this.config.move.holdMiddleKey && this.downData && PointerButton.middle(this.downData); }
|
|
9764
9819
|
get isHoldRightKey() { return this.config.move.holdRightKey && this.downData && PointerButton.right(this.downData); }
|
|
9765
9820
|
get isHoldSpaceKey() { return this.config.move.holdSpaceKey && Keyboard.isHoldSpaceKey(); }
|
|
@@ -9852,6 +9907,7 @@ var LeaferUI = (function (exports) {
|
|
|
9852
9907
|
if (!downData)
|
|
9853
9908
|
return;
|
|
9854
9909
|
PointerButton.defaultLeft(data);
|
|
9910
|
+
data.multiTouch = downData.multiTouch;
|
|
9855
9911
|
this.findPath(data);
|
|
9856
9912
|
const upData = Object.assign(Object.assign({}, data), { path: data.path.clone() });
|
|
9857
9913
|
data.path.addList(downData.path.list);
|
|
@@ -9924,7 +9980,7 @@ var LeaferUI = (function (exports) {
|
|
|
9924
9980
|
this.updateCursor();
|
|
9925
9981
|
}
|
|
9926
9982
|
pointerHover(data) {
|
|
9927
|
-
if (this.
|
|
9983
|
+
if (this.canHover) {
|
|
9928
9984
|
this.pointerOverOrOut(data);
|
|
9929
9985
|
this.pointerEnterOrLeave(data);
|
|
9930
9986
|
}
|
|
@@ -10061,7 +10117,7 @@ var LeaferUI = (function (exports) {
|
|
|
10061
10117
|
this.hoverData = data;
|
|
10062
10118
|
}
|
|
10063
10119
|
updateCursor(data) {
|
|
10064
|
-
if (!this.config.cursor || !this.
|
|
10120
|
+
if (!this.config.cursor || !this.canHover)
|
|
10065
10121
|
return;
|
|
10066
10122
|
if (!data) {
|
|
10067
10123
|
this.updateHoverData();
|
|
@@ -10383,7 +10439,7 @@ var LeaferUI = (function (exports) {
|
|
|
10383
10439
|
convertTouch(e, local) {
|
|
10384
10440
|
const touch = PointerEventHelper.getTouch(e);
|
|
10385
10441
|
const base = InteractionHelper.getBase(e);
|
|
10386
|
-
return Object.assign(Object.assign({}, base), { x: local.x, y: local.y, width: 1, height: 1, pointerType: 'touch', pressure: touch.force });
|
|
10442
|
+
return Object.assign(Object.assign({}, base), { x: local.x, y: local.y, width: 1, height: 1, pointerType: 'touch', multiTouch: e.touches.length > 1, pressure: touch.force });
|
|
10387
10443
|
},
|
|
10388
10444
|
getTouch(e) {
|
|
10389
10445
|
return e.targetTouches[0] || e.changedTouches[0];
|
|
@@ -10524,21 +10580,21 @@ var LeaferUI = (function (exports) {
|
|
|
10524
10580
|
}
|
|
10525
10581
|
onPointerDown(e) {
|
|
10526
10582
|
this.preventDefaultPointer(e);
|
|
10527
|
-
this.
|
|
10528
|
-
if (this.useMultiTouch)
|
|
10583
|
+
if (this.config.pointer.touch || this.useMultiTouch)
|
|
10529
10584
|
return;
|
|
10585
|
+
this.usePointer || (this.usePointer = true);
|
|
10530
10586
|
this.pointerDown(PointerEventHelper.convert(e, this.getLocal(e)));
|
|
10531
10587
|
}
|
|
10532
10588
|
onPointerMove(e) {
|
|
10533
|
-
this.
|
|
10534
|
-
if (this.useMultiTouch || this.preventWindowPointer(e))
|
|
10589
|
+
if (this.config.pointer.touch || this.useMultiTouch || this.preventWindowPointer(e))
|
|
10535
10590
|
return;
|
|
10591
|
+
this.usePointer || (this.usePointer = true);
|
|
10536
10592
|
this.pointerMove(PointerEventHelper.convert(e, this.getLocal(e, true)));
|
|
10537
10593
|
}
|
|
10538
10594
|
onPointerUp(e) {
|
|
10539
10595
|
if (this.downData)
|
|
10540
10596
|
this.preventDefaultPointer(e);
|
|
10541
|
-
if (this.useMultiTouch || this.preventWindowPointer(e))
|
|
10597
|
+
if (this.config.pointer.touch || this.useMultiTouch || this.preventWindowPointer(e))
|
|
10542
10598
|
return;
|
|
10543
10599
|
this.pointerUp(PointerEventHelper.convert(e, this.getLocal(e)));
|
|
10544
10600
|
}
|
|
@@ -10608,7 +10664,7 @@ var LeaferUI = (function (exports) {
|
|
|
10608
10664
|
this.pointerCancel();
|
|
10609
10665
|
}
|
|
10610
10666
|
multiTouchStart(e) {
|
|
10611
|
-
this.useMultiTouch = (e.touches.length
|
|
10667
|
+
this.useMultiTouch = (e.touches.length > 1);
|
|
10612
10668
|
this.touches = this.useMultiTouch ? this.getTouches(e.touches) : undefined;
|
|
10613
10669
|
if (this.useMultiTouch)
|
|
10614
10670
|
this.pointerCancel();
|
|
@@ -11298,7 +11354,7 @@ var LeaferUI = (function (exports) {
|
|
|
11298
11354
|
const { abs } = Math;
|
|
11299
11355
|
function checkImage(ui, canvas, paint, allowPaint) {
|
|
11300
11356
|
const { scaleX, scaleY } = ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
|
|
11301
|
-
if (!paint.data || paint.patternId === scaleX + '-' + scaleY) {
|
|
11357
|
+
if (!paint.data || (paint.patternId === scaleX + '-' + scaleY && !Export.running)) {
|
|
11302
11358
|
return false;
|
|
11303
11359
|
}
|
|
11304
11360
|
else {
|
|
@@ -12276,7 +12332,10 @@ var LeaferUI = (function (exports) {
|
|
|
12276
12332
|
const { x, y, width, height } = new Bounds(renderBounds).scale(scale);
|
|
12277
12333
|
let canvas = Creator.canvas({ width: Math.round(width), height: Math.round(height), pixelRatio, smooth, contextSettings });
|
|
12278
12334
|
const renderOptions = { matrix: matrix.scale(1 / scale).invert().translate(-x, -y).withScale(1 / scaleX * scale, 1 / scaleY * scale) };
|
|
12335
|
+
let sliceLeaf;
|
|
12279
12336
|
if (slice) {
|
|
12337
|
+
sliceLeaf = leaf;
|
|
12338
|
+
sliceLeaf.__worldOpacity = 0;
|
|
12280
12339
|
leaf = leafer;
|
|
12281
12340
|
renderOptions.bounds = canvas.bounds;
|
|
12282
12341
|
}
|
|
@@ -12291,6 +12350,8 @@ var LeaferUI = (function (exports) {
|
|
|
12291
12350
|
leaf.__render(canvas, renderOptions);
|
|
12292
12351
|
}
|
|
12293
12352
|
canvas.restore();
|
|
12353
|
+
if (sliceLeaf)
|
|
12354
|
+
sliceLeaf.__updateWorldOpacity();
|
|
12294
12355
|
if (trim) {
|
|
12295
12356
|
trimBounds = getTrimBounds(canvas);
|
|
12296
12357
|
const old = canvas, { width, height } = trimBounds;
|