further tidyup

This commit is contained in:
Ross
2025-04-14 13:46:52 +01:00
parent 2f88e101e9
commit 01514c4ea4
4 changed files with 94 additions and 30 deletions
+1
View File
@@ -238,6 +238,7 @@ td {
box-shadow: none;
text-shadow: none;
flex-shrink: 0;
font-size: 12px;
}
.nav-left {
+41 -10
View File
@@ -26,19 +26,19 @@
<div id="content">
<div class="content-panel">
<div class="nav-bar">
<button id="btn-review" class="navigation nav-right"><b></b></button>
<button id="btn-review" class="navigation nav-right"><b></b><br/>OVERVIEW</button>
<button
id="btn-submit-nav"
class="submit-button navigation nav-right"
>
<b>submit</b>
<b>SUBMIT</b>
</button>
<button
id="btn-review-overlay"
class="navigation nav-right"
title="click to finish exam and review answers"
>
review
REVIEW
</button>
<button
id="btn-fullscreen-overlay"
@@ -50,13 +50,44 @@
<div class="app-name nav-left">RTS</div>
<div id="timer" title="click to pause"></div>
<div class="exam-name" title="currently loaded packet"></div>
<input
type="button"
class="navigation nav-left"
value="previous"
disabled="disabled"
/>
<input type="button" class="navigation nav-left" value="next" />
<button class="navigation nav-left" disabled="disabled"
data-nav="previous"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-arrow-left-short"
viewBox="0 0 16 16"
>
<path
fill-rule="evenodd"
d="M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5"
/>
</svg>
<br />
<span>PREVIOUS</span>
</button>
<button class="navigation nav-left"
data-nav="next"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-arrow-right-short"
viewBox="0 0 16 16"
>
<path
fill-rule="evenodd"
d="M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8"
/>
</svg>
<br />
<span>NEXT</span>
</button>
</div>
<div class="main-panel">
<div class="question-list-panel" style="display: block"></div>
+6 -6
View File
@@ -1140,12 +1140,12 @@ async function loadQuestion(n, section = 1, force_reload = false) {
loaded_question = n;
// Set up question navigation
$(".navigation[value='next']").off();
$(".navigation[value='previous']").off();
$(".navigation[data-nav='next']").off();
$(".navigation[data-nav='previous']").off();
if (n == 0) {
$(".navigation[value='previous']").attr("disabled", "disabled");
$(".navigation[data-nav='previous']").attr("disabled", "disabled");
} else {
$(".navigation[value='previous']")
$(".navigation[data-nav='previous']")
.removeAttr("disabled")
.click(function() {
loadQuestion(n - 1);
@@ -1153,9 +1153,9 @@ async function loadQuestion(n, section = 1, force_reload = false) {
}
if (n == exam_details.number_of_questions - 1) {
$(".navigation[value='next']").attr("disabled", "disabled");
$(".navigation[data-nav='next']").attr("disabled", "disabled");
} else {
$(".navigation[value='next']")
$(".navigation[data-nav='next']")
.removeAttr("disabled")
.click(function() {
loadQuestion(n + 1);
+46 -14
View File
@@ -74,13 +74,7 @@ export function loadMainImage(image, stack) {
// already fullscreen (disable it)
disableFullscreen(this);
} else {
$(".content-panel").prepend($(".canvas-panel"));
$(".canvas-panel").toggleClass("canvas-panel canvas-panel-fullscreen");
$("#dicom-image").attr("height", "100%");
$("#dicom-image").height("100%");
// $(".cornerstone-canvas").attr("height", "100%");
// $(".cornerstone-canvas").height("100%");
cornerstone.resize(this, true);
enableFullscreen(this);
}
});
@@ -163,6 +157,9 @@ export function disableFullscreen(dicom_element) {
$(".canvas-panel-fullscreen").toggleClass(
"canvas-panel canvas-panel-fullscreen"
);
$("#disable-fullscreen-viewer-button").hide();
$("#fullscreen-viewer-button").show();
$(".question").prepend($(".canvas-panel"));
$(".canvas-panel").get(0).scrollIntoView();
@@ -384,7 +381,7 @@ export function changeControlSelection() {
break;
}
case "reset": {
cornerstone.reset(dicom_element);
resetViewer(dicom_element);
sel.selectedIndex = old;
sel.oldSelectedIndex = old;
break;
@@ -400,6 +397,12 @@ export function changeControlSelection() {
}
}
function resetViewer(dicom_element) {
cornerstoneTools.clearToolState(dicom_element, "RectangleRoi");
cornerstoneTools.clearToolState(dicom_element, "Length");
cornerstone.reset(dicom_element);
}
/**
* Handle key button events
* These are the same as in the RCR pratique implementation
@@ -425,6 +428,10 @@ export function keydown_handler(event) {
sel.selectedIndex = find_option(sel, "pan");
changeControlSelection();
break;
case "KeyC":
sel.selectedIndex = find_option(sel, "rectangle");
changeControlSelection();
break;
case "KeyZ":
sel.selectedIndex = find_option(sel, "zoom");
changeControlSelection();
@@ -463,7 +470,7 @@ export function keydown_handler(event) {
changeControlSelection();
break;
// Escape and C do the same
case "KeyC":
//case "KeyC":
case "Escape":
sel.selectedIndex = find_option(sel, "close");
changeControlSelection();
@@ -524,7 +531,7 @@ export function keydown_handler(event) {
manualZoomDicom(-1);
break;
case "rotate":
manualRotateDicom(1);
manualRotateDicom(-1);
break;
case "scroll":
manualScrollDicom(1);
@@ -544,7 +551,7 @@ export function keydown_handler(event) {
manualZoomDicom(1);
break;
case "rotate":
manualRotateDicom(-1);
manualRotateDicom(1);
break;
case "scroll":
manualScrollDicom(-1);
@@ -688,13 +695,16 @@ export function openMainImage(current_question, t, source) {
<option value="reset">reset [e]</option>
<option value="notes" disabled="true">[modality = SC]</option>
</select>
<button class="title-bar-button" title="RESET VIEW" class="reset"><span class="viewer-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16">
<button id="reset-viewer-button" class="title-bar-button" title="RESET VIEW" class="reset"><span class="viewer-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2z"/>
<path d="M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466"/>
</svg></span></button>
<button class="title-bar-button" title="TOGGLE FULLSCREEN" class="expand"><span class="viewer-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fullscreen" viewBox="0 0 16 16">
<button id="fullscreen-viewer-button" class="title-bar-button" title="TOGGLE FULLSCREEN" class="expand"><span class="viewer-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fullscreen" viewBox="0 0 16 16">
<path d="M1.5 1a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0v-4A1.5 1.5 0 0 1 1.5 0h4a.5.5 0 0 1 0 1zM10 .5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 16 1.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5M.5 10a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 0 14.5v-4a.5.5 0 0 1 .5-.5m15 0a.5.5 0 0 1 .5.5v4a1.5 1.5 0 0 1-1.5 1.5h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5"/>
</svg></span></button>
<button style="display:none;" id="disable-fullscreen-viewer-button" class="title-bar-button" title="TOGGLE FULLSCREEN" class="expand"><span class="viewer-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fullscreen-exit" viewBox="0 0 16 16">
<path d="M5.5 0a.5.5 0 0 1 .5.5v4A1.5 1.5 0 0 1 4.5 6h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5m5 0a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 10 4.5v-4a.5.5 0 0 1 .5-.5M0 10.5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 6 11.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5m10 1a1.5 1.5 0 0 1 1.5-1.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0z"/>
</svg></span></button>
<button id="close-viewer-button" class="title-bar-button" title="CLOSE VIEWER"><span class="viewer-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-lg" viewBox="0 0 16 16">
<path d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8z"/>
</svg></span></button></div>
@@ -720,11 +730,20 @@ export function openMainImage(current_question, t, source) {
}
}
const dicom_element = document.getElementById("dicom-image");
// Bind button actions
$("#close-viewer-button").click(function () {
const dicom_element = document.getElementById("dicom-image");
closeViewer(dicom_element);
});
$("#reset-viewer-button").click(function () {
resetViewer(dicom_element);
});
$("#fullscreen-viewer-button").click(function () {
enableFullscreen(dicom_element);
});
$("#disable-fullscreen-viewer-button").click(function () {
disableFullscreen(dicom_element);
});
load(images, annotations);
}
@@ -754,3 +773,16 @@ export function urltoFile(url, filename, mimeType) {
return new File([buf], filename, { type: mimeType });
});
}
function enableFullscreen(dicom_element) {
$(".content-panel").prepend($(".canvas-panel"));
$(".canvas-panel").toggleClass("canvas-panel canvas-panel-fullscreen");
$("#dicom-image").attr("height", "100%");
$("#dicom-image").height("100%");
$("#disable-fullscreen-viewer-button").show();
$("#fullscreen-viewer-button").hide();
// $(".cornerstone-canvas").attr("height", "100%");
// $(".cornerstone-canvas").height("100%");
cornerstone.resize(dicom_element, true);
}