lost-sia
Version:
Single Image Annotation Tool
2 lines (1 loc) • 2.31 kB
JavaScript
import{jsxs as t,jsx as n}from"react/jsx-runtime";import{Component as r}from"react";import{SHOW_ANNO_DETAILS as s,SHOW_LABEL_INFO as l,SHOW_ANNO_STATS as a,EDIT_STROKE_WIDTH as h,EDIT_NODE_RADIUS as p}from"./types/toolbarEvents.js";import{faCog as d}from"@fortawesome/free-solid-svg-icons";import{CFormSwitch as i,CPopover as g}from"@coreui/react";import u from"./ToolbarItem.js";class A extends r{constructor(e){super(e),this.state={}}triggerEvent(e,o){this.props.onSettingEvent&&this.props.onSettingEvent(e,o)}toggleAnnoDetails(){this.triggerEvent(s)}toggleLabelInfo(){this.triggerEvent(l)}toggleAnnoStats(){this.triggerEvent(a)}handleStrokeWidthChange(e){this.triggerEvent(h,parseInt(e.target.value))}handleNodeRadiusChange(e){this.triggerEvent(p,parseInt(e.target.value))}renderInfoBoxContent(){return t("div",{children:[n("h4",{children:"Info Boxes"}),n(i,{checked:this.props.uiConfig.annoDetails.visible,label:"Annotation Details",size:"xl",onClick:()=>this.toggleAnnoDetails()}),n(i,{checked:this.props.uiConfig.labelInfo.visible,label:"Label Info",size:"xl",onClick:()=>this.toggleLabelInfo()}),n(i,{checked:this.props.uiConfig.annoStats.visible,label:"Anno Stats",size:"xl",onClick:()=>this.toggleAnnoStats()})]})}renderInfoBoxes(){if(!this.props.enabled)return null;if(this.props.enabled===!0)return this.renderInfoBoxContent();if(this.props.enabled.infoBoxes)return this.renderInfoBoxContent()}renderAnnoStyle(){if(!this.props.enabled)return null;if(this.props.enabled===!0)return this.renderAnnoStyleContent();if(this.props.enabled.annoStyle)return this.renderAnnoStyleContent()}renderAnnoStyleContent(){return t("div",{children:[n("h4",{style:{marginTop:25},children:"Anno Appearance"}),t("div",{children:["Stroke width: ",this.props.uiConfig.strokeWidth]}),n("input",{type:"range",min:1,max:10,value:this.props.uiConfig.strokeWidth,onChange:e=>this.handleStrokeWidthChange(e)}),t("div",{children:["Node radius: ",this.props.uiConfig.nodeRadius]}),n("input",{type:"range",min:1,max:10,value:this.props.uiConfig.nodeRadius,onChange:e=>this.handleNodeRadiusChange(e)})]})}render(){if(!this.props.uiConfig)return null;const e=t("div",{children:[this.renderInfoBoxes(),this.renderAnnoStyle()]});return n(g,{content:e,placement:"right",children:n("span",{children:n(u,{faIcon:d})})})}}export{A as default};