@leafer-ui/node 1.7.0 → 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 +185 -147
- package/dist/node.esm.js +186 -148
- 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, skew: skewHelper } = 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,7 +1172,7 @@ 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, skew) {
|
|
1175
|
+
function clipMode(data, box, x, y, scaleX, scaleY, rotation, skew, clipSize) {
|
|
1146
1176
|
const transform = get$3();
|
|
1147
1177
|
if (rotation)
|
|
1148
1178
|
rotate(transform, rotation);
|
|
@@ -1151,6 +1181,10 @@ function clipMode(data, box, x, y, scaleX, scaleY, rotation, skew) {
|
|
|
1151
1181
|
if (scaleX)
|
|
1152
1182
|
scaleHelper(transform, scaleX, scaleY);
|
|
1153
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
|
+
}
|
|
1154
1188
|
data.transform = transform;
|
|
1155
1189
|
}
|
|
1156
1190
|
function repeatMode(data, box, width, height, x, y, scaleX, scaleY, rotation, align) {
|
|
@@ -1187,13 +1221,15 @@ const tempBox = new core.Bounds();
|
|
|
1187
1221
|
const tempScaleData = {};
|
|
1188
1222
|
const tempImage = {};
|
|
1189
1223
|
function createData(leafPaint, image, paint, box) {
|
|
1190
|
-
const { changeful, sync, editing } = paint;
|
|
1224
|
+
const { changeful, sync, editing, scaleFixed } = paint;
|
|
1191
1225
|
if (changeful)
|
|
1192
1226
|
leafPaint.changeful = changeful;
|
|
1193
1227
|
if (sync)
|
|
1194
1228
|
leafPaint.sync = sync;
|
|
1195
1229
|
if (editing)
|
|
1196
1230
|
leafPaint.editing = editing;
|
|
1231
|
+
if (scaleFixed)
|
|
1232
|
+
leafPaint.scaleFixed = scaleFixed;
|
|
1197
1233
|
leafPaint.data = getPatternData(paint, box, image);
|
|
1198
1234
|
}
|
|
1199
1235
|
function getPatternData(paint, box, image) {
|
|
@@ -1202,7 +1238,7 @@ function getPatternData(paint, box, image) {
|
|
|
1202
1238
|
if (paint.mode === 'strench')
|
|
1203
1239
|
paint.mode = 'stretch';
|
|
1204
1240
|
let { width, height } = image;
|
|
1205
|
-
const { opacity, mode, align, offset, scale, size, rotation, skew, repeat, filters } = paint;
|
|
1241
|
+
const { opacity, mode, align, offset, scale, size, rotation, skew, clipSize, repeat, filters } = paint;
|
|
1206
1242
|
const sameBox = box.width === width && box.height === height;
|
|
1207
1243
|
const data = { mode };
|
|
1208
1244
|
const swapSize = align !== 'center' && (rotation || 0) % 180 === 90;
|
|
@@ -1236,8 +1272,8 @@ function getPatternData(paint, box, image) {
|
|
|
1236
1272
|
break;
|
|
1237
1273
|
case 'normal':
|
|
1238
1274
|
case 'clip':
|
|
1239
|
-
if (tempImage.x || tempImage.y || scaleX || rotation || skew)
|
|
1240
|
-
clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew);
|
|
1275
|
+
if (tempImage.x || tempImage.y || scaleX || clipSize || rotation || skew)
|
|
1276
|
+
clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, paint.clipSize);
|
|
1241
1277
|
break;
|
|
1242
1278
|
case 'repeat':
|
|
1243
1279
|
if (!sameBox || scaleX || rotation)
|
|
@@ -1374,18 +1410,16 @@ function ignoreRender(ui, value) {
|
|
|
1374
1410
|
}
|
|
1375
1411
|
|
|
1376
1412
|
const { get: get$1, scale, copy: copy$1 } = core.MatrixHelper;
|
|
1377
|
-
const { ceil, abs
|
|
1413
|
+
const { ceil, abs } = Math;
|
|
1378
1414
|
function createPattern(ui, paint, pixelRatio) {
|
|
1379
|
-
let { scaleX, scaleY } =
|
|
1415
|
+
let { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed);
|
|
1380
1416
|
const id = scaleX + '-' + scaleY + '-' + pixelRatio;
|
|
1381
1417
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
1382
|
-
scaleX = abs$1(scaleX);
|
|
1383
|
-
scaleY = abs$1(scaleY);
|
|
1384
1418
|
const { image, data } = paint;
|
|
1385
1419
|
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, transform, repeat } = data;
|
|
1386
1420
|
if (sx) {
|
|
1387
|
-
sx = abs
|
|
1388
|
-
sy = abs
|
|
1421
|
+
sx = abs(sx);
|
|
1422
|
+
sy = abs(sy);
|
|
1389
1423
|
imageMatrix = get$1();
|
|
1390
1424
|
copy$1(imageMatrix, transform);
|
|
1391
1425
|
scale(imageMatrix, 1 / sx, 1 / sy);
|
|
@@ -1438,9 +1472,8 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1438
1472
|
}
|
|
1439
1473
|
}
|
|
1440
1474
|
|
|
1441
|
-
const { abs } = Math;
|
|
1442
1475
|
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1443
|
-
const { scaleX, scaleY } =
|
|
1476
|
+
const { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed);
|
|
1444
1477
|
const { pixelRatio } = canvas, { data } = paint;
|
|
1445
1478
|
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1446
1479
|
return false;
|
|
@@ -1453,8 +1486,8 @@ function checkImage(ui, canvas, paint, allowDraw) {
|
|
|
1453
1486
|
else {
|
|
1454
1487
|
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1455
1488
|
let { width, height } = data;
|
|
1456
|
-
width *=
|
|
1457
|
-
height *=
|
|
1489
|
+
width *= scaleX * pixelRatio;
|
|
1490
|
+
height *= scaleY * pixelRatio;
|
|
1458
1491
|
if (data.scaleX) {
|
|
1459
1492
|
width *= data.scaleX;
|
|
1460
1493
|
height *= data.scaleY;
|
|
@@ -1464,6 +1497,10 @@ function checkImage(ui, canvas, paint, allowDraw) {
|
|
|
1464
1497
|
}
|
|
1465
1498
|
}
|
|
1466
1499
|
if (allowDraw) {
|
|
1500
|
+
if (ui.__.__isFastShadow) {
|
|
1501
|
+
canvas.fillStyle = paint.style || '#000';
|
|
1502
|
+
canvas.fill();
|
|
1503
|
+
}
|
|
1467
1504
|
drawImage(ui, canvas, paint, data);
|
|
1468
1505
|
return true;
|
|
1469
1506
|
}
|
|
@@ -1652,10 +1689,7 @@ function shadow(ui, current, shape) {
|
|
|
1652
1689
|
}
|
|
1653
1690
|
worldCanvas ? other.copyWorld(worldCanvas, nowWorld, nowWorld, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
|
|
1654
1691
|
}
|
|
1655
|
-
|
|
1656
|
-
current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
|
|
1657
|
-
else
|
|
1658
|
-
current.copyWorldToInner(other, copyBounds, __layout.renderBounds, item.blendMode);
|
|
1692
|
+
core.LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
|
|
1659
1693
|
if (end && index < end)
|
|
1660
1694
|
other.clearWorld(copyBounds, true);
|
|
1661
1695
|
});
|
|
@@ -1714,10 +1748,7 @@ function innerShadow(ui, current, shape) {
|
|
|
1714
1748
|
copyBounds = bounds;
|
|
1715
1749
|
}
|
|
1716
1750
|
other.fillWorld(copyBounds, draw.ColorConvert.string(item.color), 'source-in');
|
|
1717
|
-
|
|
1718
|
-
current.copyWorldByReset(other, copyBounds, nowWorld, item.blendMode);
|
|
1719
|
-
else
|
|
1720
|
-
current.copyWorldToInner(other, copyBounds, __layout.renderBounds, item.blendMode);
|
|
1751
|
+
core.LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
|
|
1721
1752
|
if (end && index < end)
|
|
1722
1753
|
other.clearWorld(copyBounds, true);
|
|
1723
1754
|
});
|
|
@@ -1773,12 +1804,11 @@ draw.Group.prototype.__renderMask = function (canvas, options) {
|
|
|
1773
1804
|
contentCanvas = getCanvas(canvas);
|
|
1774
1805
|
child.__render(maskCanvas, options);
|
|
1775
1806
|
}
|
|
1776
|
-
if (
|
|
1777
|
-
|
|
1778
|
-
}
|
|
1779
|
-
if (excludeRenderBounds(child, options))
|
|
1807
|
+
if (mask === 'clipping' || mask === 'clipping-path')
|
|
1808
|
+
excludeRenderBounds(child, options) || child.__render(canvas, options);
|
|
1780
1809
|
continue;
|
|
1781
|
-
|
|
1810
|
+
}
|
|
1811
|
+
excludeRenderBounds(child, options) || child.__render(contentCanvas || canvas, options);
|
|
1782
1812
|
}
|
|
1783
1813
|
maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity);
|
|
1784
1814
|
};
|
|
@@ -2372,123 +2402,131 @@ function getTrimBounds(canvas) {
|
|
|
2372
2402
|
index++;
|
|
2373
2403
|
}
|
|
2374
2404
|
const bounds = new draw.Bounds();
|
|
2375
|
-
|
|
2376
|
-
|
|
2405
|
+
if (pointBounds) {
|
|
2406
|
+
toBounds(pointBounds, bounds);
|
|
2407
|
+
bounds.scale(1 / canvas.pixelRatio).ceil();
|
|
2408
|
+
}
|
|
2409
|
+
return bounds;
|
|
2377
2410
|
}
|
|
2378
2411
|
|
|
2379
2412
|
const ExportModule = {
|
|
2380
2413
|
syncExport(leaf, filename, options) {
|
|
2381
|
-
|
|
2414
|
+
draw.Export.running = true;
|
|
2382
2415
|
let result;
|
|
2383
|
-
|
|
2384
|
-
|
|
2385
|
-
|
|
2386
|
-
|
|
2387
|
-
|
|
2388
|
-
|
|
2389
|
-
|
|
2390
|
-
|
|
2391
|
-
|
|
2392
|
-
else if (fileType === 'svg') {
|
|
2393
|
-
isDownload && download(toURL(leaf.toSVG(), 'svg'), filename);
|
|
2394
|
-
result = { data: isDownload ? true : leaf.toSVG() };
|
|
2395
|
-
}
|
|
2396
|
-
else {
|
|
2397
|
-
let renderBounds, trimBounds, scaleX = 1, scaleY = 1;
|
|
2398
|
-
const { worldTransform, isLeafer, leafer, isFrame } = leaf;
|
|
2399
|
-
const { slice, clip, trim, screenshot, padding, onCanvas } = options;
|
|
2400
|
-
const smooth = options.smooth === undefined ? (leafer ? leafer.config.smooth : true) : options.smooth;
|
|
2401
|
-
const contextSettings = options.contextSettings || (leafer ? leafer.config.contextSettings : undefined);
|
|
2402
|
-
const fill = (isLeafer && screenshot) ? (options.fill === undefined ? leaf.fill : options.fill) : options.fill;
|
|
2403
|
-
const needFill = draw.FileHelper.isOpaqueImage(filename) || fill, matrix = new draw.Matrix();
|
|
2404
|
-
if (screenshot) {
|
|
2405
|
-
renderBounds = screenshot === true ? (isLeafer ? leafer.canvas.bounds : leaf.worldRenderBounds) : screenshot;
|
|
2406
|
-
}
|
|
2407
|
-
else {
|
|
2408
|
-
let relative = options.relative || (isLeafer ? 'inner' : 'local');
|
|
2409
|
-
scaleX = worldTransform.scaleX;
|
|
2410
|
-
scaleY = worldTransform.scaleY;
|
|
2411
|
-
switch (relative) {
|
|
2412
|
-
case 'inner':
|
|
2413
|
-
matrix.set(worldTransform);
|
|
2414
|
-
break;
|
|
2415
|
-
case 'local':
|
|
2416
|
-
matrix.set(worldTransform).divide(leaf.localTransform);
|
|
2417
|
-
scaleX /= leaf.scaleX;
|
|
2418
|
-
scaleY /= leaf.scaleY;
|
|
2419
|
-
break;
|
|
2420
|
-
case 'world':
|
|
2421
|
-
scaleX = 1;
|
|
2422
|
-
scaleY = 1;
|
|
2423
|
-
break;
|
|
2424
|
-
case 'page':
|
|
2425
|
-
relative = leafer || leaf;
|
|
2426
|
-
default:
|
|
2427
|
-
matrix.set(worldTransform).divide(leaf.getTransform(relative));
|
|
2428
|
-
const l = relative.worldTransform;
|
|
2429
|
-
scaleX /= scaleX / l.scaleX;
|
|
2430
|
-
scaleY /= scaleY / l.scaleY;
|
|
2431
|
-
}
|
|
2432
|
-
renderBounds = leaf.getBounds('render', relative);
|
|
2433
|
-
}
|
|
2434
|
-
const scaleData = { scaleX: 1, scaleY: 1 };
|
|
2435
|
-
draw.MathHelper.getScaleData(options.scale, options.size, renderBounds, scaleData);
|
|
2436
|
-
let pixelRatio = options.pixelRatio || 1;
|
|
2437
|
-
let { x, y, width, height } = new draw.Bounds(renderBounds).scale(scaleData.scaleX, scaleData.scaleY);
|
|
2438
|
-
if (clip)
|
|
2439
|
-
x += clip.x, y += clip.y, width = clip.width, height = clip.height;
|
|
2440
|
-
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) };
|
|
2441
|
-
let canvas = draw.Creator.canvas({ width: Math.floor(width), height: Math.floor(height), pixelRatio, smooth, contextSettings });
|
|
2442
|
-
let sliceLeaf;
|
|
2443
|
-
if (slice) {
|
|
2444
|
-
sliceLeaf = leaf;
|
|
2445
|
-
sliceLeaf.__worldOpacity = 0;
|
|
2446
|
-
leaf = leafer || leaf;
|
|
2447
|
-
renderOptions.bounds = canvas.bounds;
|
|
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) };
|
|
2448
2425
|
}
|
|
2449
|
-
|
|
2450
|
-
|
|
2451
|
-
|
|
2452
|
-
leaf.fill = '';
|
|
2453
|
-
leaf.__render(canvas, renderOptions);
|
|
2454
|
-
leaf.fill = oldFill;
|
|
2426
|
+
else if (fileType === 'svg') {
|
|
2427
|
+
isDownload && download(toURL(leaf.toSVG(), 'svg'), filename);
|
|
2428
|
+
result = { data: isDownload ? true : leaf.toSVG() };
|
|
2455
2429
|
}
|
|
2456
2430
|
else {
|
|
2457
|
-
|
|
2458
|
-
|
|
2459
|
-
|
|
2460
|
-
|
|
2461
|
-
|
|
2462
|
-
|
|
2463
|
-
|
|
2464
|
-
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
|
|
2468
|
-
|
|
2469
|
-
|
|
2470
|
-
|
|
2471
|
-
|
|
2472
|
-
|
|
2473
|
-
|
|
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 };
|
|
2474
2515
|
}
|
|
2475
|
-
if (needFill)
|
|
2476
|
-
canvas.fillWorld(canvas.bounds, fill || '#FFFFFF', 'destination-over');
|
|
2477
|
-
if (onCanvas)
|
|
2478
|
-
onCanvas(canvas);
|
|
2479
|
-
const data = filename === 'canvas' ? canvas : canvas.export(filename, options);
|
|
2480
|
-
result = { data, width: canvas.pixelWidth, height: canvas.pixelHeight, renderBounds, trimBounds };
|
|
2481
2516
|
}
|
|
2482
|
-
|
|
2517
|
+
catch (error) {
|
|
2518
|
+
result = { data: '', error };
|
|
2519
|
+
}
|
|
2520
|
+
draw.Export.running = false;
|
|
2483
2521
|
return result;
|
|
2484
2522
|
},
|
|
2485
2523
|
export(leaf, filename, options) {
|
|
2486
|
-
|
|
2524
|
+
draw.Export.running = true;
|
|
2487
2525
|
return addTask((success) => new Promise((resolve) => {
|
|
2488
2526
|
const getResult = () => __awaiter(this, void 0, void 0, function* () {
|
|
2489
2527
|
if (!draw.Resource.isComplete)
|
|
2490
2528
|
return draw.Platform.requestRender(getResult);
|
|
2491
|
-
const result =
|
|
2529
|
+
const result = draw.Export.syncExport(leaf, filename, options);
|
|
2492
2530
|
if (result.data instanceof Promise)
|
|
2493
2531
|
result.data = yield result.data;
|
|
2494
2532
|
success(result);
|