@searpent/react-image-annotate 2.0.75 → 2.0.76

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 (224) hide show
  1. package/.babelrc +6 -0
  2. package/.env +1 -0
  3. package/.flowconfig +2 -0
  4. package/.github/workflows/release-on-master.yml +32 -0
  5. package/.github/workflows/test.yml +16 -0
  6. package/.prettierrc +3 -0
  7. package/.releaserc.js +18 -0
  8. package/.storybook/addons.js +2 -0
  9. package/.storybook/config.js +16 -0
  10. package/LICENSE +21 -0
  11. package/package.json +1 -1
  12. package/public/favicon.ico +0 -0
  13. package/public/index.html +38 -0
  14. package/src/Annotator/bike-pic.png +0 -0
  15. package/src/Annotator/bike-pic2.png +0 -0
  16. package/src/Annotator/dab-keyframes.story.json +1 -0
  17. package/src/Annotator/exampleImages.js +48 -0
  18. package/src/Annotator/examplePhotos.js +7603 -0
  19. package/src/Annotator/index.js +380 -0
  20. package/src/Annotator/index.story.js +877 -0
  21. package/src/Annotator/poses.story.js +150 -0
  22. package/src/Annotator/reducers/combine-reducers.js +7 -0
  23. package/src/Annotator/reducers/convert-expanding-line-to-polygon.js +53 -0
  24. package/{Annotator → src/Annotator}/reducers/fix-twisted.js +5 -3
  25. package/src/Annotator/reducers/general-reducer.js +1228 -0
  26. package/src/Annotator/reducers/get-active-image.js +21 -0
  27. package/src/Annotator/reducers/get-implied-video-regions.js +115 -0
  28. package/src/Annotator/reducers/history-handler.js +60 -0
  29. package/src/Annotator/reducers/image-reducer.js +23 -0
  30. package/src/Annotator/reducers/video-reducer.js +85 -0
  31. package/src/Annotator/video.story.js +51 -0
  32. package/src/ClassSelectionMenu/index.js +112 -0
  33. package/src/Crosshairs/index.js +64 -0
  34. package/src/DebugSidebarBox/index.js +36 -0
  35. package/src/DemoSite/Editor.js +235 -0
  36. package/src/DemoSite/ErrorBoundaryDialog.js +34 -0
  37. package/src/DemoSite/index.js +41 -0
  38. package/src/DemoSite/index.story.js +10 -0
  39. package/src/DemoSite/simple-segmentation-example.json +572 -0
  40. package/src/Editor/annotation-plugin/annotation.js +536 -0
  41. package/src/Editor/index.js +50 -0
  42. package/src/Editor/readOnly.js +21 -0
  43. package/{Editor → src/Editor}/tools.js +3 -2
  44. package/src/Errorer/index.js +13 -0
  45. package/src/FullImageSegmentationAnnotator/hard1.story.jpg +0 -0
  46. package/src/FullImageSegmentationAnnotator/hard2.story.jpg +0 -0
  47. package/src/FullImageSegmentationAnnotator/hard3.story.jpg +0 -0
  48. package/src/FullImageSegmentationAnnotator/index.js +7 -0
  49. package/src/FullImageSegmentationAnnotator/index.story.js +177 -0
  50. package/src/FullImageSegmentationAnnotator/orange.story.png +0 -0
  51. package/src/GroupSelectorSidebarBox/index.js +48 -0
  52. package/src/GroupsEditorSidebarBox/index.js +108 -0
  53. package/src/HelpSidebarBox/index.js +43 -0
  54. package/src/HighlightBox/index.js +143 -0
  55. package/src/HistorySidebarBox/index.js +78 -0
  56. package/src/ImageCanvas/dancing-man.story.jpg +0 -0
  57. package/src/ImageCanvas/index.js +515 -0
  58. package/src/ImageCanvas/index.story.js +314 -0
  59. package/src/ImageCanvas/mouse_mask.story.png +0 -0
  60. package/src/ImageCanvas/region-tools.js +171 -0
  61. package/src/ImageCanvas/seves_desk.story.jpg +0 -0
  62. package/{ImageCanvas → src/ImageCanvas}/styles.js +8 -12
  63. package/src/ImageCanvas/use-mouse.js +168 -0
  64. package/src/ImageCanvas/use-project-box.js +23 -0
  65. package/src/ImageCanvas/use-wasd-mode.js +50 -0
  66. package/src/ImageMask/index.js +127 -0
  67. package/src/ImageMask/load-image.js +32 -0
  68. package/src/ImageSelectorSidebarBox/index.js +54 -0
  69. package/src/KeyframeTimeline/get-time-string.js +25 -0
  70. package/src/KeyframeTimeline/index.js +223 -0
  71. package/src/KeyframesSelectorSidebarBox/index.js +93 -0
  72. package/src/LandingPage/content.md +57 -0
  73. package/src/LandingPage/github-markdown.css +964 -0
  74. package/src/LandingPage/index.js +147 -0
  75. package/src/Locker/index.js +13 -0
  76. package/src/MainLayout/RightSidebarItemsWrapper.js +21 -0
  77. package/src/MainLayout/icon-dictionary.js +79 -0
  78. package/src/MainLayout/index.js +564 -0
  79. package/src/MainLayout/index.story.js +240 -0
  80. package/{MainLayout → src/MainLayout}/styles.js +7 -6
  81. package/src/MainLayout/types.js +171 -0
  82. package/src/MainLayout/use-implied-video-regions.js +17 -0
  83. package/src/MetadataEditorSidebarBox/index.js +160 -0
  84. package/src/PageSelector/index.js +159 -0
  85. package/src/PointDistances/index.js +90 -0
  86. package/src/PreventScrollToParents/index.js +48 -0
  87. package/src/PreventScrollToParents/index.story.js +23 -0
  88. package/src/RegionLabel/index.js +236 -0
  89. package/{RegionLabel → src/RegionLabel}/styles.js +15 -12
  90. package/src/RegionSelectAndTransformBoxes/index.js +236 -0
  91. package/src/RegionSelectorSidebarBox/index.js +220 -0
  92. package/{RegionSelectorSidebarBox → src/RegionSelectorSidebarBox}/styles.js +14 -13
  93. package/src/RegionShapes/index.js +254 -0
  94. package/src/RegionTags/index.js +136 -0
  95. package/src/SettingsDialog/index.js +58 -0
  96. package/src/SettingsProvider/index.js +57 -0
  97. package/src/Shortcuts/ShortcutField.js +44 -0
  98. package/src/Shortcuts/index.js +129 -0
  99. package/src/ShortcutsManager/index.js +162 -0
  100. package/src/Sidebar/index.js +117 -0
  101. package/src/SidebarBoxContainer/index.js +93 -0
  102. package/src/SmallToolButton/index.js +57 -0
  103. package/src/TagsSidebarBox/index.js +93 -0
  104. package/src/TaskDescriptionSidebarBox/index.js +43 -0
  105. package/src/Theme/index.js +36 -0
  106. package/src/VideoOrImageCanvasBackground/index.js +170 -0
  107. package/src/colors.js +32 -0
  108. package/src/hooks/use-colors.js +75 -0
  109. package/src/hooks/use-event-callback.js +11 -0
  110. package/src/hooks/use-exclude-pattern.js +27 -0
  111. package/src/hooks/use-load-image.js +21 -0
  112. package/src/hooks/use-window-size.js +46 -0
  113. package/{hooks → src/hooks}/xpattern.js +1 -1
  114. package/src/hooks/xpattern.png +0 -0
  115. package/src/index.js +18 -0
  116. package/src/lib.js +7 -0
  117. package/src/screenshot.png +0 -0
  118. package/src/site.css +5 -0
  119. package/src/stories.js +2 -0
  120. package/src/utils/blocks-to-article.js +61 -0
  121. package/{utils → src/utils}/blocks-to-article.test.js +8 -5
  122. package/{utils → src/utils}/default-locked-until.js +1 -2
  123. package/{utils → src/utils}/filter-only-unique.js +1 -1
  124. package/src/utils/get-from-local-storage.js +7 -0
  125. package/src/utils/get-hotkey-help-text.js +11 -0
  126. package/src/utils/get-landmarks-with-transform.js +23 -0
  127. package/src/utils/photosToImages.js +67 -0
  128. package/src/utils/regions-groups.js +19 -0
  129. package/src/utils/regions-to-blocks.js +16 -0
  130. package/src/utils/saveable-actions-enum.js +5 -0
  131. package/src/utils/set-in-local-storage.js +6 -0
  132. package/src/utils/sleep.js +3 -0
  133. package/src/utils/uuid-to-hash.js +5 -0
  134. package/Annotator/exampleImages.js +0 -41
  135. package/Annotator/examplePhotos.js +0 -6980
  136. package/Annotator/index.js +0 -417
  137. package/Annotator/reducers/combine-reducers.js +0 -14
  138. package/Annotator/reducers/convert-expanding-line-to-polygon.js +0 -73
  139. package/Annotator/reducers/general-reducer.js +0 -1430
  140. package/Annotator/reducers/get-active-image.js +0 -27
  141. package/Annotator/reducers/get-implied-video-regions.js +0 -180
  142. package/Annotator/reducers/history-handler.js +0 -38
  143. package/Annotator/reducers/image-reducer.js +0 -20
  144. package/Annotator/reducers/video-reducer.js +0 -88
  145. package/ClassSelectionMenu/index.js +0 -140
  146. package/Crosshairs/index.js +0 -53
  147. package/DebugSidebarBox/index.js +0 -20
  148. package/DemoSite/Editor.js +0 -194
  149. package/DemoSite/ErrorBoundaryDialog.js +0 -64
  150. package/DemoSite/index.js +0 -40
  151. package/Editor/annotation-plugin/annotation.js +0 -647
  152. package/Editor/index.js +0 -93
  153. package/Editor/readOnly.js +0 -73
  154. package/Errorer/index.js +0 -11
  155. package/FullImageSegmentationAnnotator/index.js +0 -7
  156. package/GroupSelectorSidebarBox/index.js +0 -63
  157. package/GroupsEditorSidebarBox/index.js +0 -138
  158. package/HelpSidebarBox/index.js +0 -58
  159. package/HighlightBox/index.js +0 -102
  160. package/HistorySidebarBox/index.js +0 -71
  161. package/ImageCanvas/index.js +0 -441
  162. package/ImageCanvas/region-tools.js +0 -165
  163. package/ImageCanvas/use-mouse.js +0 -180
  164. package/ImageCanvas/use-project-box.js +0 -27
  165. package/ImageCanvas/use-wasd-mode.js +0 -62
  166. package/ImageMask/index.js +0 -133
  167. package/ImageMask/load-image.js +0 -25
  168. package/ImageSelectorSidebarBox/index.js +0 -60
  169. package/KeyframeTimeline/get-time-string.js +0 -27
  170. package/KeyframeTimeline/index.js +0 -233
  171. package/KeyframesSelectorSidebarBox/index.js +0 -93
  172. package/LandingPage/index.js +0 -159
  173. package/Locker/index.js +0 -11
  174. package/MainLayout/RightSidebarItemsWrapper.js +0 -19
  175. package/MainLayout/icon-dictionary.js +0 -104
  176. package/MainLayout/index.js +0 -526
  177. package/MainLayout/types.js +0 -0
  178. package/MainLayout/use-implied-video-regions.js +0 -13
  179. package/MetadataEditorSidebarBox/index.js +0 -231
  180. package/PageSelector/index.js +0 -180
  181. package/PointDistances/index.js +0 -73
  182. package/PreventScrollToParents/index.js +0 -51
  183. package/RegionLabel/index.js +0 -232
  184. package/RegionSelectAndTransformBoxes/index.js +0 -169
  185. package/RegionSelectorSidebarBox/index.js +0 -254
  186. package/RegionShapes/index.js +0 -294
  187. package/RegionTags/index.js +0 -144
  188. package/SettingsDialog/index.js +0 -52
  189. package/SettingsProvider/index.js +0 -60
  190. package/Shortcuts/ShortcutField.js +0 -46
  191. package/Shortcuts/index.js +0 -133
  192. package/ShortcutsManager/index.js +0 -155
  193. package/Sidebar/index.js +0 -69
  194. package/SidebarBoxContainer/index.js +0 -93
  195. package/SmallToolButton/index.js +0 -42
  196. package/TagsSidebarBox/index.js +0 -105
  197. package/TaskDescriptionSidebarBox/index.js +0 -58
  198. package/Theme/index.js +0 -30
  199. package/VideoOrImageCanvasBackground/index.js +0 -151
  200. package/colors.js +0 -14
  201. package/hooks/use-colors.js +0 -97
  202. package/hooks/use-event-callback.js +0 -10
  203. package/hooks/use-exclude-pattern.js +0 -24
  204. package/hooks/use-load-image.js +0 -26
  205. package/hooks/use-window-size.js +0 -46
  206. package/index.js +0 -3
  207. package/lib.js +0 -3
  208. package/stories.js +0 -5
  209. package/utils/blocks-to-article.js +0 -60
  210. package/utils/get-from-local-storage.js +0 -7
  211. package/utils/get-hotkey-help-text.js +0 -9
  212. package/utils/get-landmarks-with-transform.js +0 -40
  213. package/utils/photosToImages.js +0 -85
  214. package/utils/regions-groups.js +0 -28
  215. package/utils/regions-to-blocks.js +0 -18
  216. package/utils/saveable-actions-enum.js +0 -3
  217. package/utils/set-in-local-storage.js +0 -3
  218. package/utils/sleep.js +0 -7
  219. package/utils/uuid-to-hash.js +0 -5
  220. /package/{Editor → src/Editor}/annotation-plugin/annotation.css +0 -0
  221. /package/{Errorer → src/Errorer}/errorer.css +0 -0
  222. /package/{Locker → src/Locker}/locker.css +0 -0
  223. /package/{PageSelector → src/PageSelector}/page-selector.css +0 -0
  224. /package/{utils → src/utils}/next-group-id.js +0 -0
