leafer-draw 1.3.3 → 1.4.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/dist/web.cjs +27 -19
- package/dist/web.cjs.map +1 -0
- package/dist/web.esm.js +28 -20
- package/dist/web.esm.js.map +1 -0
- package/dist/web.esm.min.js +2 -1
- package/dist/web.esm.min.js.map +1 -0
- package/dist/web.js +377 -322
- package/dist/web.js.map +1 -0
- package/dist/web.min.cjs +2 -1
- package/dist/web.min.cjs.map +1 -0
- package/dist/web.min.js +2 -1
- package/dist/web.min.js.map +1 -0
- package/dist/web.module.js +376 -323
- package/dist/web.module.js.map +1 -0
- package/dist/web.module.min.js +2 -1
- package/dist/web.module.min.js.map +1 -0
- package/package.json +7 -7
package/dist/web.cjs
CHANGED
|
@@ -121,7 +121,7 @@ class LeaferCanvas extends core.LeaferCanvasBase {
|
|
|
121
121
|
}
|
|
122
122
|
}
|
|
123
123
|
else {
|
|
124
|
-
window.addEventListener('resize', () => {
|
|
124
|
+
window.addEventListener('resize', this.windowListener = () => {
|
|
125
125
|
const pixelRatio = core.Platform.devicePixelRatio;
|
|
126
126
|
if (this.pixelRatio !== pixelRatio) {
|
|
127
127
|
const { width, height } = this;
|
|
@@ -150,11 +150,9 @@ class LeaferCanvas extends core.LeaferCanvasBase {
|
|
|
150
150
|
}
|
|
151
151
|
stopAutoLayout() {
|
|
152
152
|
this.autoLayout = false;
|
|
153
|
-
this.
|
|
154
|
-
if (this.resizeObserver) {
|
|
153
|
+
if (this.resizeObserver)
|
|
155
154
|
this.resizeObserver.disconnect();
|
|
156
|
-
|
|
157
|
-
}
|
|
155
|
+
this.resizeListener = this.resizeObserver = null;
|
|
158
156
|
}
|
|
159
157
|
emitResize(size) {
|
|
160
158
|
const oldSize = {};
|
|
@@ -175,6 +173,10 @@ class LeaferCanvas extends core.LeaferCanvasBase {
|
|
|
175
173
|
destroy() {
|
|
176
174
|
if (this.view) {
|
|
177
175
|
this.stopAutoLayout();
|
|
176
|
+
if (this.windowListener) {
|
|
177
|
+
window.removeEventListener('resize', this.windowListener);
|
|
178
|
+
this.windowListener = null;
|
|
179
|
+
}
|
|
178
180
|
if (!this.unreal) {
|
|
179
181
|
const view = this.view;
|
|
180
182
|
if (view.parentElement)
|
|
@@ -201,7 +203,10 @@ function useCanvas(_canvasType, _power) {
|
|
|
201
203
|
canvas.height = height;
|
|
202
204
|
return canvas;
|
|
203
205
|
},
|
|
204
|
-
canvasToDataURL: (canvas, type, quality) =>
|
|
206
|
+
canvasToDataURL: (canvas, type, quality) => {
|
|
207
|
+
const imageType = mineType(type), url = canvas.toDataURL(imageType, quality);
|
|
208
|
+
return imageType === 'image/bmp' ? url.replace('image/png;', 'image/bmp;') : url;
|
|
209
|
+
},
|
|
205
210
|
canvasToBolb: (canvas, type, quality) => new Promise((resolve) => canvas.toBlob(resolve, mineType(type), quality)),
|
|
206
211
|
canvasSaveAs: (canvas, filename, quality) => {
|
|
207
212
|
const url = canvas.toDataURL(mineType(fileType(filename)), quality);
|
|
@@ -246,14 +251,14 @@ function useCanvas(_canvasType, _power) {
|
|
|
246
251
|
core.Platform.name = 'web';
|
|
247
252
|
core.Platform.isMobile = 'ontouchstart' in window;
|
|
248
253
|
core.Platform.requestRender = function (render) { window.requestAnimationFrame(render); };
|
|
249
|
-
core.defineKey(core.Platform, 'devicePixelRatio', { get() { return
|
|
254
|
+
core.defineKey(core.Platform, 'devicePixelRatio', { get() { return devicePixelRatio; } });
|
|
250
255
|
const { userAgent } = navigator;
|
|
251
256
|
if (userAgent.indexOf("Firefox") > -1) {
|
|
252
257
|
core.Platform.conicGradientRotate90 = true;
|
|
253
258
|
core.Platform.intWheelDeltaY = true;
|
|
254
259
|
core.Platform.syncDomFont = true;
|
|
255
260
|
}
|
|
256
|
-
else if (userAgent.indexOf("
|
|
261
|
+
else if (userAgent.indexOf("AppleWebKit") > -1) {
|
|
257
262
|
core.Platform.fullImageShadow = true;
|
|
258
263
|
}
|
|
259
264
|
if (userAgent.indexOf('Windows') > -1) {
|
|
@@ -522,7 +527,7 @@ class Layouter {
|
|
|
522
527
|
}
|
|
523
528
|
partLayout() {
|
|
524
529
|
var _a;
|
|
525
|
-
if (!((_a = this.__updatedList) === null || _a ===
|
|
530
|
+
if (!((_a = this.__updatedList) === null || _a === void 0 ? void 0 : _a.length))
|
|
526
531
|
return;
|
|
527
532
|
const t = core.Run.start('PartLayout');
|
|
528
533
|
const { target, __updatedList: updateList } = this;
|
|
@@ -1212,7 +1217,7 @@ function getPatternData(paint, box, image) {
|
|
|
1212
1217
|
box = tempBox.set(box).shrink(paint.padding);
|
|
1213
1218
|
if (paint.mode === 'strench')
|
|
1214
1219
|
paint.mode = 'stretch';
|
|
1215
|
-
const { opacity, mode, align, offset, scale, size, rotation, repeat } = paint;
|
|
1220
|
+
const { opacity, mode, align, offset, scale, size, rotation, repeat, filters } = paint;
|
|
1216
1221
|
const sameBox = box.width === width && box.height === height;
|
|
1217
1222
|
const data = { mode };
|
|
1218
1223
|
const swapSize = align !== 'center' && (rotation || 0) % 180 === 90;
|
|
@@ -1275,6 +1280,8 @@ function getPatternData(paint, box, image) {
|
|
|
1275
1280
|
data.height = height;
|
|
1276
1281
|
if (opacity)
|
|
1277
1282
|
data.opacity = opacity;
|
|
1283
|
+
if (filters)
|
|
1284
|
+
data.filters = filters;
|
|
1278
1285
|
if (repeat)
|
|
1279
1286
|
data.repeat = typeof repeat === 'string' ? (repeat === 'x' ? 'repeat-x' : 'repeat-y') : 'repeat';
|
|
1280
1287
|
return data;
|
|
@@ -1377,7 +1384,7 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1377
1384
|
scaleX = abs$1(scaleX);
|
|
1378
1385
|
scaleY = abs$1(scaleY);
|
|
1379
1386
|
const { image, data } = paint;
|
|
1380
|
-
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy,
|
|
1387
|
+
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, transform, repeat } = data;
|
|
1381
1388
|
if (sx) {
|
|
1382
1389
|
imageMatrix = get$1();
|
|
1383
1390
|
copy$1(imageMatrix, transform);
|
|
@@ -1420,7 +1427,7 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1420
1427
|
}
|
|
1421
1428
|
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
1422
1429
|
}
|
|
1423
|
-
const canvas = image.getCanvas(ceil(width) || 1, ceil(height) || 1, opacity);
|
|
1430
|
+
const canvas = image.getCanvas(ceil(width) || 1, ceil(height) || 1, data.opacity, data.filters);
|
|
1424
1431
|
const pattern = image.getPattern(canvas, repeat || (core.Platform.origin.noRepeat || 'no-repeat'), imageMatrix, paint);
|
|
1425
1432
|
paint.style = pattern;
|
|
1426
1433
|
paint.patternId = id;
|
|
@@ -1496,7 +1503,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1496
1503
|
canvas.opacity *= data.opacity;
|
|
1497
1504
|
if (data.transform)
|
|
1498
1505
|
canvas.transform(data.transform);
|
|
1499
|
-
canvas.drawImage(paint.image.
|
|
1506
|
+
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1500
1507
|
canvas.restore();
|
|
1501
1508
|
return true;
|
|
1502
1509
|
}
|
|
@@ -1506,7 +1513,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1506
1513
|
}
|
|
1507
1514
|
else {
|
|
1508
1515
|
if (!paint.patternTask) {
|
|
1509
|
-
paint.patternTask = core.ImageManager.patternTasker.add(() => __awaiter(this,
|
|
1516
|
+
paint.patternTask = core.ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function* () {
|
|
1510
1517
|
paint.patternTask = null;
|
|
1511
1518
|
if (canvas.bounds.hit(ui.__nowWorld))
|
|
1512
1519
|
createPattern(ui, paint, pixelRatio);
|
|
@@ -2096,11 +2103,11 @@ const TextMode = 2;
|
|
|
2096
2103
|
function layoutChar(drawData, style, width, _height) {
|
|
2097
2104
|
const { rows } = drawData;
|
|
2098
2105
|
const { textAlign, paraIndent, letterSpacing } = style;
|
|
2099
|
-
let charX, addWordWidth, indentWidth, mode, wordChar;
|
|
2106
|
+
let charX, addWordWidth, indentWidth, mode, wordChar, wordsLength;
|
|
2100
2107
|
rows.forEach(row => {
|
|
2101
2108
|
if (row.words) {
|
|
2102
|
-
indentWidth = paraIndent && row.paraStart ? paraIndent : 0;
|
|
2103
|
-
addWordWidth = (width && (textAlign === 'justify' || textAlign === 'both') &&
|
|
2109
|
+
indentWidth = paraIndent && row.paraStart ? paraIndent : 0, wordsLength = row.words.length;
|
|
2110
|
+
addWordWidth = (width && (textAlign === 'justify' || textAlign === 'both') && wordsLength > 1) ? (width - row.width - indentWidth) / (wordsLength - 1) : 0;
|
|
2104
2111
|
mode = (letterSpacing || row.isOverflow) ? CharMode : (addWordWidth > 0.01 ? WordMode : TextMode);
|
|
2105
2112
|
if (row.isOverflow && !letterSpacing)
|
|
2106
2113
|
row.textMode = true;
|
|
@@ -2112,7 +2119,7 @@ function layoutChar(drawData, style, width, _height) {
|
|
|
2112
2119
|
row.x += indentWidth;
|
|
2113
2120
|
charX = row.x;
|
|
2114
2121
|
row.data = [];
|
|
2115
|
-
row.words.forEach(word => {
|
|
2122
|
+
row.words.forEach((word, index) => {
|
|
2116
2123
|
if (mode === WordMode) {
|
|
2117
2124
|
wordChar = { char: '', x: charX };
|
|
2118
2125
|
charX = toWordChar(word.data, charX, wordChar);
|
|
@@ -2122,7 +2129,7 @@ function layoutChar(drawData, style, width, _height) {
|
|
|
2122
2129
|
else {
|
|
2123
2130
|
charX = toChar(word.data, charX, row.data, row.isOverflow);
|
|
2124
2131
|
}
|
|
2125
|
-
if (addWordWidth && (!row.paraEnd || textAlign === 'both')) {
|
|
2132
|
+
if (addWordWidth && (!row.paraEnd || textAlign === 'both') && (index !== wordsLength - 1)) {
|
|
2126
2133
|
charX += addWordWidth;
|
|
2127
2134
|
row.width += addWordWidth;
|
|
2128
2135
|
}
|
|
@@ -2394,3 +2401,4 @@ Object.keys(draw).forEach(function (k) {
|
|
|
2394
2401
|
get: function () { return draw[k]; }
|
|
2395
2402
|
});
|
|
2396
2403
|
});
|
|
2404
|
+
//# sourceMappingURL=web.cjs.map
|