lost-sia 1.0.3 → 1.1.0

package/CHANGELOG.md

@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.1.0] - 2022-05-10
+### Added
+- More fine grained visibility level for toolbar elements
+
 ## [1.0.3] - 2022-05-10
 ### Fixed
 - Export of toolbarEvents and tools

package/dist/index.es.js

@@ -8768,12 +8768,11 @@ var SIASettingButton = function (_Component) {
             this.triggerEvent(EDIT_NODE_RADIUS, parseInt(e.target.value));
         }
     }, {
-        key: 'render',
-        value: function render() {
+        key: 'renderInfoBoxContent',
+        value: function renderInfoBoxContent() {
             var _this2 = this;
 
-            if (!this.props.uiConfig) return null;
-            var popupContent = React.createElement(
+            return React.createElement(
                 'div',
                 null,
                 React.createElement(
@@ -8801,7 +8800,41 @@ var SIASettingButton = function (_Component) {
                     onClick: function onClick() {
                         return _this2.toggleAnnoStats();
                     }
-                }),
+                })
+            );
+        }
+    }, {
+        key: 'renderInfoBoxes',
+        value: function renderInfoBoxes() {
+            if (!this.props.enabled) return null;
+            if (this.props.enabled == true) {
+                return this.renderInfoBoxContent();
+            } else {
+                if (this.props.enabled.infoBoxes) {
+                    return this.renderInfoBoxContent();
+                }
+            }
+        }
+    }, {
+        key: 'renderAnnoStyle',
+        value: function renderAnnoStyle() {
+            if (!this.props.enabled) return null;
+            if (this.props.enabled == true) {
+                return this.renderAnnoStyleContent();
+            } else {
+                if (this.props.enabled.annoStyle) {
+                    return this.renderAnnoStyleContent();
+                }
+            }
+        }
+    }, {
+        key: 'renderAnnoStyleContent',
+        value: function renderAnnoStyleContent() {
+            var _this3 = this;
+
+            return React.createElement(
+                'div',
+                null,
                 React.createElement(
                     Divider,
                     { horizontal: true },
@@ -8819,7 +8852,7 @@ var SIASettingButton = function (_Component) {
                     max: 10,
                     value: this.props.uiConfig.strokeWidth,
                     onChange: function onChange(e) {
-                        return _this2.handleStrokeWidthChange(e);
+                        return _this3.handleStrokeWidthChange(e);
                     }
                 }),
                 React.createElement(
@@ -8834,10 +8867,22 @@ var SIASettingButton = function (_Component) {
                     max: 10,
                     value: this.props.uiConfig.nodeRadius,
                     onChange: function onChange(e) {
-                        return _this2.handleNodeRadiusChange(e);
+                        return _this3.handleNodeRadiusChange(e);
                     }
                 })
             );
+        }
+    }, {
+        key: 'render',
+        value: function render() {
+
+            if (!this.props.uiConfig) return null;
+            var popupContent = React.createElement(
+                'div',
+                null,
+                this.renderInfoBoxes(),
+                this.renderAnnoStyle()
+            );
             return React.createElement(Popup, { trigger: React.createElement(
                     Menu.Item,
                     { name: 'setting' },
@@ -8962,13 +9007,12 @@ var SIAFilterButton = function (_Component) {
             // })
         }
     }, {
-        key: 'render',
-        value: function render() {
+        key: 'renderRotateContent',
+        value: function renderRotateContent() {
             var _this2 = this;
 
             var filter = this.props.filter;
-            if (!this.props.imageMeta) return null;
-            var popupContent = React.createElement(
+            return React.createElement(
                 'div',
                 null,
                 React.createElement(
@@ -8996,7 +9040,30 @@ var SIAFilterButton = function (_Component) {
                     onClick: function onClick() {
                         return _this2.rotateImg(180);
                     }
-                }),
+                })
+            );
+        }
+    }, {
+        key: 'renderRotate',
+        value: function renderRotate() {
+            if (!this.props.enabled) return null;
+            if (this.props.enabled === true) {
+                return this.renderRotateContent();
+            } else {
+                if (this.props.enabled.rotate) {
+                    return this.renderRotateContent();
+                }
+            }
+        }
+    }, {
+        key: 'renderClaheContent',
+        value: function renderClaheContent() {
+            var _this3 = this;
+
+            var filter = this.props.filter;
+            return React.createElement(
+                'div',
+                null,
                 React.createElement(
                     Divider,
                     { horizontal: true },
@@ -9006,7 +9073,7 @@ var SIAFilterButton = function (_Component) {
                     checked: filter.clahe.active,
                     label: 'Histogram equalization', toggle: true,
                     onClick: function onClick() {
-                        return _this2.claheFilter(_this2.state.clipLimit);
+                        return _this3.claheFilter(_this3.state.clipLimit);
                     }
                 }),
                 React.createElement(
@@ -9021,13 +9088,36 @@ var SIAFilterButton = function (_Component) {
                     max: 40,
                     value: this.state.clipLimit,
                     onChange: function onChange(e) {
-                        return _this2.handleClipLimitChange(e);
+                        return _this3.handleClipLimitChange(e);
                     },
                     onMouseUp: function onMouseUp(e) {
-                        return _this2.releaseCLAHESlider(e);
+                        return _this3.releaseCLAHESlider(e);
                     }
                 })
             );
+        }
+    }, {
+        key: 'renderClahe',
+        value: function renderClahe() {
+            if (!this.props.enabled) return null;
+            if (this.props.enabled === true) {
+                return this.renderClaheContent();
+            } else {
+                if (this.props.enabled.clahe) {
+                    return this.renderClaheContent();
+                }
+            }
+        }
+    }, {
+        key: 'render',
+        value: function render() {
+            if (!this.props.imageMeta) return null;
+            var popupContent = React.createElement(
+                'div',
+                null,
+                this.renderRotate(),
+                this.renderClahe()
+            );
             return React.createElement(Popup, { trigger: React.createElement(
                     Menu.Item,
                     { name: 'filter', active: this.state.active },
@@ -9605,6 +9695,7 @@ var ToolBar = function (_Component) {
 
             if (!this.props.enabled.settings) return null;
             return React.createElement(SIASettingButton, {
+                enabled: this.props.enabled.settings,
                 uiConfig: this.props.uiConfig,
                 onSettingEvent: function onSettingEvent(e, data) {
                     return _this11.triggerToolBarEvent(e, data);
@@ -9617,6 +9708,7 @@ var ToolBar = function (_Component) {
 
             if (!this.props.enabled.filter) return null;
             return React.createElement(SIAFilterButton, {
+                enabled: this.props.enabled.filter,
                 onFilterEvent: function onFilterEvent(e, data) {
                     return _this12.triggerToolBarEvent(e, data);
                 },
@@ -9777,15 +9869,15 @@ var _slicedToArray$3 = function () { function sliceIterator(arr, i) { var _arr =
  * @param {bool | object} toolbarEnabled Defines which toolbar buttons are 
  *      displayed or if toolbar is shown at all. 
  *          false | {
- *              imgLabel: true,
- *              nextPrev: true,
- *              toolSelection: true,
- *              fullscreen: true,
- *              junk: true,
- *              deleteAll: true,
- *              settings: true,
- *              filter: true,
- *              help: true
+ *              imgLabel: bool,
+ *              nextPrev: bool,
+ *              toolSelection: bool,
+ *              fullscreen: bool,
+ *              junk: bool,
+ *              deleteAll: bool,
+ *              settings: bool | {infoBoxes: bool, annoStyle: bool},
+ *              filter: bool | {rotate: bool, clahe:bool},
+ *              help: bool
  *          }
  * @event onNotification - Callback for Notification messages
  *      args: {title: str, message: str, type: str}