@hprint/plugins 0.0.1-alpha.3 → 0.0.1-alpha.4

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.
Files changed (50) hide show
  1. package/dist/index.js +17 -17
  2. package/dist/index.mjs +1282 -1277
  3. package/dist/src/plugins/CreateElementPlugin.d.ts +4 -0
  4. package/dist/src/plugins/CreateElementPlugin.d.ts.map +1 -1
  5. package/dist/src/utils/ruler/ruler.d.ts +1 -0
  6. package/dist/src/utils/ruler/ruler.d.ts.map +1 -1
  7. package/package.json +3 -3
  8. package/src/assets/style/resizePlugin.css +27 -27
  9. package/src/objects/Arrow.js +47 -47
  10. package/src/objects/ThinTailArrow.js +50 -50
  11. package/src/plugins/AlignGuidLinePlugin.ts +1152 -1152
  12. package/src/plugins/ControlsPlugin.ts +251 -251
  13. package/src/plugins/ControlsRotatePlugin.ts +111 -111
  14. package/src/plugins/CopyPlugin.ts +255 -255
  15. package/src/plugins/CreateElementPlugin.ts +23 -2
  16. package/src/plugins/DeleteHotKeyPlugin.ts +57 -57
  17. package/src/plugins/DrawLinePlugin.ts +162 -162
  18. package/src/plugins/DrawPolygonPlugin.ts +205 -205
  19. package/src/plugins/DringPlugin.ts +125 -125
  20. package/src/plugins/FlipPlugin.ts +59 -59
  21. package/src/plugins/FontPlugin.ts +165 -165
  22. package/src/plugins/FreeDrawPlugin.ts +49 -49
  23. package/src/plugins/GroupAlignPlugin.ts +365 -365
  24. package/src/plugins/GroupPlugin.ts +82 -82
  25. package/src/plugins/GroupTextEditorPlugin.ts +198 -198
  26. package/src/plugins/HistoryPlugin.ts +181 -181
  27. package/src/plugins/ImageStroke.ts +121 -121
  28. package/src/plugins/LayerPlugin.ts +108 -108
  29. package/src/plugins/LockPlugin.ts +242 -242
  30. package/src/plugins/MaskPlugin.ts +155 -155
  31. package/src/plugins/MaterialPlugin.ts +224 -224
  32. package/src/plugins/MiddleMousePlugin.ts +45 -45
  33. package/src/plugins/MoveHotKeyPlugin.ts +46 -46
  34. package/src/plugins/PathTextPlugin.ts +89 -89
  35. package/src/plugins/PolygonModifyPlugin.ts +224 -224
  36. package/src/plugins/PrintPlugin.ts +81 -81
  37. package/src/plugins/PsdPlugin.ts +52 -52
  38. package/src/plugins/ResizePlugin.ts +278 -278
  39. package/src/plugins/RulerPlugin.ts +78 -78
  40. package/src/plugins/SimpleClipImagePlugin.ts +244 -244
  41. package/src/plugins/UnitPlugin.ts +326 -326
  42. package/src/plugins/WaterMarkPlugin.ts +257 -257
  43. package/src/types/eventType.ts +11 -11
  44. package/src/utils/psd.js +432 -432
  45. package/src/utils/ruler/guideline.ts +145 -145
  46. package/src/utils/ruler/index.ts +91 -91
  47. package/src/utils/ruler/ruler.ts +936 -924
  48. package/src/utils/ruler/utils.ts +162 -162
  49. package/tsconfig.json +10 -10
  50. package/vite.config.ts +29 -29
