modern-canvas 0.7.13 → 0.7.15
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/dist/index.cjs +113 -80
- package/dist/index.d.cts +28 -22
- package/dist/index.d.mts +28 -22
- package/dist/index.d.ts +28 -22
- package/dist/index.js +15 -15
- package/dist/index.mjs +113 -80
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1746,7 +1746,7 @@ class Matrix3 extends Matrix {
|
|
|
1746
1746
|
constructor(array) {
|
|
1747
1747
|
super(3, 3, array);
|
|
1748
1748
|
}
|
|
1749
|
-
|
|
1749
|
+
affineInvert() {
|
|
1750
1750
|
const [
|
|
1751
1751
|
n11,
|
|
1752
1752
|
n21,
|
|
@@ -1763,7 +1763,17 @@ class Matrix3 extends Matrix {
|
|
|
1763
1763
|
const t13 = n23 * n12 - n22 * n13;
|
|
1764
1764
|
const det = n11 * t11 + n21 * t12 + n31 * t13;
|
|
1765
1765
|
if (det === 0) {
|
|
1766
|
-
return this.set([
|
|
1766
|
+
return this.set([
|
|
1767
|
+
0,
|
|
1768
|
+
0,
|
|
1769
|
+
0,
|
|
1770
|
+
0,
|
|
1771
|
+
0,
|
|
1772
|
+
0,
|
|
1773
|
+
0,
|
|
1774
|
+
0,
|
|
1775
|
+
0
|
|
1776
|
+
]);
|
|
1767
1777
|
}
|
|
1768
1778
|
const detInv = 1 / det;
|
|
1769
1779
|
return this.set([
|
|
@@ -1956,8 +1966,8 @@ class Rect2 {
|
|
|
1956
1966
|
position.set(arg.position);
|
|
1957
1967
|
size.set(arg.size);
|
|
1958
1968
|
} else {
|
|
1959
|
-
const xx = arg.map((p) => p
|
|
1960
|
-
const yy = arg.map((p) => p
|
|
1969
|
+
const xx = arg.map((p) => p.x);
|
|
1970
|
+
const yy = arg.map((p) => p.y);
|
|
1961
1971
|
const minX = Math.min(...xx);
|
|
1962
1972
|
const maxX = Math.max(...xx);
|
|
1963
1973
|
const minY = Math.min(...yy);
|
|
@@ -2155,13 +2165,6 @@ class Transform2D extends Matrix3 {
|
|
|
2155
2165
|
]);
|
|
2156
2166
|
return this;
|
|
2157
2167
|
}
|
|
2158
|
-
applyToPoint(x, y) {
|
|
2159
|
-
const { a, c, tx, b, d, ty } = this.toObject();
|
|
2160
|
-
return [
|
|
2161
|
-
a * x + c * y + tx,
|
|
2162
|
-
b * x + d * y + ty
|
|
2163
|
-
];
|
|
2164
|
-
}
|
|
2165
2168
|
decompose(pivot = { x: 0, y: 0 }, output = {
|
|
2166
2169
|
position: { x: 0, y: 0 },
|
|
2167
2170
|
scale: { x: 0, y: 0 },
|
|
@@ -2186,8 +2189,27 @@ class Transform2D extends Matrix3 {
|
|
|
2186
2189
|
output.position.y = ty + (pivot.x * b + pivot.y * d);
|
|
2187
2190
|
return output;
|
|
2188
2191
|
}
|
|
2189
|
-
|
|
2190
|
-
|
|
2192
|
+
apply(pos, newPos) {
|
|
2193
|
+
newPos = newPos || new Vector2();
|
|
2194
|
+
const { a, c, tx, b, d, ty } = this.toObject();
|
|
2195
|
+
const x = pos.x;
|
|
2196
|
+
const y = pos.y;
|
|
2197
|
+
newPos.x = a * x + c * y + tx;
|
|
2198
|
+
newPos.y = b * x + d * y + ty;
|
|
2199
|
+
return newPos;
|
|
2200
|
+
}
|
|
2201
|
+
affineInverse() {
|
|
2202
|
+
return this.clone().affineInvert();
|
|
2203
|
+
}
|
|
2204
|
+
applyAffineInverse(pos, newPos) {
|
|
2205
|
+
newPos = newPos || new Vector2();
|
|
2206
|
+
const { a, b, c, d, tx, ty } = this.toObject();
|
|
2207
|
+
const id = 1 / (a * d + c * -b);
|
|
2208
|
+
const x = pos.x;
|
|
2209
|
+
const y = pos.y;
|
|
2210
|
+
newPos.x = d * id * x + -c * id * y + (ty * c - tx * d) * id;
|
|
2211
|
+
newPos.y = a * id * y + -b * id * x + (-ty * a + tx * b) * id;
|
|
2212
|
+
return newPos;
|
|
2191
2213
|
}
|
|
2192
2214
|
isIdentity() {
|
|
2193
2215
|
const { a, b, c, d, tx, ty } = this.toObject();
|
|
@@ -2558,7 +2580,7 @@ attribute vec4 aBackgroundColor;
|
|
|
2558
2580
|
attribute vec4 aDisableWrapMode;
|
|
2559
2581
|
|
|
2560
2582
|
uniform mat3 projectionMatrix;
|
|
2561
|
-
uniform mat3
|
|
2583
|
+
uniform mat3 viewMatrix;
|
|
2562
2584
|
uniform vec4 modulate;
|
|
2563
2585
|
|
|
2564
2586
|
varying float vTextureId;
|
|
@@ -2574,7 +2596,7 @@ void main(void) {
|
|
|
2574
2596
|
0.0, 0.0, 1.0
|
|
2575
2597
|
);
|
|
2576
2598
|
vTextureId = aTextureId;
|
|
2577
|
-
mat3 modelViewProjectionMatrix = projectionMatrix *
|
|
2599
|
+
mat3 modelViewProjectionMatrix = projectionMatrix * viewMatrix * modelMatrix;
|
|
2578
2600
|
gl_Position = vec4((modelViewProjectionMatrix * vec3(aPosition, 1.0)).xy, 0.0, 1.0);
|
|
2579
2601
|
vUv = aUv;
|
|
2580
2602
|
vModulate = aModulate * modulate;
|
|
@@ -3305,7 +3327,7 @@ class WebGLProgramModule extends WebGLModule {
|
|
|
3305
3327
|
boundProgram = null;
|
|
3306
3328
|
uniforms = {
|
|
3307
3329
|
projectionMatrix: [1, 0, 0, 0, 1, 0, 0, 0, 1],
|
|
3308
|
-
|
|
3330
|
+
viewMatrix: [1, 0, 0, 0, 1, 0, 0, 0, 1]
|
|
3309
3331
|
};
|
|
3310
3332
|
create(options) {
|
|
3311
3333
|
const program = this.gl.createProgram();
|
|
@@ -3509,7 +3531,7 @@ ${gl.getShaderInfoLog(shader)}`);
|
|
|
3509
3531
|
this.boundProgram = null;
|
|
3510
3532
|
this.uniforms = {
|
|
3511
3533
|
projectionMatrix: [1, 0, 0, 0, 1, 0, 0, 0, 1],
|
|
3512
|
-
|
|
3534
|
+
viewMatrix: [1, 0, 0, 0, 1, 0, 0, 0, 1]
|
|
3513
3535
|
};
|
|
3514
3536
|
}
|
|
3515
3537
|
free() {
|
|
@@ -3603,8 +3625,8 @@ class WebGLScissorModule extends WebGLModule {
|
|
|
3603
3625
|
use() {
|
|
3604
3626
|
const renderer = this._renderer;
|
|
3605
3627
|
const { pixelRatio, mask, viewport, screen, gl, program } = renderer;
|
|
3606
|
-
const {
|
|
3607
|
-
const rect = transformRectToAABB(
|
|
3628
|
+
const { viewMatrix } = program.uniforms;
|
|
3629
|
+
const rect = transformRectToAABB(viewMatrix, mask.last.mask);
|
|
3608
3630
|
const { x, y, width, height } = rect;
|
|
3609
3631
|
let scissorY;
|
|
3610
3632
|
if (viewport.boundViewport) {
|
|
@@ -5636,7 +5658,7 @@ class CanvasContext extends modernPath2d.Path2D {
|
|
|
5636
5658
|
}
|
|
5637
5659
|
buildUvs(start, vertices, uvs, texture, uvTransform) {
|
|
5638
5660
|
if (texture) {
|
|
5639
|
-
const _uvTransform = uvTransform ? typeof uvTransform === "function" ? uvTransform : (x, y) => uvTransform.
|
|
5661
|
+
const _uvTransform = uvTransform ? typeof uvTransform === "function" ? uvTransform : (x, y) => uvTransform.apply({ x, y }).toArray() : uvTransform;
|
|
5640
5662
|
const w = texture.width;
|
|
5641
5663
|
const h = texture.height;
|
|
5642
5664
|
for (let len = vertices.length, i = start; i < len; i += 2) {
|
|
@@ -6658,7 +6680,7 @@ exports.Viewport = class Viewport extends exports.Node {
|
|
|
6658
6680
|
render(renderer, next) {
|
|
6659
6681
|
const oldViewport = this._tree?.getCurrentViewport();
|
|
6660
6682
|
renderer.program.uniforms.projectionMatrix = this.projection.toArray(true);
|
|
6661
|
-
renderer.program.uniforms.
|
|
6683
|
+
renderer.program.uniforms.viewMatrix = this.canvasTransform.toArray(true);
|
|
6662
6684
|
this.activate(renderer);
|
|
6663
6685
|
renderer.clear();
|
|
6664
6686
|
super.render(renderer, next);
|
|
@@ -6673,6 +6695,12 @@ exports.Viewport = class Viewport extends exports.Node {
|
|
|
6673
6695
|
getRect() {
|
|
6674
6696
|
return new Rect2(this.x, this.y, this.width, this.height);
|
|
6675
6697
|
}
|
|
6698
|
+
toCanvasGlobal(screenPos, newPos) {
|
|
6699
|
+
return this.canvasTransform.applyAffineInverse(screenPos, newPos);
|
|
6700
|
+
}
|
|
6701
|
+
toCanvasScreen(globalPos, newPos) {
|
|
6702
|
+
return this.canvasTransform.apply(globalPos, newPos);
|
|
6703
|
+
}
|
|
6676
6704
|
};
|
|
6677
6705
|
__decorateClass$P([
|
|
6678
6706
|
modernIdoc.property({ fallback: 0 })
|
|
@@ -7209,35 +7237,28 @@ exports.Node2D = class Node2D extends exports.CanvasItem {
|
|
|
7209
7237
|
getTransformOrigin() {
|
|
7210
7238
|
return new Vector2(0, 0);
|
|
7211
7239
|
}
|
|
7212
|
-
|
|
7240
|
+
updateTransform(cb) {
|
|
7213
7241
|
const origin = this.getTransformOrigin();
|
|
7214
|
-
const transform =
|
|
7215
|
-
transform.translate(-origin.x, -origin.y).scale(this.scale.x, this.scale.y).skew(this.skew.x, this.skew.y).rotate(this.rotation);
|
|
7242
|
+
const transform = this.transform.identity().translate(-origin.x, -origin.y).scale(this.scale.x, this.scale.y).skew(this.skew.x, this.skew.y).rotate(this.rotation);
|
|
7216
7243
|
cb?.(transform);
|
|
7217
7244
|
transform.translate(this.position.x, this.position.y).translate(origin.x, origin.y);
|
|
7218
|
-
return transform;
|
|
7219
|
-
}
|
|
7220
|
-
updateTransform() {
|
|
7221
|
-
this.transform.copy(this.getTransform());
|
|
7222
7245
|
}
|
|
7223
7246
|
updateGlobalTransform() {
|
|
7224
7247
|
this.updateTransform();
|
|
7225
7248
|
const parent = this.getParent();
|
|
7226
7249
|
if (parent?.globalTransform) {
|
|
7227
|
-
|
|
7228
|
-
|
|
7229
|
-
|
|
7230
|
-
|
|
7231
|
-
|
|
7232
|
-
|
|
7233
|
-
|
|
7234
|
-
|
|
7235
|
-
);
|
|
7236
|
-
this.
|
|
7237
|
-
|
|
7238
|
-
|
|
7239
|
-
);
|
|
7240
|
-
this.globalRotation = parent.globalRotation + this.rotation;
|
|
7250
|
+
const {
|
|
7251
|
+
globalPosition,
|
|
7252
|
+
globalScale,
|
|
7253
|
+
globalSkew,
|
|
7254
|
+
globalTransform,
|
|
7255
|
+
globalRotation
|
|
7256
|
+
} = parent;
|
|
7257
|
+
this._parentTransformDirtyId = globalTransform.dirtyId;
|
|
7258
|
+
this.globalPosition.set(globalPosition.x + this.position.x, globalPosition.y + this.position.y);
|
|
7259
|
+
this.globalScale.set(globalScale.x * this.scale.x, globalScale.y * this.scale.y);
|
|
7260
|
+
this.globalSkew.set(globalSkew.x * this.skew.x, globalSkew.y * this.skew.y);
|
|
7261
|
+
this.globalRotation = globalRotation + this.rotation;
|
|
7241
7262
|
parent.globalTransform.multiply(this.transform, this.globalTransform);
|
|
7242
7263
|
} else {
|
|
7243
7264
|
this.globalPosition.copy(this.position);
|
|
@@ -7285,6 +7306,12 @@ exports.Node2D = class Node2D extends exports.CanvasItem {
|
|
|
7285
7306
|
this.requestRelayout();
|
|
7286
7307
|
}
|
|
7287
7308
|
}
|
|
7309
|
+
toLocal(globalPos, newPos) {
|
|
7310
|
+
return this.globalTransform.applyAffineInverse(globalPos, newPos);
|
|
7311
|
+
}
|
|
7312
|
+
toGlobal(localPos, newPos) {
|
|
7313
|
+
return this.globalTransform.apply(localPos, newPos);
|
|
7314
|
+
}
|
|
7288
7315
|
};
|
|
7289
7316
|
__decorateClass$J([
|
|
7290
7317
|
modernIdoc.property({ protected: true, fallback: 0 })
|
|
@@ -7403,6 +7430,18 @@ exports.Camera2D = class Camera2D extends exports.Node2D {
|
|
|
7403
7430
|
viewport.canvasTransform.identity().scale(this.zoom.x, this.zoom.y).translate(this.position.x, this.position.y);
|
|
7404
7431
|
this.emit("updateCanvasTransform");
|
|
7405
7432
|
}
|
|
7433
|
+
toGlobal(screenPos, newPos) {
|
|
7434
|
+
const viewport = this.getViewport();
|
|
7435
|
+
if (!viewport)
|
|
7436
|
+
throw new Error("Failed to toGlobal, viewport is empty");
|
|
7437
|
+
return viewport.toCanvasGlobal(screenPos, newPos);
|
|
7438
|
+
}
|
|
7439
|
+
toScreen(globalPos, newPos) {
|
|
7440
|
+
const viewport = this.getViewport();
|
|
7441
|
+
if (!viewport)
|
|
7442
|
+
throw new Error("Failed to toScreen, viewport is empty");
|
|
7443
|
+
return viewport.toCanvasScreen(globalPos, newPos);
|
|
7444
|
+
}
|
|
7406
7445
|
};
|
|
7407
7446
|
__decorateClass$I([
|
|
7408
7447
|
modernIdoc.property({ protected: true, fallback: false })
|
|
@@ -9763,7 +9802,10 @@ class BaseElement2DText extends CoreObject {
|
|
|
9763
9802
|
break;
|
|
9764
9803
|
}
|
|
9765
9804
|
}
|
|
9766
|
-
|
|
9805
|
+
setContent(content) {
|
|
9806
|
+
this.content = modernIdoc.normalizeTextContent(content);
|
|
9807
|
+
}
|
|
9808
|
+
measure() {
|
|
9767
9809
|
this.base.style = {
|
|
9768
9810
|
justifyContent: "center",
|
|
9769
9811
|
alignItems: "center",
|
|
@@ -9771,12 +9813,6 @@ class BaseElement2DText extends CoreObject {
|
|
|
9771
9813
|
...this.parent.style.toJSON()
|
|
9772
9814
|
};
|
|
9773
9815
|
this.base.requestUpdate();
|
|
9774
|
-
}
|
|
9775
|
-
setContent(content) {
|
|
9776
|
-
this.content = modernIdoc.normalizeTextContent(content);
|
|
9777
|
-
}
|
|
9778
|
-
measure() {
|
|
9779
|
-
this._updateText();
|
|
9780
9816
|
return this.base.measure();
|
|
9781
9817
|
}
|
|
9782
9818
|
updateMeasure() {
|
|
@@ -10007,9 +10043,9 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
|
|
|
10007
10043
|
const [originX, originY] = parseCSSTransformOrigin(this.style.transformOrigin);
|
|
10008
10044
|
return new Vector2(originX * width, originY * height);
|
|
10009
10045
|
}
|
|
10010
|
-
|
|
10046
|
+
updateTransform(cb) {
|
|
10011
10047
|
const { width, height } = this.size;
|
|
10012
|
-
|
|
10048
|
+
super.updateTransform((transform) => {
|
|
10013
10049
|
parseCSSTransform(this.style.transform ?? "", width, height, transform);
|
|
10014
10050
|
cb?.(transform);
|
|
10015
10051
|
});
|
|
@@ -10028,37 +10064,35 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
|
|
|
10028
10064
|
const x2 = x1 + width;
|
|
10029
10065
|
const y2 = y1 + height;
|
|
10030
10066
|
return [
|
|
10031
|
-
|
|
10032
|
-
|
|
10033
|
-
|
|
10034
|
-
|
|
10067
|
+
{ x: x1, y: y1 },
|
|
10068
|
+
{ x: x1, y: y2 },
|
|
10069
|
+
{ x: x2, y: y1 },
|
|
10070
|
+
{ x: x2, y: y2 }
|
|
10035
10071
|
];
|
|
10036
10072
|
}
|
|
10037
10073
|
getAabb() {
|
|
10038
10074
|
return new Rect2(
|
|
10039
10075
|
this._getPointArray().map((p) => {
|
|
10040
|
-
return this.transform.
|
|
10076
|
+
return this.transform.apply(p);
|
|
10041
10077
|
})
|
|
10042
10078
|
);
|
|
10043
10079
|
}
|
|
10044
10080
|
getGlobalAabb() {
|
|
10045
10081
|
return new Rect2(
|
|
10046
10082
|
this._getPointArray().map((p) => {
|
|
10047
|
-
return this.globalTransform.
|
|
10083
|
+
return this.globalTransform.apply(p);
|
|
10048
10084
|
})
|
|
10049
10085
|
);
|
|
10050
10086
|
}
|
|
10051
10087
|
getObb() {
|
|
10052
10088
|
const origin = this.getTransformOrigin();
|
|
10053
|
-
const _origin = this.transform.
|
|
10054
|
-
const offset = [_origin[0] - origin.x, _origin[1] - origin.y];
|
|
10089
|
+
const _origin = this.transform.apply(origin).sub(origin);
|
|
10055
10090
|
return {
|
|
10056
10091
|
rect: new Rect2(
|
|
10057
10092
|
this._getPointArray().map((p) => {
|
|
10058
|
-
|
|
10059
|
-
|
|
10060
|
-
|
|
10061
|
-
];
|
|
10093
|
+
p.x += _origin.x;
|
|
10094
|
+
p.y += _origin.y;
|
|
10095
|
+
return p;
|
|
10062
10096
|
})
|
|
10063
10097
|
),
|
|
10064
10098
|
rotation: this.rotation
|
|
@@ -10066,15 +10100,13 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
|
|
|
10066
10100
|
}
|
|
10067
10101
|
getGlobalObb() {
|
|
10068
10102
|
const origin = this.getTransformOrigin();
|
|
10069
|
-
const _origin = this.globalTransform.
|
|
10070
|
-
const offset = [_origin[0] - origin.x, _origin[1] - origin.y];
|
|
10103
|
+
const _origin = this.globalTransform.apply(origin).sub(origin);
|
|
10071
10104
|
return {
|
|
10072
10105
|
rect: new Rect2(
|
|
10073
10106
|
this._getPointArray().map((p) => {
|
|
10074
|
-
|
|
10075
|
-
|
|
10076
|
-
|
|
10077
|
-
];
|
|
10107
|
+
p.x += _origin.x;
|
|
10108
|
+
p.y += _origin.y;
|
|
10109
|
+
return p;
|
|
10078
10110
|
})
|
|
10079
10111
|
),
|
|
10080
10112
|
rotation: this.globalRotation
|
|
@@ -10092,12 +10124,12 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
|
|
|
10092
10124
|
// override isVisibleInTree(): boolean {
|
|
10093
10125
|
// if (this._tree) {
|
|
10094
10126
|
// const root = this._tree.root
|
|
10095
|
-
// const camera = root.
|
|
10127
|
+
// const camera = root.worldTransform.inverse()
|
|
10096
10128
|
// const { x, y, width, height } = root
|
|
10097
|
-
// const p1 = camera.
|
|
10098
|
-
// const p2 = camera.
|
|
10099
|
-
// const p3 = camera.
|
|
10100
|
-
// const p4 = camera.
|
|
10129
|
+
// const p1 = camera.apply(x, y)
|
|
10130
|
+
// const p2 = camera.apply(x + width, y)
|
|
10131
|
+
// const p3 = camera.apply(x + width, y + height)
|
|
10132
|
+
// const p4 = camera.apply(x, y + height)
|
|
10101
10133
|
// const pts = [p1, p2, p3, p4]
|
|
10102
10134
|
// const xs = pts.map(p => p[0])
|
|
10103
10135
|
// const ys = pts.map(p => p[1])
|
|
@@ -10187,9 +10219,9 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
|
|
|
10187
10219
|
}
|
|
10188
10220
|
}
|
|
10189
10221
|
// eslint-disable-next-line unused-imports/no-unused-vars
|
|
10190
|
-
|
|
10222
|
+
_positionInput(localPos, key) {
|
|
10191
10223
|
const { width, height } = this.size;
|
|
10192
|
-
return
|
|
10224
|
+
return localPos.x >= 0 && localPos.x < width && localPos.y >= 0 && localPos.y < height;
|
|
10193
10225
|
}
|
|
10194
10226
|
_input(event, key) {
|
|
10195
10227
|
switch (key) {
|
|
@@ -10197,14 +10229,15 @@ exports.BaseElement2D = class BaseElement2D extends exports.Node2D {
|
|
|
10197
10229
|
case "pointermove":
|
|
10198
10230
|
case "pointerup": {
|
|
10199
10231
|
if (this.canPointerEvents()) {
|
|
10200
|
-
|
|
10232
|
+
const { screenX, screenY } = event;
|
|
10201
10233
|
if (screenX && screenY) {
|
|
10234
|
+
const pos = new Vector2(screenX, screenY);
|
|
10202
10235
|
const viewport = this.getViewport();
|
|
10203
10236
|
if (viewport) {
|
|
10204
|
-
|
|
10237
|
+
viewport.toCanvasGlobal(pos, pos);
|
|
10205
10238
|
}
|
|
10206
|
-
|
|
10207
|
-
if (this.
|
|
10239
|
+
this.toLocal(pos, pos);
|
|
10240
|
+
if (this._positionInput(pos, key)) {
|
|
10208
10241
|
if (!event.target) {
|
|
10209
10242
|
event.target = this;
|
|
10210
10243
|
}
|
package/dist/index.d.cts
CHANGED
|
@@ -444,7 +444,7 @@ declare class Matrix2 extends Matrix {
|
|
|
444
444
|
*/
|
|
445
445
|
declare class Matrix3 extends Matrix {
|
|
446
446
|
constructor(array?: number[]);
|
|
447
|
-
|
|
447
|
+
affineInvert(): this;
|
|
448
448
|
}
|
|
449
449
|
|
|
450
450
|
declare class Projection2D extends Matrix3 {
|
|
@@ -460,6 +460,10 @@ declare class Projection2D extends Matrix3 {
|
|
|
460
460
|
protected _performUpdateArray(): void;
|
|
461
461
|
}
|
|
462
462
|
|
|
463
|
+
interface Vector2Data {
|
|
464
|
+
x: number;
|
|
465
|
+
y: number;
|
|
466
|
+
}
|
|
463
467
|
/**
|
|
464
468
|
* Vector2
|
|
465
469
|
*/
|
|
@@ -480,7 +484,7 @@ declare class Vector2 extends Vector {
|
|
|
480
484
|
update(x: number, y: number): this;
|
|
481
485
|
getLength(): number;
|
|
482
486
|
getAngle(): number;
|
|
483
|
-
distanceTo(point:
|
|
487
|
+
distanceTo(point: Vector2Data): number;
|
|
484
488
|
normalize(): this;
|
|
485
489
|
static lerp(a: VectorLike, b: VectorLike, t: number): Vector2;
|
|
486
490
|
}
|
|
@@ -498,8 +502,8 @@ declare class Rect2 {
|
|
|
498
502
|
readonly position: Vector2;
|
|
499
503
|
readonly size: Vector2;
|
|
500
504
|
constructor(from: Rect2);
|
|
501
|
-
constructor(pointArray: [
|
|
502
|
-
constructor(position:
|
|
505
|
+
constructor(pointArray: Vector2Data[]);
|
|
506
|
+
constructor(position: Vector2Data, size: Vector2Data);
|
|
503
507
|
constructor(x: number, y: number, width: number, height: number);
|
|
504
508
|
update(): this;
|
|
505
509
|
toMinmax(): {
|
|
@@ -574,12 +578,13 @@ declare class Transform2D extends Matrix3 {
|
|
|
574
578
|
protected _rotateToScale(rad: number): number;
|
|
575
579
|
protected _rotate3d(x: number, y: number, z: number, rad: number): number[];
|
|
576
580
|
makeRotation(theta: number): this;
|
|
577
|
-
applyToPoint(x: number, y: number): [number, number];
|
|
578
581
|
decompose(pivot?: {
|
|
579
582
|
x: number;
|
|
580
583
|
y: number;
|
|
581
584
|
}, output?: TransformableObject): TransformableObject;
|
|
582
|
-
|
|
585
|
+
apply<P extends Vector2Data = Vector2>(pos: Vector2Data, newPos?: P): P;
|
|
586
|
+
affineInverse(): this;
|
|
587
|
+
applyAffineInverse<P extends Vector2Data = Vector2>(pos: Vector2Data, newPos?: P): P;
|
|
583
588
|
isIdentity(): boolean;
|
|
584
589
|
toObject(): TransformObject;
|
|
585
590
|
}
|
|
@@ -1100,7 +1105,7 @@ declare class WebGLProgramModule extends WebGLModule {
|
|
|
1100
1105
|
boundProgram: WebGLProgram | null;
|
|
1101
1106
|
uniforms: {
|
|
1102
1107
|
projectionMatrix: number[];
|
|
1103
|
-
|
|
1108
|
+
viewMatrix: number[];
|
|
1104
1109
|
};
|
|
1105
1110
|
create(options?: WebGLProgramOptions): WebGLProgram;
|
|
1106
1111
|
getMeta(program: WebGLProgram): WebGLProgramMeta;
|
|
@@ -1457,7 +1462,7 @@ declare class VideoTexture extends Texture2D<HTMLVideoElement> {
|
|
|
1457
1462
|
declare class ViewportTexture extends PixelsTexture {
|
|
1458
1463
|
}
|
|
1459
1464
|
|
|
1460
|
-
type
|
|
1465
|
+
type UvTransform = Transform2D | ((x: number, y: number) => [number, number]);
|
|
1461
1466
|
type VertTransform = Transform2D | (() => Transform2D);
|
|
1462
1467
|
interface CanvasBatchable extends Batchable2D {
|
|
1463
1468
|
type: 'stroke' | 'fill';
|
|
@@ -1468,12 +1473,12 @@ interface StrokeDraw extends Partial<CanvasBatchable> {
|
|
|
1468
1473
|
type: 'stroke';
|
|
1469
1474
|
path: Path2D;
|
|
1470
1475
|
style: LineStyle;
|
|
1471
|
-
uvTransform?:
|
|
1476
|
+
uvTransform?: UvTransform;
|
|
1472
1477
|
}
|
|
1473
1478
|
interface FillDraw extends Partial<CanvasBatchable> {
|
|
1474
1479
|
type: 'fill';
|
|
1475
1480
|
path: Path2D;
|
|
1476
|
-
uvTransform?:
|
|
1481
|
+
uvTransform?: UvTransform;
|
|
1477
1482
|
}
|
|
1478
1483
|
declare class CanvasContext extends Path2D {
|
|
1479
1484
|
fillStyle?: Color$1 | Texture2D;
|
|
@@ -1483,7 +1488,7 @@ declare class CanvasContext extends Path2D {
|
|
|
1483
1488
|
lineJoin?: LineJoin;
|
|
1484
1489
|
lineWidth?: number;
|
|
1485
1490
|
miterLimit?: number;
|
|
1486
|
-
uvTransform?:
|
|
1491
|
+
uvTransform?: UvTransform;
|
|
1487
1492
|
vertTransform?: VertTransform;
|
|
1488
1493
|
protected _defaultStyle: Texture2D<Texture2DSource>;
|
|
1489
1494
|
protected _draws: (StrokeDraw | FillDraw)[];
|
|
@@ -1495,7 +1500,7 @@ declare class CanvasContext extends Path2D {
|
|
|
1495
1500
|
copy(source: CanvasContext): this;
|
|
1496
1501
|
resetStatus(): void;
|
|
1497
1502
|
reset(): this;
|
|
1498
|
-
buildUvs(start: number, vertices: number[], uvs: number[], texture?: Texture2D, uvTransform?:
|
|
1503
|
+
buildUvs(start: number, vertices: number[], uvs: number[], texture?: Texture2D, uvTransform?: UvTransform): void;
|
|
1499
1504
|
toBatchables(): CanvasBatchable[];
|
|
1500
1505
|
}
|
|
1501
1506
|
|
|
@@ -1552,6 +1557,8 @@ declare class Viewport extends Node implements Rectangulable {
|
|
|
1552
1557
|
activateWithCopy(renderer: WebGLRenderer, target: Viewport): void;
|
|
1553
1558
|
render(renderer: WebGLRenderer, next?: () => void): void;
|
|
1554
1559
|
getRect(): Rect2;
|
|
1560
|
+
toCanvasGlobal<P extends Vector2Data = Vector2>(screenPos: Vector2Data, newPos?: P): P;
|
|
1561
|
+
toCanvasScreen<P extends Vector2Data = Vector2>(globalPos: Vector2Data, newPos?: P): P;
|
|
1555
1562
|
}
|
|
1556
1563
|
|
|
1557
1564
|
interface RenderCall {
|
|
@@ -1941,12 +1948,13 @@ declare class Node2D extends CanvasItem {
|
|
|
1941
1948
|
constructor(properties?: Partial<Node2DProperties>, nodes?: Node[]);
|
|
1942
1949
|
protected _updateProperty(key: string, value: any, oldValue: any, declaration?: PropertyDeclaration): void;
|
|
1943
1950
|
getTransformOrigin(): Vector2;
|
|
1944
|
-
|
|
1945
|
-
updateTransform(): void;
|
|
1951
|
+
updateTransform(cb?: (transform: Transform2D) => void): void;
|
|
1946
1952
|
updateGlobalTransform(): void;
|
|
1947
1953
|
protected _transformVertices(vertices: Float32Array, vertTransform?: VertTransform): Float32Array;
|
|
1948
1954
|
protected _relayout(batchables: CanvasBatchable[]): CanvasBatchable[];
|
|
1949
1955
|
protected _process(delta: number): void;
|
|
1956
|
+
toLocal<P extends Vector2Data = Vector2>(globalPos: Vector2Data, newPos?: P): P;
|
|
1957
|
+
toGlobal<P extends Vector2Data = Vector2>(localPos: Vector2Data, newPos?: P): P;
|
|
1950
1958
|
}
|
|
1951
1959
|
|
|
1952
1960
|
interface Camera2DProperties extends Node2DProperties {
|
|
@@ -1977,6 +1985,8 @@ declare class Camera2D extends Node2D {
|
|
|
1977
1985
|
protected _onWheel(e: WheelInputEvent): void;
|
|
1978
1986
|
updateTransform(): void;
|
|
1979
1987
|
updateCanvasTransform(): void;
|
|
1988
|
+
toGlobal<P extends Vector2Data = Vector2>(screenPos: Vector2Data, newPos?: P): P;
|
|
1989
|
+
toScreen<P extends Vector2Data = Vector2>(globalPos: Vector2Data, newPos?: P): P;
|
|
1980
1990
|
}
|
|
1981
1991
|
|
|
1982
1992
|
interface BaseElement2DFill extends NormalizedFill {
|
|
@@ -2088,7 +2098,6 @@ declare class BaseElement2DText extends CoreObject {
|
|
|
2088
2098
|
constructor(parent: BaseElement2D);
|
|
2089
2099
|
setProperties(properties?: Text$1): this;
|
|
2090
2100
|
protected _updateProperty(key: string, value: any, oldValue: any, declaration?: PropertyDeclaration): void;
|
|
2091
|
-
protected _updateText(): void;
|
|
2092
2101
|
setContent(content: TextContent): void;
|
|
2093
2102
|
measure(): MeasureResult;
|
|
2094
2103
|
updateMeasure(): this;
|
|
@@ -2148,10 +2157,10 @@ declare class BaseElement2D extends Node2D implements Rectangulable {
|
|
|
2148
2157
|
protected _updateStyleProperty(key: string, value: any, _oldValue: any, _declaration?: PropertyDeclaration): void;
|
|
2149
2158
|
protected _updateMaskImage(): void;
|
|
2150
2159
|
getTransformOrigin(): Vector2;
|
|
2151
|
-
|
|
2160
|
+
updateTransform(cb?: (transform: Transform2D) => void): void;
|
|
2152
2161
|
updateGlobalTransform(): void;
|
|
2153
2162
|
getRect(): Rect2;
|
|
2154
|
-
protected _getPointArray(): [
|
|
2163
|
+
protected _getPointArray(): Vector2Data[];
|
|
2155
2164
|
getAabb(): Rect2;
|
|
2156
2165
|
getGlobalAabb(): Rect2;
|
|
2157
2166
|
getObb(): {
|
|
@@ -2168,10 +2177,7 @@ declare class BaseElement2D extends Node2D implements Rectangulable {
|
|
|
2168
2177
|
protected _repaint(batchables: CanvasBatchable[]): CanvasBatchable[];
|
|
2169
2178
|
canPointerEvents(): boolean;
|
|
2170
2179
|
input(event: InputEvent, key: InputEventKey): void;
|
|
2171
|
-
protected
|
|
2172
|
-
x: number;
|
|
2173
|
-
y: number;
|
|
2174
|
-
}, key: InputEventKey): boolean;
|
|
2180
|
+
protected _positionInput(localPos: Vector2Data, key: InputEventKey): boolean;
|
|
2175
2181
|
protected _input(event: InputEvent, key: InputEventKey): void;
|
|
2176
2182
|
toJSON(): Record<string, any>;
|
|
2177
2183
|
}
|
|
@@ -3306,4 +3312,4 @@ interface RenderOptions {
|
|
|
3306
3312
|
declare function render(options: RenderOptions): Promise<HTMLCanvasElement>;
|
|
3307
3313
|
|
|
3308
3314
|
export { AnimatedTexture, Animation, Assets, Audio, AudioPipeline, AudioProcessor, AudioSpectrum, AudioWaveform, BaseElement2D, BaseElement2DBackground, BaseElement2DFill, BaseElement2DForeground, BaseElement2DOutline, BaseElement2DShadow, BaseElement2DShape, BaseElement2DStyle, BaseElement2DText, Camera2D, CanvasContext, CanvasItem, CanvasItemEditor, CanvasTexture, Color, ColorAdjustEffect, ColorFilterEffect, ColorMatrix, ColorOverlayEffect, ColorRemoveEffect, ColorReplaceEffect, ColorTexture, Control, CoreObject, DEG_TO_RAD, DEVICE_PIXEL_RATIO, DropShadowEffect, Effect, EffectMaterial, Element2D, Element2DStyle, EmbossEffect, Engine, FlexElement2D, FlexElement2DStyle, FlexLayout, FontLoader, GIFLoader, GaussianBlurEffect, Geometry, GlitchEffect, GodrayEffect, GradientTexture, HTMLAudio, HTMLAudioContext, HTMLSound, IN_BROWSER, Image2D, ImageTexture, IndexBuffer, Input, InputEvent, JSONLoader, KawaseBlurEffect, KawaseTransition, KeyboardInputEvent, LeftEraseTransition, Loader, Lottie2D, LottieLoader, MainLoop, MaskEffect, Material, Matrix, Matrix2, Matrix3, Matrix4, MouseInputEvent, Node, Node2D, OutlineEffect, PI, PI_2, PixelateEffect, PixelsTexture, PointerInputEvent, Projection2D, QuadGeometry, QuadUvGeometry, RAD_TO_DEG, Range, RawWeakMap, Rect2, RefCounted, Renderer, Resource, Ruler, SUPPORTS_AUDIO_CONTEXT, SUPPORTS_CLICK_EVENTS, SUPPORTS_CREATE_IMAGE_BITMAP, SUPPORTS_IMAGE_BITMAP, SUPPORTS_MOUSE_EVENTS, SUPPORTS_OFFLINE_AUDIO_CONTEXT, SUPPORTS_POINTER_EVENTS, SUPPORTS_RESIZE_OBSERVER, SUPPORTS_TOUCH_EVENTS, SUPPORTS_WEBGL2, SUPPORTS_WEBKIT_AUDIO_CONTEXT, SUPPORTS_WEBKIT_OFFLINE_AUDIO_CONTEXT, SUPPORTS_WEB_AUDIO, SUPPORTS_WHEEL_EVENTS, Scaler, SceneTree, ScrollBar, TextLoader, Texture2D, TextureLoader, TextureRect2D, Ticker, TiltShiftTransition, Timeline, TimelineNode, Transform2D, TransformRect2D, Transition, TwistTransition, UvGeometry, UvMaterial, Vector, Vector2, Vector3, Vector4, VertexAttribute, VertexBuffer, Video2D, VideoLoader, VideoTexture, Viewport, ViewportTexture, WebAudio, WebAudioContext, WebGLBatch2DModule, WebGLBlendMode, WebGLBufferModule, WebGLFramebufferModule, WebGLMaskModule, WebGLModule, WebGLProgramModule, WebGLRenderer, WebGLScissorModule, WebGLState, WebGLStateModule, WebGLStencilModule, WebGLTextureModule, WebGLVertexArrayModule, WebGLViewportModule, WebSound, WheelInputEvent, Window, XScrollBar, YScrollBar, ZoomBlurEffect, assets, clamp, clampFrag, createHTMLCanvas, createNode, crossOrigin, cubicBezier, curves, customNode, customNodes, defaultOptions, determineCrossOrigin, ease, easeIn, easeInOut, easeOut, frag, getDefaultCssPropertyValue, isCanvasElement, isElementNode, isImageElement, isPow2, isVideoElement, isWebgl2, lerp, linear, log2, mapWebGLBlendModes, nextPow2, nextTick, parseCSSFilter, parseCSSTransform, parseCSSTransformOrigin, parseCssFunctions, parseCssProperty, render, timingFunctions, uid };
|
|
3309
|
-
export type { AnimationEffectMode, AnimationProperties, AssetHandler, AudioWaveformProperties, BaseElement2DEventMap, BaseElement2DProperties, BaseElement2DStyleProperties, Batchable2D, CSSFilterKey, CSSFilters, Camera2DEventMap, Camera2DProperties, CanvasBatchable, CanvasItemEventMap, CanvasItemProperties, ColorAdjustEffectProperties, ColorFilterEffectProperties, ColorOverlayEffectProperties, ColorRemoveEffectProperties, ColorReplaceEffectProperties, ComputedLayout, ControlEventMap, ControlProperties, CoreObjectEventMap, CssFunction, CssFunctionArg, Cursor, CustomPropertyAccessor, DropShadowEffectProperties, Easing, EffectContext, EffectMode, EffectProperties, Element2DEventMap, Element2DProperties, Element2DStyleProperties, EmbossEffectProperties, EngineOptions, FillDraw, FlexBaseElement2DEventMap, FlexElement2DProperties, FlexElement2DStyleProperties, GaussianBlurEffectProperties, GeometryOptions, GlitchEffectProperties, GodrayEffectProperties, IAudioContext, IAudioNode, IPlayOptions, Image2DProperties, ImageFrame, ImageTextureOptions, IndexBufferOptions, InputEventKey, InputEventMap, InternalMode, KawaseBlurEffectProperties, Keyframe, Lottie2DProperties, MainLoopEventMap, MaskColor, MaskData, MaskEffectProperties, MaskObject, MaskRect, Maskable, MaterialOptions, MatrixLike, MatrixOperateOutput, Node2DEventMap, Node2DProperties, NodeEventMap, NodeProperties, NormalizedKeyframe, OutlineEffectProperties, PixelateEffectProperties, PlatformAudio, PlatformSound, ProcessMode, ProcessSortMode, RangeProperties, Rectangulable, RectangulableEventMap, RefCountedEventMap, RenderMode, RenderOptions, Renderable, ResourceEventMap, RulerProperties, ScalerEventMap, ScalerProperties, SceneTreeEventMap, ScrollBarProperties, StrokeDraw, Texture2DFilterMode, Texture2DPixelsSource, Texture2DSource, Texture2DWrapMode, TextureRect2DProperties, TimelineEventMap, TimelineNodeEventMap, TimelineNodeProperties, TimelineProperties, TimingFunctions, TransformObject, TransformRect2DProperties, TransformableObject, TransitionProperties,
|
|
3315
|
+
export type { AnimationEffectMode, AnimationProperties, AssetHandler, AudioWaveformProperties, BaseElement2DEventMap, BaseElement2DProperties, BaseElement2DStyleProperties, Batchable2D, CSSFilterKey, CSSFilters, Camera2DEventMap, Camera2DProperties, CanvasBatchable, CanvasItemEventMap, CanvasItemProperties, ColorAdjustEffectProperties, ColorFilterEffectProperties, ColorOverlayEffectProperties, ColorRemoveEffectProperties, ColorReplaceEffectProperties, ComputedLayout, ControlEventMap, ControlProperties, CoreObjectEventMap, CssFunction, CssFunctionArg, Cursor, CustomPropertyAccessor, DropShadowEffectProperties, Easing, EffectContext, EffectMode, EffectProperties, Element2DEventMap, Element2DProperties, Element2DStyleProperties, EmbossEffectProperties, EngineOptions, FillDraw, FlexBaseElement2DEventMap, FlexElement2DProperties, FlexElement2DStyleProperties, GaussianBlurEffectProperties, GeometryOptions, GlitchEffectProperties, GodrayEffectProperties, IAudioContext, IAudioNode, IPlayOptions, Image2DProperties, ImageFrame, ImageTextureOptions, IndexBufferOptions, InputEventKey, InputEventMap, InternalMode, KawaseBlurEffectProperties, Keyframe, Lottie2DProperties, MainLoopEventMap, MaskColor, MaskData, MaskEffectProperties, MaskObject, MaskRect, Maskable, MaterialOptions, MatrixLike, MatrixOperateOutput, Node2DEventMap, Node2DProperties, NodeEventMap, NodeProperties, NormalizedKeyframe, OutlineEffectProperties, PixelateEffectProperties, PlatformAudio, PlatformSound, ProcessMode, ProcessSortMode, RangeProperties, Rectangulable, RectangulableEventMap, RefCountedEventMap, RenderMode, RenderOptions, Renderable, ResourceEventMap, RulerProperties, ScalerEventMap, ScalerProperties, SceneTreeEventMap, ScrollBarProperties, StrokeDraw, Texture2DFilterMode, Texture2DPixelsSource, Texture2DSource, Texture2DWrapMode, TextureRect2DProperties, TimelineEventMap, TimelineNodeEventMap, TimelineNodeProperties, TimelineProperties, TimingFunctions, TransformObject, TransformRect2DProperties, TransformableObject, TransitionProperties, UvTransform, Vector2Data, VectorLike, VectorOperateOutput, VertTransform, VertexAttributeOptions, VertexBufferOptions, Video2DProperties, VideoTextureOptions, VideoTextureSource, ViewportEventMap, ViewportFramebuffer, WebGLBufferMeta, WebGLBufferOptions, WebGLBufferTarget, WebGLBufferUsage, WebGLDrawMode, WebGLDrawOptions, WebGLExtensions, WebGLFramebufferMeta, WebGLFramebufferOptions, WebGLProgramMeta, WebGLProgramOptions, WebGLTarget, WebGLTextureFilterMode, WebGLTextureLocation, WebGLTextureMeta, WebGLTextureOptions, WebGLTextureSource, WebGLTextureTarget, WebGLTextureWrapMode, WebGLVertexArrayObjectMeta, WebGLVertexArrayObjectOptions, WebGLVertexAttrib, WebGLVertexAttribType, WebGLViewport, XScrollBarProperties, YScrollBarProperties, ZoomBlurEffectProperties };
|