Removing serverInformationModal from DOM

LesionTracker/client/components/app/app.html

@@ -28,7 +28,6 @@
         <div class="tab-pane" id="viewerTab">
         </div>
     </div>
-    {{>serverInformationModal}}
     {{>lastLoginModal}}
     {{>progressDialog}}
     {{>viewSeriesDetailsModal}}

LesionTracker/client/routes.js

@@ -1,10 +1,12 @@
+import { Meteor } from 'meteor/meteor';
 import { Session } from 'meteor/session';
 import { Router } from 'meteor/iron:router';
+import { OHIF } from 'meteor/ohif:core';
 
 Session.setDefault('ViewerData', {});
 
 // verifyEmail controls whether emailVerification template will be rendered or not
-var verifyEmail = Meteor.settings && Meteor.settings.public && Meteor.settings.public.verifyEmail || false;
+const verifyEmail = Meteor.settings && Meteor.settings.public && Meteor.settings.public.verifyEmail || false;
 
 Router.configure({
     layoutTemplate: 'layout',
@@ -13,34 +15,29 @@ Router.configure({
 
 Router.onBeforeAction('loading');
 
-var data = {
+const data = {
     additionalTemplates: [
-        'serverInformationModal',
         'lastLoginModal',
         'viewSeriesDetailsModal'
     ]
 };
 
-var routerOptions = {
+const routerOptions = { data };
-    data: data
-};
 
 Router.route('/', function() {
     // Check user is logged in
     if (Meteor.user() && Meteor.userId()) {
         if (verifyEmail && Meteor.user().emails && !Meteor.user().emails[0].verified) {
             this.render('emailVerification', routerOptions);
-        }
+        } else {
-        else {
             const contentId = Session.get('activeContentId');
-            if(!contentId) {
+            if (!contentId) {
                 Session.set('activeContentId', 'studylistTab');
             }
+
             this.render('app', routerOptions);
         }
-
+    } else {
-    }
-    else {
         this.render('entrySignIn', routerOptions);
     }
 });
@@ -49,7 +46,7 @@ Router.route('/viewer/timepoints/:_id', {
     layoutTemplate: 'layout',
     name: 'viewer',
     onBeforeAction: function() {
-        var timepointId = this.params._id;
+        const timepointId = this.params._id;
 
         this.render('app', routerOptions);
         OHIF.lesiontracker.openNewTabWithTimepoint(timepointId);

OHIFViewer/client/components/ohifViewer/ohifViewer.html

@@ -24,7 +24,7 @@
                     </div>
                     <ul class="dropdown-menu dropdown-menu-right">
                         <li>
-                            <a data-toggle="modal" data-target="#serverInformationModal">
+                            <a id="serverInformation">
                                 <i class="fa fa-server fa-lg"></i> Server Information
                             </a>
                         </li>
@@ -39,7 +39,6 @@
             </span>
         </div>
     </div>
-    {{>serverInformationModal}}
     {{>studylist}}
     {{>aboutModal}}
     {{>viewSeriesDetailsModal}}

OHIFViewer/client/components/ohifViewer/ohifViewer.js

@@ -1,5 +1,6 @@
 import { Template } from 'meteor/templating';
 import { Session } from 'meteor/session';
+import { OHIF } from 'meteor/ohif:core';
 
 const studylistContentId = 'studylistTab';
 let lastContentId;
@@ -20,6 +21,10 @@ Template.ohifViewer.events({
         } else {
             switchToTab(lastContentId);
         }
+    },
+
+    'click #serverInformation'() {
+        OHIF.ui.showDialog('serverInformationModal');
     }
 });
 

Packages/ohif-core/client/components/base/section/section.html

@@ -1,3 +1,3 @@
-<template name="section">
+<template name="section">{{! TODO: use whitespace control when/if it's available (https://github.com/meteor/blaze/issues/88)
-    {{>instance.renderFunction.get instance.sectionData.get}}
+    }}{{>instance.renderFunction.get instance.sectionData.get}}{{!
-</template>
+}}</template>

Packages/ohif-core/client/components/base/section/section.js

@@ -3,24 +3,9 @@ import { Tracker } from 'meteor/tracker';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { OHIF } from 'meteor/ohif:core';
 
-// Get the view that contains the desired section's content and return it
-const getSection = (view, sectionName) => {
-    let currentView = view;
-    while (!currentView._sectionMap || !currentView._sectionMap.get(sectionName)) {
-        currentView = OHIF.blaze.getParentTemplateView(currentView);
-        if (!currentView) return;
-    }
-
-    return currentView._sectionMap.get(sectionName);
-};
-
 Template.section.onCreated(() => {
     const instance = Template.instance();
 
-    if (instance.data === 'dialogFooter') {
-        console.warn('>>>>instance', instance);
-    }
-
     // Create the render function and section data as reactive objects
     instance.renderFunction = new ReactiveVar(null);
     instance.sectionData = new ReactiveVar(null);
@@ -55,7 +40,7 @@ Template.section.onCreated(() => {
         // Wait for re-rendering and print the section content
         Tracker.afterFlush(() => {
             // Get the defined section's content
-            const section = getSection(currentView, sectionName);
+            const section = OHIF.blaze.getSectionContent(currentView, sectionName);
 
             // Stop here if the section content is not defined
             if (!section) {

Packages/ohif-core/client/components/bootstrap/dialog/bootstrap.styl

@@ -0,0 +1,2 @@
+.modal .modal-footer:empty
+  display: none

Packages/ohif-core/client/components/bootstrap/dialog/simple.html

@@ -13,6 +13,7 @@
                 <div class="modal-body">
                     {{>UI.contentBlock}}
                 </div>
+                <div class="modal-footer">{{>section 'dialogFooter'}}</div>
             </div>
         </div>
     </div>

Packages/ohif-core/client/lib/blaze.js

@@ -51,3 +51,14 @@ OHIF.blaze.getParentTemplateView = view => {
         }
     }
 };
+
+// Get the view that contains the desired section's content and return it
+OHIF.blaze.getSectionContent = (view, sectionName) => {
+    let currentView = view;
+    while (!currentView._sectionMap || !currentView._sectionMap.get(sectionName)) {
+        currentView = OHIF.blaze.getParentTemplateView(currentView);
+        if (!currentView) return;
+    }
+
+    return currentView._sectionMap.get(sectionName);
+};

Packages/ohif-core/package.js

@@ -26,6 +26,7 @@ Package.onUse(function(api) {
     api.addFiles([
         'client/ui/dimensional/dimensional.styl',
         'client/ui/resizable/resizable.styl',
+        'client/components/bootstrap/dialog/bootstrap.styl',
         'client/components/bootstrap/dialog/loading.styl',
         'client/components/bootstrap/dialog/progress.styl',
         'client/components/bootstrap/dialog/unsavedChangesDialog.styl',

Packages/ohif-lesiontracker/client/components/index.js

@@ -5,5 +5,4 @@ import './trialOptionsModal/irRCDescription.html';
 import './trialOptionsModal/recistDescription.html';
 
 import './trialOptionsModal/trialOptionsModal.html';
-import './trialOptionsModal/trialOptionsModal.styl';
 import './trialOptionsModal/trialOptionsModal.js';

Packages/ohif-lesiontracker/client/components/trialOptionsModal/trialOptionsModal.html

@@ -1,17 +1,16 @@
 <template name="trialOptionsModal">
     {{#dialogForm (extend this
-        schema=instance.schema id='trialOptionsModal' dialogClass='modal-lg'
+        schema=instance.schema dialogClass='modal-lg'
         confirmLabel='Save' title='Clinical Trial Options'
     )}}
         <h3 class="m-t-0">Select one or more Trial Criteria types:</h3>
         {{>groupRadio class='js-trial' labelClass='form-group' key='trialCriteria'}}
-        <div>
+
-            <h3>Selected Trial Criteria:</h3>
+        <h3>Selected Trial Criteria:</h3>
-            <div class="m-t-2">
+        <div class="m-t-2">
-                {{#let descriptionTemplate=(getDescriptionTemplate instance.selectedTrial.get)}}
+            {{#let descriptionTemplate=(getDescriptionTemplate instance.selectedTrial.get)}}
-                    {{>Template.dynamic template=descriptionTemplate}}
+                {{>Template.dynamic template=descriptionTemplate}}
-                {{/let}}
+            {{/let}}
-            </div>
         </div>
     {{/dialogForm}}
 </template>

Packages/ohif-lesiontracker/client/components/trialOptionsModal/trialOptionsModal.styl

@@ -1,3 +0,0 @@
-#trialOptionsModal
-  .panel
-    background-color: transparent

Packages/ohif-study-list/client/components/serverInformation/serverInformationForm/serverInformationForm.js

@@ -34,7 +34,7 @@ Template.serverInformationForm.onCreated(() => {
 Template.serverInformationForm.onRendered(() => {
     const instance = Template.instance();
 
-    instance.data.$form = instance.$('form:first');
+    instance.data.$form = instance.$('form').first();
     instance.data.form = instance.data.$form.data('component');
 
     // Handle the server type

Packages/ohif-study-list/client/components/serverInformation/serverInformationModal/serverInformationModal.html

@@ -1,27 +1,12 @@
 <template name="serverInformationModal">
-    <div class="modal" id="serverInformationModal" tabindex="-1" role="dialog" aria-labelledby="serverInformationModalLabel">
+    {{#dialogSimple (extend this dialogClass='modal-lg' title='Server Information')}}
-        <div class="modal-dialog modal-lg" role="document">
+        {{#if (eq instance.container.mode.get "list")}}
-            <div class="modal-content">
+            {{>serverInformationList instance.container}}
-                {{#let isList=(eq instance.container.mode.get "list")}}
+        {{else}}
-                    <div class="modal-header">
+            {{>serverInformationForm instance.container}}
-                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        {{/if}}
-                        <h4 class="modal-title" id="serverInformationModalLabel">Server Information</h4>
+        {{#section 'dialogFooter'}}{{#unless (eq instance.container.mode.get "list")}}{{!
-                    </div>
+            }}<button type="button" class="btn btn-default js-back">Back</button>{{!
-                    <div class="modal-body">
+        }}{{/unless}}{{/section}}
-                        {{#if isList}}
+    {{/dialogSimple}}
-                            {{>serverInformationList instance.container}}
-                        {{else}}
-                            {{>serverInformationForm instance.container}}
-                        {{/if}}
-                    </div>
-                    <div class="modal-footer">
-                        {{#unless isList}}
-                            <button type="button" class="btn btn-default js-back">Back</button>
-                        {{/unless}}
-                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                    </div>
-                {{/let}}
-            </div>
-        </div>
-    </div>
 </template>

Packages/ohif-study-list/client/components/serverInformation/serverInformationModal/serverInformationModal.js

@@ -1,5 +1,8 @@
+import { Template } from 'meteor/templating';
+import { ReactiveVar } from 'meteor/reactive-var';
+
 Template.serverInformationModal.onCreated(function() {
-    var instance = Template.instance();
+    const instance = Template.instance();
     instance.container = {
         mode: new ReactiveVar('list'),
         serverType: new ReactiveVar(null),
@@ -14,7 +17,7 @@ Template.serverInformationModal.onCreated(function() {
 });
 
 Template.serverInformationModal.events({
-    'click .js-back, click [data-dismiss=modal]': function(event, instance) {
+    'click .js-back'(event, instance) {
         instance.container.resetState();
     }
 });

Packages/ohif-user-management/client/components/userAccountMenu/userAccountMenu.js

@@ -3,6 +3,7 @@ import { Template } from 'meteor/templating';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { Session } from 'meteor/session';
 import { Router } from 'meteor/iron:router';
+import { moment } from 'meteor/momentjs:moment';
 import { OHIF } from 'meteor/ohif:core';
 
 // Display the last login modal as default
@@ -10,13 +11,14 @@ Session.setDefault('displayLastLoginModal', true);
 
 Template.userAccountMenu.helpers({
     name: function() {
-        var nameSplit = Meteor.user().profile.fullName.split(' ');
+        const nameSplit = Meteor.user().profile.fullName.split(' ');
-        var lastName = nameSplit[nameSplit.length - 1];
+        const lastName = nameSplit[nameSplit.length - 1];
         nameSplit[nameSplit.length - 1] = lastName.substr(0, 1) + '.';
         return nameSplit.join(' ');
     },
+
     currentUser: function() {
-        var verifyEmail = Meteor.settings && Meteor.settings.public && Meteor.settings.public.verifyEmail || false;
+        const verifyEmail = Meteor.settings && Meteor.settings.public && Meteor.settings.public.verifyEmail || false;
 
         if (!Meteor.user() || !Meteor.userId()) {
             return;
@@ -36,7 +38,7 @@ Template.userAccountMenu.helpers({
 
 Template.userAccountMenu.events({
     'click #serverInformation'() {
-        $('#serverInformationModal').modal('show');
+        OHIF.ui.showDialog('serverInformationModal');
     },
 
     'click #themeSelector'() {
@@ -51,7 +53,7 @@ Template.userAccountMenu.events({
 });
 
 Template.userAccountMenu.onCreated(function userAccountMenuCreated() {
-    const instance =  Template.instance();
+    const instance = Template.instance();
 
     // Create reactive last login date
     instance.lastLoginDate = new ReactiveVar();
@@ -60,14 +62,14 @@ Template.userAccountMenu.onCreated(function userAccountMenuCreated() {
     let oldUser;
 
     // Get last login date
-    Meteor.call('getPriorLoginDate', function(error, lastLoginDate){
+    Meteor.call('getPriorLoginDate', function(error, lastLoginDate) {
         if (error) {
-            console.log(error);
+            OHIF.log.error(error);
             return;
         }
 
         // Format the last login date
-        const formattedLastLoginDate = moment(lastLoginDate).format("MMMM Do YYYY, HH:mm:ss A");
+        const formattedLastLoginDate = moment(lastLoginDate).format('MMMM Do YYYY, HH:mm:ss A');
 
         instance.lastLoginDate.set(formattedLastLoginDate);
 
@@ -80,7 +82,7 @@ Template.userAccountMenu.onCreated(function userAccountMenuCreated() {
         }
 
         // Hook login/logout
-        var user = Meteor.user();
+        const user = Meteor.user();
         if (!user) {
             // Display last login modal for the next login
             Session.setPersistent('displayLastLoginModal', true);
@@ -97,6 +99,7 @@ Template.userAccountMenu.onCreated(function userAccountMenuCreated() {
                 // Remove the user by oldUserId from Reviewers
                 Meteor.call('removeUserFromReviewers', oldUser._id);
             }
+
             return;
         }