.

anatomy/static/css/anatomy.css

@@ -779,7 +779,7 @@ input {
 
 .select2-search__field {
   background-color: #05668d;
-    color: white;
+    color: darkblue;
     border: 1px solid black; 
 
  }

static/css/anatomy.css

@@ -779,7 +779,7 @@ input {
 
 .select2-search__field {
   background-color: #05668d;
-    color: white;
+    color: darkblue;
     border: 1px solid black; 
 
  }

static/css/dicomViewer.css

@@ -61,6 +61,11 @@
   opacity: 100%;
 }
 
+.dicom-button-highlight {
+  opacity: 50%;
+  color: lightblue;
+}
+
 #dicom-toggle-mode-button {
   position: absolute;
   left: 0;

static/js/dicomViewer.js

@@ -96,14 +96,7 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
         .append($("<span id='dicom-toggle-mode-button' class='dicom-button' title='toggle stack/thumbnail view'>↻</span>"))
         .append($("<span id='dicom-fullscreen-button' class='dicom-button' title='toggle stack/thumbnail view'>⛶</span>"))
         .append($("<span id='dicom-settings-button' class='dicom-button' title='open settings'>&#9881;</span>"))
-        .append($("<span id='dicom-collapse-button' class='dicom-button' title='collapse viewer'>⇄</span>"));
+        .append($("<span id='dicom-collapse-button' class='dicom-button' title='collapse viewer'>⇄</span>"))
-
-    $(single_dicom_viewer).append(
-        $(
-            "<div id='dicom-overlay'>Image <span id='current_image_number'></span> of <span id='total_image_number'></span><br />wc: <span id='wc'></span> ww: <span id='ww'></span></div>"
-        )
-    )
-        // Add buttons
         .append(
             $(`<div id='dicom-window-panel'>
            <button id='window-btn-abdomen'>Abdomen</button> 
@@ -116,6 +109,13 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
             </div>`)
         );
 
+    $(single_dicom_viewer).append(
+        $(
+            "<div id='dicom-overlay'>Image <span id='current_image_number'></span> of <span id='total_image_number'></span><br />wc: <span id='wc'></span> ww: <span id='ww'></span></div>"
+        )
+    );
+        // Add buttons
+
     let window_presets = {
         "window-btn-abdomen": [400, 50],
         "window-btn-liver": [150, 30],
@@ -139,6 +139,8 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
             cornerstone.setViewport(single_dicom_viewer, viewport);
 
             e.preventDefault();
+            e.stopPropagation();
+
         })
     })
 
@@ -180,9 +182,13 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
         if (main_element[0].dataset.collapsed == "none") {
             main_element[0].dataset.collapsed = main_element.width();
             main_element.width("50px");
+            $("#dicom-window-panel").hide();
+            $(e.target).addClass("dicom-button-highlight");
         } else {
             main_element.width(main_element[0].dataset.collapsed);
             main_element[0].dataset.collapsed = "none"
+            $("#dicom-window-panel").show();
+            $(e.target).removeClass("dicom-button-highlight");
         }
         resizeHandler();
         //loadCornerstone(main_element, db, images, annotations_to_load, stack)
@@ -293,7 +299,7 @@ export function loadCornerstone(main_element, db, images, annotations_to_load, l
         })
             .catch((err, err2) => {
                 console.log(err);
-                $("#dicom-log-panel").append(err);
+                $("#dicom-log-panel").append("<br/>").append(err.stack);
 
             });
     }