@idraw/core 0.3.1 → 0.4.0-alpha.3

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 (74) hide show
  1. package/dist/esm/index.d.ts +19 -55
  2. package/dist/esm/index.js +52 -188
  3. package/dist/esm/lib/cursor-image.d.ts +2 -0
  4. package/dist/esm/lib/cursor-image.js +2 -0
  5. package/dist/esm/lib/cursor.d.ts +16 -0
  6. package/dist/esm/lib/cursor.js +121 -0
  7. package/dist/esm/middleware/scaler/index.d.ts +2 -0
  8. package/dist/esm/middleware/scaler/index.js +22 -0
  9. package/dist/esm/middleware/scroller/config.d.ts +6 -0
  10. package/dist/esm/middleware/scroller/config.js +6 -0
  11. package/dist/esm/middleware/scroller/index.d.ts +2 -0
  12. package/dist/esm/middleware/scroller/index.js +97 -0
  13. package/dist/esm/middleware/scroller/util.d.ts +12 -0
  14. package/dist/esm/middleware/scroller/util.js +192 -0
  15. package/dist/esm/middleware/selector/config.d.ts +20 -0
  16. package/dist/esm/middleware/selector/config.js +20 -0
  17. package/dist/esm/middleware/selector/draw-wrapper.d.ts +22 -0
  18. package/dist/esm/middleware/selector/draw-wrapper.js +111 -0
  19. package/dist/esm/middleware/selector/index.d.ts +3 -0
  20. package/dist/esm/middleware/selector/index.js +454 -0
  21. package/dist/esm/middleware/selector/types.d.ts +40 -0
  22. package/dist/esm/middleware/selector/types.js +1 -0
  23. package/dist/esm/middleware/selector/util.d.ts +53 -0
  24. package/dist/esm/middleware/selector/util.js +789 -0
  25. package/dist/index.global.js +3825 -3991
  26. package/dist/index.global.min.js +1 -1
  27. package/package.json +8 -8
  28. package/LICENSE +0 -21
  29. package/dist/esm/constant/element.d.ts +0 -2
  30. package/dist/esm/constant/element.js +0 -10
  31. package/dist/esm/constant/static.d.ts +0 -11
  32. package/dist/esm/constant/static.js +0 -13
  33. package/dist/esm/lib/calculate.d.ts +0 -5
  34. package/dist/esm/lib/calculate.js +0 -64
  35. package/dist/esm/lib/check.d.ts +0 -28
  36. package/dist/esm/lib/check.js +0 -115
  37. package/dist/esm/lib/config.d.ts +0 -3
  38. package/dist/esm/lib/config.js +0 -20
  39. package/dist/esm/lib/core-event.d.ts +0 -49
  40. package/dist/esm/lib/core-event.js +0 -50
  41. package/dist/esm/lib/diff.d.ts +0 -6
  42. package/dist/esm/lib/diff.js +0 -82
  43. package/dist/esm/lib/draw/base.d.ts +0 -5
  44. package/dist/esm/lib/draw/base.js +0 -90
  45. package/dist/esm/lib/draw/wrapper.d.ts +0 -4
  46. package/dist/esm/lib/draw/wrapper.js +0 -168
  47. package/dist/esm/lib/element.d.ts +0 -15
  48. package/dist/esm/lib/element.js +0 -442
  49. package/dist/esm/lib/engine-temp.d.ts +0 -22
  50. package/dist/esm/lib/engine-temp.js +0 -29
  51. package/dist/esm/lib/engine.d.ts +0 -47
  52. package/dist/esm/lib/engine.js +0 -323
  53. package/dist/esm/lib/helper.d.ts +0 -30
  54. package/dist/esm/lib/helper.js +0 -363
  55. package/dist/esm/lib/index.d.ts +0 -13
  56. package/dist/esm/lib/index.js +0 -13
  57. package/dist/esm/lib/is.d.ts +0 -26
  58. package/dist/esm/lib/is.js +0 -100
  59. package/dist/esm/lib/mapper.d.ts +0 -26
  60. package/dist/esm/lib/mapper.js +0 -89
  61. package/dist/esm/lib/parse.d.ts +0 -2
  62. package/dist/esm/lib/parse.js +0 -32
  63. package/dist/esm/lib/temp.d.ts +0 -11
  64. package/dist/esm/lib/temp.js +0 -19
  65. package/dist/esm/lib/transform.d.ts +0 -4
  66. package/dist/esm/lib/transform.js +0 -20
  67. package/dist/esm/lib/value.d.ts +0 -2
  68. package/dist/esm/lib/value.js +0 -7
  69. package/dist/esm/mixins/element.d.ts +0 -18
  70. package/dist/esm/mixins/element.js +0 -168
  71. package/dist/esm/plugins/helper.d.ts +0 -12
  72. package/dist/esm/plugins/helper.js +0 -16
  73. package/dist/esm/util/filter.d.ts +0 -1
  74. package/dist/esm/util/filter.js +0 -3
