From 51ff40dd6d0b997f5fffb305e95d058b0b17b72b Mon Sep 17 00:00:00 2001 From: Evren Ozkan Date: Wed, 2 Dec 2015 11:32:14 -0500 Subject: [PATCH] OHIFVIEWER-27 Popup is shown/hidden to set the timepoint as Baseline when the user clicks timepoint header cell in lesion table --- LesionTracker/client/components/viewer.html | 2 + .../lesionTableTimepointHeader.html | 8 +- .../lesionTableTimepointHeader.js | 104 ++++++++++++++++++ .../timepointTextDialog.html | 11 ++ .../timepointTextDialog.styl | 27 +++++ 5 files changed, 151 insertions(+), 1 deletion(-) create mode 100644 Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.html create mode 100644 Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.styl diff --git a/LesionTracker/client/components/viewer.html b/LesionTracker/client/components/viewer.html index 9bab4bd48..37259d2c2 100644 --- a/LesionTracker/client/components/viewer.html +++ b/LesionTracker/client/components/viewer.html @@ -2,6 +2,8 @@
{{>lesionLocationDialog}} {{>nonTargetLesionDialog}} + {{>timepointTextDialog}} + {{>hidingPanel}}
{{>viewerMain }} diff --git a/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.html b/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.html index 8122faeab..b97ba8894 100644 --- a/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.html +++ b/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.html @@ -1,3 +1,9 @@ \ No newline at end of file diff --git a/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.js b/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.js index e69de29bb..5ed844f3c 100644 --- a/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.js +++ b/Packages/lesiontracker/components/lesionTableTimepointHeader/lesionTableTimepointHeader.js @@ -0,0 +1,104 @@ +Template.lesionTableTimepointHeader.events({ + 'click th': function(e, template){ + + var parentPosition = getPosition(e.currentTarget); + var cellText = e.currentTarget.innerText; + // Remove spaces in string + cellText = cellText.replace(/\s/g, ''); // Remove spaces + cellText = cellText.replace('<', ''); // Remove < + var splitCellText = cellText.split('/'); + var dateStr = splitCellText[2].replace(/\D/g,'') + "" + splitCellText[0].replace(/\D/g,'') + ""+splitCellText[1].replace(/\D/g,''); // Remove non-digit chars + + // Check patient has a timepointText as Baseline + var patientId = template.data.patientId; + + // Open popup + var timepointTextDialog = $("#timepointTextDialog"); + var dialogDisplay = timepointTextDialog.css("display"); + if(dialogDisplay === "none") { + + var isBaselineInCollection = Timepoints.findOne({patientId: patientId, timepointName: dateStr, timepointText: "Baseline"}); + + // If isBaselineInCollection is true, "Baseline" is found in collection for patient and set checkbox as checked + if (isBaselineInCollection) { + // Set checkbox as checked + $('#checkBoxBaseline').prop('checked', true); + } else { + // Set checkbox as unchecked + $('#checkBoxBaseline').prop('checked', false); + } + + // Open dialog + var dialogProperty = { + top: parentPosition.y - 30, + left: parentPosition.x, + display: 'block' + }; + timepointTextDialog.css(dialogProperty); + + } else if(dialogDisplay === "block") { + + // Get timepoints of patient + // Set timepointText as Baseline for selected timepoint + var timepoints = Timepoints.find({patientId: patientId}).fetch(); + + // Check checkbox is selected + var checkboxBaselineChecked = $("#checkBoxBaseline").is(":checked"); + + timepoints.forEach(function(timepoint) { + // timepointText defines a custom text for timepoint such as Baseline, Nadir, Current + if (timepoint.timepointName === dateStr) { + // If checkbox is selected, set timepointText as Baseline + // Else set timepointText as "" + var timepointText = "Baseline"; + if(!checkboxBaselineChecked) { + timepointText = ""; + } + + Timepoints.update(timepoint._id,{ + $set: { + timepointText: timepointText + } + }); + } else{ + // Set timepointText as empty + Timepoints.update(timepoint._id,{ + $set: { + timepointText: "" + } + }); + } + }); + + + // Close dialog + timepointTextDialog.css("display", "none"); + + } + } +}); + +Template.lesionTableTimepointHeader.helpers({ + 'timepointTextFound': function(){ + var timepointText = this.timepointText; + if(timepointText && timepointText === 'Baseline') { + return true; + } + + return false; + } +}); + + +// Gets parent's position of element which mouse pointer is clicked in +function getPosition(element) { + var xPosition = 0; + var yPosition = 0; + + while (element) { + xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft); + yPosition += (element.offsetTop - element.scrollTop + element.clientTop); + element = element.offsetParent; + } + return { x: xPosition, y: yPosition }; +} \ No newline at end of file diff --git a/Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.html b/Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.html new file mode 100644 index 000000000..32a50117b --- /dev/null +++ b/Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.html @@ -0,0 +1,11 @@ + \ No newline at end of file diff --git a/Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.styl b/Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.styl new file mode 100644 index 000000000..1478a4ff7 --- /dev/null +++ b/Packages/lesiontracker/components/timepointTextDialog/timepointTextDialog.styl @@ -0,0 +1,27 @@ + +#timepointTextDialog + display: none + position: absolute + z-index: 99 + + .timepointDialogContentWrapper + position: absolute + width: 100px + height: 30px + padding: 5px + background-color: rgba(255,255,255,1) + border-top-left-radius: 5px + border-top-right-radius: 5px + text-align: left + + .dialogContent + margin: 0 auto + float: none + padding: 0 + + .timepointContent + font-size: 16px + + #checkBoxBaseline + height: 16px + width: 16px \ No newline at end of file