From 3e483cb7a9342e185e83c6c7e05f5a645bbad1ac Mon Sep 17 00:00:00 2001 From: Erik Ziegler Date: Tue, 20 Oct 2015 16:23:32 +0200 Subject: [PATCH] Updated with Aysel's LesionTracker changes --- .../client/compatibility/docking-container.js | 62 ++++++++++--------- .../client/compatibility/lesionTool.js | 9 +-- LesionTracker/client/components/init.js | 6 ++ .../components/lesionDialog/lesionDialog.html | 3 + .../components/lesionDialog/lesionDialog.js | 23 +++++++ .../lesionLocationDialog.css | 0 .../lesionLocationDialog.html | 20 ++++++ .../lesionLocationDialog.js | 49 +++++++++++++++ .../lesionMeasurementContainer.html | 12 +++- .../lesionMeasurementContainer.js | 28 +++++++++ .../lesionMeasurementContainer.styl | 18 +++++- LesionTracker/client/components/viewer.html | 1 + LesionTracker/client/route.js | 2 - 13 files changed, 193 insertions(+), 40 deletions(-) create mode 100644 LesionTracker/client/components/init.js create mode 100644 LesionTracker/client/components/lesionDialog/lesionDialog.html create mode 100644 LesionTracker/client/components/lesionDialog/lesionDialog.js create mode 100644 LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.css create mode 100644 LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.html create mode 100644 LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.js create mode 100644 LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.js diff --git a/LesionTracker/client/compatibility/docking-container.js b/LesionTracker/client/compatibility/docking-container.js index d515d6c88..5b7a1b4d3 100644 --- a/LesionTracker/client/compatibility/docking-container.js +++ b/LesionTracker/client/compatibility/docking-container.js @@ -1,33 +1,39 @@ -//Collapse the container -function collapseContainer ( container ) { - container.toggleClass("collapseHorizontal"); -} +(function($) { -//function add collapse button -function addButtonCollapse ( container ) { - var btnCollapse = document.createElement("button"); - btnCollapse.innerHTML = ">"; - btnCollapse.classList.add('btnCollapse'); - btnCollapse.onclick = function() { // Note this is a function - collapseContainer(container); + //Collapse the container + function collapseContainer ( container ) { + container.toggleClass("collapseHorizontal"); + var btnCollapse = container.find(".btnCollapse"); + } + + //function add collapse button + function addButtonCollapse ( container ) { + var btnCollapse = document.createElement("button"); + btnCollapse.innerHTML = ">"; + $(btnCollapse).addClass ("btnCollapse"); + + btnCollapse.onclick = function() { // Note this is a function + collapseContainer(container); + }; + container.append(btnCollapse); + } + + $.fn.dockingContainer = function(options) { + var self = this; + var opts = $.extend( {}, $.fn.dockingContainer.defaults, options); + + //Set container class + this.addClass("dockingContainer"); + + //Add btnCollapse + addButtonCollapse(this); + return this; }; - container.append(btnCollapse); -} -$.fn.dockingContainer = function(options) { - var self = this; - var opts = $.extend( {}, $.fn.dockingContainer.defaults, options); + //Defaults + $.fn.dockingContainer.defaults = { + background: "black" + }; - //Set container class - this.addClass("dockingContainer"); - - //Add btnCollapse - addButtonCollapse(this); - return this; -}; - -//Defaults -$.fn.dockingContainer.defaults = { - background: "black" -}; \ No newline at end of file +}(jQuery)); \ No newline at end of file diff --git a/LesionTracker/client/compatibility/lesionTool.js b/LesionTracker/client/compatibility/lesionTool.js index 14fa4add9..2bfb8c093 100644 --- a/LesionTracker/client/compatibility/lesionTool.js +++ b/LesionTracker/client/compatibility/lesionTool.js @@ -22,7 +22,7 @@ var cornerstoneTools = (function ($, cornerstone, cornerstoneMath, cornerstoneTo //Listens LesionToolModified event and calls measurementModified function when lesion measurement is changed or updated. $(element).on("LesionToolModified", measurementModified); - $(element).trigger("LesionMeasurementCreated"); + $(element).trigger("LesionMeasurementCreated", mouseEventData); // create the measurement data for this tool with the end handle activated var measurementData = { @@ -282,9 +282,4 @@ var cornerstoneTools = (function ($, cornerstone, cornerstoneMath, cornerstoneTo toolType: toolType }); return cornerstoneTools; -}($, cornerstone, cornerstoneMath, cornerstoneTools)); - -toolManager.addTool('lesion', { - mouse: cornerstoneTools.lesion, - touch: cornerstoneTools.lesionTouch -}); \ No newline at end of file +}($, cornerstone, cornerstoneMath, cornerstoneTools)); \ No newline at end of file diff --git a/LesionTracker/client/components/init.js b/LesionTracker/client/components/init.js new file mode 100644 index 000000000..a81e40987 --- /dev/null +++ b/LesionTracker/client/components/init.js @@ -0,0 +1,6 @@ +Meteor.startup(function() { + toolManager.addTool('lesion', { + mouse: cornerstoneTools.lesion, + touch: cornerstoneTools.lesionTouch + }); +}); \ No newline at end of file diff --git a/LesionTracker/client/components/lesionDialog/lesionDialog.html b/LesionTracker/client/components/lesionDialog/lesionDialog.html new file mode 100644 index 000000000..369c7cd5a --- /dev/null +++ b/LesionTracker/client/components/lesionDialog/lesionDialog.html @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/LesionTracker/client/components/lesionDialog/lesionDialog.js b/LesionTracker/client/components/lesionDialog/lesionDialog.js new file mode 100644 index 000000000..c6c8a0c9e --- /dev/null +++ b/LesionTracker/client/components/lesionDialog/lesionDialog.js @@ -0,0 +1,23 @@ +Template.lesionDialog.onRendered(function () { + // Listen lesionMeaurementCreated Event and when this event is triggered, show lesionLocationDialog Box + var viewportIndex = this.data.activeViewport.get(); + + $(document).on("LesionMeasurementCreated",function(e, eventData){ + + console.log("lesionMeasurementCreated"); + var data = {}; + data.viewportIndex = viewportIndex; + + //Set Lesion Table Data to insert into lesion table + setLesionTableData(data); + + if( !Session.get("lesionLocationSelected") ) { + $("#modal-dialog-container").css({ + "top": eventData.currentPoints.page.y, + "left": eventData.currentPoints.page.x + }); + + $("#lesionDialog").modal("show"); + } + }); +}); \ No newline at end of file diff --git a/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.css b/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.css new file mode 100644 index 000000000..e69de29bb diff --git a/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.html b/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.html new file mode 100644 index 000000000..1f25b7950 --- /dev/null +++ b/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.html @@ -0,0 +1,20 @@ + \ No newline at end of file diff --git a/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.js b/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.js new file mode 100644 index 000000000..738244ab5 --- /dev/null +++ b/LesionTracker/client/components/lesionLocationDialog/lesionLocationDialog.js @@ -0,0 +1,49 @@ +//fill selectLesionLocation element +var lesionLocationsArray = [ + {location:"Brain Brainstem",hasDescription:false, description:""}, + {location:"Brain Cerebellum Left",hasDescription:false, description:""}, + {location:"Brain Cerebrum Left",hasDescription:false, description:""}, + {location:"Brain Cerebrum Right",hasDescription:false, description:""}, + {location:"Brain Multiple Sites",hasDescription:false, description:""} +]; + +Template.lesionLocationDialog.onRendered(function () { + + function fillSelectLesionLocation () { + var el = $("#selectLesionLocation"); + el.find('option:not(:first)').remove(); + $.each(lesionLocationsArray, function(key, value) { + el.append(""); + }); + } + + // Fill dropdown + fillSelectLesionLocation(); +}); + +Template.lesionLocationDialog.events({ + 'click button#btnCloseLesionPopup': function (e) { + $("#lesionDialog").modal("hide"); + }, + + 'change select#selectLesionLocation': function (e) { + var el = $(e.target); + var selectedLocationIndex = el.val(); + if(selectedLocationIndex !== "-1"){ + + var locationObj = lesionLocationsArray[selectedLocationIndex]; + + // Trigger location selected event + $(document).trigger("lesionLocationSelected",locationObj); + + // Set activeModule parameters in index.html + $("#lesionDialog").modal("hide"); + + // Select first option + el.val($("#selectLesionLocation option:first").val()); + + // Set lesion location selected session to prevent open + Session.set("lesionLocationSelected", true); + } + } +}); \ No newline at end of file diff --git a/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.html b/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.html index 70b990a2b..8759ff939 100644 --- a/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.html +++ b/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.html @@ -1,5 +1,15 @@ \ No newline at end of file diff --git a/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.js b/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.js new file mode 100644 index 000000000..298d79808 --- /dev/null +++ b/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.js @@ -0,0 +1,28 @@ +var lesionTableData; + +setLesionTableData = function (data) { + lesionTableData = data; +}; + +getLesionTableData = function () { + return lesionTableData; +}; + +returnTblStr = function (obj) { + return '1' + obj.lesionLocationObj.location + '' + obj.lesions + ''; +}; + +Template.lesionMeasurementContainer.onRendered( function () { + console.log("rendered lesion"); + //Link lesionLocationSelected event + $(document).on("lesionLocationSelected",function(event,data ){ + var lesionData = getLesionTableData(); + lesionData.lesionLocationObj = data; + var tabId = lesionData.tabId; + var el_index = lesionData.viewportIndex; + var lesionTables = $(".lesionTable"); + var tableEl = lesionTables.get(el_index); + var tblStr = returnTblStr(lesionData); + $(tableEl).append(tblStr); + }); +}); \ No newline at end of file diff --git a/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.styl b/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.styl index 41a05cb28..6f691bb88 100644 --- a/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.styl +++ b/LesionTracker/client/components/lesionMeasurementContainer/lesionMeasurementContainer.styl @@ -3,5 +3,19 @@ float: left height: 100% - background-color: white - border: 8px solid lightblue \ No newline at end of file +#tblLesion { + overflow: auto; + border: solid 1px white; + padding: 0; + margin: 0 auto; + font-size: 14px; + cursor: pointer; + color: white; + width: 100%; + height:100%; + background-color: black; +} + +#tblLesion > tr {background-color: #545454;border-bottom: solid 1px black; width: 100%;} +#tblLesion > tr.headRow{background-color: #424242;width: 100%; line-height: 15px;} +#tblLesion > tr.headRow th{padding:5px;text-align: left;font-style: italic;font-size:14px;} \ No newline at end of file diff --git a/LesionTracker/client/components/viewer.html b/LesionTracker/client/components/viewer.html index 0ded93dbd..71dec6ebc 100644 --- a/LesionTracker/client/components/viewer.html +++ b/LesionTracker/client/components/viewer.html @@ -1,5 +1,6 @@