Replacing switchToTab with routes

This commit is contained in:
Bruno Alves de Faria committed 2017-03-21 10:16:47 -03:00
1 parent 0cf4dbf13f
commit 7718d31a77
46 files changed
+358 -753

No files matched your search

@@ -1,5 +1,4 @@
import './studylist.html';
import './studylist.js';
import './studylist.styl';
import './studylistStudy/studylistStudy.html';
@@ -1,13 +1,5 @@
<template name="studylist">
<div id="studylistTabs" class="tab-content">
<div role="tabpanel" class="tab-pane active" id="studylistTab">
<div class="studylistContainer">
{{>studylistResult (clone this)}}
</div>
</div>
<div role="tabpanel" class="tab-pane" id="viewerTab">
<div class="viewerContainer">
</div>
</div>
<div class="study-list-wrapper">
{{>studylistResult (clone this)}}
</div>
</template>
@@ -1,44 +0,0 @@
/**
* Template: StudyList
*
* This is the main component of the StudyList package
*/
// Define the ViewerData global object
// If there is currently any Session data for this object,
// use this to repopulate the variable
ViewerData = Session.get('ViewerData') || {};
// Define the StudyListStudies Collection
// This is a client-side only Collection which
// Stores the list of studies in the StudyList
StudyListStudies = new Meteor.Collection(null);
StudyListStudies._debugName = 'StudyListStudies';
Session.setDefault('activeContentId', 'studylistTab');
Template.studylist.onCreated(() => {
const instance = Template.instance();
if (StudyList.subscriptions) {
StudyList.subscriptions.forEach(subscriptionName => {
instance.subscribe(subscriptionName);
});
}
});
Template.studylist.onRendered(() => {
const instance = Template.instance();
if (instance.data && instance.data.studyInstanceUid) {
const studyInstanceUid = instance.data.studyInstanceUid;
openNewTab(studyInstanceUid);
} else {
// If there is a tab set as active in the Session,
// switch to that now.
console.log('studylist onRendered');
const contentId = Session.get('activeContentId');
if (contentId !== 'studylistTab' && ViewerData && ViewerData[contentId]) {
switchToTab(contentId);
}
}
});
@@ -1,34 +1,13 @@
@import "{ohif:design}/app"
body
theme('background-color', '$primaryBackgroundColor')
#tblStudyList
tr
height: 20px
#studylistTab
theme('background-color', '$primaryBackgroundColor')
.studylistContainer
.study-list-wrapper
theme('background-color', '$primaryBackgroundColor')
color: white
margin: 2px auto 0
height: calc(100% - 91px)
position: relative
width: 100%
.tab-content
width: 100%
height: calc(100% - 91px)
.loadingTextDiv
theme('color', '$textSecondaryColor')
font-size: 30px
.tab-pane
width: 100%
height: 100%
.viewerContainer
height: 100%
width: 100%
@@ -1,14 +1,8 @@
<template name="studylistResult">
<div class="studyListToolbar clearfix">
<div class="header pull-left">
Study List
</div>
<div class="studyCount pull-right">
{{numberOfStudies}}
</div>
<div class="pull-right">
{{>studylistToolbar}}
</div>
<div class="header pull-left">Study List</div>
<div class="studyCount pull-right">{{numberOfStudies}}</div>
<div class="pull-right">{{>studylistToolbar}}</div>
</div>
<div class="theadBackground">
</div>
@@ -74,18 +68,18 @@
</tr>
</thead>
<tbody id="studyListData">
{{#each study in studies}}
{{>studylistStudy (clone study this)}}
{{/each}}
{{#each study in studies}}
{{>studylistStudy (clone study this)}}
{{/each}}
</tbody>
</table>
<!-- Pagination -->
{{> studylistPagination }}
{{>studylistPagination}}
{{#if session "showLoadingText"}}
{{>loadingText}}
{{ else }}
{{else}}
{{#unless numberOfStudies}}
<div class="notFound">No matching results</div>
{{/unless}}
@@ -1,11 +1,16 @@
import { Meteor } from 'meteor/meteor';
import { Template } from 'meteor/templating';
import { Session } from 'meteor/session';
import { ReactiveVar } from 'meteor/reactive-var';
import { ReactiveDict } from 'meteor/reactive-dict';
import { moment } from 'meteor/momentjs:moment';
import { OHIF } from 'meteor/ohif:core';
Session.setDefault('showLoadingText', true);
Template.studylistResult.helpers({
/**
* Returns a sorted instance of the StudyListStudies Collection
* by Patient name and Study Date in Ascending order.
* Returns a ascending sorted instance of the Studies Collection by Patient name and Study Date
*/
studies() {
const instance = Template.instance();
@@ -26,7 +31,7 @@ Template.studylistResult.helpers({
const offset = rowsPerPage * currentPage;
const limit = offset + rowsPerPage;
studies = StudyListStudies.find({}, {
studies = OHIF.studylist.collections.Studies.find({}, {
sort: sortOption
}).fetch();
@@ -42,7 +47,7 @@ Template.studylistResult.helpers({
},
numberOfStudies() {
return StudyListStudies.find().count();
return OHIF.studylist.collections.Studies.find().count();
},
sortingColumnsIcons() {
@@ -65,9 +70,9 @@ Template.studylistResult.helpers({
}
});
var studyDateFrom;
var studyDateTo;
var filter;
let studyDateFrom;
let studyDateTo;
let filter;
/**
* Transforms an input string into a search filter for
@@ -106,9 +111,6 @@ function replaceUndefinedColumnValue(text) {
}
}
/**
/**
* Convert string to study date
*/
@@ -122,10 +124,10 @@ function convertStringToStudyDate(dateStr) {
/**
* Runs a search for studies matching the studylist query parameters
* Inserts the identified studies into the StudyListStudies Collection
* Inserts the identified studies into the Studies Collection
*/
function search() {
console.log('search()');
OHIF.log.info('search()');
// Show loading message
Session.set('showLoadingText', true);
@@ -138,7 +140,7 @@ function search() {
studyDescription: getFilter($('input#studyDescription').val()),
studyDateFrom: studyDateFrom,
studyDateTo: studyDateTo,
modalitiesInStudy: $('input#modality').val() ? $('input#modality').val() : ""
modalitiesInStudy: $('input#modality').val() ? $('input#modality').val() : ''
};
// Make sure that modality has a reasonable value, since it is occasionally
@@ -146,10 +148,10 @@ function search() {
const modality = replaceUndefinedColumnValue($('input#modality').val());
// Clear all current studies
StudyListStudies.remove({});
OHIF.studylist.collections.Studies.remove({});
Meteor.call('StudyListSearch', filter, (error, studies) => {
console.log('StudyListSearch');
OHIF.log.info('StudyListSearch');
if (error) {
OHIF.log.warn(error);
return;
@@ -172,8 +174,8 @@ function search() {
// Convert numberOfStudyRelatedInstance string into integer
study.numberOfStudyRelatedInstances = !isNaN(study.numberOfStudyRelatedInstances) ? parseInt(study.numberOfStudyRelatedInstances) : undefined;
// Insert any matching studies into the StudyListStudies Collection
StudyListStudies.insert(study);
// Insert any matching studies into the Studies Collection
OHIF.studylist.collections.Studies.insert(study);
}
});
});
@@ -181,7 +183,7 @@ function search() {
const getRowsPerPage = () => sessionStorage.getItem('rowsPerPage');
// Wraps ReactiveVar equalsFunc function. Whenever ReactiveVar is
// Wraps ReactiveVar equalsFunc function. Whenever ReactiveVar is
// set to a new value, it will save it in the Session Storage.
// The return is the default ReactiveVar equalsFunc if available
// or values are === compared
@@ -200,9 +202,10 @@ Template.studylistResult.onCreated(() => {
// Rows per page
// Check session storage or set 25 as default
const cachedRowsPerPage = getRowsPerPage();
if(!cachedRowsPerPage) {
if (!cachedRowsPerPage) {
setRowsPerPage(0, 25);
}
const rowsPerPage = getRowsPerPage();
instance.rowsPerPage = new ReactiveVar(parseInt(rowsPerPage, 10), setRowsPerPage);
@@ -214,8 +217,7 @@ Template.studylistResult.onCreated(() => {
const sortOptionSession = Session.get('sortOption');
if (sortOptionSession) {
instance.sortingColumns.set(sortOptionSession);
}
else {
} else {
instance.sortingColumns.set({
patientName: 1,
studyDate: 1,
@@ -76,6 +76,9 @@ $bodyCellHeight = 40px
text-align: center
table#tblStudyList
tr
height: 20px
thead
white-space: nowrap
@@ -172,10 +175,10 @@ $bodyCellHeight = 40px
@media only screen and (max-width: 1362px)
$tablePadding = 5%
#studyListContainer
padding: 0 $tablePadding
table#tblStudyList
thead,
tbody
@@ -190,10 +193,10 @@ $bodyCellHeight = 40px
@media only screen and (max-width: 1161px)
$tablePadding = 3%
#studyListContainer
padding: 0 $tablePadding
table#tblStudyList
thead,
tbody
@@ -208,31 +211,31 @@ $bodyCellHeight = 40px
@media only screen and (max-width: 1069px)
$tablePaddingMediumScreen = 5px
.theadBackground
height: 101px
.studyListToolbar
padding: 0 $tablePaddingMediumScreen
#studyListContainer
padding: 0
table#tblStudyList
thead > tr > th
&:first-child
padding-left: $tablePaddingMediumScreen
&:last-child
padding-right: $tablePaddingMediumScreen
input.worklist-search
padding: 10px
div.sortingCell
padding: 10px 5px
i
width: auto
@@ -242,8 +245,8 @@ $bodyCellHeight = 40px
&:last-child
padding-right: $tablePaddingMediumScreen
.worklistPagination
.row
margin-left: 0
margin-right: 0
margin-right: 0
@@ -1,5 +1,5 @@
<template name="studylistStudy">
<tr class="studylistStudy noselect">
<tr class="studylistStudy noselect {{#if this.selected}}active{{/if}}">
<td class="patientName">
{{formatPN patientName}}
</td>
@@ -19,4 +19,4 @@
{{studyDescription}}
</td>
</tr>
</template>
</template>
@@ -1,100 +1,82 @@
import { Meteor } from 'meteor/meteor';
import { Template } from 'meteor/templating';
import { Blaze } from 'meteor/blaze';
import { OHIF } from 'meteor/ohif:core';
// Maybe we should use regular StudyList collection?
StudyListSelectedStudies = new Meteor.Collection(null);
StudyListSelectedStudies._debugName = 'StudyListSelectedStudies';
function isStudySelected(study) {
// Search StudyListSelectedStudies for given study and return true if found
let count = StudyListSelectedStudies.find({
studyInstanceUid: study.studyInstanceUid
}).count();
return count > 0;
}
// Clear all selected studies
function doClearStudySelections() {
// Clear all selected studies
StudyListSelectedStudies.remove({});
$('tr.studylistStudy').removeClass('active');
OHIF.studylist.collections.Studies.update({}, {
$set: { selected: false }
}, { multi: true });
}
function doSelectRow(studyRow, data) {
// Insert current study into selection list if it's not there already...
if (!isStudySelected(data)) {
StudyListSelectedStudies.insert(data);
function doSelectRow($studyRow, data) {
// Mark the current study as selected if it's not marked yet
if (!data.selected) {
const filter = { studyInstanceUid: data.studyInstanceUid };
const modifiers = { $set: { selected: true } };
OHIF.studylist.collections.Studies.update(filter, modifiers);
}
// Make sure the study row has "active" class
studyRow.addClass('active');
// Set this as the previously selected row, so the user can
// use Shift to select from this point onwards
StudyList.previouslySelected = studyRow;
// Set it as the previously selected row, so the user can use Shift to select from this point on
OHIF.studylist.$lastSelectedRow = $studyRow;
}
function doSelectSingleRow(studyRow, data) {
function doSelectSingleRow($studyRow, data) {
// Clear all selected studies
doClearStudySelections();
// ... And add selected row to selection list
doSelectRow(studyRow, data);
// Add selected row to selection list
doSelectRow($studyRow, data);
}
function doUnselectRow(studyRow, data) {
// Find the current studyInstanceUid in the stored list and remove it
StudyListSelectedStudies.remove({
studyInstanceUid: data.studyInstanceUid
});
studyRow.removeClass('active');
function doUnselectRow($studyRow, data) {
// Find the current studyInstanceUid in the stored list and mark as unselected
const filter = { studyInstanceUid: data.studyInstanceUid };
const modifiers = { $set: { selected: false } };
OHIF.studylist.collections.Studies.update(filter, modifiers);
}
function handleShiftClick($studyRow, data) {
//OHIF.log.info('shiftKey');
let study, previous = StudyList.previouslySelected ? $(StudyList.previouslySelected) : null;
if (previous && previous.length > 0) {
study = Blaze.getData(previous.get(0));
if (!isStudySelected(study)) {
previous = void 0; // undefined
StudyList.previouslySelected = previous;
let study;
let $previousRow = OHIF.studylist.$lastSelectedRow;
if ($previousRow && $previousRow.length > 0) {
study = Blaze.getData($previousRow.get(0));
if (!study.selected) {
$previousRow = $(); // undefined
OHIF.studylist.$lastSelectedRow = $previousRow;
}
}
// Select all rows in between these two rows
if (previous) {
if ($previousRow.length) {
let $rowsInBetween;
if (previous.index() < $studyRow.index()) {
if ($previousRow.index() < $studyRow.index()) {
// The previously selected row is above (lower index) the
// currently selected row.
// Fill in the rows upwards from the previously selected row
$rowsInBetween = previous.nextAll('tr');
} else if (previous.index() > $studyRow.index()) {
$rowsInBetween = $previousRow.nextAll('tr');
} else if ($previousRow.index() > $studyRow.index()) {
// The previously selected row is below the currently
// selected row.
// Fill in the rows upwards from the previously selected row
$rowsInBetween = previous.prevAll('tr');
$rowsInBetween = $previousRow.prevAll('tr');
} else {
// nothing to do since previous.index() === $studyRow.index()
// nothing to do since $previousRow.index() === $studyRow.index()
// the user is shift-clicking the same row...
return;
}
// Loop through the rows in between current and previous selected studies
$rowsInBetween.forEach(row => {
$rowsInBetween.each((index, row) => {
const $row = $(row);
if ($row.hasClass('active')) {
// If we find one that is already selected, do nothing
return;
}
// Get the relevant studyInstanceUid
let studyInstanceUid = $row.attr('studyInstanceUid');
// Retrieve the data context through Blaze
let data = Blaze.getData(this);
const data = Blaze.getData(row);
// If we find one that is already selected, do nothing
if (data.selected) return;
// Set the current study as selected
doSelectRow($row, data);
@@ -108,37 +90,31 @@ function handleShiftClick($studyRow, data) {
}
}
function handleCtrlClick(studyRow, data) {
//OHIF.log.info('ctrlKey');
if (isStudySelected(data)) {
doUnselectRow(studyRow, data);
} else {
doSelectRow(studyRow, data);
OHIF.log.info('StudyList PreviouslySelected set: ' + studyRow.index());
}
function handleCtrlClick($studyRow, data) {
const handler = data.selected ? doUnselectRow : doSelectRow;
handler($studyRow, data);
}
Template.studylistStudy.onRendered(function() {
let instance = this,
data = instance.data,
row = instance.$('tr.studylistStudy').first();
Template.studylistStudy.onRendered(() => {
const instance = Template.instance();
const data = instance.data;
const $row = instance.$('tr.studylistStudy').first();
// Enable HammerJS to allow touch support
let mc = new Hammer.Manager(row.get(0)),
doubleTapRecognizer = new Hammer.Tap({
event: 'doubletap',
taps: 2,
interval: 500,
threshold: 30,
posThreshold: 30
});
const mc = new Hammer.Manager($row.get(0));
const doubleTapRecognizer = new Hammer.Tap({
event: 'doubletap',
taps: 2,
interval: 500,
threshold: 30,
posThreshold: 30
});
mc.add(doubleTapRecognizer);
// Check if current row has been previously selected
if (isStudySelected(data)) {
doSelectRow(row, data);
if (data.selected) {
doSelectRow($row, data);
}
});
Template.studylistStudy.events({
@@ -164,7 +140,7 @@ Template.studylistStudy.events({
return;
}
const middleClickOnStudy = StudyList.callbacks.middleClickOnStudy;
const middleClickOnStudy = OHIF.studylist.callbacks.middleClickOnStudy;
if (middleClickOnStudy && typeof middleClickOnStudy === 'function') {
middleClickOnStudy(instance.data);
}
@@ -175,7 +151,7 @@ Template.studylistStudy.events({
return;
}
const dblClickOnStudy = StudyList.callbacks.dblClickOnStudy;
const dblClickOnStudy = OHIF.studylist.callbacks.dblClickOnStudy;
if (dblClickOnStudy && typeof dblClickOnStudy === 'function') {
dblClickOnStudy(instance.data);
@@ -185,7 +161,7 @@ Template.studylistStudy.events({
'contextmenu tr.studylistStudy, press tr.studylistStudy'(event, instance) {
const $studyRow = $(event.currentTarget);
if (!isStudySelected(instance.data)) {
if (!instance.data.selected) {
doSelectSingleRow($studyRow, instance.data);
}