@pie-element/hotspot 9.3.4-next.3 → 10.0.0-beta.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.
Files changed (103) hide show
  1. package/configure/lib/DeleteWidget.js +30 -43
  2. package/configure/lib/DeleteWidget.js.map +1 -1
  3. package/configure/lib/button.js +26 -45
  4. package/configure/lib/button.js.map +1 -1
  5. package/configure/lib/buttons/circle.js +20 -27
  6. package/configure/lib/buttons/circle.js.map +1 -1
  7. package/configure/lib/buttons/polygon.js +26 -33
  8. package/configure/lib/buttons/polygon.js.map +1 -1
  9. package/configure/lib/buttons/rectangle.js +26 -33
  10. package/configure/lib/buttons/rectangle.js.map +1 -1
  11. package/configure/lib/defaults.js +2 -3
  12. package/configure/lib/defaults.js.map +1 -1
  13. package/configure/lib/hotspot-circle.js +132 -198
  14. package/configure/lib/hotspot-circle.js.map +1 -1
  15. package/configure/lib/hotspot-container.js +250 -355
  16. package/configure/lib/hotspot-container.js.map +1 -1
  17. package/configure/lib/hotspot-drawable.js +360 -472
  18. package/configure/lib/hotspot-drawable.js.map +1 -1
  19. package/configure/lib/hotspot-palette.js +92 -139
  20. package/configure/lib/hotspot-palette.js.map +1 -1
  21. package/configure/lib/hotspot-polygon.js +212 -317
  22. package/configure/lib/hotspot-polygon.js.map +1 -1
  23. package/configure/lib/hotspot-rectangle.js +128 -192
  24. package/configure/lib/hotspot-rectangle.js.map +1 -1
  25. package/configure/lib/icons.js.map +1 -1
  26. package/configure/lib/image-konva.js +46 -86
  27. package/configure/lib/image-konva.js.map +1 -1
  28. package/configure/lib/index.js +162 -222
  29. package/configure/lib/index.js.map +1 -1
  30. package/configure/lib/root.js +301 -393
  31. package/configure/lib/root.js.map +1 -1
  32. package/configure/lib/shapes/circle.js +69 -101
  33. package/configure/lib/shapes/circle.js.map +1 -1
  34. package/configure/lib/shapes/index.js +4 -12
  35. package/configure/lib/shapes/index.js.map +1 -1
  36. package/configure/lib/shapes/polygon.js +64 -96
  37. package/configure/lib/shapes/polygon.js.map +1 -1
  38. package/configure/lib/shapes/rectagle.js +69 -101
  39. package/configure/lib/shapes/rectagle.js.map +1 -1
  40. package/configure/lib/shapes/utils.js +2 -8
  41. package/configure/lib/shapes/utils.js.map +1 -1
  42. package/configure/lib/upload-control.js +25 -52
  43. package/configure/lib/upload-control.js.map +1 -1
  44. package/configure/lib/utils.js +84 -137
  45. package/configure/lib/utils.js.map +1 -1
  46. package/configure/package.json +11 -10
  47. package/configure/src/__tests__/hotspot-container.test.js +50 -19
  48. package/configure/src/__tests__/hotspot-drawable.test.js +55 -34
  49. package/configure/src/__tests__/index.test.js +167 -5
  50. package/configure/src/__tests__/root.test.js +89 -63
  51. package/configure/src/button.jsx +12 -20
  52. package/configure/src/hotspot-circle.jsx +5 -18
  53. package/configure/src/hotspot-container.jsx +82 -98
  54. package/configure/src/hotspot-drawable.jsx +43 -45
  55. package/configure/src/hotspot-palette.jsx +45 -37
  56. package/configure/src/hotspot-polygon.jsx +4 -20
  57. package/configure/src/hotspot-rectangle.jsx +4 -17
  58. package/configure/src/index.js +12 -2
  59. package/configure/src/root.jsx +85 -79
  60. package/configure/src/upload-control.jsx +6 -16
  61. package/controller/lib/defaults.js +2 -3
  62. package/controller/lib/defaults.js.map +1 -1
  63. package/controller/lib/index.js +151 -205
  64. package/controller/lib/index.js.map +1 -1
  65. package/controller/lib/utils.js +14 -34
  66. package/controller/lib/utils.js.map +1 -1
  67. package/controller/package.json +2 -2
  68. package/lib/hotspot/circle.js +110 -169
  69. package/lib/hotspot/circle.js.map +1 -1
  70. package/lib/hotspot/container.js +174 -260
  71. package/lib/hotspot/container.js.map +1 -1
  72. package/lib/hotspot/icons.js.map +1 -1
  73. package/lib/hotspot/image-konva-tooltip.js +65 -112
  74. package/lib/hotspot/image-konva-tooltip.js.map +1 -1
  75. package/lib/hotspot/index.js +135 -198
  76. package/lib/hotspot/index.js.map +1 -1
  77. package/lib/hotspot/polygon.js +150 -214
  78. package/lib/hotspot/polygon.js.map +1 -1
  79. package/lib/hotspot/rectangle.js +128 -185
  80. package/lib/hotspot/rectangle.js.map +1 -1
  81. package/lib/index.js +187 -256
  82. package/lib/index.js.map +1 -1
  83. package/lib/session-updater.js +12 -18
  84. package/lib/session-updater.js.map +1 -1
  85. package/package.json +14 -11
  86. package/src/__tests__/container.test.jsx +27 -175
  87. package/src/__tests__/index.test.js +70 -30
  88. package/src/hotspot/circle.jsx +2 -13
  89. package/src/hotspot/container.jsx +35 -50
  90. package/src/hotspot/index.jsx +16 -28
  91. package/src/hotspot/polygon.jsx +4 -13
  92. package/src/hotspot/rectangle.jsx +5 -15
  93. package/src/index.js +21 -12
  94. package/configure/src/__tests__/DeleteWidget.test.js +0 -64
  95. package/configure/src/__tests__/__snapshots__/hotspot-container.test.js.snap +0 -192
  96. package/configure/src/__tests__/__snapshots__/hotspot-drawable.test.js.snap +0 -562
  97. package/configure/src/__tests__/__snapshots__/root.test.js.snap +0 -469
  98. package/src/__tests__/__snapshots__/container.test.jsx.snap +0 -264
  99. package/src/__tests__/__snapshots__/index.test.js.snap +0 -81
  100. package/src/__tests__/__snapshots__/polygon.test.jsx.snap +0 -192
  101. package/src/__tests__/__snapshots__/rectangle.test.jsx.snap +0 -127
  102. package/src/__tests__/polygon.test.jsx +0 -230
  103. package/src/__tests__/rectangle.test.jsx +0 -232
