Feature/overlay-labels

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## [4.1.0] - Pre-release
+
+### Added
+- Edges mode (colorize like segmentation but only show edges).
+- Overlay one image on another.
+
 ## [4.0.19] - Pre-release
 
 ### Added

README.md

@@ -31,6 +31,14 @@ A built-in, enhanced image viewer with the following capabilities:
     <img src="readme-assets/segmentation-example.png" width="300" alt="Segmentation"/>
     <p style="word-break: break-word; white-space: normal; margin: 0 0 8px 0;">View label images with color mapping (e.g., 0=black, 1=red, etc.).</p>
   </div>
+  <div style="display: flex; flex-direction: column; align-items: center; width: 300px;">
+    <h4>Overlay</h4>
+    <div style="display:flex; gap:8px; align-items:center; justify-content:center;">
+      <img src="readme-assets/overlay-edge-example.png" width="140" alt="Overlay example 1"/>
+      <img src="readme-assets/overlay-fill-example.png" width="140" alt="Overlay example 2"/>
+    </div>
+    <p style="word-break: break-word; white-space: normal; margin: 0 0 8px 0;">Overlay one image on another</p>
+  </div>
 </div>
 
 ### Plot Viewer

icons/dist/svifpd-icons.css

@@ -6,7 +6,7 @@
 @font-face {
 	font-family: "svifpd-icons";
 	font-display: block;
-	src: url("./svifpd-icons.woff2?797726f429734e5d9e1970c77951bcfd") format("woff2");
+	src: url("./svifpd-icons.woff2?b34cdd727d5167118abfe162e0202494") format("woff2");
 }
 
 .svifpd-icons[class*='svifpd-icons-'] {
@@ -71,3 +71,5 @@
 .svifpd-icons-tensor:before { content: "\ea6c" }
 .svifpd-icons-image:before { content: "\ea6d" }
 .svifpd-icons-inspect-image:before { content: "\ea6e" }
+.svifpd-icons-edges:before { content: "\ea6f" }
+.svifpd-icons-overlay:before { content: "\ea70" }

icons/dist/svifpd-icons.html

@@ -177,6 +177,14 @@ <h1>svifpd-icons</h1>
             <span class='label'>contrast</span>
             <span class='description'></span>
         </div>
+        <div class="icon" data-name="edges" title="edges">
+            <span class="inner">
+                <i class="svifpd-icons svifpd-icons-edges" aria-hidden="true"></i>
+            </span>
+            <br>
+            <span class='label'>edges</span>
+            <span class='description'></span>
+        </div>
         <div class="icon" data-name="G" title="G">
             <span class="inner">
                 <i class="svifpd-icons svifpd-icons-G" aria-hidden="true"></i>
@@ -233,6 +241,14 @@ <h1>svifpd-icons</h1>
             <span class='label'>legend</span>
             <span class='description'></span>
         </div>
+        <div class="icon" data-name="overlay" title="overlay">
+            <span class="inner">
+                <i class="svifpd-icons svifpd-icons-overlay" aria-hidden="true"></i>
+            </span>
+            <br>
+            <span class='label'>overlay</span>
+            <span class='description'></span>
+        </div>
         <div class="icon" data-name="R" title="R">
             <span class="inner">
                 <i class="svifpd-icons svifpd-icons-R" aria-hidden="true"></i>

icons/src/template/mapping.json

@@ -12,5 +12,7 @@
   "legend": 60011,
   "tensor": 60012,
   "image": 60013,
-  "inspect-image": 60014
+  "inspect-image": 60014,
+  "edges": 60015,
+  "overlay": 60016
 }

package.json

@@ -2,7 +2,7 @@
   "publisher": "elazarcoh",
   "name": "simply-view-image-for-python-debugging",
   "displayName": "View Image for Python Debugging",
