Start

anatomy/static/js/anatomy.js

@@ -0,0 +1,126 @@
+var dwvapp = [];
+
+var marked_answers = {
+    "correct": [],
+    "half-correct": [],
+    "incorrect": [],
+}
+
+
+$(document).ready(function () {
+    $(".answer-list li").each(function (index, element) {
+        console.log(element);
+        $(element).click(function (e) {
+
+            var classes = ['correct', 'half-correct', 'incorrect'];
+            $(element).each(function () {
+                this.className = classes[($.inArray(this.className, classes) + 1) % classes.length];
+            });
+
+            prepAnswerData();
+
+
+
+        });
+    });
+    prepAnswerData();
+
+    if($(".post-form").length > 0) {
+        $(".post-form").get(0).addEventListener("submit", function (e) {
+            if($(".not-marked").length > 0) {
+                e.preventDefault(); // before the code
+                alert("Ensure all answers are marked first");
+            }
+
+        });
+    }
+
+    if($(".dwv-container").length) {
+        $(".dwv-container").append($('<!-- DWV --> <div id="dwv"> <!-- Toolbar --> <div class="toolbar"></div> <input type="range" id="sliceRange" value="0"><!-- Layer Container --> <div class="layerContainer"> <div class="dropBox"></div> <canvas class="imageLayer">Only for HTML5 compatible browsers...</canvas> <div class="infoLayer"> <div class="infotl"></div> <div class="infotc"></div> <div class="infotr"></div> <div class="infocl"></div> <div class="infocr"></div> <div class="infobl"></div> <div class="infobc"></div> <div class="infobr" style="bottom: 64px;"></div></div></div><!-- /layerContainer -->  <!-- /dwv -->'));
+
+        var app = new dwv.App();
+        dwvapp = app;
+        //DEBUG
+        var listenerWL = function (event) {
+            console.log("event: " + event.type);
+            console.log(event);
+            $(".infotc").text(event.wc);
+        };
+        app.addEventListener("wl-width-change", listenerWL);
+        //app.addEventListener("wl-center-change", listener);
+        app.init({
+
+            "containerDivId": "dwv",
+            "fitToWindow": true,
+            "isMobile": true,
+            "gui": ["tool"],
+            "filters": ["Threshold", "Sharpen", "Sobel"],
+            "tools": ["Scroll", "WindowLevel", "ZoomAndPan"], // or try "ZoomAndPan"
+        });
+
+
+
+
+        var range = document.getElementById("sliceRange");
+        range.min = 0;
+        app.addEventListener("load-end", function () {
+            range.max = app.getImage().getGeometry().getSize().getNumberOfSlices() - 1;
+
+            if(range.max == 0) {
+                $(range).hide();
+            }
+        });
+        app.addEventListener("slice-change", function () {
+            range.value = app.getViewController().getCurrentPosition().k;
+        });
+        range.oninput = function () {
+            var pos = app.getViewController().getCurrentPosition();
+            pos.k = this.value;
+            app.getViewController().setCurrentPosition(pos);
+        }
+
+        try {
+            app.loadURLs([$(".dwv-container").data("url")]);
+        } catch(error) {
+            toastr.error(error.message);
+
+        }
+        dwv.gui.appendResetHtml(app);
+    }
+
+});
+
+function prepAnswerData() {
+    //$("#id_correct").val($("li.correct").map(function() {
+    //    ans = $(this).text();
+    //    window.marked_answers["correct"].push(ans);
+    //    return ans
+    //}).get().join('--//--'));
+    //$("#id_half_correct").val($("li.half-correct").map(function() {
+    //    ans = $(this).text();
+    //    window.marked_answers["half-correct"].push(ans);
+    //    return ans;
+    //}).get().join('--//--'));
+    //$("#id_incorrect").val($("li.incorrect").map(function() {
+    //    ans = $(this).text();
+    //    window.marked_answers["incorrect"].push(ans);
+    //    return ans;
+    //}).get().join('--//--'));
+
+    window.marked_answers["correct"] = [];
+    window.marked_answers["half-correct"] = [];
+    window.marked_answers["incorrect"] = [];
+    $("li.correct").map(function () {
+        ans = $(this).text();
+        window.marked_answers["correct"].push(ans);
+    })
+    $("li.half-correct").map(function () {
+        ans = $(this).text();
+        window.marked_answers["half-correct"].push(ans);
+    })
+    $("li.incorrect").map(function () {
+        ans = $(this).text();
+        window.marked_answers["incorrect"].push(ans);
+    })
+    $("#id_marked_answers").val(JSON.stringify(window.marked_answers));
+}

anatomy/static/js/dwv/appgui.js

