leafer-x-watermark 1.1.0 → 1.2.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/index.d.mts +21 -10
- package/dist/index.mjs +177 -179
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -33,9 +33,16 @@ interface IProcessDataType extends IRectData {
|
|
|
33
33
|
_tileContent?: string;
|
|
34
34
|
_tileMode?: boolean;
|
|
35
35
|
_tileSize?: number;
|
|
36
|
-
_tileGap?: number;
|
|
37
|
-
_tileStagger?:
|
|
36
|
+
_tileGap?: number | ITileGap;
|
|
37
|
+
_tileStagger?: IStagger;
|
|
38
38
|
_tileRotation?: number;
|
|
39
|
+
_cachedUrl?: string;
|
|
40
|
+
_cachedBounds?: {
|
|
41
|
+
width: number;
|
|
42
|
+
height: number;
|
|
43
|
+
};
|
|
44
|
+
updateFill: () => void;
|
|
45
|
+
regenerateImage: () => Promise<void>;
|
|
39
46
|
}
|
|
40
47
|
interface IWatermark extends IWatermarkAttrData, IUI {
|
|
41
48
|
__: IProcessDataType;
|
|
@@ -45,19 +52,27 @@ interface IWatermarkInputData extends IWatermarkAttrData, IRectInputData {
|
|
|
45
52
|
declare class ProcessorData extends RectData implements IProcessDataType {
|
|
46
53
|
__leaf: Watermark;
|
|
47
54
|
_tileContent?: string;
|
|
48
|
-
|
|
55
|
+
_cachedUrl?: string;
|
|
56
|
+
_cachedBounds?: {
|
|
57
|
+
width: number;
|
|
58
|
+
height: number;
|
|
59
|
+
};
|
|
60
|
+
setTileContent(value: string): Promise<void>;
|
|
49
61
|
_tileMode?: boolean;
|
|
50
62
|
setTileMode(value: boolean): void;
|
|
51
63
|
_tileSize?: number;
|
|
52
64
|
setTileSize(value: number): void;
|
|
53
|
-
_tileGap?: number;
|
|
65
|
+
_tileGap?: number | ITileGap;
|
|
54
66
|
setTileGap(value: number): void;
|
|
55
|
-
_tileStagger?:
|
|
67
|
+
_tileStagger?: IStagger;
|
|
56
68
|
setTileStagger(value: number): void;
|
|
57
69
|
_tileRotation?: number;
|
|
58
70
|
setTileRotation(value: number): void;
|
|
71
|
+
updateFill(): void;
|
|
59
72
|
__getData(): IObject;
|
|
60
73
|
__getInputData(names?: string[] | IObject, options?: IJSONOptions): IObject;
|
|
74
|
+
private createTileItem;
|
|
75
|
+
regenerateImage(): Promise<void>;
|
|
61
76
|
}
|
|
62
77
|
declare class Watermark<TConstructorData = IWatermarkInputData> extends Rect<TConstructorData> implements IWatermark {
|
|
63
78
|
get __tag(): string;
|
|
@@ -73,12 +88,8 @@ declare class Watermark<TConstructorData = IWatermarkInputData> extends Rect<TCo
|
|
|
73
88
|
tileRotation: number;
|
|
74
89
|
width: number;
|
|
75
90
|
height: number;
|
|
76
|
-
|
|
77
|
-
private _cachedBounds?;
|
|
91
|
+
get tileURL(): string;
|
|
78
92
|
constructor(data?: TConstructorData);
|
|
79
|
-
private createTileItem;
|
|
80
|
-
regenerateImage(): void;
|
|
81
|
-
updateFill(): void;
|
|
82
93
|
}
|
|
83
94
|
|
|
84
95
|
declare function normalizeStagger(stagger: IStagger): INormalizedStagger;
|
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,180 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Debug, dataProcessor, boundsType, registerUI, Plugin, RectData, isObject, UICreator, Rect, MatrixHelper, MathHelper, PaintImage, Platform } from '@leafer-ui/core';
|
|
2
|
+
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __decorateClass = (decorators, target, key, kind) => {
|
|
6
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
|
|
7
|
+
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
8
|
+
if (decorator = decorators[i])
|
|
9
|
+
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
10
|
+
if (kind && result) __defProp(target, key, result);
|
|
11
|
+
return result;
|
|
12
|
+
};
|
|
13
|
+
const debug = Debug.get("leafer-x-watermark");
|
|
14
|
+
class ProcessorData extends RectData {
|
|
15
|
+
_tileContent = "";
|
|
16
|
+
_cachedUrl;
|
|
17
|
+
_cachedBounds;
|
|
18
|
+
setTileContent(value) {
|
|
19
|
+
this._tileContent = value;
|
|
20
|
+
return this.regenerateImage();
|
|
21
|
+
}
|
|
22
|
+
_tileMode = true;
|
|
23
|
+
setTileMode(value) {
|
|
24
|
+
this._tileMode = value;
|
|
25
|
+
this.updateFill();
|
|
26
|
+
}
|
|
27
|
+
_tileSize = 100;
|
|
28
|
+
setTileSize(value) {
|
|
29
|
+
this._tileSize = value;
|
|
30
|
+
this.updateFill();
|
|
31
|
+
}
|
|
32
|
+
_tileGap = 0;
|
|
33
|
+
setTileGap(value) {
|
|
34
|
+
this._tileGap = value;
|
|
35
|
+
this.updateFill();
|
|
36
|
+
}
|
|
37
|
+
_tileStagger = 0;
|
|
38
|
+
setTileStagger(value) {
|
|
39
|
+
this._tileStagger = value;
|
|
40
|
+
this.updateFill();
|
|
41
|
+
}
|
|
42
|
+
_tileRotation = 0;
|
|
43
|
+
setTileRotation(value) {
|
|
44
|
+
this._tileRotation = value;
|
|
45
|
+
this.updateFill();
|
|
46
|
+
}
|
|
47
|
+
updateFill() {
|
|
48
|
+
const leaf = this.__leaf;
|
|
49
|
+
const { _tileMode, _tileSize, _tileGap, _tileStagger, _tileRotation } = this;
|
|
50
|
+
if (!this._cachedUrl || !this._cachedBounds || _tileSize <= 0) {
|
|
51
|
+
leaf.fill = void 0;
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
const { width: boundsWidth, height: boundsHeight } = this._cachedBounds;
|
|
55
|
+
if (!_tileMode) {
|
|
56
|
+
leaf.fill = {
|
|
57
|
+
type: "image",
|
|
58
|
+
url: this._cachedUrl,
|
|
59
|
+
mode: "stretch"
|
|
60
|
+
};
|
|
61
|
+
} else {
|
|
62
|
+
const scale = _tileSize / 100;
|
|
63
|
+
const sizeWidth = boundsWidth * scale;
|
|
64
|
+
const sizeHeight = boundsHeight * scale;
|
|
65
|
+
let xGap, yGap;
|
|
66
|
+
if (isObject(_tileGap)) {
|
|
67
|
+
xGap = _tileGap.x;
|
|
68
|
+
yGap = _tileGap.y;
|
|
69
|
+
} else {
|
|
70
|
+
xGap = yGap = _tileGap;
|
|
71
|
+
}
|
|
72
|
+
const gapX = xGap / 100 * sizeWidth;
|
|
73
|
+
const gapY = yGap / 100 * sizeHeight;
|
|
74
|
+
leaf.fill = {
|
|
75
|
+
type: "image",
|
|
76
|
+
url: this._cachedUrl,
|
|
77
|
+
mode: "repeat",
|
|
78
|
+
gap: { x: gapX, y: gapY },
|
|
79
|
+
size: { width: sizeWidth, height: sizeHeight },
|
|
80
|
+
stagger: _tileStagger,
|
|
81
|
+
rotation: _tileRotation,
|
|
82
|
+
align: "center"
|
|
83
|
+
};
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
__getData() {
|
|
87
|
+
const data = super.__getData();
|
|
88
|
+
delete data.fill;
|
|
89
|
+
return data;
|
|
90
|
+
}
|
|
91
|
+
__getInputData(names, options) {
|
|
92
|
+
const data = super.__getInputData(names, options);
|
|
93
|
+
delete data.fill;
|
|
94
|
+
return data;
|
|
95
|
+
}
|
|
96
|
+
createTileItem(itemData) {
|
|
97
|
+
return UICreator.get("Group", {
|
|
98
|
+
children: [itemData],
|
|
99
|
+
around: "center"
|
|
100
|
+
});
|
|
101
|
+
}
|
|
102
|
+
async regenerateImage() {
|
|
103
|
+
const leaf = this.__leaf;
|
|
104
|
+
const { _tileContent } = this;
|
|
105
|
+
const { width, height } = leaf;
|
|
106
|
+
if (!_tileContent) {
|
|
107
|
+
this._cachedUrl = void 0;
|
|
108
|
+
this._cachedBounds = void 0;
|
|
109
|
+
leaf.fill = void 0;
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
let itemData;
|
|
113
|
+
try {
|
|
114
|
+
itemData = JSON.parse(_tileContent);
|
|
115
|
+
} catch (e) {
|
|
116
|
+
debug.error("Invalid tileContent JSON:", e);
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
const tempItem = this.createTileItem(itemData);
|
|
120
|
+
const bounds = tempItem.getBounds("box", "local");
|
|
121
|
+
if (!width || !height) {
|
|
122
|
+
leaf.width = bounds.width;
|
|
123
|
+
leaf.height = bounds.height;
|
|
124
|
+
}
|
|
125
|
+
const exportWidth = 1e3;
|
|
126
|
+
const { data: url } = await tempItem.export("png", {
|
|
127
|
+
blob: false,
|
|
128
|
+
size: { width: exportWidth }
|
|
129
|
+
});
|
|
130
|
+
this._cachedUrl = url;
|
|
131
|
+
this._cachedBounds = { width: bounds.width, height: bounds.height };
|
|
132
|
+
tempItem.destroy();
|
|
133
|
+
this.updateFill();
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
let Watermark = class extends Rect {
|
|
137
|
+
get __tag() {
|
|
138
|
+
return "Watermark";
|
|
139
|
+
}
|
|
140
|
+
get tileURL() {
|
|
141
|
+
return this.__._cachedUrl;
|
|
142
|
+
}
|
|
143
|
+
constructor(data) {
|
|
144
|
+
super(data);
|
|
145
|
+
}
|
|
146
|
+
};
|
|
147
|
+
__decorateClass([
|
|
148
|
+
dataProcessor(ProcessorData)
|
|
149
|
+
], Watermark.prototype, "__", 2);
|
|
150
|
+
__decorateClass([
|
|
151
|
+
boundsType()
|
|
152
|
+
], Watermark.prototype, "tileContent", 2);
|
|
153
|
+
__decorateClass([
|
|
154
|
+
boundsType(true)
|
|
155
|
+
], Watermark.prototype, "tileMode", 2);
|
|
156
|
+
__decorateClass([
|
|
157
|
+
boundsType(100)
|
|
158
|
+
], Watermark.prototype, "tileSize", 2);
|
|
159
|
+
__decorateClass([
|
|
160
|
+
boundsType(0)
|
|
161
|
+
], Watermark.prototype, "tileGap", 2);
|
|
162
|
+
__decorateClass([
|
|
163
|
+
boundsType(0)
|
|
164
|
+
], Watermark.prototype, "tileStagger", 2);
|
|
165
|
+
__decorateClass([
|
|
166
|
+
boundsType(0)
|
|
167
|
+
], Watermark.prototype, "tileRotation", 2);
|
|
168
|
+
__decorateClass([
|
|
169
|
+
boundsType(0)
|
|
170
|
+
], Watermark.prototype, "width", 2);
|
|
171
|
+
__decorateClass([
|
|
172
|
+
boundsType(0)
|
|
173
|
+
], Watermark.prototype, "height", 2);
|
|
174
|
+
Watermark = __decorateClass([
|
|
175
|
+
registerUI()
|
|
176
|
+
], Watermark);
|
|
177
|
+
Plugin.add("leafer-x-watermark");
|
|
2
178
|
|
|
3
179
|
const { get, scale, copy } = MatrixHelper;
|
|
4
180
|
const { getFloorScale } = MathHelper;
|
|
@@ -119,182 +295,4 @@ function processStaggerData(paint) {
|
|
|
119
295
|
return null;
|
|
120
296
|
}
|
|
121
297
|
|
|
122
|
-
var __defProp = Object.defineProperty;
|
|
123
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
124
|
-
var __decorateClass = (decorators, target, key, kind) => {
|
|
125
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
|
|
126
|
-
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
127
|
-
if (decorator = decorators[i])
|
|
128
|
-
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
129
|
-
if (kind && result) __defProp(target, key, result);
|
|
130
|
-
return result;
|
|
131
|
-
};
|
|
132
|
-
installStaggerPattern();
|
|
133
|
-
const debug = Debug.get("leafer-x-watermark");
|
|
134
|
-
class ProcessorData extends RectData {
|
|
135
|
-
_tileContent;
|
|
136
|
-
setTileContent(value) {
|
|
137
|
-
this._tileContent = value;
|
|
138
|
-
this.__leaf.regenerateImage();
|
|
139
|
-
}
|
|
140
|
-
_tileMode;
|
|
141
|
-
setTileMode(value) {
|
|
142
|
-
this._tileMode = value;
|
|
143
|
-
this.__leaf.updateFill();
|
|
144
|
-
}
|
|
145
|
-
_tileSize;
|
|
146
|
-
setTileSize(value) {
|
|
147
|
-
this._tileSize = value;
|
|
148
|
-
this.__leaf.updateFill();
|
|
149
|
-
}
|
|
150
|
-
_tileGap;
|
|
151
|
-
setTileGap(value) {
|
|
152
|
-
this._tileGap = value;
|
|
153
|
-
this.__leaf.updateFill();
|
|
154
|
-
}
|
|
155
|
-
_tileStagger;
|
|
156
|
-
setTileStagger(value) {
|
|
157
|
-
this._tileStagger = value;
|
|
158
|
-
this.__leaf.updateFill();
|
|
159
|
-
}
|
|
160
|
-
_tileRotation;
|
|
161
|
-
setTileRotation(value) {
|
|
162
|
-
this._tileRotation = value;
|
|
163
|
-
this.__leaf.updateFill();
|
|
164
|
-
}
|
|
165
|
-
__getData() {
|
|
166
|
-
const data = super.__getData();
|
|
167
|
-
delete data.fill;
|
|
168
|
-
return data;
|
|
169
|
-
}
|
|
170
|
-
__getInputData(names, options) {
|
|
171
|
-
const data = super.__getInputData(names, options);
|
|
172
|
-
delete data.fill;
|
|
173
|
-
return data;
|
|
174
|
-
}
|
|
175
|
-
}
|
|
176
|
-
let Watermark = class extends Rect {
|
|
177
|
-
get __tag() {
|
|
178
|
-
return "Watermark";
|
|
179
|
-
}
|
|
180
|
-
// 缓存导出的图片和尺寸信息
|
|
181
|
-
_cachedUrl;
|
|
182
|
-
_cachedBounds;
|
|
183
|
-
constructor(data) {
|
|
184
|
-
super(data);
|
|
185
|
-
this.regenerateImage();
|
|
186
|
-
}
|
|
187
|
-
createTileItem(itemData) {
|
|
188
|
-
return UICreator.get("Group", {
|
|
189
|
-
children: [itemData],
|
|
190
|
-
// rotation: this.tileRotation,
|
|
191
|
-
around: "center"
|
|
192
|
-
});
|
|
193
|
-
}
|
|
194
|
-
regenerateImage() {
|
|
195
|
-
Platform.requestRender(async () => {
|
|
196
|
-
const { tileContent, width, height } = this;
|
|
197
|
-
if (!tileContent) {
|
|
198
|
-
this._cachedUrl = void 0;
|
|
199
|
-
this._cachedBounds = void 0;
|
|
200
|
-
this.fill = void 0;
|
|
201
|
-
return;
|
|
202
|
-
}
|
|
203
|
-
let itemData;
|
|
204
|
-
try {
|
|
205
|
-
itemData = JSON.parse(tileContent);
|
|
206
|
-
} catch (e) {
|
|
207
|
-
debug.error("Invalid tileContent JSON:", e);
|
|
208
|
-
return;
|
|
209
|
-
}
|
|
210
|
-
const tempItem = this.createTileItem(itemData);
|
|
211
|
-
const bounds = tempItem.getBounds("box", "local");
|
|
212
|
-
if (!width || !height) {
|
|
213
|
-
this.width = bounds.width;
|
|
214
|
-
this.height = bounds.height;
|
|
215
|
-
}
|
|
216
|
-
const exportWidth = 1e3;
|
|
217
|
-
const { data: url } = await tempItem.export("png", {
|
|
218
|
-
blob: false,
|
|
219
|
-
size: { width: exportWidth }
|
|
220
|
-
});
|
|
221
|
-
this._cachedUrl = url;
|
|
222
|
-
this._cachedBounds = { width: bounds.width, height: bounds.height };
|
|
223
|
-
tempItem.destroy();
|
|
224
|
-
this.updateFill();
|
|
225
|
-
});
|
|
226
|
-
}
|
|
227
|
-
updateFill() {
|
|
228
|
-
Platform.requestRender(() => {
|
|
229
|
-
const { tileMode, tileSize, tileGap, tileStagger } = this;
|
|
230
|
-
if (!this._cachedUrl || !this._cachedBounds || tileSize <= 0) {
|
|
231
|
-
this.fill = void 0;
|
|
232
|
-
return;
|
|
233
|
-
}
|
|
234
|
-
const { width: boundsWidth, height: boundsHeight } = this._cachedBounds;
|
|
235
|
-
if (!tileMode) {
|
|
236
|
-
this.fill = {
|
|
237
|
-
type: "image",
|
|
238
|
-
url: this._cachedUrl,
|
|
239
|
-
mode: "stretch"
|
|
240
|
-
};
|
|
241
|
-
} else {
|
|
242
|
-
const scale = tileSize / 100;
|
|
243
|
-
const sizeWidth = boundsWidth * scale;
|
|
244
|
-
const sizeHeight = boundsHeight * scale;
|
|
245
|
-
let xGap, yGap;
|
|
246
|
-
if (isObject(tileGap)) {
|
|
247
|
-
xGap = tileGap.x;
|
|
248
|
-
yGap = tileGap.y;
|
|
249
|
-
} else {
|
|
250
|
-
xGap = yGap = tileGap;
|
|
251
|
-
}
|
|
252
|
-
const gapX = xGap / 100 * sizeWidth;
|
|
253
|
-
const gapY = yGap / 100 * sizeHeight;
|
|
254
|
-
this.fill = {
|
|
255
|
-
type: "image",
|
|
256
|
-
url: this._cachedUrl,
|
|
257
|
-
mode: "repeat",
|
|
258
|
-
gap: { x: gapX, y: gapY },
|
|
259
|
-
size: { width: sizeWidth, height: sizeHeight },
|
|
260
|
-
stagger: tileStagger,
|
|
261
|
-
rotation: this.tileRotation,
|
|
262
|
-
align: "center"
|
|
263
|
-
};
|
|
264
|
-
}
|
|
265
|
-
});
|
|
266
|
-
}
|
|
267
|
-
};
|
|
268
|
-
__decorateClass([
|
|
269
|
-
dataProcessor(ProcessorData)
|
|
270
|
-
], Watermark.prototype, "__", 2);
|
|
271
|
-
__decorateClass([
|
|
272
|
-
boundsType()
|
|
273
|
-
], Watermark.prototype, "tileContent", 2);
|
|
274
|
-
__decorateClass([
|
|
275
|
-
boundsType(true)
|
|
276
|
-
], Watermark.prototype, "tileMode", 2);
|
|
277
|
-
__decorateClass([
|
|
278
|
-
boundsType(100)
|
|
279
|
-
], Watermark.prototype, "tileSize", 2);
|
|
280
|
-
__decorateClass([
|
|
281
|
-
boundsType(0)
|
|
282
|
-
], Watermark.prototype, "tileGap", 2);
|
|
283
|
-
__decorateClass([
|
|
284
|
-
boundsType(0)
|
|
285
|
-
], Watermark.prototype, "tileStagger", 2);
|
|
286
|
-
__decorateClass([
|
|
287
|
-
boundsType(0)
|
|
288
|
-
], Watermark.prototype, "tileRotation", 2);
|
|
289
|
-
__decorateClass([
|
|
290
|
-
boundsType(0)
|
|
291
|
-
], Watermark.prototype, "width", 2);
|
|
292
|
-
__decorateClass([
|
|
293
|
-
boundsType(0)
|
|
294
|
-
], Watermark.prototype, "height", 2);
|
|
295
|
-
Watermark = __decorateClass([
|
|
296
|
-
registerUI()
|
|
297
|
-
], Watermark);
|
|
298
|
-
Plugin.add("leafer-x-watermark");
|
|
299
|
-
|
|
300
298
|
export { ProcessorData, Watermark, installStaggerPattern, normalizeStagger, processStaggerData };
|