-  "version": "4.0.19",
+  "version": "4.1.0",
   "packageManager": "yarn@4.4.1",
   "description": "simply view the image of the image variables when debugging python",
   "repository": {

simply-view-image-for-python-debugging.code-workspace

@@ -23,6 +23,7 @@
 			"rust": "html",
 		},
 		"rust-analyzer.check.command": "clippy",
+		"rust-analyzer.semanticHighlighting.strings.enable": false,
 		"cSpell.words": [
 			"colorbar"
 		],

src/extension.ts

@@ -1,3 +1,5 @@
+/* eslint-disable perfectionist/sort-imports */
+import 'reflect-metadata';
 import Container from 'typedi';
 import * as vscode from 'vscode';
 import { AllViewables } from './AllViewables';
@@ -26,7 +28,6 @@ import { PlotlyFigure, PyplotAxes, PyplotFigure } from './viewable/Plot';
 import { NumpyTensor, TorchTensor } from './viewable/Tensor';
 import { WebviewRequests } from './webview/communication/createMessages';
 import { GlobalWebviewClient } from './webview/communication/WebviewClient';
-import 'reflect-metadata';
 
 function onConfigChange(): void {
   initLog();

src/webview-ui/.gitignore

@@ -16,3 +16,5 @@ Cargo.lock
 
 # wasm-pack
 pkg/
+
+/debug_shaders

src/webview-ui/Cargo.toml

@@ -5,6 +5,9 @@ edition = "2021"
 rust-version = "1.80"
 resolver = "2"
 
+[build-dependencies]
+shaders = { path = "shaders" }
+
 [lib]
 crate-type = [ "cdylib" ]
 

src/webview-ui/build.rs

@@ -0,0 +1,52 @@
+use std::{env, fs, io::Write, path::PathBuf};
+
+fn base_output() -> PathBuf {
+    PathBuf::from(env::var("OUT_DIR").unwrap()).join("shaders")
+}
+
+fn is_debug() -> bool {
+    match env::var("PROFILE") {
+        Ok(profile) => profile == "debug",
+        _ => false,
+    }
+}
+
+fn create_shader_file(content: &str, filename: &str) {
+    let base_output = base_output();
+
+    let file_path = base_output.join(filename);
+    let mut file = fs::File::create(file_path).expect("Unable to create file");
+    file.write_all(content.as_bytes())
+        .expect("Unable to write to file");
+
+    // Also write to project_root/debug_shaders in debug mode
+    if is_debug() {
+        let root_dir = PathBuf::from(env::var("CARGO_MANIFEST_DIR").unwrap());
+        let debug_dir = root_dir.join("debug_shaders");
+        fs::create_dir_all(&debug_dir).unwrap();
+
+        let debug_file = debug_dir.join(filename);
+        fs::write(&debug_file, content).unwrap();
+    }
+}
+
+fn main() {
+    let base_output = base_output();
+    println!("cargo:rustc-env=SHADERS_DIR={}", base_output.display());
+    fs::create_dir_all(&base_output).expect("Unable to create directory");
+
+    #[rustfmt::skip]
+    create_shader_file(shaders::UINT_FRAGMENT_SHADER, "uint-image.frag");
+    #[rustfmt::skip]
+    create_shader_file(shaders::INT_FRAGMENT_SHADER, "int-image.frag");
+    #[rustfmt::skip]
+    create_shader_file(shaders::NORMALIZED_FRAGMENT_SHADER, "normalized-image.frag");
+    #[rustfmt::skip]
+    create_shader_file(shaders::UINT_PLANAR_FRAGMENT_SHADER, "uint-planar-image.frag");
+    #[rustfmt::skip]
+    create_shader_file(shaders::INT_PLANAR_FRAGMENT_SHADER, "int-planar-image.frag");
+    #[rustfmt::skip]
+    create_shader_file(shaders::NORMALIZED_PLANAR_FRAGMENT_SHADER, "normalized-planar-image.frag");
+
+    println!("cargo:rerun-if-changed=build.rs");
+}