11// @flow
22
3- import type { Action , Image } from "../MainLayout/types"
4- import React , { useEffect , useReducer } from "react"
5- import Immutable from "seamless-immutable"
3+ import type { Action , Image , MainLayoutState } from "../MainLayout/types" ;
4+ import { useEffect , useReducer } from "react" ;
5+ import Immutable from "seamless-immutable" ;
66
7- import type { KeypointsDefinition } from "../ImageCanvas/region-tools"
8- import MainLayout from "../MainLayout"
9- import SettingsProvider from "../SettingsProvider"
10- import combineReducers from "./reducers/combine-reducers"
11- import generalReducer from "./reducers/general-reducer"
12- import getFromLocalStorage from "../utils/get-from-local-storage"
13- import historyHandler from "./reducers/history-handler"
14- import imageReducer from "./reducers/image-reducer"
15- import useEventCallback from "use-event-callback"
16- import videoReducer from "./reducers/video-reducer"
7+ import type { KeypointsDefinition } from "../ImageCanvas/region-tools" ;
8+ import MainLayout from "../MainLayout" ;
9+ import SettingsProvider from "../SettingsProvider" ;
10+ import combineReducers from "./reducers/combine-reducers" ;
11+ import generalReducer from "./reducers/general-reducer" ;
12+ import getFromLocalStorage from "../utils/get-from-local-storage" ;
13+ import historyHandler from "./reducers/history-handler" ;
14+ import imageReducer from "./reducers/image-reducer" ;
15+ import useEventCallback from "use-event-callback" ;
16+ import videoReducer from "./reducers/video-reducer" ;
17+ import { AutosegOptions } from "autoseg/webworker" ;
1718
18- type Props = {
19- taskDescription ?: string ,
20- allowedArea ?: { x : number , y : number , w : number , h : number } ,
21- regionTagList ?: Array < string > ,
22- regionClsList ?: Array < string > ,
23- imageTagList ?: Array < string > ,
24- imageClsList ?: Array < string > ,
25- enabledTools ?: Array < string > ,
26- selectedTool ?: String ,
27- showTags ?: boolean ,
28- selectedImage ?: string | number ,
29- images ?: Array < Image > ,
30- showPointDistances ?: boolean ,
31- pointDistancePrecision ?: number ,
32- RegionEditLabel ?: Node ,
33- onExit : ( MainLayoutState ) => any ,
34- videoTime ?: number ,
35- videoSrc ?: string ,
36- keyframes ?: Object ,
37- videoName ?: string ,
38- keypointDefinitions : KeypointsDefinition ,
39- fullImageSegmentationMode ?: boolean ,
40- autoSegmentationOptions ?:
41- | { type : "simple" }
42- | { type : "autoseg" , maxClusters ?: number , slicWeightFactor ?: number } ,
43- hideHeader ?: boolean ,
44- hideHeaderText ?: boolean ,
45- hideNext ?: boolean ,
46- hidePrev ?: boolean ,
47- hideClone ?: boolean ,
48- hideSettings ?: boolean ,
49- hideFullScreen ?: boolean ,
50- hideSave ?: boolean ,
51- }
19+ export type AnnotatorProps = {
20+ taskDescription ?: string ;
21+ allowedArea ?: { x : number ; y : number ; w : number ; h : number } ;
22+ regionTagList ?: Array < string > ;
23+ regionClsList ?: Array < string > ;
24+ imageTagList ?: Array < string > ;
25+ imageClsList ?: Array < string > ;
26+ enabledTools ?: Array < string > ;
27+ selectedTool ?: String ;
28+ showTags ?: boolean ;
29+ selectedImage ?: string | number ;
30+ images ?: Array < Image > ;
31+ showPointDistances ?: boolean ;
32+ pointDistancePrecision ?: number ;
33+ RegionEditLabel ?: Node ;
34+ onExit : ( state : MainLayoutState ) => any ;
35+ videoTime ?: number ;
36+ videoSrc ?: string ;
37+ keyframes ?: Object ;
38+ videoName ?: string ;
39+ keypointDefinitions ?: KeypointsDefinition ;
40+ fullImageSegmentationMode ?: boolean ;
41+ autoSegmentationOptions ?: AutosegOptions ;
42+ hideHeader ?: boolean ;
43+ hideHeaderText ?: boolean ;
44+ hideNext ?: boolean ;
45+ hidePrev ?: boolean ;
46+ hideClone ?: boolean ;
47+ hideSettings ?: boolean ;
48+ hideFullScreen ?: boolean ;
49+ hideSave ?: boolean ;
50+ allowComments ?: boolean ;
51+ onNextImage ?: ( state : MainLayoutState ) => void ;
52+ onPrevImage ?: ( state : MainLayoutState ) => void ;
53+ } ;
5254
5355export const Annotator = ( {
54- images,
55- allowedArea,
56- selectedImage = images && images . length > 0 ? 0 : undefined ,
57- showPointDistances,
58- pointDistancePrecision,
59- showTags = getFromLocalStorage ( "showTags" , true ) ,
60- enabledTools = [
61- "select" ,
62- "create-point" ,
63- "create-box" ,
64- "create-polygon" ,
65- "create-line" ,
66- "create-expanding-line" ,
67- "show-mask"
68- ] ,
69- selectedTool = "select" ,
70- regionTagList = [ ] ,
71- regionClsList = [ ] ,
72- imageTagList = [ ] ,
73- imageClsList = [ ] ,
74- keyframes = { } ,
75- taskDescription = "" ,
76- fullImageSegmentationMode = false ,
77- RegionEditLabel,
78- videoSrc,
79- videoTime = 0 ,
80- videoName,
81- onExit,
82- onNextImage,
83- onPrevImage,
84- keypointDefinitions,
85- autoSegmentationOptions = { type : "autoseg" } ,
86- hideHeader,
87- hideHeaderText,
88- hideNext,
89- hidePrev,
90- hideClone,
91- hideSettings,
92- hideFullScreen,
93- hideSave,
94- allowComments
95- } : Props ) => {
56+ images,
57+ allowedArea,
58+ selectedImage = images && images . length > 0 ? 0 : undefined ,
59+ showPointDistances,
60+ pointDistancePrecision,
61+ showTags = getFromLocalStorage ( "showTags" , true ) ,
62+ enabledTools = [
63+ "select" ,
64+ "create-point" ,
65+ "create-box" ,
66+ "create-polygon" ,
67+ "create-line" ,
68+ "create-expanding-line" ,
69+ "show-mask" ,
70+ ] ,
71+ selectedTool = "select" ,
72+ regionTagList = [ ] ,
73+ regionClsList = [ ] ,
74+ imageTagList = [ ] ,
75+ imageClsList = [ ] ,
76+ keyframes = { } ,
77+ taskDescription = "" ,
78+ fullImageSegmentationMode = false ,
79+ RegionEditLabel,
80+ videoSrc,
81+ videoTime = 0 ,
82+ videoName,
83+ onExit,
84+ onNextImage,
85+ onPrevImage,
86+ keypointDefinitions,
87+ autoSegmentationOptions = { type : "autoseg" } ,
88+ hideHeader,
89+ hideHeaderText,
90+ hideNext,
91+ hidePrev,
92+ hideClone,
93+ hideSettings,
94+ hideFullScreen,
95+ hideSave,
96+ allowComments,
97+ } : AnnotatorProps ) => {
9698 if ( typeof selectedImage === "string" ) {
97- selectedImage = ( images || [ ] ) . findIndex ( ( img ) => img . src === selectedImage )
98- if ( selectedImage === - 1 ) selectedImage = undefined
99+ selectedImage = ( images || [ ] ) . findIndex (
100+ ( img ) => img . src === selectedImage
101+ ) ;
102+ if ( selectedImage === - 1 ) selectedImage = undefined ;
99103 }
100- const annotationType = images ? "image" : "video"
104+ const annotationType = images ? "image" : "video" ;
101105 const [ state , dispatchToReducer ] = useReducer (
102106 historyHandler (
103107 combineReducers (
@@ -130,49 +134,49 @@ export const Annotator = ({
130134 allowComments,
131135 ...( annotationType === "image"
132136 ? {
133- selectedImage,
134- images,
135- selectedImageFrameTime :
136- images && images . length > 0 ? images [ 0 ] . frameTime : undefined
137- }
137+ selectedImage,
138+ images,
139+ selectedImageFrameTime :
140+ images && images . length > 0 ? images [ 0 ] . frameTime : undefined ,
141+ }
138142 : {
139- videoSrc,
140- keyframes
141- } )
143+ videoSrc,
144+ keyframes,
145+ } ) ,
142146 } )
143- )
147+ ) ;
144148
145149 const dispatch = useEventCallback ( ( action : Action ) => {
146150 if ( action . type === "HEADER_BUTTON_CLICKED" ) {
147151 if ( [ "Exit" , "Done" , "Save" , "Complete" ] . includes ( action . buttonName ) ) {
148- return onExit ( Immutable ( state ) . without ( "history" ) )
152+ return onExit ( Immutable ( state ) . without ( "history" ) ) ;
149153 } else if ( action . buttonName === "Next" && onNextImage ) {
150- return onNextImage ( Immutable ( state ) . without ( "history" ) )
154+ return onNextImage ( Immutable ( state ) . without ( "history" ) ) ;
151155 } else if ( action . buttonName === "Prev" && onPrevImage ) {
152- return onPrevImage ( Immutable ( state ) . without ( "history" ) )
156+ return onPrevImage ( Immutable ( state ) . without ( "history" ) ) ;
153157 }
154158 }
155- dispatchToReducer ( action )
156- } )
159+ dispatchToReducer ( action ) ;
160+ } ) ;
157161
158162 const onRegionClassAdded = useEventCallback ( ( cls ) => {
159163 dispatchToReducer ( {
160164 type : "ON_CLS_ADDED" ,
161- cls : cls
162- } )
163- } )
165+ cls : cls ,
166+ } ) ;
167+ } ) ;
164168
165169 useEffect ( ( ) => {
166- if ( selectedImage === undefined ) return
170+ if ( selectedImage === undefined ) return ;
167171 dispatchToReducer ( {
168172 type : "SELECT_IMAGE" ,
169173 imageIndex : + selectedImage ,
170- image : state . images [ selectedImage ]
171- } )
172- } , [ selectedImage , state . images ] )
174+ image : state . images [ selectedImage ] ,
175+ } ) ;
176+ } , [ selectedImage , state . images ] ) ;
173177
174178 if ( ! images && ! videoSrc )
175- return " Missing required prop \ "images\ " or \ "videoSrc\""
179+ return ' Missing required prop "images" or "videoSrc"' ;
176180
177181 return (
178182 < SettingsProvider >
@@ -193,7 +197,7 @@ export const Annotator = ({
193197 hideSave = { hideSave }
194198 />
195199 </ SettingsProvider >
196- )
197- }
200+ ) ;
201+ } ;
198202
199- export default Annotator
203+ export default Annotator ;
0 commit comments