@@ -1,115 +0,0 @@
1
- import is from './is';
2
- function attrs(attrs) {
3
- const { x, y, w, h, angle } = attrs;
4
- if (!(is.x(x) && is.y(y) && is.w(w) && is.h(h) && is.angle(angle))) {
5
- return false;
6
- }
7
- if (!(angle >= -360 && angle <= 360)) {
8
- return false;
9
- }
10
- return true;
11
- }
12
- function box(desc = {}) {
13
- const { borderColor, borderRadius, borderWidth } = desc;
14
- if (desc.hasOwnProperty('borderColor') && !is.color(borderColor)) {
15
- return false;
16
- }
17
- if (desc.hasOwnProperty('borderRadius') && !is.number(borderRadius)) {
18
- return false;
19
- }
20
- if (desc.hasOwnProperty('borderWidth') && !is.number(borderWidth)) {
21
- return false;
22
- }
23
- return true;
24
- }
25
- function rectDesc(desc) {
26
- const { bgColor } = desc;
27
- if (desc.hasOwnProperty('bgColor') && !is.color(bgColor)) {
28
- return false;
29
- }
30
- if (!box(desc)) {
31
- return false;
32
- }
33
- return true;
34
- }
35
- function circleDesc(desc) {
36
- const { bgColor, borderColor, borderWidth } = desc;
37
- if (desc.hasOwnProperty('bgColor') && !is.color(bgColor)) {
38
- return false;
39
- }
40
- if (desc.hasOwnProperty('borderColor') && !is.color(borderColor)) {
41
- return false;
42
- }
43
- if (desc.hasOwnProperty('borderWidth') && !is.number(borderWidth)) {
44
- return false;
45
- }
46
- return true;
47
- }
48
- function imageDesc(desc) {
49
- const { src } = desc;
50
- if (!is.imageSrc(src)) {
51
- return false;
52
- }
53
- return true;
54
- }
55
- function svgDesc(desc) {
56
- const { svg } = desc;
57
- if (!is.svg(svg)) {
58
- return false;
59
- }
60
- return true;
61
- }
62
- function htmlDesc(desc) {
63
- const { html } = desc;
64
- if (!is.html(html)) {
65
- return false;
66
- }
67
- return true;
68
- }
69
- function textDesc(desc) {
70
- const { text, color, fontSize, lineHeight, fontFamily, textAlign, fontWeight, bgColor, strokeWidth, strokeColor } = desc;
71
- if (!is.text(text)) {
72
- return false;
73
- }
74
- if (!is.color(color)) {
75
- return false;
76
- }
77
- if (!is.fontSize(fontSize)) {
78
- return false;
79
- }
80
- if (desc.hasOwnProperty('bgColor') && !is.color(bgColor)) {
81
- return false;
82
- }
83
- if (desc.hasOwnProperty('fontWeight') && !is.fontWeight(fontWeight)) {
84
- return false;
85
- }
86
- if (desc.hasOwnProperty('lineHeight') && !is.lineHeight(lineHeight)) {
87
- return false;
88
- }
89
- if (desc.hasOwnProperty('fontFamily') && !is.fontFamily(fontFamily)) {
90
- return false;
91
- }
92
- if (desc.hasOwnProperty('textAlign') && !is.textAlign(textAlign)) {
93
- return false;
94
- }
95
- if (desc.hasOwnProperty('strokeWidth') && !is.strokeWidth(strokeWidth)) {
96
- return false;
97
- }
98
- if (desc.hasOwnProperty('strokeColor') && !is.color(strokeColor)) {
99
- return false;
100
- }
101
- if (!box(desc)) {
102
- return false;
103
- }
104
- return true;
105
- }
106
- const check = {
107
- attrs,
108
- textDesc,
109
- rectDesc,
110
- circleDesc,
111
- imageDesc,
112
- svgDesc,
113
- htmlDesc
114
- };
115
- export default check;
@@ -1,3 +0,0 @@
1
- import { IDrawConfig, IDrawConfigStrict } from '@idraw/types';
2
- declare function mergeConfig(config?: IDrawConfig): IDrawConfigStrict;
3
- export { mergeConfig };
@@ -1,20 +0,0 @@
1
- import { deepClone } from '@idraw/util';
2
- const defaultConfig = {
3
- elementWrapper: {
4
- color: '#0d85da',
5
- lockColor: '#aaaaaa',
6
- controllerSize: 6,
7
- lineWidth: 1,
8
- lineDash: [4, 3]
9
- }
10
- };
11
- function mergeConfig(config) {
12
- const result = deepClone(defaultConfig);
13
- if (config) {
14
- if (config.elementWrapper) {
15
- result.elementWrapper = Object.assign(Object.assign({}, result.elementWrapper), config.elementWrapper);
16
- }
17
- }
18
- return result;
19
- }
20
- export { mergeConfig };
@@ -1,49 +0,0 @@
1
- import { DataElement, DataElemDesc, Point, IDrawData, ScreenData } from '@idraw/types';
2
- export type TypeCoreEventSelectBaseArg = {
3
- index: number | null;
4
- uuid: string | null;
5
- };
6
- export type TypeCoreEventArgMap = {
7
- error: any;
8
- mouseOverScreen: Point;
9
- mouseLeaveScreen: void;
10
- mouseOverElement: TypeCoreEventSelectBaseArg & {
11
- element: DataElement<keyof DataElemDesc>;
12
- };
13
- mouseLeaveElement: TypeCoreEventSelectBaseArg & {
14
- element: DataElement<keyof DataElemDesc>;
15
- };
16
- screenClickElement: TypeCoreEventSelectBaseArg & {
17
- element: DataElement<keyof DataElemDesc>;
18
- };
19
- screenDoubleClickElement: TypeCoreEventSelectBaseArg & {
20
- element: DataElement<keyof DataElemDesc>;
21
- };
22
- screenSelectElement: TypeCoreEventSelectBaseArg & {
23
- element: DataElement<keyof DataElemDesc>;
24
- };
25
- screenMoveElementStart: TypeCoreEventSelectBaseArg & Point;
26
- screenMoveElementEnd: TypeCoreEventSelectBaseArg & Point;
27
- screenChangeElement: TypeCoreEventSelectBaseArg & {
28
- width: number;
29
- height: number;
30
- angle: number;
31
- };
32
- changeData: IDrawData;
33
- changeScreen: ScreenData;
34
- drawFrameComplete: void;
35
- drawFrame: void;
36
- };
37
- export interface TypeCoreEvent {
38
- on<T extends keyof TypeCoreEventArgMap>(key: T, callback: (p: TypeCoreEventArgMap[T]) => void): void;
39
- off<T extends keyof TypeCoreEventArgMap>(key: T, callback: (p: TypeCoreEventArgMap[T]) => void): void;
40
- trigger<T extends keyof TypeCoreEventArgMap>(key: T, p: TypeCoreEventArgMap[T]): void;
41
- }
42
- export declare class CoreEvent implements TypeCoreEvent {
43
- private _listeners;
44
- constructor();
45
- on<T extends keyof TypeCoreEventArgMap>(eventKey: T, callback: (p: TypeCoreEventArgMap[T]) => void): void;
46
- off<T extends keyof TypeCoreEventArgMap>(eventKey: T, callback: (p: TypeCoreEventArgMap[T]) => void): void;
47
- trigger<T extends keyof TypeCoreEventArgMap>(eventKey: T, arg: TypeCoreEventArgMap[T]): boolean;
48
- has<T extends keyof TypeCoreEventArgMap>(name: string): boolean;
49
- }
@@ -1,50 +0,0 @@
1
- export class CoreEvent {
2
- constructor() {
3
- this._listeners = new Map();
4
- }
5
- on(eventKey, callback) {
6
- if (this._listeners.has(eventKey)) {
7
- const callbacks = this._listeners.get(eventKey);
8
- callbacks === null || callbacks === void 0 ? void 0 : callbacks.push(callback);
9
- this._listeners.set(eventKey, callbacks || []);
10
- }
11
- else {
12
- this._listeners.set(eventKey, [callback]);
13
- }
14
- }
15
- off(eventKey, callback) {
16
- if (this._listeners.has(eventKey)) {
17
- const callbacks = this._listeners.get(eventKey);
18
- if (Array.isArray(callbacks)) {
19
- for (let i = 0; i < (callbacks === null || callbacks === void 0 ? void 0 : callbacks.length); i++) {
20
- if (callbacks[i] === callback) {
21
- callbacks.splice(i, 1);
22
- break;
23
- }
24
- }
25
- }
26
- this._listeners.set(eventKey, callbacks || []);
27
- }
28
- }
29
- trigger(eventKey, arg) {
30
- const callbacks = this._listeners.get(eventKey);
31
- if (Array.isArray(callbacks)) {
32
- callbacks.forEach((cb) => {
33
- cb(arg);
34
- });
35
- return true;
36
- }
37
- else {
38
- return false;
39
- }
40
- }
41
- has(name) {
42
- if (this._listeners.has(name)) {
43
- const list = this._listeners.get(name);
44
- if (Array.isArray(list) && list.length > 0) {
45
- return true;
46
- }
47
- }
48
- return false;
49
- }
50
- }
@@ -1,6 +0,0 @@
1
- import { DataElement, IDrawData, DataElemDesc } from '@idraw/types';
2
- export declare function isChangeImageElementResource(before: DataElement<'image'>, after: DataElement<'image'>): boolean;
3
- export declare function isChangeSVGElementResource(before: DataElement<'svg'>, after: DataElement<'svg'>): boolean;
4
- export declare function isChangeHTMLElementResource(before: DataElement<'html'>, after: DataElement<'html'>): boolean;
5
- export declare function diffElementResourceChange(before: DataElement<keyof DataElemDesc>, after: DataElement<keyof DataElemDesc>): string | null;
6
- export declare function diffElementResourceChangeList(before: IDrawData, after: IDrawData): string[];
@@ -1,82 +0,0 @@
1
- export function isChangeImageElementResource(before, after) {
2
- var _a, _b;
3
- return ((_a = before === null || before === void 0 ? void 0 : before.desc) === null || _a === void 0 ? void 0 : _a.src) !== ((_b = after === null || after === void 0 ? void 0 : after.desc) === null || _b === void 0 ? void 0 : _b.src);
4
- }
5
- export function isChangeSVGElementResource(before, after) {
6
- var _a, _b;
7
- return ((_a = before === null || before === void 0 ? void 0 : before.desc) === null || _a === void 0 ? void 0 : _a.svg) !== ((_b = after === null || after === void 0 ? void 0 : after.desc) === null || _b === void 0 ? void 0 : _b.svg);
8
- }
9
- export function isChangeHTMLElementResource(before, after) {
10
- var _a, _b, _c, _d, _e, _f;
11
- return (((_a = before === null || before === void 0 ? void 0 : before.desc) === null || _a === void 0 ? void 0 : _a.html) !== ((_b = after === null || after === void 0 ? void 0 : after.desc) === null || _b === void 0 ? void 0 : _b.html) ||
12
- ((_c = before === null || before === void 0 ? void 0 : before.desc) === null || _c === void 0 ? void 0 : _c.width) !== ((_d = after === null || after === void 0 ? void 0 : after.desc) === null || _d === void 0 ? void 0 : _d.width) ||
13
- ((_e = before === null || before === void 0 ? void 0 : before.desc) === null || _e === void 0 ? void 0 : _e.height) !== ((_f = after === null || after === void 0 ? void 0 : after.desc) === null || _f === void 0 ? void 0 : _f.height));
14
- }
15
- export function diffElementResourceChange(before, after) {
16
- let result = null;
17
- let isChange = false;
18
- switch (after.type) {
19
- case 'image': {
20
- isChange = isChangeImageElementResource(before, after);
21
- break;
22
- }
23
- case 'svg': {
24
- isChange = isChangeSVGElementResource(before, after);
25
- break;
26
- }
27
- case 'html': {
28
- isChange = isChangeHTMLElementResource(before, after);
29
- break;
30
- }
31
- default:
32
- break;
33
- }
34
- if (isChange === true) {
35
- result = after.uuid;
36
- }
37
- return result;
38
- }
39
- export function diffElementResourceChangeList(before, after) {
40
- var _a;
41
- const uuids = [];
42
- const beforeMap = parseDataElementMap(before);
43
- const afterMap = parseDataElementMap(after);
44
- for (const uuid in afterMap) {
45
- if (['image', 'svg', 'html'].includes((_a = afterMap[uuid]) === null || _a === void 0 ? void 0 : _a.type) !== true) {
46
- continue;
47
- }
48
- if (beforeMap[uuid]) {
49
- let isChange = false;
50
- switch (beforeMap[uuid].type) {
51
- case 'image': {
52
- isChange = isChangeImageElementResource(beforeMap[uuid], afterMap[uuid]);
53
- break;
54
- }
55
- case 'svg': {
56
- isChange = isChangeSVGElementResource(beforeMap[uuid], afterMap[uuid]);
57
- break;
58
- }
59
- case 'html': {
60
- isChange = isChangeHTMLElementResource(beforeMap[uuid], afterMap[uuid]);
61
- break;
62
- }
63
- default:
64
- break;
65
- }
66
- if (isChange === true) {
67
- uuids.push(uuid);
68
- }
69
- }
70
- else {
71
- uuids.push(uuid);
72
- }
73
- }
74
- return uuids;
75
- }
76
- function parseDataElementMap(data) {
77
- const elemMap = {};
78
- data.elements.forEach((elem) => {
79
- elemMap[elem.uuid] = elem;
80
- });
81
- return elemMap;
82
- }
@@ -1,5 +0,0 @@
1
- import { IDrawContext, DataElement } from '@idraw/types';
2
- export declare function clearContext(ctx: IDrawContext): void;
3
- export declare function drawBgColor(ctx: IDrawContext, color: string): void;
4
- export declare function drawBox(ctx: IDrawContext, elem: DataElement<'text' | 'rect'>, pattern: string | CanvasPattern | null): void;
5
- export declare function drawBoxBorder(ctx: IDrawContext, elem: DataElement<'text' | 'rect'>): void;
@@ -1,90 +0,0 @@
1
- import { istype, isColorStr } from '@idraw/util';
2
- import { rotateElement } from './../transform';
3
- import is from './../is';
4
- export function clearContext(ctx) {
5
- ctx.setFillStyle('#000000');
6
- ctx.setStrokeStyle('#000000');
7
- ctx.setLineDash([]);
8
- ctx.setGlobalAlpha(1);
9
- ctx.setShadowColor('#00000000');
10
- ctx.setShadowOffsetX(0);
11
- ctx.setShadowOffsetY(0);
12
- ctx.setShadowBlur(0);
13
- }
14
- export function drawBgColor(ctx, color) {
15
- const size = ctx.getSize();
16
- ctx.setFillStyle(color);
17
- ctx.fillRect(0, 0, size.contextWidth, size.contextHeight);
18
- }
19
- export function drawBox(ctx, elem, pattern) {
20
- clearContext(ctx);
21
- drawBoxBorder(ctx, elem);
22
- clearContext(ctx);
23
- rotateElement(ctx, elem, () => {
24
- const { x, y, w, h } = elem;
25
- let r = elem.desc.borderRadius || 0;
26
- r = Math.min(r, w / 2, h / 2);
27
- if (w < r * 2 || h < r * 2) {
28
- r = 0;
29
- }
30
- ctx.beginPath();
31
- ctx.moveTo(x + r, y);
32
- ctx.arcTo(x + w, y, x + w, y + h, r);
33
- ctx.arcTo(x + w, y + h, x, y + h, r);
34
- ctx.arcTo(x, y + h, x, y, r);
35
- ctx.arcTo(x, y, x + w, y, r);
36
- ctx.closePath();
37
- if (typeof pattern === 'string') {
38
- ctx.setFillStyle(pattern);
39
- }
40
- else if (['CanvasPattern'].includes(istype.type(pattern))) {
41
- ctx.setFillStyle(pattern);
42
- }
43
- ctx.fill();
44
- });
45
- }
46
- export function drawBoxBorder(ctx, elem) {
47
- clearContext(ctx);
48
- rotateElement(ctx, elem, () => {
49
- if (!(elem.desc.borderWidth && elem.desc.borderWidth > 0)) {
50
- return;
51
- }
52
- const bw = elem.desc.borderWidth;
53
- let borderColor = '#000000';
54
- if (isColorStr(elem.desc.borderColor) === true) {
55
- borderColor = elem.desc.borderColor;
56
- }
57
- const x = elem.x - bw / 2;
58
- const y = elem.y - bw / 2;
59
- const w = elem.w + bw;
60
- const h = elem.h + bw;
61
- let r = elem.desc.borderRadius || 0;
62
- r = Math.min(r, w / 2, h / 2);
63
- if (r < w / 2 && r < h / 2) {
64
- r = r + bw / 2;
65
- }
66
- const { desc } = elem;
67
- if (desc.shadowColor !== undefined && isColorStr(desc.shadowColor)) {
68
- ctx.setShadowColor(desc.shadowColor);
69
- }
70
- if (desc.shadowOffsetX !== undefined && is.number(desc.shadowOffsetX)) {
71
- ctx.setShadowOffsetX(desc.shadowOffsetX);
72
- }
73
- if (desc.shadowOffsetY !== undefined && is.number(desc.shadowOffsetY)) {
74
- ctx.setShadowOffsetY(desc.shadowOffsetY);
75
- }
76
- if (desc.shadowBlur !== undefined && is.number(desc.shadowBlur)) {
77
- ctx.setShadowBlur(desc.shadowBlur);
78
- }
79
- ctx.beginPath();
80
- ctx.setLineWidth(bw);
81
- ctx.setStrokeStyle(borderColor);
82
- ctx.moveTo(x + r, y);
83
- ctx.arcTo(x + w, y, x + w, y + h, r);
84
- ctx.arcTo(x + w, y + h, x, y + h, r);
85
- ctx.arcTo(x, y + h, x, y, r);
86
- ctx.arcTo(x, y, x + w, y, r);
87
- ctx.closePath();
88
- ctx.stroke();
89
- });
90
- }
@@ -1,4 +0,0 @@
1
- import { IDrawContext, HelperConfig } from '@idraw/types';
2
- export declare function drawElementWrapper(ctx: IDrawContext, config: HelperConfig): void;
3
- export declare function drawAreaWrapper(ctx: IDrawContext, config: HelperConfig): void;
4
- export declare function drawElementListWrappers(ctx: IDrawContext, config: HelperConfig): void;
@@ -1,168 +0,0 @@
1
- import { rotateContext } from './../transform';
2
- import { clearContext } from './base';
3
- export function drawElementWrapper(ctx, config) {
4
- if (!(config === null || config === void 0 ? void 0 : config.selectedElementWrapper)) {
5
- return;
6
- }
7
- const wrapper = config.selectedElementWrapper;
8
- clearContext(ctx);
9
- rotateContext(ctx, wrapper.translate, wrapper.radian || 0, () => {
10
- ctx.beginPath();
11
- ctx.setLineDash(wrapper.lineDash);
12
- ctx.setLineWidth(wrapper.lineWidth);
13
- ctx.setStrokeStyle(wrapper.color);
14
- ctx.moveTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y);
15
- ctx.lineTo(wrapper.controllers.topRight.x, wrapper.controllers.topRight.y);
16
- ctx.lineTo(wrapper.controllers.bottomRight.x, wrapper.controllers.bottomRight.y);
17
- ctx.lineTo(wrapper.controllers.bottomLeft.x, wrapper.controllers.bottomLeft.y);
18
- ctx.lineTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y - wrapper.lineWidth / 2);
19
- ctx.stroke();
20
- ctx.closePath();
21
- if (wrapper.lock !== true) {
22
- if (wrapper.controllers.rotate.invisible !== true) {
23
- ctx.beginPath();
24
- ctx.moveTo(wrapper.controllers.top.x, wrapper.controllers.top.y);
25
- ctx.lineTo(wrapper.controllers.rotate.x, wrapper.controllers.rotate.y + wrapper.controllerSize);
26
- ctx.stroke();
27
- ctx.closePath();
28
- ctx.beginPath();
29
- ctx.setLineDash([]);
30
- ctx.setLineWidth(wrapper.controllerSize / 1.2);
31
- ctx.arc(wrapper.controllers.rotate.x, wrapper.controllers.rotate.y, wrapper.controllerSize * 0.8, 0, Math.PI * 2);
32
- ctx.stroke();
33
- ctx.closePath();
34
- ctx.setStrokeStyle('#FFFFFF');
35
- ctx.beginPath();
36
- ctx.setLineDash([]);
37
- ctx.setLineWidth(wrapper.controllerSize / 2.1);
38
- ctx.arc(wrapper.controllers.rotate.x, wrapper.controllers.rotate.y, wrapper.controllerSize * 0.8, 0, Math.PI * 2);
39
- ctx.stroke();
40
- ctx.closePath();
41
- }
42
- [
43
- wrapper.controllers.topLeft,
44
- wrapper.controllers.top,
45
- wrapper.controllers.topRight,
46
- wrapper.controllers.right,
47
- wrapper.controllers.bottomRight,
48
- wrapper.controllers.bottom,
49
- wrapper.controllers.bottomLeft,
50
- wrapper.controllers.left
51
- ].forEach((controller) => {
52
- if (controller.invisible !== true) {
53
- ctx.setFillStyle(wrapper.color);
54
- ctx.beginPath();
55
- ctx.arc(controller.x, controller.y, wrapper.controllerSize, 0, Math.PI * 2);
56
- ctx.fill();
57
- ctx.closePath();
58
- ctx.setFillStyle('#FFFFFF');
59
- ctx.beginPath();
60
- ctx.arc(controller.x, controller.y, wrapper.controllerSize - 1, 0, Math.PI * 2);
61
- ctx.fill();
62
- ctx.closePath();
63
- }
64
- });
65
- }
66
- else {
67
- clearContext(ctx);
68
- ctx.setStrokeStyle(wrapper.color);
69
- [
70
- wrapper.controllers.topLeft,
71
- wrapper.controllers.top,
72
- wrapper.controllers.topRight,
73
- wrapper.controllers.right,
74
- wrapper.controllers.bottomRight,
75
- wrapper.controllers.bottom,
76
- wrapper.controllers.bottomLeft,
77
- wrapper.controllers.left
78
- ].forEach((controller) => {
79
- ctx.beginPath();
80
- ctx.moveTo(controller.x - wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
81
- ctx.lineTo(controller.x + wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
82
- ctx.stroke();
83
- ctx.closePath();
84
- ctx.beginPath();
85
- ctx.moveTo(controller.x + wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
86
- ctx.lineTo(controller.x - wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
87
- ctx.stroke();
88
- ctx.closePath();
89
- });
90
- }
91
- });
92
- }
93
- export function drawAreaWrapper(ctx, config) {
94
- if (!(config === null || config === void 0 ? void 0 : config.selectedAreaWrapper)) {
95
- return;
96
- }
97
- const wrapper = config.selectedAreaWrapper;
98
- if (wrapper && wrapper.w > 0 && wrapper.h > 0) {
99
- clearContext(ctx);
100
- ctx.setGlobalAlpha(0.3);
101
- ctx.setFillStyle(wrapper.color);
102
- ctx.fillRect(wrapper.x, wrapper.y, wrapper.w, wrapper.h);
103
- clearContext(ctx);
104
- ctx.beginPath();
105
- ctx.setLineDash(wrapper.lineDash);
106
- ctx.setLineWidth(wrapper.lineWidth);
107
- ctx.setStrokeStyle(wrapper.color);
108
- ctx.moveTo(wrapper.x, wrapper.y);
109
- ctx.lineTo(wrapper.x + wrapper.w, wrapper.y);
110
- ctx.lineTo(wrapper.x + wrapper.w, wrapper.y + wrapper.h);
111
- ctx.lineTo(wrapper.x, wrapper.y + wrapper.h);
112
- ctx.lineTo(wrapper.x, wrapper.y);
113
- ctx.stroke();
114
- ctx.closePath();
115
- }
116
- }
117
- export function drawElementListWrappers(ctx, config) {
118
- if (!Array.isArray(config === null || config === void 0 ? void 0 : config.selectedElementListWrappers)) {
119
- return;
120
- }
121
- const wrapperList = config.selectedElementListWrappers;
122
- wrapperList === null || wrapperList === void 0 ? void 0 : wrapperList.forEach((wrapper) => {
123
- clearContext(ctx);
124
- rotateContext(ctx, wrapper.translate, wrapper.radian || 0, () => {
125
- clearContext(ctx);
126
- ctx.setGlobalAlpha(0.05);
127
- ctx.setFillStyle(wrapper.color);
128
- ctx.fillRect(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y, wrapper.controllers.bottomRight.x - wrapper.controllers.topLeft.x, wrapper.controllers.bottomRight.y - wrapper.controllers.topLeft.y);
129
- clearContext(ctx);
130
- ctx.beginPath();
131
- ctx.setLineDash(wrapper.lineDash);
132
- ctx.setLineWidth(wrapper.lineWidth);
133
- ctx.setStrokeStyle(wrapper.color);
134
- ctx.moveTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y);
135
- ctx.lineTo(wrapper.controllers.topRight.x, wrapper.controllers.topRight.y);
136
- ctx.lineTo(wrapper.controllers.bottomRight.x, wrapper.controllers.bottomRight.y);
137
- ctx.lineTo(wrapper.controllers.bottomLeft.x, wrapper.controllers.bottomLeft.y);
138
- ctx.lineTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y - wrapper.lineWidth / 2);
139
- ctx.stroke();
140
- ctx.closePath();
141
- if (wrapper.lock === true) {
142
- clearContext(ctx);
143
- ctx.setStrokeStyle(wrapper.color);
144
- [
145
- wrapper.controllers.topLeft,
146
- wrapper.controllers.top,
147
- wrapper.controllers.topRight,
148
- wrapper.controllers.right,
149
- wrapper.controllers.bottomRight,
150
- wrapper.controllers.bottom,
151
- wrapper.controllers.bottomLeft,
152
- wrapper.controllers.left
153
- ].forEach((controller) => {
154
- ctx.beginPath();
155
- ctx.moveTo(controller.x - wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
156
- ctx.lineTo(controller.x + wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
157
- ctx.stroke();
158
- ctx.closePath();
159
- ctx.beginPath();
160
- ctx.moveTo(controller.x + wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
161
- ctx.lineTo(controller.x - wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
162
- ctx.stroke();
163
- ctx.closePath();
164
- });
165
- }
166
- });
167
- });
168
- }
@@ -1,15 +0,0 @@
1
- import { IDrawContext, Point, IDrawData, HelperWrapperControllerDirection, DataElement, DataElemDesc } from '@idraw/types';
2
- export declare class Element {
3
- private _ctx;
4
- constructor(ctx: IDrawContext);
5
- initData(data: IDrawData): IDrawData;
6
- isPointInElement(p: Point, data: IDrawData): [number, string | null];
7
- dragElement(data: IDrawData, uuid: string, point: Point, prevPoint: Point, scale: number): void;
8
- transformElement(data: IDrawData, uuid: string, point: Point, prevPoint: Point, scale: number, direction: HelperWrapperControllerDirection): null | {
9
- width: number;
10
- height: number;
11
- angle: number;
12
- };
13
- getElementIndex(data: IDrawData, uuid: string): number;
14
- limitElementAttrs(elem: DataElement<keyof DataElemDesc>): void;
15
- }