lost-sia/dist/SIAFilterButton.js

Single Image Annotation Tool

import{jsxs as r,jsx as i}from"react/jsx-runtime";import{Component as s}from"react";import{APPLY_FILTER as a}from"./types/toolbarEvents.js";import{faFilter as n}from"@fortawesome/free-solid-svg-icons";import{CFormSwitch as l,CPopover as h}from"@coreui/react";import c from"./ToolbarItem.js";class C extends s{constructor(t){super(t),this.state={clipLimit:3,active:!1,color:void 0}}componentDidUpdate(t){t.filter.clahe.clipLimit!==this.props.filter.clahe.clipLimit&&this.setState({clipLimit:this.props.filter.clahe.clipLimit}),this.props.filter!==t.filter&&(filterTools.active(this.props.filter)?this.setState({color:"red",active:!0}):this.setState({color:"white",active:!1}))}triggerEvent(t,e){this.props.onFilterEvent&&this.props.onFilterEvent(t,e)}handleClipLimitChange(t){const e=parseInt(t.target.value);this.setState({clipLimit:e})}rotateImg(t){const e=!(this.props.filter.rotate.active&&this.props.filter.rotate.angle===t),o=e?t:0;this.triggerEvent(a,{...this.props.filter,rotate:{angle:o,active:e}})}claheFilter(t){const e={clahe:{clipLimit:t,active:!this.props.filter.clahe.active}};this.triggerEvent(a,{...this.props.filter,clahe:e.clahe})}releaseCLAHESlider(t){const e={clahe:{clipLimit:parseInt(t.target.value),active:!0}};this.triggerEvent(a,{...this.props.filter,clahe:e.clahe})}renderRotateContent(){const t=this.props.filter;return r("div",{children:[i("h4",{children:"Rotate"}),i(l,{checked:t.rotate.active&&t.rotate.angle===90,label:"Rotate 90",size:"xl",onClick:()=>this.rotateImg(90)}),i(l,{checked:t.rotate.active&&t.rotate.angle===-90,label:"Rotate -90",size:"xl",onClick:()=>this.rotateImg(-90)}),i(l,{checked:t.rotate.active&&t.rotate.angle===180,label:"Rotate 180",size:"xl",onClick:()=>this.rotateImg(180)})]})}renderRotate(){if(!this.props.enabled)return null;if(this.props.enabled===!0)return this.renderRotateContent();if(this.props.enabled.rotate)return this.renderRotateContent()}renderClaheContent(){const t=this.props.filter;return r("div",{children:[i("h4",{children:"Histogram equalization"}),i(l,{checked:t.clahe.active,label:"Histogram equalization",size:"xl",onClick:()=>this.claheFilter(this.state.clipLimit)}),r("div",{children:["Cliplimit: ",this.state.clipLimit]}),i("input",{type:"range",min:0,max:40,value:this.state.clipLimit,onChange:e=>this.handleClipLimitChange(e),onMouseUp:e=>this.releaseCLAHESlider(e)})]})}renderClahe(){if(!this.props.enabled)return null;if(this.props.enabled===!0)return this.renderClaheContent();if(this.props.enabled.clahe)return this.renderClaheContent()}render(){if(!this.props.imageMeta)return null;const t=r("div",{children:[this.renderRotate(),this.renderClahe()]});return i(h,{content:t,placement:"right",children:i("span",{children:i(c,{faIcon:n})})})}}export{C as default};