@@ -1,108 +1,69 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
- exports["default"] = void 0;
9
-
10
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
11
-
12
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
13
-
14
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
15
-
16
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
17
-
18
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
19
-
20
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
21
-
7
+ exports.default = void 0;
22
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
23
-
24
9
  var _react = _interopRequireDefault(require("react"));
25
-
26
10
  var _propTypes = _interopRequireDefault(require("prop-types"));
27
-
28
11
  var _reactKonva = require("react-konva");
29
-
30
- var _styles = require("@material-ui/core/styles");
31
-
32
12
  var _DeleteWidget = _interopRequireDefault(require("./DeleteWidget"));
33
-
34
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
35
-
36
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
37
-
38
- var CircleComponent = /*#__PURE__*/function (_React$Component) {
39
- (0, _inherits2["default"])(CircleComponent, _React$Component);
40
-
41
- var _super = _createSuper(CircleComponent);
42
-
43
- function CircleComponent(props) {
44
- var _this;
45
-
46
- (0, _classCallCheck2["default"])(this, CircleComponent);
47
- _this = _super.call(this, props);
48
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClick", function (e) {
49
- var _this$props = _this.props,
50
- radius = _this$props.radius,
51
- isDrawing = _this$props.isDrawing,
52
- onClick = _this$props.onClick,
53
- id = _this$props.id;
54
-
13
+ class CircleComponent extends _react.default.Component {
14
+ constructor(props) {
15
+ super(props);
16
+ (0, _defineProperty2.default)(this, "handleClick", e => {
17
+ const {
18
+ radius,
19
+ isDrawing,
20
+ onClick,
21
+ id
22
+ } = this.props;
55
23
  if (radius <= 0 && isDrawing) {
56
24
  return;
57
25
  }
58
-
59
26
  e.cancelBubble = true;
60
27
  onClick(id);
61
28
  });
62
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseEnter", function () {
29
+ (0, _defineProperty2.default)(this, "handleMouseEnter", () => {
63
30
  document.body.style.cursor = 'pointer';
64
-
65
- _this.setState({
31
+ this.setState({
66
32
  hovered: true
67
33
  });
68
-
69
- _this.trRef.current.setNode(_this.shapeRef.current);
70
-
71
- _this.trRef.current.getLayer().batchDraw();
34
+ this.trRef.current.setNode(this.shapeRef.current);
35
+ this.trRef.current.getLayer().batchDraw();
72
36
  });
73
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseLeave", function () {
74
- _this.setState({
37
+ (0, _defineProperty2.default)(this, "handleMouseLeave", () => {
38
+ this.setState({
75
39
  hovered: false
76
40
  });
77
-
78
41
  document.body.style.cursor = 'default';
79
42
  });
80
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleOnDragEnd", function (e) {
81
- var _this$props2 = _this.props,
82
- onDragEnd = _this$props2.onDragEnd,
83
- id = _this$props2.id;
84
-
85
- _this.setState({
43
+ (0, _defineProperty2.default)(this, "handleOnDragEnd", e => {
44
+ const {
45
+ onDragEnd,
46
+ id
47
+ } = this.props;
48
+ this.setState({
86
49
  isDragging: false
87
50
  });
88
-
89
51
  onDragEnd(id, {
90
52
  x: e.target.x(),
91
53
  y: e.target.y()
92
54
  });
93
55
  });
94
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onResizeEnd", function () {
95
- var _this$props3 = _this.props,
96
- onDragEnd = _this$props3.onDragEnd,
97
- id = _this$props3.id;
98
- var node = _this.shapeRef.current;
99
- var scale = node.scaleX() !== 1 ? node.scaleX() : node.scaleY();
100
- var newRadius = Math.max(node.radius() * scale, 5);
101
-
102
- _this.setState({
56
+ (0, _defineProperty2.default)(this, "onResizeEnd", () => {
57
+ const {
58
+ onDragEnd,
59
+ id
60
+ } = this.props;
61
+ const node = this.shapeRef.current;
62
+ const scale = node.scaleX() !== 1 ? node.scaleX() : node.scaleY();
63
+ const newRadius = Math.max(node.radius() * scale, 5);
64
+ this.setState({
103
65
  isDragging: false
104
66
  });
105
-
106
67
  onDragEnd(id, {
107
68
  x: node.x(),
108
69
  y: node.y(),
@@ -111,146 +72,119 @@ var CircleComponent = /*#__PURE__*/function (_React$Component) {
111
72
  node.scaleX(1);
112
73
  node.scaleY(1);
113
74
  });
114
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleDelete", function (id) {
115
- var onDeleteShape = _this.props.onDeleteShape;
75
+ (0, _defineProperty2.default)(this, "handleDelete", id => {
76
+ const {
77
+ onDeleteShape
78
+ } = this.props;
116
79
  onDeleteShape(id);
117
80
  });
118
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onTransform", function () {
119
- var node = _this.shapeRef.current;
120
- var avgScale = (node.scaleX() + node.scaleY()) / 2;
81
+ (0, _defineProperty2.default)(this, "onTransform", () => {
82
+ const node = this.shapeRef.current;
83
+ const avgScale = (node.scaleX() + node.scaleY()) / 2;
121
84
  node.scaleX(avgScale);
122
85
  node.scaleY(avgScale);
123
86
  });
124
- _this.state = {
87
+ this.state = {
125
88
  hovered: false,
126
89
  isDragging: false
127
90
  };
128
- _this.shapeRef = /*#__PURE__*/_react["default"].createRef();
129
- _this.trRef = /*#__PURE__*/_react["default"].createRef();
130
- return _this;
91
+ this.shapeRef = /*#__PURE__*/_react.default.createRef();
92
+ this.trRef = /*#__PURE__*/_react.default.createRef();
131
93
  }
132
-
133
- (0, _createClass2["default"])(CircleComponent, [{
134
- key: "render",
135
- value: function render() {
136
- var _this2 = this;
137
-
138
- var _this$props4 = this.props,
139
- classes = _this$props4.classes,
140
- correct = _this$props4.correct,
141
- radius = _this$props4.radius,
142
- hotspotColor = _this$props4.hotspotColor,
143
- id = _this$props4.id,
144
- outlineColor = _this$props4.outlineColor,
145
- x = _this$props4.x,
146
- y = _this$props4.y,
147
- _this$props4$strokeWi = _this$props4.strokeWidth,
148
- strokeWidth = _this$props4$strokeWi === void 0 ? 5 : _this$props4$strokeWi,
149
- selectedHotspotColor = _this$props4.selectedHotspotColor,
150
- hoverOutlineColor = _this$props4.hoverOutlineColor;
151
- var _this$state = this.state,
152
- hovered = _this$state.hovered,
153
- isDragging = _this$state.isDragging; // Ensure radius is valid
154
-
155
- var validRadius = isNaN(radius) || radius <= 0 ? 5 : radius;
156
- return /*#__PURE__*/_react["default"].createElement(_reactKonva.Group, {
157
- classes: classes.group,
158
- onMouseLeave: this.handleMouseLeave,
159
- onMouseEnter: this.handleMouseEnter
160
- }, /*#__PURE__*/_react["default"].createElement(_reactKonva.Circle, {
161
- classes: classes.base,
162
- ref: this.shapeRef,
163
- radius: validRadius,
164
- fill: correct && selectedHotspotColor ? selectedHotspotColor : hotspotColor,
165
- onClick: this.handleClick,
166
- onTap: this.handleClick,
167
- draggable: true,
168
- stroke: outlineColor,
169
- strokeWidth: correct ? strokeWidth : 0,
170
- onDragStart: function onDragStart() {
171
- return _this2.setState({
172
- isDragging: true
173
- });
174
- },
175
- onDragEnd: this.handleOnDragEnd,
176
- onTransformStart: function onTransformStart() {
177
- return _this2.setState({
178
- isDragging: true
179
- });
180
- },
181
- onTransformEnd: this.onResizeEnd,
182
- x: x,
183
- y: y
184
- }), !isDragging && hovered && /*#__PURE__*/_react["default"].createElement(_DeleteWidget["default"], {
185
- id: id,
186
- radius: validRadius,
187
- x: x,
188
- y: y,
189
- handleWidgetClick: this.handleDelete,
190
- isCircle: true
191
- }), this.state.hovered && /*#__PURE__*/_react["default"].createElement(_reactKonva.Transformer, {
192
- borderStroke: hoverOutlineColor || null,
193
- ref: this.trRef,
194
- rotateEnabled: false,
195
- keepRatio: true,
196
- onTransform: this.onTransform,
197
- enabledAnchors: ['middle-left', 'middle-right', 'top-center', 'bottom-center'],
198
- boundBoxFunc: function boundBoxFunc(oldBox, newBox) {
199
- // Constraint to prevent resizing too small
200
- if (newBox.width < 10 || newBox.height < 10) {
201
- return oldBox;
202
- }
203
-
204
- var oldCenterX = oldBox.x + oldBox.width / 2;
205
- var oldCenterY = oldBox.y + oldBox.height / 2;
206
- var newCenterX = newBox.x + newBox.width / 2;
207
- var newCenterY = newBox.y + newBox.height / 2;
208
- var offsetX = oldCenterX - newCenterX;
209
- var offsetY = oldCenterY - newCenterY;
210
- newBox.x += offsetX;
211
- newBox.y += offsetY;
212
- return newBox;
94
+ render() {
95
+ const {
96
+ correct,
97
+ radius,
98
+ hotspotColor,
99
+ id,
100
+ outlineColor,
101
+ x,
102
+ y,
103
+ strokeWidth = 5,
104
+ selectedHotspotColor,
105
+ hoverOutlineColor
106
+ } = this.props;
107
+ const {
108
+ hovered,
109
+ isDragging
110
+ } = this.state;
111
+ // Ensure radius is valid
112
+ const validRadius = isNaN(radius) || radius <= 0 ? 5 : radius;
113
+ return /*#__PURE__*/_react.default.createElement(_reactKonva.Group, {
114
+ onMouseLeave: this.handleMouseLeave,
115
+ onMouseEnter: this.handleMouseEnter,
116
+ padding: 12
117
+ }, /*#__PURE__*/_react.default.createElement(_reactKonva.Circle, {
118
+ ref: this.shapeRef,
119
+ radius: validRadius,
120
+ fill: correct && selectedHotspotColor ? selectedHotspotColor : hotspotColor,
121
+ onClick: this.handleClick,
122
+ onTap: this.handleClick,
123
+ draggable: true,
124
+ stroke: outlineColor,
125
+ strokeWidth: correct ? strokeWidth : 0,
126
+ onDragStart: () => this.setState({
127
+ isDragging: true
128
+ }),
129
+ onDragEnd: this.handleOnDragEnd,
130
+ onTransformStart: () => this.setState({
131
+ isDragging: true
132
+ }),
133
+ onTransformEnd: this.onResizeEnd,
134
+ x: x,
135
+ y: y,
136
+ opacity: 0.5,
137
+ cursor: "pointer"
138
+ }), !isDragging && hovered && /*#__PURE__*/_react.default.createElement(_DeleteWidget.default, {
139
+ id: id,
140
+ radius: validRadius,
141
+ x: x,
142
+ y: y,
143
+ handleWidgetClick: this.handleDelete,
144
+ isCircle: true
145
+ }), this.state.hovered && /*#__PURE__*/_react.default.createElement(_reactKonva.Transformer, {
146
+ borderStroke: hoverOutlineColor || null,
147
+ ref: this.trRef,
148
+ rotateEnabled: false,
149
+ keepRatio: true,
150
+ onTransform: this.onTransform,
151
+ enabledAnchors: ['middle-left', 'middle-right', 'top-center', 'bottom-center'],
152
+ boundBoxFunc: (oldBox, newBox) => {
153
+ // Constraint to prevent resizing too small
154
+ if (newBox.width < 10 || newBox.height < 10) {
155
+ return oldBox;
213
156
  }
214
- }));
215
- }
216
- }]);
217
- return CircleComponent;
218
- }(_react["default"].Component);
219
-
220
- var styles = function styles() {
221
- return {
222
- base: {
223
- cursor: 'pointer',
224
- opacity: 0.5
225
- },
226
- group: {
227
- padding: '12px'
228
- }
229
- };
230
- };
231
-
157
+ const oldCenterX = oldBox.x + oldBox.width / 2;
158
+ const oldCenterY = oldBox.y + oldBox.height / 2;
159
+ const newCenterX = newBox.x + newBox.width / 2;
160
+ const newCenterY = newBox.y + newBox.height / 2;
161
+ const offsetX = oldCenterX - newCenterX;
162
+ const offsetY = oldCenterY - newCenterY;
163
+ newBox.x += offsetX;
164
+ newBox.y += offsetY;
165
+ return newBox;
166
+ }
167
+ }));
168
+ }
169
+ }
232
170
  CircleComponent.propTypes = {
233
- classes: _propTypes["default"].object.isRequired,
234
- correct: _propTypes["default"].bool,
235
- isDrawing: _propTypes["default"].bool.isRequired,
236
- id: _propTypes["default"].string.isRequired,
237
- radius: _propTypes["default"].number.isRequired,
238
- hotspotColor: _propTypes["default"].string.isRequired,
239
- selectedHotspotColor: _propTypes["default"].string,
240
- hoverOutlineColor: _propTypes["default"].string,
241
- onClick: _propTypes["default"].func.isRequired,
242
- onDeleteShape: _propTypes["default"].func.isRequired,
243
- onDragEnd: _propTypes["default"].func.isRequired,
244
- outlineColor: _propTypes["default"].string.isRequired,
245
- x: _propTypes["default"].number.isRequired,
246
- y: _propTypes["default"].number.isRequired,
247
- strokeWidth: _propTypes["default"].number
171
+ correct: _propTypes.default.bool,
172
+ isDrawing: _propTypes.default.bool.isRequired,
173
+ id: _propTypes.default.string.isRequired,
174
+ radius: _propTypes.default.number.isRequired,
175
+ hotspotColor: _propTypes.default.string.isRequired,
176
+ selectedHotspotColor: _propTypes.default.string,
177
+ hoverOutlineColor: _propTypes.default.string,
178
+ onClick: _propTypes.default.func.isRequired,
179
+ onDeleteShape: _propTypes.default.func.isRequired,
180
+ onDragEnd: _propTypes.default.func.isRequired,
181
+ outlineColor: _propTypes.default.string.isRequired,
182
+ x: _propTypes.default.number.isRequired,
183
+ y: _propTypes.default.number.isRequired,
184
+ strokeWidth: _propTypes.default.number
248
185
  };
249
186
  CircleComponent.defaultProps = {
250
187
  correct: false
251
188
  };
252
-
253
- var _default = (0, _styles.withStyles)(styles)(CircleComponent);
254
-
255
- exports["default"] = _default;
189
+ var _default = exports.default = CircleComponent;
256
190
  //# sourceMappingURL=hotspot-circle.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hotspot-circle.jsx"],"names":["CircleComponent","props","e","radius","isDrawing","onClick","id","cancelBubble","document","body","style","cursor","setState","hovered","trRef","current","setNode","shapeRef","getLayer","batchDraw","onDragEnd","isDragging","x","target","y","node","scale","scaleX","scaleY","newRadius","Math","max","onDeleteShape","avgScale","state","React","createRef","classes","correct","hotspotColor","outlineColor","strokeWidth","selectedHotspotColor","hoverOutlineColor","validRadius","isNaN","group","handleMouseLeave","handleMouseEnter","base","handleClick","handleOnDragEnd","onResizeEnd","handleDelete","onTransform","oldBox","newBox","width","height","oldCenterX","oldCenterY","newCenterX","newCenterY","offsetX","offsetY","Component","styles","opacity","padding","propTypes","PropTypes","object","isRequired","bool","string","number","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Circle, Group, Rect, Transformer } from 'react-konva';\nimport { withStyles } from '@material-ui/core/styles';\nimport DeleteWidget from './DeleteWidget';\n\nclass CircleComponent extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n hovered: false,\n isDragging: false,\n };\n this.shapeRef = React.createRef();\n this.trRef = React.createRef();\n }\n\n handleClick = (e) => {\n const { radius, isDrawing, onClick, id } = this.props;\n if (radius <= 0 && isDrawing) {\n return;\n }\n e.cancelBubble = true;\n onClick(id);\n };\n\n handleMouseEnter = () => {\n document.body.style.cursor = 'pointer';\n this.setState({ hovered: true });\n this.trRef.current.setNode(this.shapeRef.current);\n this.trRef.current.getLayer().batchDraw();\n };\n\n handleMouseLeave = () => {\n this.setState({ hovered: false });\n document.body.style.cursor = 'default';\n };\n\n handleOnDragEnd = (e) => {\n const { onDragEnd, id } = this.props;\n this.setState({ isDragging: false });\n onDragEnd(id, {\n x: e.target.x(),\n y: e.target.y(),\n });\n };\n\n onResizeEnd = () => {\n const { onDragEnd, id } = this.props;\n const node = this.shapeRef.current;\n\n const scale = node.scaleX() !== 1 ? node.scaleX() : node.scaleY();\n const newRadius = Math.max(node.radius() * scale, 5);\n\n this.setState({ isDragging: false });\n onDragEnd(id, {\n x: node.x(),\n y: node.y(),\n radius: newRadius,\n });\n\n node.scaleX(1);\n node.scaleY(1);\n };\n\n handleDelete = (id) => {\n const { onDeleteShape } = this.props;\n onDeleteShape(id);\n };\n\n onTransform = () => {\n const node = this.shapeRef.current;\n const avgScale = (node.scaleX() + node.scaleY()) / 2;\n node.scaleX(avgScale);\n node.scaleY(avgScale);\n };\n\n render() {\n const {\n classes,\n correct,\n radius,\n hotspotColor,\n id,\n outlineColor,\n x,\n y,\n strokeWidth = 5,\n selectedHotspotColor,\n hoverOutlineColor,\n } = this.props;\n\n const { hovered, isDragging } = this.state;\n // Ensure radius is valid\n const validRadius = isNaN(radius) || radius <= 0 ? 5 : radius;\n\n return (\n <Group classes={classes.group} onMouseLeave={this.handleMouseLeave} onMouseEnter={this.handleMouseEnter}>\n <Circle\n classes={classes.base}\n ref={this.shapeRef}\n radius={validRadius}\n fill={correct && selectedHotspotColor ? selectedHotspotColor : hotspotColor}\n onClick={this.handleClick}\n onTap={this.handleClick}\n draggable\n stroke={outlineColor}\n strokeWidth={correct ? strokeWidth : 0}\n onDragStart={() => this.setState({ isDragging: true })}\n onDragEnd={this.handleOnDragEnd}\n onTransformStart={() => this.setState({ isDragging: true })}\n onTransformEnd={this.onResizeEnd}\n x={x}\n y={y}\n />\n\n {!isDragging && hovered && (\n <DeleteWidget\n id={id}\n radius={validRadius}\n x={x}\n y={y}\n handleWidgetClick={this.handleDelete}\n isCircle={true}\n />\n )}\n {this.state.hovered && (\n <Transformer\n borderStroke={hoverOutlineColor || null}\n ref={this.trRef}\n rotateEnabled={false}\n keepRatio={true}\n onTransform={this.onTransform}\n enabledAnchors={['middle-left', 'middle-right', 'top-center', 'bottom-center']}\n boundBoxFunc={(oldBox, newBox) => {\n // Constraint to prevent resizing too small\n if (newBox.width < 10 || newBox.height < 10) {\n return oldBox;\n }\n\n const oldCenterX = oldBox.x + oldBox.width / 2;\n const oldCenterY = oldBox.y + oldBox.height / 2;\n const newCenterX = newBox.x + newBox.width / 2;\n const newCenterY = newBox.y + newBox.height / 2;\n\n const offsetX = oldCenterX - newCenterX;\n const offsetY = oldCenterY - newCenterY;\n\n newBox.x += offsetX;\n newBox.y += offsetY;\n\n return newBox;\n }}\n />\n )}\n </Group>\n );\n }\n}\n\nconst styles = () => ({\n base: {\n cursor: 'pointer',\n opacity: 0.5,\n },\n\n group: {\n padding: '12px',\n },\n});\n\nCircleComponent.propTypes = {\n classes: PropTypes.object.isRequired,\n correct: PropTypes.bool,\n isDrawing: PropTypes.bool.isRequired,\n id: PropTypes.string.isRequired,\n radius: PropTypes.number.isRequired,\n hotspotColor: PropTypes.string.isRequired,\n selectedHotspotColor: PropTypes.string,\n hoverOutlineColor: PropTypes.string,\n onClick: PropTypes.func.isRequired,\n onDeleteShape: PropTypes.func.isRequired,\n onDragEnd: PropTypes.func.isRequired,\n outlineColor: PropTypes.string.isRequired,\n x: PropTypes.number.isRequired,\n y: PropTypes.number.isRequired,\n strokeWidth: PropTypes.number,\n};\n\nCircleComponent.defaultProps = {\n correct: false,\n};\n\nexport default withStyles(styles)(CircleComponent);\n"],"file":"hotspot-circle.js"}
1
+ {"version":3,"file":"hotspot-circle.js","names":["_react","_interopRequireDefault","require","_propTypes","_reactKonva","_DeleteWidget","CircleComponent","React","Component","constructor","props","_defineProperty2","default","e","radius","isDrawing","onClick","id","cancelBubble","document","body","style","cursor","setState","hovered","trRef","current","setNode","shapeRef","getLayer","batchDraw","onDragEnd","isDragging","x","target","y","node","scale","scaleX","scaleY","newRadius","Math","max","onDeleteShape","avgScale","state","createRef","render","correct","hotspotColor","outlineColor","strokeWidth","selectedHotspotColor","hoverOutlineColor","validRadius","isNaN","createElement","Group","onMouseLeave","handleMouseLeave","onMouseEnter","handleMouseEnter","padding","Circle","ref","fill","handleClick","onTap","draggable","stroke","onDragStart","handleOnDragEnd","onTransformStart","onTransformEnd","onResizeEnd","opacity","handleWidgetClick","handleDelete","isCircle","Transformer","borderStroke","rotateEnabled","keepRatio","onTransform","enabledAnchors","boundBoxFunc","oldBox","newBox","width","height","oldCenterX","oldCenterY","newCenterX","newCenterY","offsetX","offsetY","propTypes","PropTypes","bool","isRequired","string","number","func","defaultProps","_default","exports"],"sources":["../src/hotspot-circle.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Circle, Group, Transformer } from 'react-konva';\nimport DeleteWidget from './DeleteWidget';\n\nclass CircleComponent extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n hovered: false,\n isDragging: false,\n };\n this.shapeRef = React.createRef();\n this.trRef = React.createRef();\n }\n\n handleClick = (e) => {\n const { radius, isDrawing, onClick, id } = this.props;\n if (radius <= 0 && isDrawing) {\n return;\n }\n e.cancelBubble = true;\n onClick(id);\n };\n\n handleMouseEnter = () => {\n document.body.style.cursor = 'pointer';\n this.setState({ hovered: true });\n this.trRef.current.setNode(this.shapeRef.current);\n this.trRef.current.getLayer().batchDraw();\n };\n\n handleMouseLeave = () => {\n this.setState({ hovered: false });\n document.body.style.cursor = 'default';\n };\n\n handleOnDragEnd = (e) => {\n const { onDragEnd, id } = this.props;\n this.setState({ isDragging: false });\n onDragEnd(id, {\n x: e.target.x(),\n y: e.target.y(),\n });\n };\n\n onResizeEnd = () => {\n const { onDragEnd, id } = this.props;\n const node = this.shapeRef.current;\n\n const scale = node.scaleX() !== 1 ? node.scaleX() : node.scaleY();\n const newRadius = Math.max(node.radius() * scale, 5);\n\n this.setState({ isDragging: false });\n onDragEnd(id, {\n x: node.x(),\n y: node.y(),\n radius: newRadius,\n });\n\n node.scaleX(1);\n node.scaleY(1);\n };\n\n handleDelete = (id) => {\n const { onDeleteShape } = this.props;\n onDeleteShape(id);\n };\n\n onTransform = () => {\n const node = this.shapeRef.current;\n const avgScale = (node.scaleX() + node.scaleY()) / 2;\n node.scaleX(avgScale);\n node.scaleY(avgScale);\n };\n\n render() {\n const {\n correct,\n radius,\n hotspotColor,\n id,\n outlineColor,\n x,\n y,\n strokeWidth = 5,\n selectedHotspotColor,\n hoverOutlineColor,\n } = this.props;\n\n const { hovered, isDragging } = this.state;\n // Ensure radius is valid\n const validRadius = isNaN(radius) || radius <= 0 ? 5 : radius;\n\n return (\n <Group onMouseLeave={this.handleMouseLeave} onMouseEnter={this.handleMouseEnter} padding={12}>\n <Circle\n ref={this.shapeRef}\n radius={validRadius}\n fill={correct && selectedHotspotColor ? selectedHotspotColor : hotspotColor}\n onClick={this.handleClick}\n onTap={this.handleClick}\n draggable\n stroke={outlineColor}\n strokeWidth={correct ? strokeWidth : 0}\n onDragStart={() => this.setState({ isDragging: true })}\n onDragEnd={this.handleOnDragEnd}\n onTransformStart={() => this.setState({ isDragging: true })}\n onTransformEnd={this.onResizeEnd}\n x={x}\n y={y}\n opacity={0.5}\n cursor=\"pointer\"\n />\n\n {!isDragging && hovered && (\n <DeleteWidget\n id={id}\n radius={validRadius}\n x={x}\n y={y}\n handleWidgetClick={this.handleDelete}\n isCircle={true}\n />\n )}\n {this.state.hovered && (\n <Transformer\n borderStroke={hoverOutlineColor || null}\n ref={this.trRef}\n rotateEnabled={false}\n keepRatio={true}\n onTransform={this.onTransform}\n enabledAnchors={['middle-left', 'middle-right', 'top-center', 'bottom-center']}\n boundBoxFunc={(oldBox, newBox) => {\n // Constraint to prevent resizing too small\n if (newBox.width < 10 || newBox.height < 10) {\n return oldBox;\n }\n\n const oldCenterX = oldBox.x + oldBox.width / 2;\n const oldCenterY = oldBox.y + oldBox.height / 2;\n const newCenterX = newBox.x + newBox.width / 2;\n const newCenterY = newBox.y + newBox.height / 2;\n\n const offsetX = oldCenterX - newCenterX;\n const offsetY = oldCenterY - newCenterY;\n\n newBox.x += offsetX;\n newBox.y += offsetY;\n\n return newBox;\n }}\n />\n )}\n </Group>\n );\n }\n}\n\nCircleComponent.propTypes = {\n correct: PropTypes.bool,\n isDrawing: PropTypes.bool.isRequired,\n id: PropTypes.string.isRequired,\n radius: PropTypes.number.isRequired,\n hotspotColor: PropTypes.string.isRequired,\n selectedHotspotColor: PropTypes.string,\n hoverOutlineColor: PropTypes.string,\n onClick: PropTypes.func.isRequired,\n onDeleteShape: PropTypes.func.isRequired,\n onDragEnd: PropTypes.func.isRequired,\n outlineColor: PropTypes.string.isRequired,\n x: PropTypes.number.isRequired,\n y: PropTypes.number.isRequired,\n strokeWidth: PropTypes.number,\n};\n\nCircleComponent.defaultProps = {\n correct: false,\n};\n\nexport default CircleComponent;\n"],"mappings":"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","ignoreList":[]}