@@ -0,0 +1,174 @@
+/**
+ * Application GUI.
+ */
+
+// Default window level presets.
+dwv.tool.defaultpresets = {
+    "default (127+/-255)": {"center": 127, "width": 255},
+    //"default": {"center": 127, "width": 100},
+};
+dwv.tool.defaultpresets.SC = {
+    "default (127+/-255)": {"center": 127, "width": 255},
+};
+// Default window level presets for CT.
+dwv.tool.defaultpresets.CT = {
+    "mediastinum": {"center": 40, "width": 400},
+    "lung": {"center": -500, "width": 1500},
+    "bone": {"center": 500, "width": 2000},
+};
+
+// decode query
+dwv.utils.decodeQuery = dwv.utils.base.decodeQuery;
+
+// Window
+dwv.gui.getWindowSize = function() {
+d = dwv.gui.base.getWindowSize();
+//return {"width": d["width"], "height": d["height"]+100}
+h = $(window).height() - ($(document).height()-d["height"]) - 100;
+return {"width": d["width"], "height": h}
+}
+
+// Progress
+dwv.gui.displayProgress = function (/*percent*/) { /*does nothing*/ };
+// get element
+dwv.gui.getElement = dwv.gui.base.getElement;
+// refresh
+dwv.gui.refreshElement = dwv.gui.base.refreshElement;
+// Slider
+dwv.gui.Slider = null;
+// Tags table
+dwv.gui.DicomTags = null;
+
+// Toolbox
+dwv.gui.Toolbox = function (app)
+{
+    this.setup = function (/*list*/)
+    {
+        // does nothing
+    };
+    this.display = function (/*bool*/)
+    {
+        // does nothing
+    };
+    this.initialise = function (list)
+    {
+        // not wonderful: first one should be scroll is more than one slice
+        if ( list[0] === false ) {
+            var inputScroll = app.getElement("scroll-button");
+            inputScroll.style.display = "none";
+            var inputZoom = app.getElement("zoom-button");
+            inputZoom.checked = true;
+        }
+    };
+};
+
+// Window/level
+dwv.gui.WindowLevel = function (app)
+{
+    this.setup = function ()
+    {
+        var button = document.createElement("button");
+        button.className = "wl-button";
+        button.value = "WindowLevel";
+        button.onclick = app.onChangeTool;
+        button.appendChild(document.createTextNode("Window/Level"));
+
+        var node = app.getElement("toolbar");
+        node.appendChild(button);
+    };
+    this.display = function (bool)
+    {
+        var button = app.getElement("wl-button");
+        button.disabled = bool;
+    };
+    this.initialise = function ()
+    {
+        // clear previous
+        dwv.html.removeNode(app.getElement("presetSelect"));
+        dwv.html.removeNode(app.getElement("presetLabel"));
+
+        // create preset select
+        var select = dwv.html.createHtmlSelect("presetSelect",
+            app.getViewController().getWindowLevelPresetsNames(), "wl.presets", true);
+        select.className = "presetSelect";
+        select.onchange = app.onChangeWindowLevelPreset;
+        select.title = "Select w/l preset.";
+        select.setAttribute("data-inline","true");
+        var label = document.createElement("label");
+        label.className = "presetLabel";
+        label.setAttribute("for", "presetSelect");
+        label.appendChild(document.createTextNode("Select Preset"));
+
+        var node = app.getElement("toolbar");
+        node.appendChild(label);
+        node.appendChild(select);
+    };
+};
+
+// Zoom
+dwv.gui.ZoomAndPan = function (app)
+{
+    this.setup = function ()
+    {
+        var button = document.createElement("button");
+        button.className = "zoom-button";
+        button.value = "ZoomAndPan";
+        button.onclick = app.onChangeTool;
+        button.appendChild(document.createTextNode("ZoomAndPan"));
+
+        var node = app.getElement("toolbar");
+        node.appendChild(button);
+    };
+    this.display = function (bool)
+    {
+        var button = app.getElement("zoom-button");
+        button.disabled = bool;
+    };
+};
+
+// Scroll
+dwv.gui.Scroll = function (app)
+{
+    this.setup = function ()
+    {
+        var button = document.createElement("button");
+        button.className = "scroll-button";
+        button.value = "Scroll";
+        button.onclick = app.onChangeTool;
+        button.appendChild(document.createTextNode("Scroll"));
+
+        var node = app.getElement("toolbar");
+        node.appendChild(button);
+    };
+    this.display = function (bool)
+    {
+        var button = app.getElement("scroll-button");
+        button.disabled = bool;
+    };
+};
+
+dwv.gui.Slider = dwv.gui.base.Slider;
+// NEEDS UI 
+dwv.gui.Filter = dwv.gui.base.Filter;
+
+
+// Filter: threshold
+dwv.gui.Threshold = dwv.gui.base.Threshold;
+// Filter: sharpen
+dwv.gui.Sharpen = dwv.gui.base.Sharpen;
+// Filter: sobel
+dwv.gui.Sobel = dwv.gui.base.Sobel;
+
+
+//Reset
+dwv.gui.appendResetHtml = function (app)
+{
+    var button = document.createElement("button");
+    button.className = "reset-button";
+    button.value = "reset";
+    button.onclick = app.onDisplayReset;
+    button.appendChild(document.createTextNode("Reset"));
+
+    var node = app.getElement("toolbar");
+    node.appendChild(button);
+};