From 9ce3e5ed86aab3d770ffc5dceee29de6b91106f5 Mon Sep 17 00:00:00 2001
From: Erik Ziegler <erik.ziegler@ulg.ac.be>
Date: Wed, 11 Nov 2015 22:16:22 +0100
Subject: [PATCH] Updated lesion dialog to use collections

---
 LesionTracker/client/components/init.js       |   1 +
 LesionTracker/client/components/viewer.html   |   2 +-
 .../lesiontracker/compatibility/lesionTool.js | 190 +++++++++-------
 .../compatibility/measurementManagerDAL.js    |  56 +----
 .../compatibility/nonTargetTool.js            |  81 +------
 .../components/lesionDialog/lesionDialog.html |   3 -
 .../components/lesionDialog/lesionDialog.js   |  24 ---
 .../lesionLocationDialog.html                 |  28 ++-
 .../lesionLocationDialog.js                   | 202 ++++++++++++------
 .../lesionLocationDialog.styl                 |  19 ++
 Packages/lesiontracker/package.js             |   4 +-
 11 files changed, 305 insertions(+), 305 deletions(-)
 delete mode 100644 Packages/lesiontracker/components/lesionDialog/lesionDialog.html
 delete mode 100644 Packages/lesiontracker/components/lesionDialog/lesionDialog.js
 create mode 100644 Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.styl

diff --git a/LesionTracker/client/components/init.js b/LesionTracker/client/components/init.js
index 58e32c45f..fc816f8a7 100644
--- a/LesionTracker/client/components/init.js
+++ b/LesionTracker/client/components/init.js
@@ -3,6 +3,7 @@ Meteor.startup(function() {
         mouse: cornerstoneTools.lesion,
         touch: cornerstoneTools.lesionTouch
     });