@@ -1,162 +1,162 @@
1
- import type { Rect } from './ruler';
2
- import { fabric } from '@hprint/core';
3
-
4
- /**
5
- * 计算尺子间距
6
- * @param zoom 缩放比例
7
- * @returns 返回计算出的尺子间距
8
- */
9
- const getGap = (zoom: number) => {
10
- const zooms = [0.02, 0.03, 0.05, 0.1, 0.2, 0.5, 1, 2, 5, 10, 18];
11
- const gaps = [5000, 2500, 1000, 500, 250, 100, 50, 25, 10, 5, 2];
12
-
13
- let i = 0;
14
- while (i < zooms.length && zooms[i] < zoom) {
15
- i++;
16
- }
17
-
18
- return gaps[i - 1] || 5000;
19
- };
20
-
21
- /**
22
- * 线段合并
23
- * @param rect Rect数组
24
- * @param isHorizontal
25
- * @returns 合并后的Rect数组
26
- */
27
- const mergeLines = (rect: Rect[], isHorizontal: boolean) => {
28
- const axis = isHorizontal ? 'left' : 'top';
29
- const length = isHorizontal ? 'width' : 'height';
30
- // 先按照 axis 的大小排序
31
- rect.sort((a, b) => a[axis] - b[axis]);
32
- const mergedLines = [];
33
- let currentLine = Object.assign({}, rect[0]);
34
- for (const item of rect) {
35
- const line = Object.assign({}, item);
36
- if (currentLine[axis] + currentLine[length] >= line[axis]) {
37
- // 当前线段和下一个线段相交,合并宽度
38
- currentLine[length] =
39
- Math.max(
40
- currentLine[axis] + currentLine[length],
41
- line[axis] + line[length]
42
- ) - currentLine[axis];
43
- } else {
44
- // 当前线段和下一个线段不相交,将当前线段加入结果数组中,并更新当前线段为下一个线段
45
- mergedLines.push(currentLine);
46
- currentLine = Object.assign({}, line);
47
- }
48
- }
49
- // 加入数组
50
- mergedLines.push(currentLine);
51
- return mergedLines;
52
- };
53
-
54
- const darwLine = (
55
- ctx: CanvasRenderingContext2D,
56
- options: {
57
- left: number;
58
- top: number;
59
- width: number;
60
- height: number;
61
- stroke?: string | CanvasGradient | CanvasPattern;
62
- lineWidth?: number;
63
- }
64
- ) => {
65
- ctx.save();
66
- const { left, top, width, height, stroke, lineWidth } = options;
67
- ctx.beginPath();
68
- stroke && (ctx.strokeStyle = stroke);
69
- ctx.lineWidth = lineWidth ?? 1;
70
- ctx.moveTo(left, top);
71
- ctx.lineTo(left + width, top + height);
72
- ctx.stroke();
73
- ctx.restore();
74
- };
75
-
76
- const darwText = (
77
- ctx: CanvasRenderingContext2D,
78
- options: {
79
- left: number;
80
- top: number;
81
- text: string;
82
- fill?: string | CanvasGradient | CanvasPattern;
83
- align?: CanvasTextAlign;
84
- angle?: number;
85
- fontSize?: number;
86
- }
87
- ) => {
88
- ctx.save();
89
- const { left, top, text, fill, align, angle, fontSize } = options;
90
- fill && (ctx.fillStyle = fill);
91
- ctx.textAlign = align ?? 'left';
92
- ctx.textBaseline = 'top';
93
- ctx.font = `${fontSize ?? 10}px sans-serif`;
94
- if (angle) {
95
- ctx.translate(left, top);
96
- ctx.rotate((Math.PI / 180) * angle);
97
- ctx.translate(-left, -top);
98
- }
99
- ctx.fillText(text, left, top);
100
- ctx.restore();
101
- };
102
-
103
- const darwRect = (
104
- ctx: CanvasRenderingContext2D,
105
- options: {
106
- left: number;
107
- top: number;
108
- width: number;
109
- height: number;
110
- fill?: string | CanvasGradient | CanvasPattern;
111
- stroke?: string;
112
- strokeWidth?: number;
113
- }
114
- ) => {
115
- ctx.save();
116
- const { left, top, width, height, fill, stroke, strokeWidth } = options;
117
- ctx.beginPath();
118
- fill && (ctx.fillStyle = fill);
119
- ctx.rect(left, top, width, height);
120
- ctx.fill();
121
- if (stroke) {
122
- ctx.strokeStyle = stroke;
123
- ctx.lineWidth = strokeWidth ?? 1;
124
- ctx.stroke();
125
- }
126
- ctx.restore();
127
- };
128
-
129
- const drawMask = (
130
- ctx: CanvasRenderingContext2D,
131
- options: {
132
- isHorizontal: boolean;
133
- left: number;
134
- top: number;
135
- width: number;
136
- height: number;
137
- backgroundColor: string;
138
- }
139
- ) => {
140
- ctx.save();
141
- const { isHorizontal, left, top, width, height, backgroundColor } = options;
142
- // 创建一个线性渐变对象
143
- const gradient = isHorizontal
144
- ? ctx.createLinearGradient(left, height / 2, left + width, height / 2)
145
- : ctx.createLinearGradient(width / 2, top, width / 2, height + top);
146
- const transparentColor = new fabric.Color(backgroundColor);
147
- transparentColor.setAlpha(0);
148
- gradient.addColorStop(0, transparentColor.toRgba());
149
- gradient.addColorStop(0.33, backgroundColor);
150
- gradient.addColorStop(0.67, backgroundColor);
151
- gradient.addColorStop(1, transparentColor.toRgba());
152
- darwRect(ctx, {
153
- left,
154
- top,
155
- width,
156
- height,
157
- fill: gradient,
158
- });
159
- ctx.restore();
160
- };
161
-
162
- export { getGap, mergeLines, darwRect, darwText, darwLine, drawMask };
1
+ import type { Rect } from './ruler';
2
+ import { fabric } from '@hprint/core';
3
+
4
+ /**
5
+ * 计算尺子间距
6
+ * @param zoom 缩放比例
7
+ * @returns 返回计算出的尺子间距
8
+ */
9
+ const getGap = (zoom: number) => {
10
+ const zooms = [0.02, 0.03, 0.05, 0.1, 0.2, 0.5, 1, 2, 5, 10, 18];
11
+ const gaps = [5000, 2500, 1000, 500, 250, 100, 50, 25, 10, 5, 2];
12
+
13
+ let i = 0;
14
+ while (i < zooms.length && zooms[i] < zoom) {
15
+ i++;
16
+ }
17
+
18
+ return gaps[i - 1] || 5000;
19
+ };
20
+
21
+ /**
22
+ * 线段合并
23
+ * @param rect Rect数组
24
+ * @param isHorizontal
25
+ * @returns 合并后的Rect数组
26
+ */
27
+ const mergeLines = (rect: Rect[], isHorizontal: boolean) => {
28
+ const axis = isHorizontal ? 'left' : 'top';
29
+ const length = isHorizontal ? 'width' : 'height';
30
+ // 先按照 axis 的大小排序
31
+ rect.sort((a, b) => a[axis] - b[axis]);
32
+ const mergedLines = [];
33
+ let currentLine = Object.assign({}, rect[0]);
34
+ for (const item of rect) {
35
+ const line = Object.assign({}, item);
36
+ if (currentLine[axis] + currentLine[length] >= line[axis]) {
37
+ // 当前线段和下一个线段相交,合并宽度
38
+ currentLine[length] =
39
+ Math.max(
40
+ currentLine[axis] + currentLine[length],
41
+ line[axis] + line[length]
42
+ ) - currentLine[axis];
43
+ } else {
44
+ // 当前线段和下一个线段不相交,将当前线段加入结果数组中,并更新当前线段为下一个线段
45
+ mergedLines.push(currentLine);
46
+ currentLine = Object.assign({}, line);
47
+ }
48
+ }
49
+ // 加入数组
50
+ mergedLines.push(currentLine);
51
+ return mergedLines;
52
+ };
53
+
54
+ const darwLine = (
55
+ ctx: CanvasRenderingContext2D,
56
+ options: {
57
+ left: number;
58
+ top: number;
59
+ width: number;
60
+ height: number;
61
+ stroke?: string | CanvasGradient | CanvasPattern;
62
+ lineWidth?: number;
63
+ }
64
+ ) => {
65
+ ctx.save();
66
+ const { left, top, width, height, stroke, lineWidth } = options;
67
+ ctx.beginPath();
68
+ stroke && (ctx.strokeStyle = stroke);
69
+ ctx.lineWidth = lineWidth ?? 1;
70
+ ctx.moveTo(left, top);
71
+ ctx.lineTo(left + width, top + height);
72
+ ctx.stroke();
73
+ ctx.restore();
74
+ };
75
+
76
+ const darwText = (
77
+ ctx: CanvasRenderingContext2D,
78
+ options: {
79
+ left: number;
80
+ top: number;
81
+ text: string;
82
+ fill?: string | CanvasGradient | CanvasPattern;
83
+ align?: CanvasTextAlign;
84
+ angle?: number;
85
+ fontSize?: number;
86
+ }
87
+ ) => {
88
+ ctx.save();
89
+ const { left, top, text, fill, align, angle, fontSize } = options;
90
+ fill && (ctx.fillStyle = fill);
91
+ ctx.textAlign = align ?? 'left';
92
+ ctx.textBaseline = 'top';
93
+ ctx.font = `${fontSize ?? 10}px sans-serif`;
94
+ if (angle) {
95
+ ctx.translate(left, top);
96
+ ctx.rotate((Math.PI / 180) * angle);
97
+ ctx.translate(-left, -top);
98
+ }
99
+ ctx.fillText(text, left, top);
100
+ ctx.restore();
101
+ };
102
+
103
+ const darwRect = (
104
+ ctx: CanvasRenderingContext2D,
105
+ options: {
106
+ left: number;
107
+ top: number;
108
+ width: number;
109
+ height: number;
110
+ fill?: string | CanvasGradient | CanvasPattern;
111
+ stroke?: string;
112
+ strokeWidth?: number;
113
+ }
114
+ ) => {
115
+ ctx.save();
116
+ const { left, top, width, height, fill, stroke, strokeWidth } = options;
117
+ ctx.beginPath();
118
+ fill && (ctx.fillStyle = fill);
119
+ ctx.rect(left, top, width, height);
120
+ ctx.fill();
121
+ if (stroke) {
122
+ ctx.strokeStyle = stroke;
123
+ ctx.lineWidth = strokeWidth ?? 1;
124
+ ctx.stroke();
125
+ }
126
+ ctx.restore();
127
+ };
128
+
129
+ const drawMask = (
130
+ ctx: CanvasRenderingContext2D,
131
+ options: {
132
+ isHorizontal: boolean;
133
+ left: number;
134
+ top: number;
135
+ width: number;
136
+ height: number;
137
+ backgroundColor: string;
138
+ }
139
+ ) => {
140
+ ctx.save();
141
+ const { isHorizontal, left, top, width, height, backgroundColor } = options;
142
+ // 创建一个线性渐变对象
143
+ const gradient = isHorizontal
144
+ ? ctx.createLinearGradient(left, height / 2, left + width, height / 2)
145
+ : ctx.createLinearGradient(width / 2, top, width / 2, height + top);
146
+ const transparentColor = new fabric.Color(backgroundColor);
147
+ transparentColor.setAlpha(0);
148
+ gradient.addColorStop(0, transparentColor.toRgba());
149
+ gradient.addColorStop(0.33, backgroundColor);
150
+ gradient.addColorStop(0.67, backgroundColor);
151
+ gradient.addColorStop(1, transparentColor.toRgba());
152
+ darwRect(ctx, {
153
+ left,
154
+ top,
155
+ width,
156
+ height,
157
+ fill: gradient,
158
+ });
159
+ ctx.restore();
160
+ };
161
+
162
+ export { getGap, mergeLines, darwRect, darwText, darwLine, drawMask };
package/tsconfig.json CHANGED
@@ -1,10 +1,10 @@
1
- {
2
- "extends": "../../tsconfig.json",
3
- "compilerOptions": {
4
- "outDir": "./dist",
5
- "rootDir": "./",
6
- "composite": true
7
- },
8
- "include": ["**/*.ts"],
9
- "exclude": ["node_modules", "dist"]
10
- }
1
+ {
2
+ "extends": "../../tsconfig.json",
3
+ "compilerOptions": {
4
+ "outDir": "./dist",
5
+ "rootDir": "./",
6
+ "composite": true
7
+ },
8
+ "include": ["**/*.ts"],
9
+ "exclude": ["node_modules", "dist"]
10
+ }
package/vite.config.ts CHANGED
@@ -1,29 +1,29 @@
1
- import { defineConfig } from 'vite';
2
- import { resolve } from 'path';
3
- import { fileURLToPath } from 'url';
4
- import dts from 'vite-plugin-dts';
5
-
6
- const __dirname = fileURLToPath(new URL('.', import.meta.url));
7
-
8
- export default defineConfig({
9
- plugins: [
10
- dts({
11
- outDir: 'dist',
12
- include: ['src/**/*'],
13
- }),
14
- ],
15
- build: {
16
- lib: {
17
- entry: resolve(__dirname, 'src/index.ts'),
18
- name: '@hprint/plugins',
19
- fileName: 'index',
20
- formats: ['es', 'cjs'],
21
- },
22
- rollupOptions: {
23
- external: ['@hprint/core'],
24
- output: {
25
- globals: {},
26
- },
27
- },
28
- },
29
- });
1
+ import { defineConfig } from 'vite';
2
+ import { resolve } from 'path';
3
+ import { fileURLToPath } from 'url';
4
+ import dts from 'vite-plugin-dts';
5
+
6
+ const __dirname = fileURLToPath(new URL('.', import.meta.url));
7
+
8
+ export default defineConfig({
9
+ plugins: [
10
+ dts({
11
+ outDir: 'dist',
12
+ include: ['src/**/*'],
13
+ }),
14
+ ],
15
+ build: {
16
+ lib: {
17
+ entry: resolve(__dirname, 'src/index.ts'),
18
+ name: '@hprint/plugins',
19
+ fileName: 'index',
20
+ formats: ['es', 'cjs'],
21
+ },
22
+ rollupOptions: {
23
+ external: ['@hprint/core'],
24
+ output: {
25
+ globals: {},
26
+ },
27
+ },
28
+ },
29
+ });