copper3d 1.15.20 → 1.15.21

package/dist/Utils/nrrd_tool.d.ts

@@ -49,6 +49,7 @@ export declare class nrrd_tools {
     private initState;
     private preTimer;
     private eraserUrls;
+    private pencilUrls;
     private nrrd_states;
     private cursorPage;
     private gui_states;
@@ -74,6 +75,7 @@ export declare class nrrd_tools {
     private loadingMaskByLabel;
     setMasksData(masksData: storeExportPaintImageType, loadingBar?: loadingBarType): void;
     setEraserUrls(urls: string[]): void;
+    setPencilIconUrls(urls: string[]): void;
     getCurrentImageDimension(): never[];
     getVoxelSpacing(): never[];
     getSpaceOrigin(): never[];

package/dist/Utils/nrrd_tool.js

@@ -1,6 +1,6 @@
 import * as THREE from "three";
 import { throttle } from "./utils";
-import { switchEraserSize } from "./utils";
+import { switchEraserSize, switchPencilIcon } from "./utils";
 import { saveFileAsJson } from "./download";
 import { restructData, convertReformatDataToBlob, } from "./workers/reformatSaveDataWorker";
 export class nrrd_tools {
@@ -47,6 +47,7 @@ export class nrrd_tools {
         this.undoArray = [];
         this.initState = true;
         this.eraserUrls = [];
+        this.pencilUrls = [];
         this.nrrd_states = {
             originWidth: 0,
             originHeight: 0,
@@ -93,9 +94,7 @@ export class nrrd_tools {
             switchSliceFlag: false,
             labels: ["label1", "label2", "label3"],
             getMask: (mask, sliceId, label, width, height, clearAllFlag) => { },
-            // defaultPaintCursor:
-            //   "url(https://raw.githubusercontent.com/LinkunGao/copper3d_icons/main/icons/pencil-black.svg), auto",
-            defaultPaintCursor: "url(https://raw.githubusercontent.com/LinkunGao/copper3d-datasets/main/icons/dot.svg) 12 12,auto",
+            defaultPaintCursor: switchPencilIcon("dot"),
             drawStartPos: new THREE.Vector2(1, 1),
         };
         this.cursorPage = {
@@ -344,6 +343,11 @@ export class nrrd_tools {
     setEraserUrls(urls) {
         this.eraserUrls = urls;
     }
+    setPencilIconUrls(urls) {
+        this.pencilUrls = urls;
+        this.nrrd_states.defaultPaintCursor = switchPencilIcon("dot", this.pencilUrls);
+        this.drawingCanvas.style.cursor = this.nrrd_states.defaultPaintCursor;
+    }
     getCurrentImageDimension() {
         return this.nrrd_states.dimensions;
     }
@@ -2299,54 +2303,10 @@ export class nrrd_tools {
         if (modeFolder.__controllers.length > 0)
             this.removeGuiFolderChilden(modeFolder);
         modeFolder.open();
-        const actionsFolder = modeFolder.addFolder("Default Actions");
-        actionsFolder
-            .add(this.gui_states, "label", ["label1", "label2", "label3"])
-            .onChange((val) => {
-            if (val === "label1") {
-                this.gui_states.fillColor = "#00ff00";
-                this.gui_states.brushColor = "#00ff00";
-            }
-            else if (val === "label2") {
-                this.gui_states.fillColor = "#ff0000";
-                this.gui_states.brushColor = "#ff0000";
-            }
-            else if (val === "label3") {
-                this.gui_states.fillColor = "#0000ff";
-                this.gui_states.brushColor = "#0000ff";
-            }
-        });
-        actionsFolder
-            .add(this.gui_states, "cursor", ["crosshair", "pencil", "dot"])
-            .name("cursor icons")
-            .onChange((value) => {
-            if (value === "crosshair") {
-                this.nrrd_states.defaultPaintCursor = "crosshair";
-            }
-            if (value === "pencil") {
-                this.nrrd_states.defaultPaintCursor =
-                    "url(https://raw.githubusercontent.com/LinkunGao/copper3d_icons/main/icons/pencil-black.svg), auto";
-            }
-            if (value === "dot") {
-                this.nrrd_states.defaultPaintCursor =
-                    "url(https://raw.githubusercontent.com/LinkunGao/copper3d-datasets/main/icons/dot.svg) 12 12,auto";
-            }
-            this.drawingCanvas.style.cursor = this.nrrd_states.defaultPaintCursor;
-        });
-        actionsFolder
-            .add(this.gui_states, "mainAreaSize")
-            .name("zoom")
-            .min(1)
-            .max(8)
-            .onFinishChange((factor) => {
-            this.resetPaintArea();
-            this.nrrd_states.sizeFoctor = factor;
-            this.resizePaintArea(factor);
-        });
-        actionsFolder.add(this.gui_states, "resetZoom");
+        const actionsFolder = modeFolder.addFolder("DefaultActions");
         actionsFolder
             .add(this.gui_states, "globalAlpha")
-            .name("opacity")
+            .name("Opacity")
             .min(0.1)
             .max(1)
             .step(0.01);
@@ -2383,6 +2343,7 @@ export class nrrd_tools {
         });
         actionsFolder
             .add(this.gui_states, "brushAndEraserSize")
+            .name("BrushAndEraserSize")
             .min(5)
             .max(50)
             .step(1)
@@ -2404,12 +2365,13 @@ export class nrrd_tools {
                 this.drawingCanvas.style.cursor = this.nrrd_states.defaultPaintCursor;
             }
         });
-        actionsFolder.add(this.gui_states, "clear");
-        actionsFolder.add(this.gui_states, "clearAll");
-        actionsFolder.add(this.gui_states, "undo");
+        actionsFolder.add(this.gui_states, "clear").name("Clear");
+        actionsFolder.add(this.gui_states, "clearAll").name("ClearAll");
+        actionsFolder.add(this.gui_states, "undo").name("Undo");
+        actionsFolder.add(this.gui_states, "resetZoom").name("ResetZoom");
         actionsFolder
             .add(this.mainPreSlice.volume, "windowHigh", this.mainPreSlice.volume.min, this.mainPreSlice.volume.max, 1)
-            .name("Image contrast")
+            .name("ImageContrast")
             .onChange((value) => {
             this.nrrd_states.readyToUpdate = false;
             this.updateSlicesContrast(value, "windowHigh");
@@ -2418,30 +2380,68 @@ export class nrrd_tools {
             this.repraintAllContrastSlices();
             this.nrrd_states.readyToUpdate = true;
         });
-        actionsFolder.add(this.gui_states, "exportMarks");
-        const advanceFolder = modeFolder.addFolder("Advance settings");
+        const advanceFolder = modeFolder.addFolder("AdvanceSettings");
+        advanceFolder
+            .add(this.gui_states, "label", ["label1", "label2", "label3"])
+            .name("Label")
+            .onChange((val) => {
+            if (val === "label1") {
+                this.gui_states.fillColor = "#00ff00";
+                this.gui_states.brushColor = "#00ff00";
+            }
+            else if (val === "label2") {
+                this.gui_states.fillColor = "#ff0000";
+                this.gui_states.brushColor = "#ff0000";
+            }
+            else if (val === "label3") {
+                this.gui_states.fillColor = "#0000ff";
+                this.gui_states.brushColor = "#0000ff";
+            }
+        });
+        advanceFolder
+            .add(this.gui_states, "cursor", ["crosshair", "pencil", "dot"])
+            .name("CursorIcons")
+            .onChange((value) => {
+            this.nrrd_states.defaultPaintCursor = switchPencilIcon(value, this.pencilUrls);
+            this.drawingCanvas.style.cursor = this.nrrd_states.defaultPaintCursor;
+        });
+        advanceFolder
+            .add(this.gui_states, "mainAreaSize")
+            .name("Zoom")
+            .min(1)
+            .max(8)
+            .onFinishChange((factor) => {
+            this.resetPaintArea();
+            this.nrrd_states.sizeFoctor = factor;
+            this.resizePaintArea(factor);
+        });
         advanceFolder
             .add(this.gui_states, "dragSensitivity")
+            .name("DragSensitivity")
             .min(1)
             .max(this.nrrd_states.Max_sensitive)
             .step(1);
-        const segmentationFolder = advanceFolder.addFolder("Pencil settings");
+        const segmentationFolder = advanceFolder.addFolder("PencilSettings");
         segmentationFolder
             .add(this.gui_states, "lineWidth")
-            .name("outerLineWidth")
+            .name("OuterLineWidth")
             .min(1.7)
             .max(3)
             .step(0.01);
-        segmentationFolder.addColor(this.gui_states, "color");
-        segmentationFolder.addColor(this.gui_states, "fillColor");
-        const bushFolder = advanceFolder.addFolder("Brush settings");
-        bushFolder.addColor(this.gui_states, "brushColor");
+        segmentationFolder.addColor(this.gui_states, "color").name("Color");
+        segmentationFolder.addColor(this.gui_states, "fillColor").name("FillColor");
+        const bushFolder = advanceFolder.addFolder("BrushSettings");
+        bushFolder.addColor(this.gui_states, "brushColor").name("BrushColor");
         // modeFolder.add(this.stateMode, "EraserSize").min(1).max(50).step(1);
-        advanceFolder.add(this.gui_states, "downloadCurrentMask");
-        const contrastFolder = advanceFolder.addFolder("contrast advance settings");
+        const maskFolder = advanceFolder.addFolder("MaskDownload");
+        maskFolder
+            .add(this.gui_states, "downloadCurrentMask")
+            .name("DownloadCurrentMask");
+        maskFolder.add(this.gui_states, "exportMarks").name("ExportMask");
+        const contrastFolder = advanceFolder.addFolder("ContrastAdvanceSettings");
         contrastFolder
             .add(this.mainPreSlice.volume, "lowerThreshold", this.mainPreSlice.volume.min, this.mainPreSlice.volume.max, 1)
-            .name("Lower Threshold")
+            .name("LowerThreshold")
             .onChange((value) => {
             this.nrrd_states.readyToUpdate = false;
             this.updateSlicesContrast(value, "lowerThreshold");
@@ -2452,7 +2452,7 @@ export class nrrd_tools {
         });
         contrastFolder
             .add(this.mainPreSlice.volume, "upperThreshold", this.mainPreSlice.volume.min, this.mainPreSlice.volume.max, 1)
-            .name("Upper Threshold")
+            .name("UpperThreshold")
             .onChange((value) => {
             this.nrrd_states.readyToUpdate = false;
             this.updateSlicesContrast(value, "upperThreshold");
@@ -2463,7 +2463,7 @@ export class nrrd_tools {
         });
         contrastFolder
             .add(this.mainPreSlice.volume, "windowLow", this.mainPreSlice.volume.min, this.mainPreSlice.volume.max, 1)
-            .name("Window Low")
+            .name("WindowLow")
             .onChange((value) => {
             this.nrrd_states.readyToUpdate = false;
             this.updateSlicesContrast(value, "windowLow");