@idraw/util 0.4.3 → 1.0.0-alpha.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/esm/converter/data-svg.d.ts +2 -0
- package/dist/esm/converter/data-svg.js +19 -0
- package/dist/esm/converter/material-svg.d.ts +2 -0
- package/dist/esm/converter/material-svg.js +63 -0
- package/dist/esm/converter/svg-material.d.ts +2 -0
- package/dist/esm/converter/svg-material.js +188 -0
- package/dist/esm/index.d.ts +32 -21
- package/dist/esm/index.js +32 -21
- package/dist/esm/static.d.ts +1 -0
- package/dist/esm/static.js +1 -0
- package/dist/esm/tool/file.js +2 -2
- package/dist/esm/tool/html.js +27 -27
- package/dist/esm/tool/id.d.ts +1 -0
- package/dist/esm/tool/id.js +4 -0
- package/dist/esm/tool/image.js +6 -6
- package/dist/esm/tool/path-to-box.d.ts +3 -0
- package/dist/esm/tool/path-to-box.js +353 -0
- package/dist/esm/tool/path-to-command.d.ts +4 -0
- package/dist/esm/tool/path-to-command.js +392 -0
- package/dist/esm/tool/path.d.ts +18 -0
- package/dist/esm/tool/path.js +421 -0
- package/dist/esm/tool/svg-path.d.ts +3 -0
- package/dist/esm/{view → tool}/svg-path.js +4 -16
- package/dist/esm/tool/time.d.ts +2 -2
- package/dist/esm/tool/time.js +4 -4
- package/dist/esm/tool/uuid.d.ts +1 -1
- package/dist/esm/tool/uuid.js +6 -6
- package/dist/esm/view/box.d.ts +0 -2
- package/dist/esm/view/box.js +1 -173
- package/dist/esm/view/canvas.js +3 -3
- package/dist/esm/view/check.d.ts +8 -7
- package/dist/esm/view/check.js +34 -34
- package/dist/esm/view/config.d.ts +0 -9
- package/dist/esm/view/config.js +1 -71
- package/dist/esm/view/context2d.d.ts +10 -3
- package/dist/esm/view/context2d.js +39 -18
- package/dist/esm/view/controller.d.ts +5 -5
- package/dist/esm/view/controller.js +105 -102
- package/dist/esm/view/data.d.ts +2 -2
- package/dist/esm/view/data.js +65 -65
- package/dist/esm/view/dom.d.ts +23 -0
- package/dist/esm/view/dom.js +190 -0
- package/dist/esm/view/flat.d.ts +2 -2
- package/dist/esm/view/flat.js +53 -53
- package/dist/esm/view/group.d.ts +3 -3
- package/dist/esm/view/group.js +25 -28
- package/dist/esm/view/handle-material.d.ts +24 -0
- package/dist/esm/view/{handle-element.js → handle-material.js} +98 -75
- package/dist/esm/view/is.d.ts +10 -12
- package/dist/esm/view/is.js +15 -19
- package/dist/esm/view/load.d.ts +2 -2
- package/dist/esm/view/load.js +7 -7
- package/dist/esm/view/material.d.ts +40 -0
- package/dist/esm/view/material.js +476 -0
- package/dist/esm/view/middleware.d.ts +1 -0
- package/dist/esm/view/middleware.js +14 -2
- package/dist/esm/view/modify-record.d.ts +4 -4
- package/dist/esm/view/modify-record.js +2 -2
- package/dist/esm/view/parser.d.ts +2 -2
- package/dist/esm/view/parser.js +3 -3
- package/dist/esm/view/path.d.ts +2 -0
- package/dist/esm/view/path.js +30 -0
- package/dist/esm/view/point-move-material.d.ts +5 -0
- package/dist/esm/view/{point-move-element.js → point-move-material.js} +6 -6
- package/dist/esm/view/point.d.ts +3 -8
- package/dist/esm/view/point.js +1 -21
- package/dist/esm/view/position.d.ts +9 -9
- package/dist/esm/view/position.js +1 -1
- package/dist/esm/view/rect.d.ts +2 -2
- package/dist/esm/view/rect.js +4 -4
- package/dist/esm/view/resize-material.d.ts +4 -0
- package/dist/esm/view/resize-material.js +266 -0
- package/dist/esm/view/rotate.d.ts +11 -11
- package/dist/esm/view/rotate.js +24 -24
- package/dist/esm/view/static.d.ts +13 -0
- package/dist/esm/view/static.js +89 -0
- package/dist/esm/view/styles.d.ts +11 -0
- package/dist/esm/view/styles.js +78 -0
- package/dist/esm/view/vertex.d.ts +8 -8
- package/dist/esm/view/vertex.js +28 -28
- package/dist/esm/view/view-box.d.ts +2 -6
- package/dist/esm/view/view-box.js +8 -64
- package/dist/esm/view/view-calc.d.ts +23 -20
- package/dist/esm/view/view-calc.js +104 -93
- package/dist/esm/view/view-content.d.ts +2 -2
- package/dist/esm/view/view-content.js +34 -34
- package/dist/index.global.js +3144 -1548
- package/dist/index.global.min.js +1 -1
- package/package.json +1 -1
- package/dist/esm/view/element.d.ts +0 -35
- package/dist/esm/view/element.js +0 -471
- package/dist/esm/view/handle-element.d.ts +0 -24
- package/dist/esm/view/point-move-element.d.ts +0 -5
- package/dist/esm/view/resize-element.d.ts +0 -4
- package/dist/esm/view/resize-element.js +0 -255
- package/dist/esm/view/svg-path.d.ts +0 -10
|
@@ -0,0 +1,476 @@
|
|
|
1
|
+
import { limitAngle, rotateMaterialVertexes } from './rotate';
|
|
2
|
+
import { isAssetId, createAssetId } from '../tool/uuid';
|
|
3
|
+
function getGroupUUIDs(materials, index) {
|
|
4
|
+
const ids = [];
|
|
5
|
+
if (typeof index === 'string' && /^\d+(\.\d+)*$/.test(index)) {
|
|
6
|
+
const nums = index.split('.');
|
|
7
|
+
let target = materials;
|
|
8
|
+
while (nums.length > 0) {
|
|
9
|
+
const num = nums.shift();
|
|
10
|
+
if (typeof num === 'string') {
|
|
11
|
+
const mtrl = target[parseInt(num)];
|
|
12
|
+
if (mtrl && nums.length === 0) {
|
|
13
|
+
ids.push(mtrl.id);
|
|
14
|
+
}
|
|
15
|
+
else if (mtrl.type === 'group' && nums.length > 0) {
|
|
16
|
+
target = (mtrl === null || mtrl === void 0 ? void 0 : mtrl.children) || [];
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
break;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
return ids;
|
|
23
|
+
}
|
|
24
|
+
export function getSelectedMaterialUUIDs(data, indexes) {
|
|
25
|
+
var _a;
|
|
26
|
+
let ids = [];
|
|
27
|
+
if (Array.isArray(data === null || data === void 0 ? void 0 : data.materials) && ((_a = data === null || data === void 0 ? void 0 : data.materials) === null || _a === void 0 ? void 0 : _a.length) > 0 && Array.isArray(indexes) && indexes.length > 0) {
|
|
28
|
+
indexes.forEach((idx) => {
|
|
29
|
+
var _a;
|
|
30
|
+
if (typeof idx === 'number') {
|
|
31
|
+
if ((_a = data === null || data === void 0 ? void 0 : data.materials) === null || _a === void 0 ? void 0 : _a[idx]) {
|
|
32
|
+
ids.push(data.materials[idx].id);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
else if (typeof idx === 'string') {
|
|
36
|
+
ids = ids.concat(getGroupUUIDs(data.materials, idx));
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
return ids;
|
|
41
|
+
}
|
|
42
|
+
export function validateMaterials(materials) {
|
|
43
|
+
let isValid = true;
|
|
44
|
+
if (Array.isArray(materials)) {
|
|
45
|
+
const ids = [];
|
|
46
|
+
materials.forEach((mtrl) => {
|
|
47
|
+
if (typeof mtrl.id === 'string' && mtrl.id) {
|
|
48
|
+
if (ids.includes(mtrl.id)) {
|
|
49
|
+
isValid = false;
|
|
50
|
+
console.warn(`Duplicate ids: ${mtrl.id}`);
|
|
51
|
+
}
|
|
52
|
+
else {
|
|
53
|
+
ids.push(mtrl.id);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
else {
|
|
57
|
+
isValid = false;
|
|
58
|
+
console.warn('Material missing id', mtrl);
|
|
59
|
+
}
|
|
60
|
+
if (mtrl.type === 'group') {
|
|
61
|
+
isValid = validateMaterials(mtrl === null || mtrl === void 0 ? void 0 : mtrl.children);
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
return isValid;
|
|
66
|
+
}
|
|
67
|
+
export function calcMaterialListSize(list) {
|
|
68
|
+
var _a;
|
|
69
|
+
const area = { x: 0, y: 0, width: 0, height: 0 };
|
|
70
|
+
let prevMtrlSize = null;
|
|
71
|
+
for (let i = 0; i < list.length; i++) {
|
|
72
|
+
const mtrl = list[i];
|
|
73
|
+
if ((_a = mtrl === null || mtrl === void 0 ? void 0 : mtrl.operations) === null || _a === void 0 ? void 0 : _a.invisible) {
|
|
74
|
+
continue;
|
|
75
|
+
}
|
|
76
|
+
const mtrlSize = {
|
|
77
|
+
x: mtrl.x,
|
|
78
|
+
y: mtrl.y,
|
|
79
|
+
width: mtrl.width,
|
|
80
|
+
height: mtrl.height,
|
|
81
|
+
angle: mtrl.angle || 0,
|
|
82
|
+
};
|
|
83
|
+
if (mtrlSize.angle && (mtrlSize.angle > 0 || mtrlSize.angle < 0)) {
|
|
84
|
+
const ves = rotateMaterialVertexes(mtrlSize);
|
|
85
|
+
if (ves.length === 4) {
|
|
86
|
+
const xList = [ves[0].x, ves[1].x, ves[2].x, ves[3].x];
|
|
87
|
+
const yList = [ves[0].y, ves[1].y, ves[2].y, ves[3].y];
|
|
88
|
+
mtrlSize.x = Math.min(...xList);
|
|
89
|
+
mtrlSize.y = Math.min(...yList);
|
|
90
|
+
mtrlSize.width = Math.abs(Math.max(...xList) - Math.min(...xList));
|
|
91
|
+
mtrlSize.height = Math.abs(Math.max(...yList) - Math.min(...yList));
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
if (prevMtrlSize) {
|
|
95
|
+
const areaStartX = Math.min(mtrlSize.x, area.x);
|
|
96
|
+
const areaStartY = Math.min(mtrlSize.y, area.y);
|
|
97
|
+
const areaEndX = Math.max(mtrlSize.x + mtrlSize.width, area.x + area.width);
|
|
98
|
+
const areaEndY = Math.max(mtrlSize.y + mtrlSize.height, area.y + area.height);
|
|
99
|
+
area.x = areaStartX;
|
|
100
|
+
area.y = areaStartY;
|
|
101
|
+
area.width = Math.abs(areaEndX - areaStartX);
|
|
102
|
+
area.height = Math.abs(areaEndY - areaStartY);
|
|
103
|
+
}
|
|
104
|
+
else {
|
|
105
|
+
area.x = mtrlSize.x;
|
|
106
|
+
area.y = mtrlSize.y;
|
|
107
|
+
area.width = mtrlSize.width;
|
|
108
|
+
area.height = mtrlSize.height;
|
|
109
|
+
}
|
|
110
|
+
prevMtrlSize = mtrlSize;
|
|
111
|
+
}
|
|
112
|
+
const listSize = {
|
|
113
|
+
x: Math.floor(area.x),
|
|
114
|
+
y: Math.floor(area.y),
|
|
115
|
+
width: Math.ceil(area.width),
|
|
116
|
+
height: Math.ceil(area.height),
|
|
117
|
+
};
|
|
118
|
+
return listSize;
|
|
119
|
+
}
|
|
120
|
+
export function calcMaterialsContextSize(materials, opts) {
|
|
121
|
+
const area = { x: 0, y: 0, width: 0, height: 0 };
|
|
122
|
+
materials.forEach((mtrl) => {
|
|
123
|
+
const mtrlSize = {
|
|
124
|
+
x: mtrl.x,
|
|
125
|
+
y: mtrl.y,
|
|
126
|
+
width: mtrl.width,
|
|
127
|
+
height: mtrl.height,
|
|
128
|
+
angle: mtrl.angle,
|
|
129
|
+
};
|
|
130
|
+
if (mtrlSize.angle && (mtrlSize.angle > 0 || mtrlSize.angle < 0)) {
|
|
131
|
+
const ves = rotateMaterialVertexes(mtrlSize);
|
|
132
|
+
if (ves.length === 4) {
|
|
133
|
+
const xList = [ves[0].x, ves[1].x, ves[2].x, ves[3].x];
|
|
134
|
+
const yList = [ves[0].y, ves[1].y, ves[2].y, ves[3].y];
|
|
135
|
+
mtrlSize.x = Math.min(...xList);
|
|
136
|
+
mtrlSize.y = Math.min(...yList);
|
|
137
|
+
mtrlSize.width = Math.abs(Math.max(...xList) - Math.min(...xList));
|
|
138
|
+
mtrlSize.height = Math.abs(Math.max(...yList) - Math.min(...yList));
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
const areaStartX = Math.min(mtrlSize.x, area.x);
|
|
142
|
+
const areaStartY = Math.min(mtrlSize.y, area.y);
|
|
143
|
+
const areaEndX = Math.max(mtrlSize.x + mtrlSize.width, area.x + area.width);
|
|
144
|
+
const areaEndY = Math.max(mtrlSize.y + mtrlSize.height, area.y + area.height);
|
|
145
|
+
area.x = areaStartX;
|
|
146
|
+
area.y = areaStartY;
|
|
147
|
+
area.width = Math.abs(areaEndX - areaStartX);
|
|
148
|
+
area.height = Math.abs(areaEndY - areaStartY);
|
|
149
|
+
});
|
|
150
|
+
if (opts === null || opts === void 0 ? void 0 : opts.extend) {
|
|
151
|
+
area.x = Math.min(area.x, 0);
|
|
152
|
+
area.y = Math.min(area.y, 0);
|
|
153
|
+
}
|
|
154
|
+
const ctxSize = {
|
|
155
|
+
contextWidth: area.width,
|
|
156
|
+
contextHeight: area.height,
|
|
157
|
+
};
|
|
158
|
+
if ((opts === null || opts === void 0 ? void 0 : opts.viewWidth) && (opts === null || opts === void 0 ? void 0 : opts.viewHeight) && (opts === null || opts === void 0 ? void 0 : opts.viewWidth) > 0 && (opts === null || opts === void 0 ? void 0 : opts.viewHeight) > 0) {
|
|
159
|
+
if (opts.viewWidth > area.x + area.width) {
|
|
160
|
+
ctxSize.contextWidth = opts.viewWidth - area.x;
|
|
161
|
+
}
|
|
162
|
+
if (opts.viewHeight > area.y + area.height) {
|
|
163
|
+
ctxSize.contextHeight = opts.viewHeight - area.y;
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
return ctxSize;
|
|
167
|
+
}
|
|
168
|
+
export function calcMaterialsViewInfo(materials, prevViewSize, options) {
|
|
169
|
+
const contextSize = calcMaterialsContextSize(materials, {
|
|
170
|
+
viewWidth: prevViewSize.width,
|
|
171
|
+
viewHeight: prevViewSize.height,
|
|
172
|
+
extend: options === null || options === void 0 ? void 0 : options.extend,
|
|
173
|
+
});
|
|
174
|
+
if ((options === null || options === void 0 ? void 0 : options.extend) === true) {
|
|
175
|
+
contextSize.contextWidth = Math.max(contextSize.contextWidth, prevViewSize.contextWidth);
|
|
176
|
+
contextSize.contextHeight = Math.max(contextSize.contextHeight, prevViewSize.contextHeight);
|
|
177
|
+
}
|
|
178
|
+
return {
|
|
179
|
+
contextSize,
|
|
180
|
+
};
|
|
181
|
+
}
|
|
182
|
+
export function getMaterialsAssetIds(materials) {
|
|
183
|
+
const assetIds = [];
|
|
184
|
+
const _scanMaterials = (mtrls) => {
|
|
185
|
+
mtrls.forEach((mtrl) => {
|
|
186
|
+
if (mtrl.type === 'image' && isAssetId(mtrl.href)) {
|
|
187
|
+
assetIds.push(mtrl.href);
|
|
188
|
+
}
|
|
189
|
+
else if (mtrl.type === 'svgCode' && isAssetId(mtrl.code)) {
|
|
190
|
+
assetIds.push(mtrl.code);
|
|
191
|
+
}
|
|
192
|
+
else if (mtrl.type === 'foreignObject' && mtrl.content) {
|
|
193
|
+
assetIds.push(mtrl.content);
|
|
194
|
+
}
|
|
195
|
+
else if (mtrl.type === 'group' && Array.isArray(mtrl.children)) {
|
|
196
|
+
_scanMaterials(mtrl.children);
|
|
197
|
+
}
|
|
198
|
+
});
|
|
199
|
+
};
|
|
200
|
+
_scanMaterials(materials);
|
|
201
|
+
return assetIds;
|
|
202
|
+
}
|
|
203
|
+
export function findMaterialFromList(id, list) {
|
|
204
|
+
let result = null;
|
|
205
|
+
for (let i = 0; i < list.length; i++) {
|
|
206
|
+
const mtrl = list[i];
|
|
207
|
+
if (mtrl.id === id) {
|
|
208
|
+
result = mtrl;
|
|
209
|
+
break;
|
|
210
|
+
}
|
|
211
|
+
else if (!result && mtrl.type === 'group') {
|
|
212
|
+
const resultInGroup = findMaterialFromList(id, (mtrl === null || mtrl === void 0 ? void 0 : mtrl.children) || []);
|
|
213
|
+
if ((resultInGroup === null || resultInGroup === void 0 ? void 0 : resultInGroup.id) === id) {
|
|
214
|
+
result = resultInGroup;
|
|
215
|
+
break;
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
return result;
|
|
220
|
+
}
|
|
221
|
+
export function findMaterialsFromList(ids, list) {
|
|
222
|
+
const result = [];
|
|
223
|
+
function _find(materials) {
|
|
224
|
+
for (let i = 0; i < materials.length; i++) {
|
|
225
|
+
const mtrl = materials[i];
|
|
226
|
+
if (ids.includes(mtrl.id)) {
|
|
227
|
+
result.push(mtrl);
|
|
228
|
+
}
|
|
229
|
+
else if (mtrl.type === 'group') {
|
|
230
|
+
_find((mtrl === null || mtrl === void 0 ? void 0 : mtrl.children) || []);
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
_find(list);
|
|
235
|
+
return result;
|
|
236
|
+
}
|
|
237
|
+
export function getMaterialAndGroupQueueFromList(id, materials) {
|
|
238
|
+
const groupQueue = [];
|
|
239
|
+
let target = null;
|
|
240
|
+
const position = [];
|
|
241
|
+
function _scan(id, materials) {
|
|
242
|
+
let result = null;
|
|
243
|
+
for (let i = 0; i < materials.length; i++) {
|
|
244
|
+
const mtrl = materials[i];
|
|
245
|
+
position.push(i);
|
|
246
|
+
if (mtrl.id === id) {
|
|
247
|
+
result = mtrl;
|
|
248
|
+
target = mtrl;
|
|
249
|
+
break;
|
|
250
|
+
}
|
|
251
|
+
else if (!result && mtrl.type === 'group') {
|
|
252
|
+
groupQueue.push(mtrl);
|
|
253
|
+
const resultInGroup = _scan(id, (mtrl === null || mtrl === void 0 ? void 0 : mtrl.children) || []);
|
|
254
|
+
if ((resultInGroup === null || resultInGroup === void 0 ? void 0 : resultInGroup.id) === id) {
|
|
255
|
+
result = resultInGroup;
|
|
256
|
+
break;
|
|
257
|
+
}
|
|
258
|
+
groupQueue.pop();
|
|
259
|
+
position.pop();
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
return result;
|
|
263
|
+
}
|
|
264
|
+
_scan(id, materials);
|
|
265
|
+
return {
|
|
266
|
+
groupQueue,
|
|
267
|
+
material: target,
|
|
268
|
+
position,
|
|
269
|
+
};
|
|
270
|
+
}
|
|
271
|
+
export function getGroupQueueFromList(id, materials) {
|
|
272
|
+
const { groupQueue } = getMaterialAndGroupQueueFromList(id, materials);
|
|
273
|
+
return groupQueue;
|
|
274
|
+
}
|
|
275
|
+
export function getGroupQueueByMaterialPosition(materials, position) {
|
|
276
|
+
const groupQueue = [];
|
|
277
|
+
let currentMaterials = materials;
|
|
278
|
+
if (position.length > 1) {
|
|
279
|
+
for (let i = 0; i < position.length - 1; i++) {
|
|
280
|
+
const index = position[i];
|
|
281
|
+
const group = currentMaterials[index];
|
|
282
|
+
if ((group === null || group === void 0 ? void 0 : group.type) === 'group' && Array.isArray(group === null || group === void 0 ? void 0 : group.children)) {
|
|
283
|
+
groupQueue.push(group);
|
|
284
|
+
currentMaterials = group.children;
|
|
285
|
+
}
|
|
286
|
+
else {
|
|
287
|
+
return null;
|
|
288
|
+
}
|
|
289
|
+
}
|
|
290
|
+
}
|
|
291
|
+
return groupQueue;
|
|
292
|
+
}
|
|
293
|
+
export function getMaterialSize(mtrl) {
|
|
294
|
+
const { id, x, y, width, height, angle = 0 } = mtrl;
|
|
295
|
+
const size = { id, x, y, width, height, angle };
|
|
296
|
+
return size;
|
|
297
|
+
}
|
|
298
|
+
export function mergeMaterialAsset(material, assets) {
|
|
299
|
+
const mtrl = material;
|
|
300
|
+
let assetId = null;
|
|
301
|
+
let assetItem = null;
|
|
302
|
+
if (mtrl.type === 'image') {
|
|
303
|
+
assetId = mtrl.href;
|
|
304
|
+
}
|
|
305
|
+
else if (mtrl.type === 'svgCode') {
|
|
306
|
+
assetId = mtrl.code;
|
|
307
|
+
}
|
|
308
|
+
else if (mtrl.type === 'foreignObject') {
|
|
309
|
+
assetId = mtrl.content;
|
|
310
|
+
}
|
|
311
|
+
if (assetId && (assetId === null || assetId === void 0 ? void 0 : assetId.startsWith('@assets/'))) {
|
|
312
|
+
assetItem = assets[assetId];
|
|
313
|
+
}
|
|
314
|
+
if ((assetItem === null || assetItem === void 0 ? void 0 : assetItem.type) === mtrl.type && typeof (assetItem === null || assetItem === void 0 ? void 0 : assetItem.value) === 'string' && (assetItem === null || assetItem === void 0 ? void 0 : assetItem.value)) {
|
|
315
|
+
if (mtrl.type === 'image') {
|
|
316
|
+
mtrl.href = assetItem.value;
|
|
317
|
+
}
|
|
318
|
+
else if (mtrl.type === 'svgCode') {
|
|
319
|
+
mtrl.code = assetItem.value;
|
|
320
|
+
}
|
|
321
|
+
else if (mtrl.type === 'foreignObject') {
|
|
322
|
+
mtrl.content = assetItem.value;
|
|
323
|
+
}
|
|
324
|
+
}
|
|
325
|
+
return mtrl;
|
|
326
|
+
}
|
|
327
|
+
export function filterMaterialAsset(material) {
|
|
328
|
+
let assetId = null;
|
|
329
|
+
let assetItem = null;
|
|
330
|
+
let resource = null;
|
|
331
|
+
if (material.type === 'image') {
|
|
332
|
+
resource = material.href;
|
|
333
|
+
}
|
|
334
|
+
else if (material.type === 'svgCode') {
|
|
335
|
+
resource = material.code;
|
|
336
|
+
}
|
|
337
|
+
else if (material.type === 'foreignObject') {
|
|
338
|
+
resource = material.content;
|
|
339
|
+
}
|
|
340
|
+
if (typeof resource === 'string' && !isAssetId(resource)) {
|
|
341
|
+
assetId = createAssetId(resource, material.id);
|
|
342
|
+
assetItem = {
|
|
343
|
+
type: material.type,
|
|
344
|
+
value: resource,
|
|
345
|
+
};
|
|
346
|
+
if (material.type === 'image') {
|
|
347
|
+
material.href = assetId;
|
|
348
|
+
}
|
|
349
|
+
else if (material.type === 'svgCode') {
|
|
350
|
+
material.code = assetId;
|
|
351
|
+
}
|
|
352
|
+
else if (material.type === 'foreignObject') {
|
|
353
|
+
material.content = assetId;
|
|
354
|
+
}
|
|
355
|
+
}
|
|
356
|
+
return {
|
|
357
|
+
material,
|
|
358
|
+
assetId,
|
|
359
|
+
assetItem,
|
|
360
|
+
};
|
|
361
|
+
}
|
|
362
|
+
export function isResourceMaterial(mtrl) {
|
|
363
|
+
return ['image', 'svgCode', 'foreignObject'].includes(mtrl === null || mtrl === void 0 ? void 0 : mtrl.type);
|
|
364
|
+
}
|
|
365
|
+
export function findMaterialsFromListByPositions(positions, list) {
|
|
366
|
+
const materials = [];
|
|
367
|
+
positions.forEach((pos) => {
|
|
368
|
+
const mtrl = findMaterialFromListByPosition(pos, list);
|
|
369
|
+
if (mtrl) {
|
|
370
|
+
materials.push(mtrl);
|
|
371
|
+
}
|
|
372
|
+
});
|
|
373
|
+
return materials;
|
|
374
|
+
}
|
|
375
|
+
export function findMaterialFromListByPosition(position, list) {
|
|
376
|
+
let result = null;
|
|
377
|
+
let tempList = list;
|
|
378
|
+
for (let i = 0; i < position.length; i++) {
|
|
379
|
+
const pos = position[i];
|
|
380
|
+
const item = tempList[pos];
|
|
381
|
+
if (i < position.length - 1 && (item === null || item === void 0 ? void 0 : item.type) === 'group') {
|
|
382
|
+
tempList = item.children;
|
|
383
|
+
}
|
|
384
|
+
else if (i === position.length - 1) {
|
|
385
|
+
result = item;
|
|
386
|
+
}
|
|
387
|
+
else {
|
|
388
|
+
break;
|
|
389
|
+
}
|
|
390
|
+
}
|
|
391
|
+
return result;
|
|
392
|
+
}
|
|
393
|
+
export function findMaterialQueueFromListByPosition(position, list) {
|
|
394
|
+
const result = [];
|
|
395
|
+
let tempList = list;
|
|
396
|
+
for (let i = 0; i < position.length; i++) {
|
|
397
|
+
const pos = position[i];
|
|
398
|
+
const item = tempList[pos];
|
|
399
|
+
if (item) {
|
|
400
|
+
result.push(item);
|
|
401
|
+
}
|
|
402
|
+
else {
|
|
403
|
+
break;
|
|
404
|
+
}
|
|
405
|
+
if (i < position.length - 1 && item.type === 'group') {
|
|
406
|
+
tempList = item.children;
|
|
407
|
+
}
|
|
408
|
+
else {
|
|
409
|
+
break;
|
|
410
|
+
}
|
|
411
|
+
}
|
|
412
|
+
return result;
|
|
413
|
+
}
|
|
414
|
+
export function getMaterialPositionFromList(id, materials) {
|
|
415
|
+
const result = [];
|
|
416
|
+
let over = false;
|
|
417
|
+
const _loop = (list) => {
|
|
418
|
+
for (let i = 0; i < list.length; i++) {
|
|
419
|
+
if (over === true) {
|
|
420
|
+
break;
|
|
421
|
+
}
|
|
422
|
+
result.push(i);
|
|
423
|
+
const mtrl = list[i];
|
|
424
|
+
if (mtrl.id === id) {
|
|
425
|
+
over = true;
|
|
426
|
+
break;
|
|
427
|
+
}
|
|
428
|
+
else if (mtrl.type === 'group') {
|
|
429
|
+
_loop((mtrl === null || mtrl === void 0 ? void 0 : mtrl.children) || []);
|
|
430
|
+
}
|
|
431
|
+
if (over) {
|
|
432
|
+
break;
|
|
433
|
+
}
|
|
434
|
+
result.pop();
|
|
435
|
+
}
|
|
436
|
+
};
|
|
437
|
+
_loop(materials);
|
|
438
|
+
return result;
|
|
439
|
+
}
|
|
440
|
+
export function getMaterialPositionMapFromList(ids, materials) {
|
|
441
|
+
const currentPosition = [];
|
|
442
|
+
const positionMap = {};
|
|
443
|
+
let over = false;
|
|
444
|
+
const _loop = (list) => {
|
|
445
|
+
for (let i = 0; i < list.length; i++) {
|
|
446
|
+
if (over === true) {
|
|
447
|
+
break;
|
|
448
|
+
}
|
|
449
|
+
currentPosition.push(i);
|
|
450
|
+
const mtrl = list[i];
|
|
451
|
+
if (ids.includes(mtrl.id)) {
|
|
452
|
+
positionMap[mtrl.id] = [...currentPosition];
|
|
453
|
+
if (Object.keys(positionMap).length === ids.length) {
|
|
454
|
+
over = true;
|
|
455
|
+
break;
|
|
456
|
+
}
|
|
457
|
+
}
|
|
458
|
+
else if (mtrl.type === 'group') {
|
|
459
|
+
_loop((mtrl === null || mtrl === void 0 ? void 0 : mtrl.children) || []);
|
|
460
|
+
}
|
|
461
|
+
if (over) {
|
|
462
|
+
break;
|
|
463
|
+
}
|
|
464
|
+
currentPosition.pop();
|
|
465
|
+
}
|
|
466
|
+
};
|
|
467
|
+
_loop(materials);
|
|
468
|
+
return positionMap;
|
|
469
|
+
}
|
|
470
|
+
export function isSameMaterialSize(mtrl1, mtrl2) {
|
|
471
|
+
return (mtrl1.x === mtrl2.x &&
|
|
472
|
+
mtrl1.y === mtrl2.y &&
|
|
473
|
+
mtrl1.height === mtrl2.height &&
|
|
474
|
+
mtrl1.width === mtrl2.width &&
|
|
475
|
+
limitAngle(mtrl1.angle || 0) === limitAngle(mtrl2.angle || 0));
|
|
476
|
+
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import type { BoardViewerFrameSnapshot, ViewScaleInfo, ViewSizeInfo } from '@idraw/types';
|
|
2
2
|
export declare function getViewScaleInfoFromSnapshot(snapshot: BoardViewerFrameSnapshot): ViewScaleInfo;
|
|
3
3
|
export declare function getViewSizeInfoFromSnapshot(snapshot: BoardViewerFrameSnapshot): ViewSizeInfo;
|
|
4
|
+
export declare function getMiddlewareValidStyles<C = any, S = any>(config: C, keys: string[]): S;
|
|
@@ -5,7 +5,7 @@ export function getViewScaleInfoFromSnapshot(snapshot) {
|
|
|
5
5
|
offsetTop: activeStore === null || activeStore === void 0 ? void 0 : activeStore.offsetTop,
|
|
6
6
|
offsetBottom: activeStore === null || activeStore === void 0 ? void 0 : activeStore.offsetBottom,
|
|
7
7
|
offsetLeft: activeStore === null || activeStore === void 0 ? void 0 : activeStore.offsetLeft,
|
|
8
|
-
offsetRight: activeStore === null || activeStore === void 0 ? void 0 : activeStore.offsetRight
|
|
8
|
+
offsetRight: activeStore === null || activeStore === void 0 ? void 0 : activeStore.offsetRight,
|
|
9
9
|
};
|
|
10
10
|
return sacelInfo;
|
|
11
11
|
}
|
|
@@ -16,7 +16,19 @@ export function getViewSizeInfoFromSnapshot(snapshot) {
|
|
|
16
16
|
width: activeStore === null || activeStore === void 0 ? void 0 : activeStore.width,
|
|
17
17
|
height: activeStore === null || activeStore === void 0 ? void 0 : activeStore.height,
|
|
18
18
|
contextWidth: activeStore === null || activeStore === void 0 ? void 0 : activeStore.contextWidth,
|
|
19
|
-
contextHeight: activeStore === null || activeStore === void 0 ? void 0 : activeStore.contextHeight
|
|
19
|
+
contextHeight: activeStore === null || activeStore === void 0 ? void 0 : activeStore.contextHeight,
|
|
20
20
|
};
|
|
21
21
|
return sacelInfo;
|
|
22
22
|
}
|
|
23
|
+
export function getMiddlewareValidStyles(config, keys) {
|
|
24
|
+
const styles = {};
|
|
25
|
+
if (config) {
|
|
26
|
+
keys.forEach((key) => {
|
|
27
|
+
const value = config === null || config === void 0 ? void 0 : config[key];
|
|
28
|
+
if (typeof value === 'string' || typeof value === 'number') {
|
|
29
|
+
styles[key] = value;
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
return styles;
|
|
34
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
export declare function
|
|
3
|
-
export declare function toFlattenLayout(layout: DataLayout | RecursivePartial<DataLayout>):
|
|
4
|
-
export declare function toFlattenGlobal(global: DataGlobal | RecursivePartial<DataLayout>):
|
|
1
|
+
import type { FlattenMaterial, Material, RecursivePartial, DataLayout, DataGlobal } from '@idraw/types';
|
|
2
|
+
export declare function toFlattenMaterial(mtrl: Material | RecursivePartial<Material>): FlattenMaterial;
|
|
3
|
+
export declare function toFlattenLayout(layout: DataLayout | RecursivePartial<DataLayout>): FlattenMaterial;
|
|
4
|
+
export declare function toFlattenGlobal(global: DataGlobal | RecursivePartial<DataLayout>): FlattenMaterial;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { flatObject } from '../tool/flat-object';
|
|
2
|
-
export function
|
|
3
|
-
return flatObject(
|
|
2
|
+
export function toFlattenMaterial(mtrl) {
|
|
3
|
+
return flatObject(mtrl, { ignorePaths: ['children'] });
|
|
4
4
|
}
|
|
5
5
|
export function toFlattenLayout(layout) {
|
|
6
6
|
return flatObject(layout);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export declare function
|
|
1
|
+
export declare function parseXMLToDataURL(xml: string, opts: {
|
|
2
2
|
width: number;
|
|
3
3
|
height: number;
|
|
4
4
|
}): Promise<string>;
|
|
5
|
-
export declare function
|
|
5
|
+
export declare function parseSVGCodeToDataURL(svg: string): Promise<string>;
|
package/dist/esm/view/parser.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export function
|
|
1
|
+
export function parseXMLToDataURL(xml, opts) {
|
|
2
2
|
const { width, height } = opts;
|
|
3
3
|
return new Promise((resolve, reject) => {
|
|
4
4
|
const _svg = `
|
|
@@ -8,7 +8,7 @@ export function parseHTMLToDataURL(html, opts) {
|
|
|
8
8
|
height = "${height || ''}">
|
|
9
9
|
<foreignObject width="100%" height="100%">
|
|
10
10
|
<div xmlns = "http://www.w3.org/1999/xhtml">
|
|
11
|
-
${
|
|
11
|
+
${xml}
|
|
12
12
|
</div>
|
|
13
13
|
</foreignObject>
|
|
14
14
|
</svg>
|
|
@@ -26,7 +26,7 @@ export function parseHTMLToDataURL(html, opts) {
|
|
|
26
26
|
};
|
|
27
27
|
});
|
|
28
28
|
}
|
|
29
|
-
export function
|
|
29
|
+
export function parseSVGCodeToDataURL(svg) {
|
|
30
30
|
return new Promise((resolve, reject) => {
|
|
31
31
|
const _svg = svg;
|
|
32
32
|
const blob = new Blob([_svg], { type: 'image/svg+xml;charset=utf-8' });
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import { calcPathCommondsBoundingBox } from '../tool/path-to-box';
|
|
13
|
+
import { shiftPathCommands } from '../tool/path';
|
|
14
|
+
export function refinePathMaterial(mtrl) {
|
|
15
|
+
let { x, y, width, height } = mtrl, attributes = __rest(mtrl, ["x", "y", "width", "height"]);
|
|
16
|
+
const { commands } = attributes;
|
|
17
|
+
const boundingBox = calcPathCommondsBoundingBox(commands);
|
|
18
|
+
const { minX, minY, maxX, maxY } = boundingBox;
|
|
19
|
+
x = x + minX;
|
|
20
|
+
y = y + minY;
|
|
21
|
+
width = Math.abs(maxX - minX);
|
|
22
|
+
height = Math.abs(maxY - minY);
|
|
23
|
+
if (minX !== 0 || minY !== 0) {
|
|
24
|
+
attributes.commands = shiftPathCommands(commands, 0 - minX, 0 - minY);
|
|
25
|
+
}
|
|
26
|
+
return Object.assign(Object.assign(Object.assign({}, mtrl), { x,
|
|
27
|
+
y,
|
|
28
|
+
width,
|
|
29
|
+
height }), attributes);
|
|
30
|
+
}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { rotatePointInGroup } from './rotate';
|
|
2
|
-
export function
|
|
2
|
+
export function calcPointMoveMaterialInGroup(start, end, groupQueue) {
|
|
3
3
|
let moveX = end.x - start.x;
|
|
4
4
|
let moveY = end.y - start.y;
|
|
5
5
|
const pointGroupQueue = [];
|
|
6
6
|
groupQueue.forEach((group) => {
|
|
7
|
-
const { x, y,
|
|
7
|
+
const { x, y, width, height, angle = 0 } = group;
|
|
8
8
|
pointGroupQueue.push({
|
|
9
9
|
x,
|
|
10
10
|
y,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
angle: 0 - angle
|
|
11
|
+
width,
|
|
12
|
+
height,
|
|
13
|
+
angle: 0 - angle,
|
|
14
14
|
});
|
|
15
15
|
});
|
|
16
16
|
if ((groupQueue === null || groupQueue === void 0 ? void 0 : groupQueue.length) > 0) {
|
|
@@ -21,6 +21,6 @@ export function calcPointMoveElementInGroup(start, end, groupQueue) {
|
|
|
21
21
|
}
|
|
22
22
|
return {
|
|
23
23
|
moveX,
|
|
24
|
-
moveY
|
|
24
|
+
moveY,
|
|
25
25
|
};
|
|
26
26
|
}
|
package/dist/esm/view/point.d.ts
CHANGED
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
import type { Point
|
|
2
|
-
export declare function calcDistance(start:
|
|
3
|
-
export declare function
|
|
4
|
-
export declare function equalPoint(p1: Point, p2: Point): boolean;
|
|
5
|
-
export declare function equalTouchPoint(p1: TouchPoint, p2: TouchPoint): boolean;
|
|
6
|
-
export declare function vaildPoint(p: Point): boolean;
|
|
7
|
-
export declare function vaildTouchPoint(p: TouchPoint): boolean;
|
|
8
|
-
export declare function getCenterFromTwoPoints(p1: PointSize, p2: PointSize): PointSize;
|
|
1
|
+
import type { Point } from '@idraw/types';
|
|
2
|
+
export declare function calcDistance(start: Point, end: Point): number;
|
|
3
|
+
export declare function getCenterFromTwoPoints(p1: Point, p2: Point): Point;
|
package/dist/esm/view/point.js
CHANGED
|
@@ -2,29 +2,9 @@ export function calcDistance(start, end) {
|
|
|
2
2
|
const distance = (start.x - end.x) * (start.x - end.x) + (start.y - end.y) * (start.y - end.y);
|
|
3
3
|
return distance === 0 ? distance : Math.sqrt(distance);
|
|
4
4
|
}
|
|
5
|
-
export function calcSpeed(start, end) {
|
|
6
|
-
const distance = calcDistance(start, end);
|
|
7
|
-
const speed = distance / Math.abs(end.t - start.t);
|
|
8
|
-
return speed;
|
|
9
|
-
}
|
|
10
|
-
export function equalPoint(p1, p2) {
|
|
11
|
-
return p1.x === p2.x && p1.y === p2.y && p1.t === p2.t;
|
|
12
|
-
}
|
|
13
|
-
export function equalTouchPoint(p1, p2) {
|
|
14
|
-
return equalPoint(p1, p2) === true && p1.f === p2.f;
|
|
15
|
-
}
|
|
16
|
-
function isNum(num) {
|
|
17
|
-
return num >= 0 || num < 0;
|
|
18
|
-
}
|
|
19
|
-
export function vaildPoint(p) {
|
|
20
|
-
return isNum(p.x) && isNum(p.y) && p.t > 0;
|
|
21
|
-
}
|
|
22
|
-
export function vaildTouchPoint(p) {
|
|
23
|
-
return vaildPoint(p) === true && p.f >= 0;
|
|
24
|
-
}
|
|
25
5
|
export function getCenterFromTwoPoints(p1, p2) {
|
|
26
6
|
return {
|
|
27
7
|
x: p1.x + (p2.x - p1.x) / 2,
|
|
28
|
-
y: p1.y + (p2.y - p1.y) / 2
|
|
8
|
+
y: p1.y + (p2.y - p1.y) / 2,
|
|
29
9
|
};
|
|
30
10
|
}
|