+    
     toolManager.addTool('nonTarget', {
         mouse: cornerstoneTools.nonTarget,
         touch: cornerstoneTools.nonTargetTouch
diff --git a/LesionTracker/client/components/viewer.html b/LesionTracker/client/components/viewer.html
index c41694b7a..92111a314 100644
--- a/LesionTracker/client/components/viewer.html
+++ b/LesionTracker/client/components/viewer.html
@@ -1,6 +1,6 @@
 <template name="viewer">
     <div id="viewer">
-        {{ >lesionDialog }}
+        {{ >lesionLocationDialog }}
         {{ >nonTargetLesionDialog}}
 
         {{ >hidingPanel }}
diff --git a/Packages/lesiontracker/compatibility/lesionTool.js b/Packages/lesiontracker/compatibility/lesionTool.js
index b099ef21b..720e242aa 100644
--- a/Packages/lesiontracker/compatibility/lesionTool.js
+++ b/Packages/lesiontracker/compatibility/lesionTool.js
@@ -8,41 +8,70 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
         cornerstoneTools = {};
     }
 
+    var configuration = {
+        getLesionLocationCallback: getLesionLocationCallback,
+        changeLesionLocationCallback: changeLesionLocationCallback,
+    };
+
+    // Define a callback to get your text annotation
+    // This could be used, e.g. to open a modal
+    function getLesionLocationCallback(measurementData, eventData, doneCallback) {
+        doneCallback(prompt('Enter your lesion location:'));
+    }
+
+    function changeLesionLocationCallback(measurementData, eventData, doneCallback) {
+        doneCallback(prompt('Change your lesion location:'));
+    }
+
     var toolType = "lesion";
 
     ///////// BEGIN ACTIVE TOOL ///////
-    function createNewMeasurement(mouseEventData) {
+
+    function addNewMeasurement(mouseEventData) {
         var element = mouseEventData.element;
-        timepointID = $(element).data('timepointID');
-        var lesionNumber = measurementManagerDAL.getNewLesionNumber(timepointID, true);
-        var lesionCounter = "";
 
+        function doneCallback(lesionNumber) {
+            measurementData.lesionName = "Target " + lesionNumber;
+            measurementData.lesionNumber = lesionNumber;
+            measurementData.active = false;
+            cornerstone.updateImage(element);
+        }
 
-        // ** This stuff should not be done here! We should do this inside addNewMeasurement!** //
+        var measurementData = createNewMeasurement(mouseEventData);
 
-        // Subscribe CornerstoneMouseup event, when mouse is up, call lesionDialog
-        $(element).on("CornerstoneToolsMouseUp", function(e) {
+        var eventData = {
+            mouseButtonMask: mouseEventData.which,
+        };
+        
+        // associate this data with this imageId so we can render it and manipulate it
+        cornerstoneTools.addToolState(element, toolType, measurementData);
+       
+        // since we are dragging to another place to drop the end point, we can just activate
+        // the end point and let the moveHandle move it for us.
+        $(element).off('CornerstoneToolsMouseMove', cornerstoneTools.lesion.mouseMoveCallback);
+        $(element).off('CornerstoneToolsMouseDown', cornerstoneTools.lesion.mouseDownCallback);
+        $(element).off('CornerstoneToolsMouseDownActivate', cornerstoneTools.lesion.mouseDownActivateCallback);
 
-            // Unsubscribe CornerstoneToolsMouseUp event
-            $(element).off("CornerstoneToolsMouseUp");
+        cornerstone.updateImage(element);
+        cornerstoneTools.moveNewHandle(mouseEventData, measurementData.handles.end, function() {
+            if (cornerstoneTools.anyHandlesOutsideImage(mouseEventData, measurementData.handles)) {
+                // delete the measurement
+                cornerstoneTools.removeToolState(element, toolType, measurementData);
+            } else {
+                // Set lesionMeasurementData Session
+                var config = cornerstoneTools.lesion.getConfiguration();
+                config.getLesionLocationCallback(measurementData, mouseEventData, doneCallback);
+            }
 
-            // Set lesionMeasurementData Session
-            activeLesionMeasurementData.timepointID = timepointID;
-            Session.set("lesionMeasurementData", activeLesionMeasurementData);
-
-            // Show LesionDialog
-            $(document).trigger("ShowLesionDialog", [e, activeLesionMeasurementData]);
+            $(element).on('CornerstoneToolsMouseMove', eventData, cornerstoneTools.lesion.mouseMoveCallback);
+            $(element).on('CornerstoneToolsMouseDown', eventData, cornerstoneTools.lesion.mouseDownCallback);
+            $(element).on('CornerstoneToolsMouseDownActivate', eventData, cornerstoneTools.lesion.mouseDownActivateCallback);
+            cornerstone.updateImage(element);
         });
+    }
 
-        // Set Lesion Name
-        $(element).on("LesionNameSet", function(e, lesionName) {
-            lesionCounter = lesionName;
-        });
-
-        // Subscribe LesionMeasurementCreated
-        $(element).trigger("LesionMeasurementCreated");
-
-        // create the measurement data for this tool with the end handle activated
+    function createNewMeasurement(mouseEventData) {
+        // Create the measurement data for this tool with the end handle activated
         var measurementData = {
             visible: true,
             active: true,
@@ -70,9 +99,8 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
             },
             imageId: mouseEventData.image.imageId,
             measurementText: 0,
-            lesionName: "Target " + lesionNumber,
+            lesionName: '',
             isDeleted: false,
-            lesionNumber: lesionNumber,
             isTarget: true,
             uid: uuid.v4()
         };
@@ -136,15 +164,15 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
     }
 
     function updateLesionCollection(lesionData) {
+        if (!lesionData.active) {
+            return;
+        }
 
-        if (lesionData.active) {
-            if (lesionData.timepointID !== undefined && lesionData.timepointID !== "") {
-                // Update Measurements Collection
-                measurementManagerDAL.updateTimepointData(lesionData);
-
-            } else {
-                activeLesionMeasurementData = lesionData;
-            }
+        if (lesionData.timepointID && lesionData.timepointID !== "") {
+            // Update Measurements Collection
+            measurementManagerDAL.updateTimepointData(lesionData);
+        } else {
+            activeLesionMeasurementData = lesionData;
         }
     }
 
@@ -230,63 +258,62 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
     ///////// END IMAGE RENDERING ///////
 
     function updateLesion(e, eventData) {
-        var start = new Date();
-
         var enabledElement = eventData.enabledElement;
+        var element = eventData.enabledElement.element;
         var isTarget = eventData.lesionData.isTarget;
         var lesionNumber = eventData.lesionData.lesionNumber;
         var type = eventData.type;
 
         // if we have no toolData for this element, return immediately as there is nothing to do
         var toolData = cornerstoneTools.getToolState(e.currentTarget, toolType);
-        if (toolData === undefined) {
+        if (!toolData) {
             return;
         }
 
         var data,
             i;
 
-        //If type is delete, remove measurement
-        if (type === "delete") {
-            var deletedDataIndex = -1;
+        switch (type) {
+            case "delete":
+                //If type is delete, remove measurement
+                var deletedDataIndex = -1;
 
-            for (i = 0; i < toolData.data.length; i++) {
-                data = toolData.data[i];
+                for (i = 0; i < toolData.data.length; i++) {
+                    data = toolData.data[i];
 
-                //When click a row of table measurements, measurement will be active and color will be green
-                if (data.lesionNumber === eventData.lesionNumber && eventData.type !== "active" && isTarget) {
-                    data.visible = false;
-                    deletedDataIndex = i;
+                    //When click a row of table measurements, measurement will be active and color will be green
+                    if (data.lesionNumber === lesionNumber && eventData.type !== "active" && isTarget) {
+                        data.visible = false;
+                        deletedDataIndex = i;
+                    }
                 }
-            }
 
-            if (deletedDataIndex >= 0 && deletedDataIndex < toolData.data.length) {
-                toolData.data.splice(deletedDataIndex, 1);
-            }
-        } else if (type === "active") {
-            for (i = 0; i < toolData.data.length; i++) {
-                data = toolData.data[i];
-                //When click a row of table measurements, measurement will be active and color will be green
-                if (data.lesionNumber === eventData.lesionData.lesionNumber && eventData.type === "active" && isTarget) {
-                    data.active = true;
-                } else {
+                if (deletedDataIndex >= 0 && deletedDataIndex < toolData.data.length) {
+                    toolData.data.splice(deletedDataIndex, 1);
+                }
+                break;
+
+            case "active":
+                for (i = 0; i < toolData.data.length; i++) {
+                    data = toolData.data[i];
+                    //When click a row of table measurements, measurement will be active and color will be green
+                    if (data.lesionNumber === lesionNumber && eventData.type === "active" && isTarget) {
+                        data.active = true;
+                    } else {
+                        data.active = false;
+                    }
+                }
+                break;
+
+            case "inactive":
+                for (i = 0; i < toolData.data.length; i++) {
+                    data = toolData.data[i];
+                    // Make inactive all lesions for the timepoint
                     data.active = false;
                 }
-            }
-        } else if (type === "inactive") {
-            for (i = 0; i < toolData.data.length; i++) {
-                data = toolData.data[i];
-                // Make inactive all lesions for the timepoint
-                data.active = false;
-            }
+                break;
         }
 
-        var context = enabledElement.canvas.getContext('2d');
-
-        var end = new Date();
-        var diff = end - start;
-        //console.log(diff + ' ms');
-
         cornerstone.updateImage(element);
     }
 
@@ -298,19 +325,19 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
         if (eventData.type === "active") {
             var stackToolDataSource = cornerstoneTools.getToolState(e.currentTarget, 'stack');
             var stackData = stackToolDataSource.data[0];
-            var imageIdsArr = stackData.imageIds;
-            var indexOfImage = imageIdsArr.indexOf(eventData.lesionData.imageId);
-            if (indexOfImage > -1) {
-                cornerstone.loadAndCacheImage(stackData.imageIds[indexOfImage]).then(function(image) {
-                    cornerstone.displayImage(eventData.enabledElement.element, image);
-                    updateLesion(e, eventData);
-                });
+            var imageIds = stackData.imageIds;
+            var imageIdIndex = imageIds.indexOf(eventData.lesionData.imageId);
+            if (imageIdIndex < 0) {
+                return;
             }
+
+            cornerstone.loadAndCacheImage(imageIds[imageIdIndex]).then(function(image) {
+                cornerstone.displayImage(eventData.enabledElement.element, image);
+                updateLesion(e, eventData);
+            });
         } else if (eventData.type === "inactive") {
             updateLesion(e, eventData);
         }
-
-
     }
 
     //This function is called from cornerstone-viewport.html and updates lesion measurement and makes the lesion active
@@ -321,6 +348,7 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
     // module exports
     cornerstoneTools.lesion = cornerstoneTools.mouseButtonTool({
         createNewMeasurement: createNewMeasurement,
+        addNewMeasurement: addNewMeasurement,
         onImageRendered: onImageRendered,
         pointNearTool: pointNearTool,
         toolType: toolType
@@ -328,10 +356,14 @@ var cornerstoneTools = (function($, cornerstone, cornerstoneMath, cornerstoneToo
 
     cornerstoneTools.lesionTouch = cornerstoneTools.touchTool({
         createNewMeasurement: createNewMeasurement,
+        //addNewMeasurement: addNewMeasurementTouch,
         onImageRendered: onImageRendered,
         pointNearTool: pointNearTool,
         toolType: toolType
     });
+
+    cornerstoneTools.lesion.setConfiguration(configuration);
+
     return cornerstoneTools;
 
 }($, cornerstone, cornerstoneMath, cornerstoneTools));
\ No newline at end of file
diff --git a/Packages/lesiontracker/compatibility/measurementManagerDAL.js b/Packages/lesiontracker/compatibility/measurementManagerDAL.js
index 28a46eef1..b438bbf21 100644
--- a/Packages/lesiontracker/compatibility/measurementManagerDAL.js
+++ b/Packages/lesiontracker/compatibility/measurementManagerDAL.js
@@ -1,30 +1,9 @@
 var measurementManagerDAL = (function() {
-    var trialPatientLocations = [];
+    PatientLocations = new Meteor.Collection(null);
 
-    // Returns trialPatientLocations array
-    function getPatientLocations() {
-        return trialPatientLocations;
-    }
-
-    function getLocationName(locationUID) {
-        for (var i = 0; i < trialPatientLocations.length; i++) {
-            var locationObject = trialPatientLocations[i];
-            if (locationObject.uid === locationUID) {
-                return locationObject.location.location;
-            }
-        }
-        return "";
-    }
-
-    // Adds new location to trialPatientLocations array
-    function addPatientLocation(location) {
-        var locationUID = uuid.v4();
-        var locationObject = {
-            uid: locationUID,
-            location: location
-        };
-        trialPatientLocations.push(locationObject);
-        return locationUID;
+    function getLocationName(id) {
+        var locationObject = PatientLocations.findOne(id);
+        return locationObject.location || "";
     }
 
     // Add timepoint data to Measurements collection
@@ -57,7 +36,7 @@ var measurementManagerDAL = (function() {
             lesionUID: uuid.v4(),
             number: Measurements.find().count() + 1,
             lesionNumber: lesionData.lesionNumber,
-            isTarget: typeof lesionData.isTarget !== 'undefined'?lesionData.isTarget:true,
+            isTarget: lesionData.isTarget,
             locationUID: lesionData.locationUID,
             location: getLocationName(lesionData.locationUID),
             timepoints: timepointsObject
@@ -67,9 +46,6 @@ var measurementManagerDAL = (function() {
 
     // Update timepoint data in Measurements collection
     function updateTimepointData(lesionData) {
-        if(typeof lesionData.isTarget === 'undefined') {
-            lesionData.isTarget = true;
-        }
         // Find the specific lesion to be updated
         var measurement = Measurements.find({
             lesionNumber: lesionData.lesionNumber,
@@ -100,10 +76,10 @@ var measurementManagerDAL = (function() {
     }
 
     // Check timepointData is found in Measurements collection
-    function timepointDataIsFound(lesionData) {
+    function hasTimepointData(lesionData) {
         var timepointData = Measurements.findOne({
             lesionNumber: lesionData.lesionNumber,
-            isTarget: typeof lesionData.isTarget!== 'undefined'?lesionData.isTarget:true
+            isTarget: lesionData.isTarget
         });
         if (timepointData) {
             return true;
@@ -113,7 +89,7 @@ var measurementManagerDAL = (function() {
 
     // Adds new timepoint item to tiemepoints array
     function addLesionData(lesionData) {
-        if (timepointDataIsFound(lesionData)) {
+        if (hasTimepointData(lesionData)) {
             // Update data
             updateTimepointData(lesionData);
         } else {
@@ -124,10 +100,6 @@ var measurementManagerDAL = (function() {
 
     // Returns new lesion number according to timepointID
     function getNewLesionNumber(timepointID, isTarget) {
-
-        if (typeof isTarget === 'undefined') {
-            isTarget = true;
-        }
         // Get all current lesion measurements
         var measurements = Measurements.find({isTarget: isTarget}).fetch();
 
@@ -153,14 +125,11 @@ var measurementManagerDAL = (function() {
     }
 
     // If lesion number is added for any timepoint, returns lesion locationUID
-    function isLesionNumberAdded(lesionData) {
-        if (!timepointDataIsFound(lesionData)) {
+    function lesionNumberExists(lesionData) {
+        if (!hasTimepointData(lesionData)) {
             return;
         }
 
-        if(typeof isTarget === undefined) {
-            isTarget = true;
-        }
         var measurement = Measurements.find({
             lesionNumber: lesionData.lesionNumber,
             isTarget: lesionData.isTarget
@@ -169,13 +138,10 @@ var measurementManagerDAL = (function() {
         return measurement.locationUID;
     }
 
-
     return {
-        addNewLocation: addPatientLocation,
-        getLocations: getPatientLocations,
         addLesionData: addLesionData,
         getNewLesionNumber: getNewLesionNumber,
-        isLesionNumberAdded: isLesionNumberAdded,
+        lesionNumberExists: lesionNumberExists,
         updateTimepointData: updateTimepointData,
         getLocationName: getLocationName
     };
diff --git a/Packages/lesiontracker/compatibility/nonTargetTool.js b/Packages/lesiontracker/compatibility/nonTargetTool.js
index 71a01e965..22d7383d7 100644
--- a/Packages/lesiontracker/compatibility/nonTargetTool.js
+++ b/Packages/lesiontracker/compatibility/nonTargetTool.js
@@ -1,4 +1,3 @@
-// Begin Source: src/imageTools/annotation.js
 (function($, cornerstone, cornerstoneMath, cornerstoneTools) {
 
     'use strict';
@@ -8,14 +7,13 @@
     // Define a callback to get your text annotation
     // This could be used, e.g. to open a modal
     function getTextCallback(doneChangingTextCallback) {
-        doneChangingTextCallback(prompt('Enter your annotation:'));
+        doneChangingTextCallback(prompt('Add a non-target lesion name:'));
     }
 
     function changeTextCallback(data, doneChangingTextCallback) {
         doneChangingTextCallback(prompt('Change your annotation:'));
     }
 
-
     var configuration = {
         getTextCallback: getTextCallback,
         changeTextCallback: changeTextCallback,
@@ -141,16 +139,6 @@
         return (distanceToPoint < 25);
     }
 
-    function pointNearToolForText(element, data, coords) {
-        var lineSegment = {
-            start: cornerstone.pixelToCanvas(element, data.linkedTextCoords.start),
-            end: cornerstone.pixelToCanvas(element, data.linkedTextCoords.end)
-        };
-
-        var distanceToPoint = cornerstoneMath.lineSegment.distanceToPoint(lineSegment, coords);
-        return (distanceToPoint < 30);
-    }
-
     function drawArrow(context, start, end, color, lineWidth) {
         //variables to be used when creating the arrow
         var headLength = 10;
@@ -185,7 +173,7 @@
         context.fill();
     }
 
-    function suscribeNonTargetToolModifiedEvent(element) {
+    function subcribeNonTargetToolModifiedEvent(element) {
         var elementEvents = $._data(element, "events");
         var index = Object.keys(elementEvents).indexOf("NonTargetToolSelected");
         if (index < 0) {
@@ -197,7 +185,7 @@
     ///////// BEGIN IMAGE RENDERING ///////
     function onImageRendered(e, eventData) {
 
-        suscribeNonTargetToolModifiedEvent(e.currentTarget);
+        subcribeNonTargetToolModifiedEvent(e.currentTarget);
 
         // if we have no toolData for this element, return immediately as there is nothing to do
         var toolData = cornerstoneTools.getToolState(e.currentTarget, toolType);
@@ -229,8 +217,8 @@
         // configurable shadow from CornerstoneTools
         if (config && config.shadow) {
             context.shadowColor = '#000000';
-            context.shadowOffsetX = +1;
-            context.shadowOffsetY = +1;
+            context.shadowOffsetX = 1;
+            context.shadowOffsetY = 1;
         }
 
         if (lesion.active) {
@@ -303,49 +291,6 @@
         context.restore();
 
     }
-    // ---- Touch tool ----
-
-    ///////// BEGIN ACTIVE TOOL ///////
-    function addNewMeasurementTouch(touchEventData) {
-        var element = touchEventData.element;
-
-        function doneChangingTextCallback(text) {
-            if (text !== null) {
-                measurementData.text = text;
-            } else {
-                cornerstoneTools.removeToolState(element, toolType, measurementData);
-            }
-
-            measurementData.active = false;
-            cornerstone.updateImage(element);
-        }
-
-        var measurementData = createNewMeasurement(touchEventData);
-        cornerstoneTools.addToolState(element, toolType, measurementData);
-        $(element).off('CornerstoneToolsTouchDrag', cornerstoneTools.nonTargetTouch.touchMoveCallback);
-        $(element).off('CornerstoneToolsDragStartActive', cornerstoneTools.nonTargetTouch.touchDownActivateCallback);
-        $(element).off('CornerstoneToolsTap', cornerstoneTools.nonTargetTouch.tapCallback);
-        cornerstone.updateImage(element);
-
-        cornerstoneTools.moveNewHandleTouch(touchEventData, measurementData.handles.end, function() {
-            cornerstone.updateImage(element);
-
-            if (cornerstoneTools.anyHandlesOutsideImage(touchEventData, measurementData.handles)) {
-                // delete the measurement
-                cornerstoneTools.removeToolState(element, toolType, measurementData);
-            }
-
-            var config = cornerstoneTools.nonTarget.getConfiguration();
-            if (measurementData.text === undefined) {
-                config.getTextCallback(doneChangingTextCallback);
-            }
-
-            $(element).on('CornerstoneToolsTouchDrag', cornerstoneTools.nonTargetTouch.touchMoveCallback);
-            $(element).on('CornerstoneToolsDragStartActive', cornerstoneTools.nonTargetTouch.touchDownActivateCallback);
-            $(element).on('CornerstoneToolsTap', cornerstoneTools.nonTargetTouch.tapCallback);
-        });
-    }
-
 
     function doubleClickCallback(e, eventData) {
         var element = eventData.element;
@@ -497,24 +442,10 @@
         createNewMeasurement: createNewMeasurement,
         onImageRendered: onImageRendered,
         pointNearTool: pointNearTool,
-        pointNearToolForText: pointNearToolForText,
         toolType: toolType,
         mouseDoubleClickCallback: doubleClickCallback
     });
 
     cornerstoneTools.nonTarget.setConfiguration(configuration);
 
-    cornerstoneTools.nonTargetTouch = cornerstoneTools.touchTool({
-        addNewMeasurement: addNewMeasurementTouch,
-        createNewMeasurement: createNewMeasurement,
-        onImageRendered: onImageRendered,
-        pointNearTool: pointNearTool,
-        pointNearToolForText: pointNearToolForText,
-        toolType: toolType,
-        pressCallback: doubleClickCallback
-    });
-
-
-})($, cornerstone, cornerstoneMath, cornerstoneTools);
-
-// End Source; src/imageTools/annotation.js
\ No newline at end of file
+})($, cornerstone, cornerstoneMath, cornerstoneTools);
\ No newline at end of file
diff --git a/Packages/lesiontracker/components/lesionDialog/lesionDialog.html b/Packages/lesiontracker/components/lesionDialog/lesionDialog.html
deleted file mode 100644
index 369c7cd5a..000000000
--- a/Packages/lesiontracker/components/lesionDialog/lesionDialog.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<template name="lesionDialog">
-    {{> lesionLocationDialog}}
-</template>
\ No newline at end of file
diff --git a/Packages/lesiontracker/components/lesionDialog/lesionDialog.js b/Packages/lesiontracker/components/lesionDialog/lesionDialog.js
deleted file mode 100644
index abc44b891..000000000
--- a/Packages/lesiontracker/components/lesionDialog/lesionDialog.js
+++ /dev/null
@@ -1,24 +0,0 @@
-Template.lesionDialog.onRendered(function () {
-    // This event determines whether or not to show the lesion dialog
-    // If there already exists a lesion with this specific lesion number,
-    // related to the chosen location.
-
-    $(document).on("ShowLesionDialog", function (e, eventData, lesionData) {
-        var locationUID = measurementManagerDAL.isLesionNumberAdded(lesionData);
-        
-        if (locationUID) {
-            lesionData.locationUID = locationUID;
-            measurementManagerDAL.updateTimepointData(lesionData);
-        } else {
-            // Show Dialog
-            var dialogPointsOnPage = eventData.currentPoints.page;
-            $("#modal-dialog-container").css({
-                "top": dialogPointsOnPage.y,
-                "left": dialogPointsOnPage.x
-            });
-
-            $("#lesionDialog").modal("show");
-        }
-    });
-});
-
diff --git a/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.html b/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.html
index 1f25b7950..b71e636f9 100644
--- a/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.html
+++ b/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.html
@@ -1,19 +1,17 @@
 <template name="lesionLocationDialog">
-    <div class="modal fade" id="lesionDialog" style=" background-color: transparent;">
-        <div id="modal-dialog-container" class="modal-dialog modal-sm" style="position: absolute; border: none; ">
-            <div class="modal-content" style="padding: 10px;">
-                 <div class="dialogHeader">
-                        <div style="float:left;"><h4>Select Lesion Location</h4></div>
-                        <div style="float:right;"><button class="btn" id="btnCloseLesionPopup" style="outline: 0; border: none; background-color: transparent;"><i class="fa fa-close"></i></button></div>
-                    </div>
-                    <div class="dialogContent" style="margin-bottom: 20px;">
-                        <div class="lesionLocation">
-                            <label>Lesion Location</label>
-                            <select id="selectLesionLocation" style="margin-top:5px;">
-                                <option value="-1"></option>
-                            </select>
-                        </div>
-                    </div>
+    <div id="lesionLocationDialog">
+        <div class="dialogHeader">
+            <h4>Select Lesion Location</h4>
+        </div>
+        <div class="dialogContent">
+            <div class="lesionLocation">
+                <label>Lesion Location</label>
+                <select id="selectLesionLocation">
+                    <option value="-1"></option>
+                    {{ #each lesionLocations}} 
+                        <option value='{{_id}}'>{{location}}</option>
+                    {{ /each}}
+                </select>
             </div>
         </div>
     </div>
diff --git a/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.js b/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.js
index bb21d3fda..9997b87af 100644
--- a/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.js
+++ b/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.js
@@ -1,90 +1,172 @@
-var lastAddedLesionData;
+// This event determines whether or not to show the lesion dialog
+// If there already exists a lesion with this specific lesion number,
+// related to the chosen location.
+function getLesionLocationCallback(measurementData, eventData, doneCallback) {
+    // Get the lesion location dialog
+    var lesionDialog = $("#lesionLocationDialog");
 
-//fill selectLesionLocation element
-var lesionLocationsArray = [{
+    // Find the select option box
+    var selector = lesionDialog.find("select#selectLesionLocation");
+
+    // Get the current element's timepointID
+    // TODO: Change this when we are no longer storing timepointID in the viewport element DOM data
+    measurementData.timepointID = $(eventData.element).data('timepointID');
+
+    // Get a lesion number for this lesion, depending on whether or not the same lesion previously
+    // exists at a different timepoint
+    var lesionNumber = measurementManagerDAL.getNewLesionNumber(measurementData.timepointID, isTarget=true);
+    measurementData.lesionNumber = lesionNumber;
+
+    // Find out if this lesion number is already added in the lesion manager for another timepoint
+    // If it is, stop here because we don't need the dialog.
+    var locationUID = measurementManagerDAL.lesionNumberExists(measurementData);
+    if (locationUID) {
+        measurementData.locationUID = locationUID;
+        measurementManagerDAL.updateTimepointData(measurementData);
+        closeHandler();
+        return;
+    }
+    // If it isn't, continue to open the dialog and have the user choose a lesion location
+
+    // Attach close handler if the user clicks the close button
+    var close = lesionDialog.find("#btnCloseLesionPopup");
+    close.off('click');
+    close.on('click', function() {
+        closeHandler();
+    });
+
+    function closeHandler() {
+        // Hide the lesion dialog
+        lesionDialog.css('display', 'none');
+
+        // Fire the doneCallback with the lesion number
+        doneCallback(lesionNumber);
+
+        // Get the current value of the select option box
+        var currentValue = selector.find("option:selected").val();
+
+        // Select the first option for the next time the dialog is opened
+        selector.val(currentValue);
+    }
+
+    // Attach keypress handlers so the user can close with the Enter button
+    lesionDialog.off("keypress");
+    lesionDialog.on('keypress', keyPressHandler);
+
+    // This is the keypress callback function
+    function keyPressHandler(e) {
+        // If Enter is pressed, close the dialog
+        if (e.which === 13) {
+            closeHandler();
+        }
+    }
+
+    // Show the lesion location dialog above
+    lesionDialog.css({
+        top: eventData.currentPoints.page.y - lesionDialog.outerHeight() - 40,
+        left: eventData.currentPoints.page.x - lesionDialog.outerWidth() / 2,
+        display: 'block'
+    });
+
+    // Attach a callback for the select box
+    selector.off('change');
+    selector.on('change', function(e) {
+        // Get the current value of the selector
+        var selectedOptionId = this.value;
+
+        // If the selected option is still the default (-1)
+        // then stop here
+        if (selectedOptionId < 0) {
+            return;
+        }
+
+        // Get selected location data
+        var locationObj = LesionLocations.findOne({_id: selectedOptionId});
+
+        
+        var id;
+        var existingLocation = PatientLocations.findOne({location: locationObj.location});
+        if (existingLocation) {
+            id = existingLocation._id;
+        } else {
+            // Adds location data to PatientLocation and retrieve the location ID
+            id = PatientLocations.insert({location: locationObj.location});
+        }
+
+        // Link locationUID with active lesion measurementData
+        measurementData.locationUID = id;
+
+        /// Set the isTarget value to true, since this is the target-lesion dialog callback
+        measurementData.isTarget = true;
+
+        // Adds lesion data to timepoints array
+        measurementManagerDAL.addLesionData(measurementData);
+
+        // Close the dialog
+        closeHandler();
+    });
+}
+
+function changeLesionLocationCallback(measurementData, eventData, doneCallback) {
+    doneCallback(prompt('Change your lesion location:'));
+}
+
+var config = {
+    getLesionLocationCallback: getLesionLocationCallback,
+    changeLesionLocationCallback: changeLesionLocationCallback
+};
+
+cornerstoneTools.lesion.setConfiguration(config);
+
+
+LesionLocations = new Meteor.Collection(null);
+
+LesionLocations.insert({
     location: "Brain Brainstem",
     hasDescription: false,
     description: ""
-}, {
+});
+
+LesionLocations.insert({
     location: "Brain Cerebellum Left",
     hasDescription: false,
     description: ""
-}, {
+});
+
+LesionLocations.insert({
     location: "Brain Cerebrum Left",
     hasDescription: false,
     description: ""
-}, {
+});
+
+LesionLocations.insert({
     location: "Brain Cerebrum Right",
     hasDescription: false,
     description: ""
-}, {
+});
+
+LesionLocations.insert({
     location: "Brain Multiple Sites",
     hasDescription: false,
     description: ""
-}];
+});
+
+var lastAddedLesionData;
 
 Template.lesionLocationDialog.onRendered(function() {
-    console.log(this.data);
-
-    function fillSelectLesionLocation() {
-        var el = $("#selectLesionLocation");
-        el.find('option:not(:first)').remove();
-        $.each(lesionLocationsArray, function(key, value) {
-            el.append("<option value='" + key + "'>" + value.location + "</option>");
-        });
-    }
-
-    // Fill dropdown
-    fillSelectLesionLocation();
-
     // Observe Measurements Collection Changes
     Measurements.find().observe({
         added: function(lesionData) {
             lastAddedLesionData = lesionData;
         },
         changed: function(lesionData) {
-            console.log("lesionData is changed!");
+            console.log("lesionData has changed!");
         }
     });
 });
 
-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 < 0) {
-            return;
-        }
-
-        // Get selected location data
-        var locationObj = lesionLocationsArray[selectedLocationIndex];
-
-        // Gets active lesion measurement data that is latest added data
-        var activeLesionMeasurementData = Session.get("lesionMeasurementData");
-
-        // Adds location data to trialPatientLocations array and returns locationUID
-        var locationUID = measurementManagerDAL.addNewLocation(locationObj);
-
-        // Linkk locationUID with activeLesionMeasurementData
-        activeLesionMeasurementData.locationUID = locationUID;
-
-        // Adds lesion data to timepoints array
-        measurementManagerDAL.addLesionData(activeLesionMeasurementData);
-
-        // 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);
+Template.lesionLocationDialog.helpers({
+    'lesionLocations': function() {
+        return LesionLocations.find();
     }
 });
\ No newline at end of file
diff --git a/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.styl b/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.styl
new file mode 100644
index 000000000..65a0ce31e
--- /dev/null
+++ b/Packages/lesiontracker/components/lesionLocationDialog/lesionLocationDialog.styl
@@ -0,0 +1,19 @@
+#lesionLocationDialog
+    display: none
+    position: absolute
+    z-index: 100
+    background: white
+    padding: 10px
+    border-radius: 10px
+
+#closeLesionPopup
+    outline: 0
+    border: none
+    background-color: transparent
+    
+#selectLesionLocation
+    margin-top: 5px
+    
+.dialogContent
+    margin-bottom: 20px
+    
diff --git a/Packages/lesiontracker/package.js b/Packages/lesiontracker/package.js
index b5930bf44..7dbac85e1 100644
--- a/Packages/lesiontracker/package.js
+++ b/Packages/lesiontracker/package.js
@@ -18,11 +18,9 @@ Package.onUse(function (api) {
     api.addFiles('compatibility/nonTargetTool.js', 'client', {bare: true});
     api.addFiles('compatibility/measurementManagerDAL.js', 'client', {bare: true});
 
-    api.addFiles('components/lesionDialog/lesionDialog.html', 'client');
-    api.addFiles('components/lesionDialog/lesionDialog.js', 'client');
-
     api.addFiles('components/lesionLocationDialog/lesionLocationDialog.html', 'client');
     api.addFiles('components/lesionLocationDialog/lesionLocationDialog.js', 'client');
+    api.addFiles('components/lesionLocationDialog/lesionLocationDialog.styl', 'client');
     
     api.addFiles('components/lesionTable/lesionTable.html', 'client');
     api.addFiles('components/lesionTable/lesionTable.styl', 'client');