@leafer-ui/node 1.6.7 → 1.8.0
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/node.cjs +194 -150
- package/dist/node.esm.js +195 -151
- package/dist/node.esm.min.js +1 -1
- package/dist/node.esm.min.js.map +1 -1
- package/dist/node.min.cjs +1 -1
- package/dist/node.min.cjs.map +1 -1
- package/package.json +12 -12
package/dist/node.cjs
CHANGED
|
@@ -868,9 +868,14 @@ function fills(fills, ui, canvas) {
|
|
|
868
868
|
}
|
|
869
869
|
}
|
|
870
870
|
canvas.fillStyle = item.style;
|
|
871
|
-
if (item.transform) {
|
|
871
|
+
if (item.transform || item.scaleFixed) {
|
|
872
872
|
canvas.save();
|
|
873
|
-
|
|
873
|
+
if (item.transform)
|
|
874
|
+
canvas.transform(item.transform);
|
|
875
|
+
if (item.scaleFixed) {
|
|
876
|
+
const { scaleX, scaleY } = ui.getRenderScaleData(true);
|
|
877
|
+
canvas.scale(1 / scaleX, 1 / scaleY);
|
|
878
|
+
}
|
|
874
879
|
if (item.blendMode)
|
|
875
880
|
canvas.blendMode = item.blendMode;
|
|
876
881
|
fillPathOrText(ui, canvas);
|
|
@@ -906,8 +911,13 @@ function strokeText(stroke, ui, canvas) {
|
|
|
906
911
|
}
|
|
907
912
|
function drawCenter$1(stroke, strokeWidthScale, ui, canvas) {
|
|
908
913
|
const data = ui.__;
|
|
909
|
-
|
|
910
|
-
|
|
914
|
+
if (typeof stroke === 'object') {
|
|
915
|
+
drawStrokesStyle(stroke, strokeWidthScale, true, ui, canvas);
|
|
916
|
+
}
|
|
917
|
+
else {
|
|
918
|
+
canvas.setStroke(stroke, data.__strokeWidth * strokeWidthScale, data);
|
|
919
|
+
drawTextStroke(ui, canvas);
|
|
920
|
+
}
|
|
911
921
|
}
|
|
912
922
|
function drawAlign(stroke, align, ui, canvas) {
|
|
913
923
|
const out = canvas.getSameCanvas(true, true);
|
|
@@ -916,15 +926,9 @@ function drawAlign(stroke, align, ui, canvas) {
|
|
|
916
926
|
out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
|
|
917
927
|
fillText(ui, out);
|
|
918
928
|
out.blendMode = 'normal';
|
|
919
|
-
|
|
929
|
+
core.LeafHelper.copyCanvasByWorld(ui, canvas, out);
|
|
920
930
|
out.recycle(ui.__nowWorld);
|
|
921
931
|
}
|
|
922
|
-
function copyWorld(canvas, out, ui) {
|
|
923
|
-
if (ui.__worldFlipped || core.Platform.fullImageShadow)
|
|
924
|
-
canvas.copyWorldByReset(out, ui.__nowWorld);
|
|
925
|
-
else
|
|
926
|
-
canvas.copyWorldToInner(out, ui.__nowWorld, ui.__layout.renderBounds);
|
|
927
|
-
}
|
|
928
932
|
function drawTextStroke(ui, canvas) {
|
|
929
933
|
let row, data = ui.__.__textDrawData;
|
|
930
934
|
const { rows, decorationY } = data;
|
|
@@ -940,14 +944,21 @@ function drawTextStroke(ui, canvas) {
|
|
|
940
944
|
rows.forEach(row => decorationY.forEach(value => canvas.strokeRect(row.x, row.y + value, row.width, decorationHeight)));
|
|
941
945
|
}
|
|
942
946
|
}
|
|
943
|
-
function drawStrokesStyle(strokes, isText, ui, canvas) {
|
|
947
|
+
function drawStrokesStyle(strokes, strokeWidthScale, isText, ui, canvas) {
|
|
944
948
|
let item;
|
|
949
|
+
const data = ui.__, { __hasMultiStrokeStyle } = data;
|
|
950
|
+
__hasMultiStrokeStyle || canvas.setStroke(undefined, data.__strokeWidth * strokeWidthScale, data);
|
|
945
951
|
for (let i = 0, len = strokes.length; i < len; i++) {
|
|
946
952
|
item = strokes[i];
|
|
947
953
|
if (item.image && draw.PaintImage.checkImage(ui, canvas, item, false))
|
|
948
954
|
continue;
|
|
949
955
|
if (item.style) {
|
|
950
|
-
|
|
956
|
+
if (__hasMultiStrokeStyle) {
|
|
957
|
+
const { strokeStyle } = item;
|
|
958
|
+
strokeStyle ? canvas.setStroke(item.style, data.__getRealStrokeWidth(strokeStyle) * strokeWidthScale, data, strokeStyle) : canvas.setStroke(item.style, data.__strokeWidth * strokeWidthScale, data);
|
|
959
|
+
}
|
|
960
|
+
else
|
|
961
|
+
canvas.strokeStyle = item.style;
|
|
951
962
|
if (item.blendMode) {
|
|
952
963
|
canvas.saveBlendMode(item.blendMode);
|
|
953
964
|
isText ? drawTextStroke(ui, canvas) : canvas.stroke();
|
|
@@ -986,8 +997,13 @@ function strokes(strokes, ui, canvas) {
|
|
|
986
997
|
}
|
|
987
998
|
function drawCenter(stroke, strokeWidthScale, ui, canvas) {
|
|
988
999
|
const data = ui.__;
|
|
989
|
-
|
|
990
|
-
|
|
1000
|
+
if (typeof stroke === 'object') {
|
|
1001
|
+
drawStrokesStyle(stroke, strokeWidthScale, false, ui, canvas);
|
|
1002
|
+
}
|
|
1003
|
+
else {
|
|
1004
|
+
canvas.setStroke(stroke, data.__strokeWidth * strokeWidthScale, data);
|
|
1005
|
+
canvas.stroke();
|
|
1006
|
+
}
|
|
991
1007
|
if (data.__useArrow)
|
|
992
1008
|
draw.Paint.strokeArrow(stroke, ui, canvas);
|
|
993
1009
|
}
|
|
@@ -1009,7 +1025,7 @@ function drawOutside(stroke, ui, canvas) {
|
|
|
1009
1025
|
drawCenter(stroke, 2, ui, out);
|
|
1010
1026
|
out.clipUI(data);
|
|
1011
1027
|
out.clearWorld(renderBounds);
|
|
1012
|
-
|
|
1028
|
+
core.LeafHelper.copyCanvasByWorld(ui, canvas, out);
|
|
1013
1029
|
out.recycle(ui.__nowWorld);
|
|
1014
1030
|
}
|
|
1015
1031
|
}
|
|
@@ -1064,8 +1080,16 @@ function compute(attrName, ui) {
|
|
|
1064
1080
|
if (!(paints instanceof Array))
|
|
1065
1081
|
paints = [paints];
|
|
1066
1082
|
recycleMap = draw.PaintImage.recycleImage(attrName, data);
|
|
1083
|
+
let maxChildStrokeWidth;
|
|
1067
1084
|
for (let i = 0, len = paints.length, item; i < len; i++) {
|
|
1068
|
-
(item = getLeafPaint(attrName, paints[i], ui))
|
|
1085
|
+
if (item = getLeafPaint(attrName, paints[i], ui)) {
|
|
1086
|
+
leafPaints.push(item);
|
|
1087
|
+
if (item.strokeStyle) {
|
|
1088
|
+
maxChildStrokeWidth || (maxChildStrokeWidth = 1);
|
|
1089
|
+
if (item.strokeStyle.strokeWidth)
|
|
1090
|
+
maxChildStrokeWidth = Math.max(maxChildStrokeWidth, item.strokeStyle.strokeWidth);
|
|
1091
|
+
}
|
|
1092
|
+
}
|
|
1069
1093
|
}
|
|
1070
1094
|
data['_' + attrName] = leafPaints.length ? leafPaints : undefined;
|
|
1071
1095
|
if (leafPaints.length) {
|
|
@@ -1082,6 +1106,7 @@ function compute(attrName, ui) {
|
|
|
1082
1106
|
else {
|
|
1083
1107
|
stintSet(data, '__isAlphaPixelStroke', isAlphaPixel);
|
|
1084
1108
|
stintSet(data, '__isTransparentStroke', isTransparent);
|
|
1109
|
+
stintSet(data, '__hasMultiStrokeStyle', maxChildStrokeWidth);
|
|
1085
1110
|
}
|
|
1086
1111
|
}
|
|
1087
1112
|
function getLeafPaint(attrName, paint, ui) {
|
|
@@ -1113,6 +1138,11 @@ function getLeafPaint(attrName, paint, ui) {
|
|
|
1113
1138
|
if (data) {
|
|
1114
1139
|
if (typeof data.style === 'string' && hasTransparent$1(data.style))
|
|
1115
1140
|
data.isTransparent = true;
|
|
1141
|
+
if (paint.style) {
|
|
1142
|
+
if (paint.style.strokeWidth === 0)
|
|
1143
|
+
return undefined;
|
|
1144
|
+
data.strokeStyle = paint.style;
|
|
1145
|
+
}
|
|
1116
1146
|
if (paint.blendMode)
|
|
1117
1147
|
data.blendMode = paint.blendMode;
|
|
1118
1148
|
}
|
|
@@ -1132,8 +1162,8 @@ const PaintModule = {
|
|
|
1132
1162
|
shape
|
|
1133
1163
|
};
|
|
1134
1164
|
|
|
1135
|
-
let origin = {};
|
|
1136
|
-
const { get: get$3, rotateOfOuter: rotateOfOuter$1, translate: translate$1, scaleOfOuter: scaleOfOuter$1, scale: scaleHelper, rotate } = core.MatrixHelper;
|
|
1165
|
+
let origin = {}, tempMatrix = core.getMatrixData();
|
|
1166
|
+
const { get: get$3, rotateOfOuter: rotateOfOuter$1, translate: translate$1, scaleOfOuter: scaleOfOuter$1, multiplyParent, scale: scaleHelper, rotate, skew: skewHelper } = core.MatrixHelper;
|
|
1137
1167
|
function fillOrFitMode(data, box, x, y, scaleX, scaleY, rotation) {
|
|
1138
1168
|
const transform = get$3();
|
|
1139
1169
|
translate$1(transform, box.x + x, box.y + y);
|
|
@@ -1142,13 +1172,19 @@ function fillOrFitMode(data, box, x, y, scaleX, scaleY, rotation) {
|
|
|
1142
1172
|
rotateOfOuter$1(transform, { x: box.x + box.width / 2, y: box.y + box.height / 2 }, rotation);
|
|
1143
1173
|
data.transform = transform;
|
|
1144
1174
|
}
|
|
1145
|
-
function clipMode(data, box, x, y, scaleX, scaleY, rotation) {
|
|
1175
|
+
function clipMode(data, box, x, y, scaleX, scaleY, rotation, skew, clipSize) {
|
|
1146
1176
|
const transform = get$3();
|
|
1147
|
-
translate$1(transform, box.x + x, box.y + y);
|
|
1148
|
-
if (scaleX)
|
|
1149
|
-
scaleHelper(transform, scaleX, scaleY);
|
|
1150
1177
|
if (rotation)
|
|
1151
1178
|
rotate(transform, rotation);
|
|
1179
|
+
if (skew)
|
|
1180
|
+
skewHelper(transform, skew.x, skew.y);
|
|
1181
|
+
if (scaleX)
|
|
1182
|
+
scaleHelper(transform, scaleX, scaleY);
|
|
1183
|
+
translate$1(transform, box.x + x, box.y + y);
|
|
1184
|
+
if (clipSize) {
|
|
1185
|
+
tempMatrix.a = box.width / clipSize.width, tempMatrix.d = box.height / clipSize.height;
|
|
1186
|
+
multiplyParent(transform, tempMatrix);
|
|
1187
|
+
}
|
|
1152
1188
|
data.transform = transform;
|
|
1153
1189
|
}
|
|
1154
1190
|
function repeatMode(data, box, width, height, x, y, scaleX, scaleY, rotation, align) {
|
|
@@ -1185,11 +1221,15 @@ const tempBox = new core.Bounds();
|
|
|
1185
1221
|
const tempScaleData = {};
|
|
1186
1222
|
const tempImage = {};
|
|
1187
1223
|
function createData(leafPaint, image, paint, box) {
|
|
1188
|
-
const { changeful, sync } = paint;
|
|
1224
|
+
const { changeful, sync, editing, scaleFixed } = paint;
|
|
1189
1225
|
if (changeful)
|
|
1190
1226
|
leafPaint.changeful = changeful;
|
|
1191
1227
|
if (sync)
|
|
1192
1228
|
leafPaint.sync = sync;
|
|
1229
|
+
if (editing)
|
|
1230
|
+
leafPaint.editing = editing;
|
|
1231
|
+
if (scaleFixed)
|
|
1232
|
+
leafPaint.scaleFixed = scaleFixed;
|
|
1193
1233
|
leafPaint.data = getPatternData(paint, box, image);
|
|
1194
1234
|
}
|
|
1195
1235
|
function getPatternData(paint, box, image) {
|
|
@@ -1198,7 +1238,7 @@ function getPatternData(paint, box, image) {
|
|
|
1198
1238
|
if (paint.mode === 'strench')
|
|
1199
1239
|
paint.mode = 'stretch';
|
|
1200
1240
|
let { width, height } = image;
|
|
1201
|
-
const { opacity, mode, align, offset, scale, size, rotation, repeat, filters } = paint;
|
|
1241
|
+
const { opacity, mode, align, offset, scale, size, rotation, skew, clipSize, repeat, filters } = paint;
|
|
1202
1242
|
const sameBox = box.width === width && box.height === height;
|
|
1203
1243
|
const data = { mode };
|
|
1204
1244
|
const swapSize = align !== 'center' && (rotation || 0) % 180 === 90;
|
|
@@ -1232,8 +1272,8 @@ function getPatternData(paint, box, image) {
|
|
|
1232
1272
|
break;
|
|
1233
1273
|
case 'normal':
|
|
1234
1274
|
case 'clip':
|
|
1235
|
-
if (tempImage.x || tempImage.y || scaleX || rotation)
|
|
1236
|
-
clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation);
|
|
1275
|
+
if (tempImage.x || tempImage.y || scaleX || clipSize || rotation || skew)
|
|
1276
|
+
clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, paint.clipSize);
|
|
1237
1277
|
break;
|
|
1238
1278
|
case 'repeat':
|
|
1239
1279
|
if (!sameBox || scaleX || rotation)
|
|
@@ -1310,11 +1350,11 @@ function image(ui, attrName, paint, boxBounds, firstUse) {
|
|
|
1310
1350
|
}
|
|
1311
1351
|
onLoadSuccess(ui, event);
|
|
1312
1352
|
}
|
|
1313
|
-
leafPaint.loadId =
|
|
1353
|
+
leafPaint.loadId = undefined;
|
|
1314
1354
|
}, (error) => {
|
|
1315
1355
|
ignoreRender(ui, false);
|
|
1316
1356
|
onLoadError(ui, event, error);
|
|
1317
|
-
leafPaint.loadId =
|
|
1357
|
+
leafPaint.loadId = undefined;
|
|
1318
1358
|
});
|
|
1319
1359
|
if (ui.placeholderColor) {
|
|
1320
1360
|
if (!ui.placeholderDelay)
|
|
@@ -1370,16 +1410,16 @@ function ignoreRender(ui, value) {
|
|
|
1370
1410
|
}
|
|
1371
1411
|
|
|
1372
1412
|
const { get: get$1, scale, copy: copy$1 } = core.MatrixHelper;
|
|
1373
|
-
const { ceil, abs
|
|
1413
|
+
const { ceil, abs } = Math;
|
|
1374
1414
|
function createPattern(ui, paint, pixelRatio) {
|
|
1375
|
-
let { scaleX, scaleY } =
|
|
1415
|
+
let { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed);
|
|
1376
1416
|
const id = scaleX + '-' + scaleY + '-' + pixelRatio;
|
|
1377
1417
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
1378
|
-
scaleX = abs$1(scaleX);
|
|
1379
|
-
scaleY = abs$1(scaleY);
|
|
1380
1418
|
const { image, data } = paint;
|
|
1381
1419
|
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, transform, repeat } = data;
|
|
1382
1420
|
if (sx) {
|
|
1421
|
+
sx = abs(sx);
|
|
1422
|
+
sy = abs(sy);
|
|
1383
1423
|
imageMatrix = get$1();
|
|
1384
1424
|
copy$1(imageMatrix, transform);
|
|
1385
1425
|
scale(imageMatrix, 1 / sx, 1 / sy);
|
|
@@ -1432,9 +1472,8 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1432
1472
|
}
|
|
1433
1473
|
}
|
|
1434
1474
|
|
|
1435
|
-
const { abs } = Math;
|
|
1436
1475
|
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1437
|
-
const { scaleX, scaleY } =
|
|
1476
|
+
const { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed);
|
|
1438
1477
|
const { pixelRatio } = canvas, { data } = paint;
|
|
1439
1478
|
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1440
1479
|
return false;
|
|
@@ -1447,8 +1486,8 @@ function checkImage(ui, canvas, paint, allowDraw) {
|
|
|
1447
1486
|
else {
|
|
1448
1487
|
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1449
1488
|
let { width, height } = data;
|
|
1450
|
-
width *=
|
|
1451
|
-
height *=
|
|
1489
|
+
width *= scaleX * pixelRatio;
|
|
1490
|
+
height *= scaleY * pixelRatio;
|
|
1452
1491
|
if (data.scaleX) {
|
|
1453
1492
|
width *= data.scaleX;
|
|
1454
1493
|
height *= data.scaleY;
|
|
@@ -1458,6 +1497,10 @@ function checkImage(ui, canvas, paint, allowDraw) {
|
|
|
1458
1497
|
}
|
|
1459
1498
|
}
|
|
1460
1499
|
if (allowDraw) {
|
|
1500
|
+
if (ui.__.__isFastShadow) {
|
|
1501
|
+
canvas.fillStyle = paint.style || '#000';
|
|
1502
|
+
canvas.fill();
|
|
1503
|
+
}
|
|
1461
1504
|
drawImage(ui, canvas, paint, data);
|
|
1462
1505
|
return true;
|
|
1463
1506
|
}
|
|
@@ -1646,10 +1689,7 @@ function shadow(ui, current, shape) {
|
|
|
1646
1689
|
}
|
|
1647
1690
|
worldCanvas ? other.copyWorld(worldCanvas, nowWorld, nowWorld, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
|
|
1648
1691
|
}
|
|
1649
|
-
|
|
1650
|
-
current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
|
|
1651
|
-
else
|
|
1652
|
-
current.copyWorldToInner(other, copyBounds, __layout.renderBounds, item.blendMode);
|
|
1692
|
+
core.LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
|
|
1653
1693
|
if (end && index < end)
|
|
1654
1694
|
other.clearWorld(copyBounds, true);
|
|
1655
1695
|
});
|
|
@@ -1708,10 +1748,7 @@ function innerShadow(ui, current, shape) {
|
|
|
1708
1748
|
copyBounds = bounds;
|
|
1709
1749
|
}
|
|
1710
1750
|
other.fillWorld(copyBounds, draw.ColorConvert.string(item.color), 'source-in');
|
|
1711
|
-
|
|
1712
|
-
current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
|
|
1713
|
-
else
|
|
1714
|
-
current.copyWorldToInner(other, copyBounds, __layout.renderBounds, item.blendMode);
|
|
1751
|
+
core.LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
|
|
1715
1752
|
if (end && index < end)
|
|
1716
1753
|
other.clearWorld(copyBounds, true);
|
|
1717
1754
|
});
|
|
@@ -1767,12 +1804,11 @@ draw.Group.prototype.__renderMask = function (canvas, options) {
|
|
|
1767
1804
|
contentCanvas = getCanvas(canvas);
|
|
1768
1805
|
child.__render(maskCanvas, options);
|
|
1769
1806
|
}
|
|
1770
|
-
if (
|
|
1771
|
-
|
|
1772
|
-
}
|
|
1773
|
-
if (excludeRenderBounds(child, options))
|
|
1807
|
+
if (mask === 'clipping' || mask === 'clipping-path')
|
|
1808
|
+
excludeRenderBounds(child, options) || child.__render(canvas, options);
|
|
1774
1809
|
continue;
|
|
1775
|
-
|
|
1810
|
+
}
|
|
1811
|
+
excludeRenderBounds(child, options) || child.__render(contentCanvas || canvas, options);
|
|
1776
1812
|
}
|
|
1777
1813
|
maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity);
|
|
1778
1814
|
};
|
|
@@ -2366,123 +2402,131 @@ function getTrimBounds(canvas) {
|
|
|
2366
2402
|
index++;
|
|
2367
2403
|
}
|
|
2368
2404
|
const bounds = new draw.Bounds();
|
|
2369
|
-
|
|
2370
|
-
|
|
2405
|
+
if (pointBounds) {
|
|
2406
|
+
toBounds(pointBounds, bounds);
|
|
2407
|
+
bounds.scale(1 / canvas.pixelRatio).ceil();
|
|
2408
|
+
}
|
|
2409
|
+
return bounds;
|
|
2371
2410
|
}
|
|
2372
2411
|
|
|
2373
2412
|
const ExportModule = {
|
|
2374
2413
|
syncExport(leaf, filename, options) {
|
|
2375
|
-
|
|
2414
|
+
draw.Export.running = true;
|
|
2376
2415
|
let result;
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2383
|
-
|
|
2384
|
-
|
|
2385
|
-
|
|
2386
|
-
else if (fileType === 'svg') {
|
|
2387
|
-
isDownload && download(toURL(leaf.toSVG(), 'svg'), filename);
|
|
2388
|
-
result = { data: isDownload ? true : leaf.toSVG() };
|
|
2389
|
-
}
|
|
2390
|
-
else {
|
|
2391
|
-
let renderBounds, trimBounds, scaleX = 1, scaleY = 1;
|
|
2392
|
-
const { worldTransform, isLeafer, leafer, isFrame } = leaf;
|
|
2393
|
-
const { slice, clip, trim, screenshot, padding, onCanvas } = options;
|
|
2394
|
-
const smooth = options.smooth === undefined ? (leafer ? leafer.config.smooth : true) : options.smooth;
|
|
2395
|
-
const contextSettings = options.contextSettings || (leafer ? leafer.config.contextSettings : undefined);
|
|
2396
|
-
const fill = (isLeafer && screenshot) ? (options.fill === undefined ? leaf.fill : options.fill) : options.fill;
|
|
2397
|
-
const needFill = draw.FileHelper.isOpaqueImage(filename) || fill, matrix = new draw.Matrix();
|
|
2398
|
-
if (screenshot) {
|
|
2399
|
-
renderBounds = screenshot === true ? (isLeafer ? leafer.canvas.bounds : leaf.worldRenderBounds) : screenshot;
|
|
2400
|
-
}
|
|
2401
|
-
else {
|
|
2402
|
-
let relative = options.relative || (isLeafer ? 'inner' : 'local');
|
|
2403
|
-
scaleX = worldTransform.scaleX;
|
|
2404
|
-
scaleY = worldTransform.scaleY;
|
|
2405
|
-
switch (relative) {
|
|
2406
|
-
case 'inner':
|
|
2407
|
-
matrix.set(worldTransform);
|
|
2408
|
-
break;
|
|
2409
|
-
case 'local':
|
|
2410
|
-
matrix.set(worldTransform).divide(leaf.localTransform);
|
|
2411
|
-
scaleX /= leaf.scaleX;
|
|
2412
|
-
scaleY /= leaf.scaleY;
|
|
2413
|
-
break;
|
|
2414
|
-
case 'world':
|
|
2415
|
-
scaleX = 1;
|
|
2416
|
-
scaleY = 1;
|
|
2417
|
-
break;
|
|
2418
|
-
case 'page':
|
|
2419
|
-
relative = leafer || leaf;
|
|
2420
|
-
default:
|
|
2421
|
-
matrix.set(worldTransform).divide(leaf.getTransform(relative));
|
|
2422
|
-
const l = relative.worldTransform;
|
|
2423
|
-
scaleX /= scaleX / l.scaleX;
|
|
2424
|
-
scaleY /= scaleY / l.scaleY;
|
|
2425
|
-
}
|
|
2426
|
-
renderBounds = leaf.getBounds('render', relative);
|
|
2416
|
+
try {
|
|
2417
|
+
const fileType = draw.FileHelper.fileType(filename);
|
|
2418
|
+
const isDownload = filename.includes('.');
|
|
2419
|
+
options = draw.FileHelper.getExportOptions(options);
|
|
2420
|
+
const { toURL } = draw.Platform;
|
|
2421
|
+
const { download } = draw.Platform.origin;
|
|
2422
|
+
if (fileType === 'json') {
|
|
2423
|
+
isDownload && download(toURL(JSON.stringify(leaf.toJSON(options.json)), 'text'), filename);
|
|
2424
|
+
result = { data: isDownload ? true : leaf.toJSON(options.json) };
|
|
2427
2425
|
}
|
|
2428
|
-
|
|
2429
|
-
|
|
2430
|
-
|
|
2431
|
-
let { x, y, width, height } = new draw.Bounds(renderBounds).scale(scaleData.scaleX, scaleData.scaleY);
|
|
2432
|
-
if (clip)
|
|
2433
|
-
x += clip.x, y += clip.y, width = clip.width, height = clip.height;
|
|
2434
|
-
const renderOptions = { exporting: true, matrix: matrix.scale(1 / scaleData.scaleX, 1 / scaleData.scaleY).invert().translate(-x, -y).withScale(1 / scaleX * scaleData.scaleX, 1 / scaleY * scaleData.scaleY) };
|
|
2435
|
-
let canvas = draw.Creator.canvas({ width: Math.floor(width), height: Math.floor(height), pixelRatio, smooth, contextSettings });
|
|
2436
|
-
let sliceLeaf;
|
|
2437
|
-
if (slice) {
|
|
2438
|
-
sliceLeaf = leaf;
|
|
2439
|
-
sliceLeaf.__worldOpacity = 0;
|
|
2440
|
-
leaf = leafer || leaf;
|
|
2441
|
-
renderOptions.bounds = canvas.bounds;
|
|
2442
|
-
}
|
|
2443
|
-
canvas.save();
|
|
2444
|
-
if (isFrame && fill !== undefined) {
|
|
2445
|
-
const oldFill = leaf.get('fill');
|
|
2446
|
-
leaf.fill = '';
|
|
2447
|
-
leaf.__render(canvas, renderOptions);
|
|
2448
|
-
leaf.fill = oldFill;
|
|
2426
|
+
else if (fileType === 'svg') {
|
|
2427
|
+
isDownload && download(toURL(leaf.toSVG(), 'svg'), filename);
|
|
2428
|
+
result = { data: isDownload ? true : leaf.toSVG() };
|
|
2449
2429
|
}
|
|
2450
2430
|
else {
|
|
2451
|
-
|
|
2452
|
-
|
|
2453
|
-
|
|
2454
|
-
|
|
2455
|
-
|
|
2456
|
-
|
|
2457
|
-
|
|
2458
|
-
|
|
2459
|
-
|
|
2460
|
-
|
|
2461
|
-
|
|
2462
|
-
|
|
2463
|
-
|
|
2464
|
-
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
|
|
2431
|
+
let renderBounds, trimBounds, scaleX = 1, scaleY = 1;
|
|
2432
|
+
const { worldTransform, isLeafer, leafer, isFrame } = leaf;
|
|
2433
|
+
const { slice, clip, trim, screenshot, padding, onCanvas } = options;
|
|
2434
|
+
const smooth = options.smooth === undefined ? (leafer ? leafer.config.smooth : true) : options.smooth;
|
|
2435
|
+
const contextSettings = options.contextSettings || (leafer ? leafer.config.contextSettings : undefined);
|
|
2436
|
+
const fill = (isLeafer && screenshot) ? (options.fill === undefined ? leaf.fill : options.fill) : options.fill;
|
|
2437
|
+
const needFill = draw.FileHelper.isOpaqueImage(filename) || fill, matrix = new draw.Matrix();
|
|
2438
|
+
if (screenshot) {
|
|
2439
|
+
renderBounds = screenshot === true ? (isLeafer ? leafer.canvas.bounds : leaf.worldRenderBounds) : screenshot;
|
|
2440
|
+
}
|
|
2441
|
+
else {
|
|
2442
|
+
let relative = options.relative || (isLeafer ? 'inner' : 'local');
|
|
2443
|
+
scaleX = worldTransform.scaleX;
|
|
2444
|
+
scaleY = worldTransform.scaleY;
|
|
2445
|
+
switch (relative) {
|
|
2446
|
+
case 'inner':
|
|
2447
|
+
matrix.set(worldTransform);
|
|
2448
|
+
break;
|
|
2449
|
+
case 'local':
|
|
2450
|
+
matrix.set(worldTransform).divide(leaf.localTransform);
|
|
2451
|
+
scaleX /= leaf.scaleX;
|
|
2452
|
+
scaleY /= leaf.scaleY;
|
|
2453
|
+
break;
|
|
2454
|
+
case 'world':
|
|
2455
|
+
scaleX = 1;
|
|
2456
|
+
scaleY = 1;
|
|
2457
|
+
break;
|
|
2458
|
+
case 'page':
|
|
2459
|
+
relative = leafer || leaf;
|
|
2460
|
+
default:
|
|
2461
|
+
matrix.set(worldTransform).divide(leaf.getTransform(relative));
|
|
2462
|
+
const l = relative.worldTransform;
|
|
2463
|
+
scaleX /= scaleX / l.scaleX;
|
|
2464
|
+
scaleY /= scaleY / l.scaleY;
|
|
2465
|
+
}
|
|
2466
|
+
renderBounds = leaf.getBounds('render', relative);
|
|
2467
|
+
}
|
|
2468
|
+
const scaleData = { scaleX: 1, scaleY: 1 };
|
|
2469
|
+
draw.MathHelper.getScaleData(options.scale, options.size, renderBounds, scaleData);
|
|
2470
|
+
let pixelRatio = options.pixelRatio || 1;
|
|
2471
|
+
let { x, y, width, height } = new draw.Bounds(renderBounds).scale(scaleData.scaleX, scaleData.scaleY);
|
|
2472
|
+
if (clip)
|
|
2473
|
+
x += clip.x, y += clip.y, width = clip.width, height = clip.height;
|
|
2474
|
+
const renderOptions = { exporting: true, matrix: matrix.scale(1 / scaleData.scaleX, 1 / scaleData.scaleY).invert().translate(-x, -y).withScale(1 / scaleX * scaleData.scaleX, 1 / scaleY * scaleData.scaleY) };
|
|
2475
|
+
let canvas = draw.Creator.canvas({ width: Math.floor(width), height: Math.floor(height), pixelRatio, smooth, contextSettings });
|
|
2476
|
+
let sliceLeaf;
|
|
2477
|
+
if (slice) {
|
|
2478
|
+
sliceLeaf = leaf;
|
|
2479
|
+
sliceLeaf.__worldOpacity = 0;
|
|
2480
|
+
leaf = leafer || leaf;
|
|
2481
|
+
renderOptions.bounds = canvas.bounds;
|
|
2482
|
+
}
|
|
2483
|
+
canvas.save();
|
|
2484
|
+
if (isFrame && fill !== undefined) {
|
|
2485
|
+
const oldFill = leaf.get('fill');
|
|
2486
|
+
leaf.fill = '';
|
|
2487
|
+
leaf.__render(canvas, renderOptions);
|
|
2488
|
+
leaf.fill = oldFill;
|
|
2489
|
+
}
|
|
2490
|
+
else {
|
|
2491
|
+
leaf.__render(canvas, renderOptions);
|
|
2492
|
+
}
|
|
2493
|
+
canvas.restore();
|
|
2494
|
+
if (sliceLeaf)
|
|
2495
|
+
sliceLeaf.__updateWorldOpacity();
|
|
2496
|
+
if (trim) {
|
|
2497
|
+
trimBounds = getTrimBounds(canvas);
|
|
2498
|
+
const old = canvas, { width, height } = trimBounds;
|
|
2499
|
+
const config = { x: 0, y: 0, width, height, pixelRatio };
|
|
2500
|
+
canvas = draw.Creator.canvas(config);
|
|
2501
|
+
canvas.copyWorld(old, trimBounds, config);
|
|
2502
|
+
}
|
|
2503
|
+
if (padding) {
|
|
2504
|
+
const [top, right, bottom, left] = draw.MathHelper.fourNumber(padding);
|
|
2505
|
+
const old = canvas, { width, height } = old;
|
|
2506
|
+
canvas = draw.Creator.canvas({ width: width + left + right, height: height + top + bottom, pixelRatio });
|
|
2507
|
+
canvas.copyWorld(old, old.bounds, { x: left, y: top, width, height });
|
|
2508
|
+
}
|
|
2509
|
+
if (needFill)
|
|
2510
|
+
canvas.fillWorld(canvas.bounds, fill || '#FFFFFF', 'destination-over');
|
|
2511
|
+
if (onCanvas)
|
|
2512
|
+
onCanvas(canvas);
|
|
2513
|
+
const data = filename === 'canvas' ? canvas : canvas.export(filename, options);
|
|
2514
|
+
result = { data, width: canvas.pixelWidth, height: canvas.pixelHeight, renderBounds, trimBounds };
|
|
2468
2515
|
}
|
|
2469
|
-
if (needFill)
|
|
2470
|
-
canvas.fillWorld(canvas.bounds, fill || '#FFFFFF', 'destination-over');
|
|
2471
|
-
if (onCanvas)
|
|
2472
|
-
onCanvas(canvas);
|
|
2473
|
-
const data = filename === 'canvas' ? canvas : canvas.export(filename, options);
|
|
2474
|
-
result = { data, width: canvas.pixelWidth, height: canvas.pixelHeight, renderBounds, trimBounds };
|
|
2475
2516
|
}
|
|
2476
|
-
|
|
2517
|
+
catch (error) {
|
|
2518
|
+
result = { data: '', error };
|
|
2519
|
+
}
|
|
2520
|
+
draw.Export.running = false;
|
|
2477
2521
|
return result;
|
|
2478
2522
|
},
|
|
2479
2523
|
export(leaf, filename, options) {
|
|
2480
|
-
|
|
2524
|
+
draw.Export.running = true;
|
|
2481
2525
|
return addTask((success) => new Promise((resolve) => {
|
|
2482
2526
|
const getResult = () => __awaiter(this, void 0, void 0, function* () {
|
|
2483
2527
|
if (!draw.Resource.isComplete)
|
|
2484
2528
|
return draw.Platform.requestRender(getResult);
|
|
2485
|
-
const result =
|
|
2529
|
+
const result = draw.Export.syncExport(leaf, filename, options);
|
|
2486
2530
|
if (result.data instanceof Promise)
|
|
2487
2531
|
result.data = yield result.data;
|
|
2488
2532
|
success(result);
|