@@ -1,526 +0,0 @@
1
- import _objectSpread from "@babel/runtime/helpers/esm/objectSpread";
2
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
- import { FullScreen, useFullScreenHandle } from "react-full-screen";
4
- import React, { useCallback, useMemo, useRef } from "react";
5
- import { makeStyles } from "@mui/styles";
6
- import { createTheme, ThemeProvider } from "@mui/material/styles";
7
- import { styled } from "@mui/material/styles";
8
- import ClassSelectionMenu from "../ClassSelectionMenu";
9
- import DebugBox from "../DebugSidebarBox";
10
- import HistorySidebarBox from "../HistorySidebarBox";
11
- import ImageCanvas from "../ImageCanvas";
12
- import ImageSelector from "../ImageSelectorSidebarBox";
13
- import GroupSelector from "../GroupSelectorSidebarBox";
14
- import KeyframeTimeline from "../KeyframeTimeline";
15
- import KeyframesSelector from "../KeyframesSelectorSidebarBox";
16
- import RegionSelector from "../RegionSelectorSidebarBox";
17
- import SettingsDialog from "../SettingsDialog";
18
- import TagsSidebarBox from "../TagsSidebarBox";
19
- import TaskDescription from "../TaskDescriptionSidebarBox";
20
- import Help from "../HelpSidebarBox";
21
- import MetadataEditor from "../MetadataEditorSidebarBox";
22
- import GroupsEditor from "../GroupsEditorSidebarBox";
23
- import Workspace from "react-material-workspace-layout/Workspace";
24
- import classnames from "classnames";
25
- import getActiveImage from "../Annotator/reducers/get-active-image";
26
- import getHotkeyHelpText from "../utils/get-hotkey-help-text";
27
- import iconDictionary from "./icon-dictionary";
28
- import styles from "./styles";
29
- import { useDispatchHotkeyHandlers } from "../ShortcutsManager";
30
- import useEventCallback from "use-event-callback";
31
- import useImpliedVideoRegions from "./use-implied-video-regions";
32
- import useKey from "use-key-hook";
33
- import { useSettings } from "../SettingsProvider";
34
- import { withHotKeys } from "react-hotkeys";
35
- import Editor from "../Editor";
36
- import regionsToBlocks from '../utils/regions-to-blocks';
37
- import PageSelector from "../PageSelector";
38
- import regionsGroups from '../utils/regions-groups';
39
- import RightSidebarItemsWrapper from './RightSidebarItemsWrapper';
40
- import Locker from '../Locker';
41
- import { reacalcActionsEnum } from "../utils/saveable-actions-enum";
42
- import intersection from "lodash/intersection";
43
- import useColors from '../hooks/use-colors'; // import Fullscreen from "../Fullscreen"
44
-
45
- var emptyArr = [];
46
- var theme = createTheme();
47
- var useStyles = makeStyles(function (theme) {
48
- return styles;
49
- });
50
- var HotkeyDiv = withHotKeys(function (_ref) {
51
- var hotKeys = _ref.hotKeys,
52
- children = _ref.children,
53
- divRef = _ref.divRef,
54
- props = _objectWithoutProperties(_ref, ["hotKeys", "children", "divRef"]);
55
-
56
- return React.createElement("div", Object.assign({}, _objectSpread({}, hotKeys, props), {
57
- ref: divRef
58
- }), children);
59
- });
60
- var FullScreenContainer = styled("div")(function (_ref2) {
61
- var theme = _ref2.theme;
62
- return {
63
- width: "100%",
64
- height: "100%",
65
- "& .fullscreen": {
66
- width: "100%",
67
- height: "100%"
68
- }
69
- };
70
- });
71
- var WorkspaceWrapper = styled("div")(function (_ref3) {
72
- var theme = _ref3.theme;
73
- return {
74
- height: "100vh",
75
- width: "auto",
76
- backgroundColor: "red",
77
- flex: 1
78
- };
79
- });
80
- var EditorWrapper = styled("div")(function (_ref4) {
81
- var theme = _ref4.theme;
82
- return {
83
- padding: "1rem",
84
- paddingLeft: "2rem",
85
- height: "100vh",
86
- width: "30vw",
87
- overflowY: "scroll"
88
- };
89
- });
90
- export var MainLayout = function MainLayout(_ref5) {
91
- var _state$images$state$s, _state$images$state$s2, _state$images$state$s3, _state$images$state$s4, _state$images$state$s5;
92
-
93
- var state = _ref5.state,
94
- dispatch = _ref5.dispatch,
95
- _ref5$alwaysShowNextB = _ref5.alwaysShowNextButton,
96
- alwaysShowNextButton = _ref5$alwaysShowNextB === void 0 ? false : _ref5$alwaysShowNextB,
97
- _ref5$alwaysShowPrevB = _ref5.alwaysShowPrevButton,
98
- alwaysShowPrevButton = _ref5$alwaysShowPrevB === void 0 ? false : _ref5$alwaysShowPrevB,
99
- RegionEditLabel = _ref5.RegionEditLabel,
100
- onRegionClassAdded = _ref5.onRegionClassAdded,
101
- hideHeader = _ref5.hideHeader,
102
- hideHeaderText = _ref5.hideHeaderText,
103
- _ref5$hideNext = _ref5.hideNext,
104
- hideNext = _ref5$hideNext === void 0 ? false : _ref5$hideNext,
105
- _ref5$hidePrev = _ref5.hidePrev,
106
- hidePrev = _ref5$hidePrev === void 0 ? false : _ref5$hidePrev,
107
- _ref5$hideClone = _ref5.hideClone,
108
- hideClone = _ref5$hideClone === void 0 ? false : _ref5$hideClone,
109
- _ref5$hideSettings = _ref5.hideSettings,
110
- hideSettings = _ref5$hideSettings === void 0 ? false : _ref5$hideSettings,
111
- _ref5$hideFullScreen = _ref5.hideFullScreen,
112
- hideFullScreen = _ref5$hideFullScreen === void 0 ? false : _ref5$hideFullScreen,
113
- _ref5$hideSave = _ref5.hideSave,
114
- hideSave = _ref5$hideSave === void 0 ? false : _ref5$hideSave,
115
- _ref5$groups = _ref5.groups,
116
- groups = _ref5$groups === void 0 ? [] : _ref5$groups,
117
- _ref5$onGroupSelect = _ref5.onGroupSelect,
118
- onGroupSelect = _ref5$onGroupSelect === void 0 ? function () {} : _ref5$onGroupSelect,
119
- _ref5$hideHistory = _ref5.hideHistory,
120
- hideHistory = _ref5$hideHistory === void 0 ? false : _ref5$hideHistory,
121
- _ref5$hideNotEditingL = _ref5.hideNotEditingLabel,
122
- hideNotEditingLabel = _ref5$hideNotEditingL === void 0 ? false : _ref5$hideNotEditingL,
123
- _ref5$showEditor = _ref5.showEditor,
124
- showEditor = _ref5$showEditor === void 0 ? false : _ref5$showEditor,
125
- _ref5$showPageSelecto = _ref5.showPageSelector,
126
- showPageSelector = _ref5$showPageSelecto === void 0 ? false : _ref5$showPageSelecto,
127
- _ref5$recalcActive = _ref5.recalcActive,
128
- recalcActive = _ref5$recalcActive === void 0 ? false : _ref5$recalcActive,
129
- _ref5$saveActive = _ref5.saveActive,
130
- saveActive = _ref5$saveActive === void 0 ? false : _ref5$saveActive,
131
- onMetadataChange = _ref5.onMetadataChange,
132
- onAddGroup = _ref5.onAddGroup,
133
- onRecalcClick = _ref5.onRecalcClick;
134
- var classes = useStyles();
135
- var settings = useSettings();
136
- var fullScreenHandle = useFullScreenHandle();
137
-
138
- var _useColors = useColors(),
139
- clsColor = _useColors.clsColor;
140
-
141
- var memoizedActionFns = useRef({});
142
-
143
- var action = function action(type) {
144
- for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
145
- params[_key - 1] = arguments[_key];
146
- }
147
-
148
- var fnKey = "".concat(type, "(").concat(params.join(","), ")");
149
- if (memoizedActionFns.current[fnKey]) return memoizedActionFns.current[fnKey];
150
-
151
- var fn = function fn() {
152
- for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
153
- args[_key2] = arguments[_key2];
154
- }
155
-
156
- return params.length > 0 ? dispatch(_objectSpread({
157
- type: type
158
- }, params.reduce(function (acc, p, i) {
159
- return acc[p] = args[i], acc;
160
- }, {}))) : dispatch(_objectSpread({
161
- type: type
162
- }, args[0]));
163
- };
164
-
165
- memoizedActionFns.current[fnKey] = fn;
166
- return fn;
167
- };
168
-
169
- var _getActiveImage = getActiveImage(state),
170
- currentImageIndex = _getActiveImage.currentImageIndex,
171
- activeImage = _getActiveImage.activeImage;
172
-
173
- var nextImage;
174
-
175
- if (currentImageIndex !== null) {
176
- nextImage = state.images[currentImageIndex + 1];
177
- }
178
-
179
- useKey(function () {
180
- return dispatch({
181
- type: "CANCEL"
182
- });
183
- }, {
184
- detectKeys: [27]
185
- });
186
- var isAVideoFrame = activeImage && activeImage.frameTime !== undefined;
187
- var innerContainerRef = useRef();
188
- var hotkeyHandlers = useDispatchHotkeyHandlers({
189
- dispatch: dispatch
190
- });
191
- var impliedVideoRegions = useImpliedVideoRegions(state);
192
- var refocusOnMouseEvent = useCallback(function (e) {
193
- if (!innerContainerRef.current) return;
194
- if (innerContainerRef.current.contains(document.activeElement)) return;
195
-
196
- if (innerContainerRef.current.contains(e.target)) {
197
- innerContainerRef.current.focus();
198
- e.target.focus();
199
- }
200
- }, []);
201
- var allowedGroups = useMemo(function () {
202
- return regionsGroups(state.images[state.selectedImage].regions);
203
- }, [state.images, state.selectedImage]);
204
- var canvas = React.createElement(ImageCanvas, Object.assign({}, settings, {
205
- showCrosshairs: settings.showCrosshairs && !["select", "pan", "zoom"].includes(state.selectedTool),
206
- key: state.selectedImage,
207
- showMask: state.showMask,
208
- fullImageSegmentationMode: state.fullImageSegmentationMode,
209
- autoSegmentationOptions: state.autoSegmentationOptions,
210
- showTags: state.showTags,
211
- allowedArea: state.allowedArea,
212
- modifyingAllowedArea: state.selectedTool === "modify-allowed-area",
213
- regionClsList: state.regionClsList,
214
- regionTagList: state.regionTagList,
215
- regions: state.annotationType === "image" ? activeImage.regions || [] : impliedVideoRegions,
216
- realSize: activeImage ? activeImage.realSize : undefined,
217
- videoPlaying: state.videoPlaying,
218
- imageSrc: state.annotationType === "image" ? activeImage.src : null,
219
- videoSrc: state.annotationType === "video" ? state.videoSrc : null,
220
- pointDistancePrecision: state.pointDistancePrecision,
221
- createWithPrimary: state.selectedTool.includes("create"),
222
- dragWithPrimary: state.selectedTool === "pan",
223
- zoomWithPrimary: state.selectedTool === "zoom",
224
- showPointDistances: state.showPointDistances,
225
- videoTime: state.annotationType === "image" ? state.selectedImageFrameTime : state.currentVideoTime,
226
- keypointDefinitions: state.keypointDefinitions,
227
- onMouseMove: action("MOUSE_MOVE"),
228
- onMouseDown: action("MOUSE_DOWN"),
229
- onMouseUp: action("MOUSE_UP"),
230
- onChangeRegion: action("CHANGE_REGION", "region"),
231
- onBeginRegionEdit: action("OPEN_REGION_EDITOR", "region"),
232
- onCloseRegionEdit: action("CLOSE_REGION_EDITOR", "region"),
233
- onDeleteRegion: action("DELETE_REGION", "region"),
234
- onDeleteGroup: action("DELETE_GROUP", "groupId"),
235
- onBeginBoxTransform: action("BEGIN_BOX_TRANSFORM", "box", "directions"),
236
- onResetZoom: function onResetZoom() {
237
- return dispatch({
238
- type: "ZOOM_RESET"
239
- });
240
- },
241
- onBeginMovePolygonPoint: action("BEGIN_MOVE_POLYGON_POINT", "polygon", "pointIndex"),
242
- onBeginMoveKeypoint: action("BEGIN_MOVE_KEYPOINT", "region", "keypointId"),
243
- onAddPolygonPoint: action("ADD_POLYGON_POINT", "polygon", "point", "pointIndex"),
244
- onSelectRegion: action("SELECT_REGION", "region"),
245
- onBeginMovePoint: action("BEGIN_MOVE_POINT", "point"),
246
- onImageLoaded: action("IMAGE_LOADED", "image"),
247
- RegionEditLabel: RegionEditLabel,
248
- onImageOrVideoLoaded: action("IMAGE_OR_VIDEO_LOADED", "metadata"),
249
- onChangeVideoTime: action("CHANGE_VIDEO_TIME", "newTime"),
250
- onChangeVideoPlaying: action("CHANGE_VIDEO_PLAYING", "isPlaying"),
251
- onRegionClassAdded: onRegionClassAdded,
252
- allowComments: state.allowComments,
253
- hideNotEditingLabel: hideNotEditingLabel,
254
- allowedGroups: allowedGroups
255
- }));
256
- var onClickIconSidebarItem = useEventCallback(function (item) {
257
- dispatch({
258
- type: "SELECT_TOOL",
259
- selectedTool: item.name
260
- });
261
- });
262
- var onClickHeaderItem = useEventCallback(function (item) {
263
- if (item.name === "Fullscreen") {
264
- fullScreenHandle.enter();
265
- } else if (item.name === "Window") {
266
- fullScreenHandle.exit();
267
- }
268
-
269
- dispatch({
270
- type: "HEADER_BUTTON_CLICKED",
271
- buttonName: item.name
272
- });
273
- });
274
- var debugModeOn = Boolean(window.localStorage.$ANNOTATE_DEBUG_MODE && state);
275
- var nextImageHasRegions = !nextImage || nextImage.regions && nextImage.regions.length > 0; // Editor.js blocks
276
-
277
- var selectedGroupId = ((_state$images$state$s = state.images[state.selectedImage]) === null || _state$images$state$s === void 0 ? void 0 : _state$images$state$s.selectedGroupId) || null;
278
- var extractionEngineRegions = (((_state$images$state$s2 = state.images[state.selectedImage]) === null || _state$images$state$s2 === void 0 ? void 0 : _state$images$state$s2.regions) || []).filter(function (r) {
279
- return r.cls !== 'metadata';
280
- });
281
- var editorBlocks = regionsToBlocks(extractionEngineRegions, clsColor);
282
- var blocks = editorBlocks.filter(function (i) {
283
- var _i$data;
284
-
285
- return (i === null || i === void 0 ? void 0 : (_i$data = i.data) === null || _i$data === void 0 ? void 0 : _i$data.groupId) === selectedGroupId;
286
- });
287
-
288
- var handleEditorChange = function handleEditorChange(_ref6) {
289
- var imageIndex = _ref6.imageIndex,
290
- data = _ref6.data;
291
- var newRegions = data.blocks.map(function (i) {
292
- return {
293
- id: i.id,
294
- cls: i.data.labelName,
295
- text: i.data.text
296
- };
297
- });
298
- dispatch({
299
- type: "UPDATE_REGIONS",
300
- regions: newRegions,
301
- imageIndex: imageIndex
302
- });
303
- };
304
-
305
- var pages = state.images.map(function (i, idx) {
306
- var _i$metadata, _i$metadata$find;
307
-
308
- return {
309
- id: "".concat(i.id),
310
- src: i.thumbnail,
311
- isActive: idx === state.selectedImage,
312
- pageNumber: (i === null || i === void 0 ? void 0 : (_i$metadata = i.metadata) === null || _i$metadata === void 0 ? void 0 : (_i$metadata$find = _i$metadata.find(function (md) {
313
- return md.key === "pageNumber";
314
- })) === null || _i$metadata$find === void 0 ? void 0 : _i$metadata$find.value) || null,
315
- metadata: i.metadata || [],
316
- lockedUntil: i.lockedUntil,
317
- syncError: i.syncError || null,
318
- isRecalcReady: intersection(reacalcActionsEnum, state.images[idx].saveableActions).length > 0
319
- };
320
- });
321
-
322
- var handlePageClick = function handlePageClick(pageIndex) {
323
- dispatch({
324
- type: "SELECT_IMAGE",
325
- imageIndex: pageIndex
326
- });
327
- };
328
-
329
- var isSelectedImageLocked = ((_state$images$state$s3 = state.images[state.selectedImage]) === null || _state$images$state$s3 === void 0 ? void 0 : _state$images$state$s3.lockedUntil) ? true : false;
330
- var selectedFrame = ((_state$images$state$s4 = state.images[state.selectedImage]) === null || _state$images$state$s4 === void 0 ? void 0 : (_state$images$state$s5 = _state$images$state$s4.regions.find(function (i) {
331
- return i.highlighted === true;
332
- })) === null || _state$images$state$s5 === void 0 ? void 0 : _state$images$state$s5.id) || '';
333
- return React.createElement(ThemeProvider, {
334
- theme: theme
335
- }, React.createElement(FullScreenContainer, null, React.createElement(FullScreen, {
336
- handle: fullScreenHandle,
337
- onChange: function onChange(open) {
338
- if (!open) {
339
- fullScreenHandle.exit();
340
- action("HEADER_BUTTON_CLICKED", "buttonName")("Window");
341
- }
342
- }
343
- }, React.createElement(HotkeyDiv, {
344
- tabIndex: -1,
345
- divRef: innerContainerRef,
346
- onMouseDown: refocusOnMouseEvent,
347
- onMouseOver: refocusOnMouseEvent,
348
- allowChanges: true,
349
- handlers: hotkeyHandlers,
350
- className: classnames(classes.container, state.fullScreen && "Fullscreen")
351
- }, React.createElement("div", {
352
- style: {
353
- display: 'flex',
354
- flexDirection: 'row'
355
- }
356
- }, showPageSelector && React.createElement(PageSelector, {
357
- pages: pages,
358
- onPageClick: handlePageClick,
359
- onMetadataChange: onMetadataChange,
360
- metadataConfigs: state.metadataConfigs || [],
361
- onRecalcClick: onRecalcClick
362
- }), React.createElement(WorkspaceWrapper, null, React.createElement(Workspace, {
363
- style: {
364
- width: "auto"
365
- },
366
- allowFullscreen: true,
367
- iconDictionary: iconDictionary,
368
- hideHeader: hideHeader,
369
- hideHeaderText: hideHeaderText,
370
- headerLeftSide: [state.annotationType === "video" ? React.createElement(KeyframeTimeline, {
371
- currentTime: state.currentVideoTime,
372
- duration: state.videoDuration,
373
- onChangeCurrentTime: action("CHANGE_VIDEO_TIME", "newTime"),
374
- keyframes: state.keyframes
375
- }) : activeImage ? React.createElement("div", {
376
- className: classes.headerTitle
377
- }, activeImage.name) : null].filter(Boolean),
378
- headerItems: [!hidePrev && {
379
- name: "Prev"
380
- }, !hideNext && {
381
- name: "Next"
382
- }, state.annotationType !== "video" ? null : !state.videoPlaying ? {
383
- name: "Play"
384
- } : {
385
- name: "Pause"
386
- }, !hideClone && !nextImageHasRegions && activeImage.regions && {
387
- name: "Clone"
388
- }, !hideSettings && {
389
- name: "Settings"
390
- }, !hideFullScreen && (state.fullScreen ? {
391
- name: "Window"
392
- } : {
393
- name: "Fullscreen"
394
- }), !hideSave && {
395
- name: "Save"
396
- }].filter(Boolean),
397
- onClickHeaderItem: onClickHeaderItem,
398
- onClickIconSidebarItem: onClickIconSidebarItem,
399
- selectedTools: [state.selectedTool, state.showTags && "show-tags", state.showMask && "show-mask"].filter(Boolean),
400
- iconSidebarItems: !state.enabledTools ? [] : [{
401
- name: "select",
402
- helperText: "Select" + getHotkeyHelpText("select_tool"),
403
- alwaysShowing: false
404
- }, {
405
- name: "pan",
406
- helperText: "Drag/Pan (right or middle click)" + getHotkeyHelpText("pan_tool"),
407
- alwaysShowing: false
408
- }, {
409
- name: "zoom",
410
- helperText: "Zoom In/Out (scroll)" + getHotkeyHelpText("zoom_tool"),
411
- alwaysShowing: false
412
- }, {
413
- name: "show-tags",
414
- helperText: "Show / Hide Tags",
415
- alwaysShowing: false
416
- }, {
417
- name: "create-point",
418
- helperText: "Add Point" + getHotkeyHelpText("create_point")
419
- }, {
420
- name: "create-box",
421
- helperText: "Add Bounding Box" + getHotkeyHelpText("create_bounding_box")
422
- }, {
423
- name: "create-polygon",
424
- helperText: "Add Polygon" + getHotkeyHelpText("create_polygon")
425
- }, {
426
- name: "create-line",
427
- helperText: "Add Line"
428
- }, {
429
- name: "create-expanding-line",
430
- helperText: "Add Expanding Line"
431
- }, {
432
- name: "create-keypoints",
433
- helperText: "Add Keypoints (Pose)"
434
- }, state.fullImageSegmentationMode && {
435
- name: "show-mask",
436
- alwaysShowing: false,
437
- helperText: "Show / Hide Mask"
438
- }, {
439
- name: "modify-allowed-area",
440
- helperText: "Modify Allowed Area"
441
- }].filter(Boolean).filter(function (a) {
442
- return a.alwaysShowing || state.enabledTools.includes(a.name);
443
- }),
444
- rightSidebarItems: [React.createElement(RightSidebarItemsWrapper, null, [isSelectedImageLocked && React.createElement(Locker, null), debugModeOn && React.createElement(DebugBox, {
445
- state: debugModeOn,
446
- lastAction: state.lastAction,
447
- key: "debug-box"
448
- }), state.taskDescription && React.createElement(TaskDescription, {
449
- description: state.taskDescription,
450
- key: "task-description"
451
- }), state.help && React.createElement(Help, {
452
- help: state.help,
453
- key: "help"
454
- }), state.regionClsList && React.createElement(ClassSelectionMenu, {
455
- selectedCls: state.selectedCls,
456
- regionClsList: state.regionClsList,
457
- onSelectCls: action("SELECT_CLASSIFICATION", "cls"),
458
- key: "class-selection-menu"
459
- }), state.labelImages && React.createElement(TagsSidebarBox, {
460
- currentImage: activeImage,
461
- imageClsList: state.imageClsList,
462
- imageTagList: state.imageTagList,
463
- onChangeImage: action("CHANGE_IMAGE", "delta"),
464
- expandedByDefault: true,
465
- key: "tags-sidebar-box"
466
- }),, // (state.images?.length || 0) > 1 && (
467
- // <ImageSelector
468
- // onSelect={action("SELECT_REGION", "region")}
469
- // images={state.images}
470
- // />
471
- // ),
472
- // groups && (
473
- // <GroupSelector
474
- // title="Articles"
475
- // groups={groups}
476
- // selectedGroupId={selectedGroupId}
477
- // onSelect={onGroupSelect}
478
- // />
479
- // )
480
- React.createElement(RegionSelector, {
481
- regions: activeImage ? activeImage.regions : emptyArr,
482
- onSelectRegion: action("SELECT_REGION", "region"),
483
- onDeleteRegion: action("DELETE_REGION", "region"),
484
- onChangeRegion: action("CHANGE_REGION", "region"),
485
- key: "region-selector"
486
- }), state.keyframes && React.createElement(KeyframesSelector, {
487
- onChangeVideoTime: action("CHANGE_VIDEO_TIME", "newTime"),
488
- onDeleteKeyframe: action("DELETE_KEYFRAME", "time"),
489
- onChangeCurrentTime: action("CHANGE_VIDEO_TIME", "newTime"),
490
- currentTime: state.currentVideoTime,
491
- duration: state.videoDuration,
492
- keyframes: state.keyframes,
493
- key: "key-frame-selector"
494
- }), !hideHistory && React.createElement(HistorySidebarBox, {
495
- history: state.history,
496
- onRestoreHistory: action("RESTORE_HISTORY"),
497
- key: "history-sidebar"
498
- }), React.createElement(MetadataEditor, {
499
- state: state,
500
- onMetadataChange: onMetadataChange,
501
- key: "metadata-editor"
502
- }), React.createElement(GroupsEditor, {
503
- groups: allowedGroups,
504
- onAddGroup: onAddGroup,
505
- key: "groups-editor"
506
- })].filter(Boolean))]
507
- }, isSelectedImageLocked && React.createElement(Locker, null), canvas)), showEditor && !isSelectedImageLocked && React.createElement(EditorWrapper, {
508
- id: "editor-wrapper"
509
- }, React.createElement(Editor, {
510
- id: "editor",
511
- blocks: blocks,
512
- imageIndex: state.selectedImage,
513
- key: "".concat(state.selectedImage, "#").concat(selectedGroupId),
514
- selectedFrame: selectedFrame,
515
- onChange: handleEditorChange
516
- }))), React.createElement(SettingsDialog, {
517
- open: state.settingsOpen,
518
- onClose: function onClose() {
519
- return dispatch({
520
- type: "HEADER_BUTTON_CLICKED",
521
- buttonName: "Settings"
522
- });
523
- }
524
- })))));
525
- };
526
- export default MainLayout;
File without changes
@@ -1,13 +0,0 @@
1
- import { useMemo } from "react";
2
- import getImpliedVideoRegions from "../Annotator/reducers/get-implied-video-regions.js";
3
- var emptyArr = [];
4
- export default (function (state) {
5
- if (state.annotationType !== "video") return emptyArr;
6
- var keyframes = state.keyframes,
7
- _state$currentVideoTi = state.currentVideoTime,
8
- currentVideoTime = _state$currentVideoTi === void 0 ? 0 : _state$currentVideoTi; // TODO memoize
9
-
10
- return useMemo(function () {
11
- return getImpliedVideoRegions(keyframes, currentVideoTime);
12
- }, [keyframes, currentVideoTime]);
13
- });