WIP reorganization

legacy/LesionTracker/client/components/app/app.html

@@ -0,0 +1,29 @@
+<template name="app">
+    {{#header brandHref='http://ohif.org' headerClasses=instance.headerClasses}}
+        {{#section 'brand'}}
+            <svg class="logo-image">
+                <use xlink:href={{absoluteUrl "packages/ohif_viewerbase/assets/icons.svg#icon-ohif-logo"}}></use>
+            </svg>
+            <div class="logo-text">Open Health Imaging Foundation</div>
+        {{/section}}
+        {{#section 'headerAfterBrand'}}
+            {{#if studyListToggleText}}
+                <a href="#" class="btn studyListLinkSection pull-left js-toggle-studyList" id="{{dasherize studyListToggleText}}-btn">
+                    {{studyListToggleText}}
+                </a>
+            {{/if}}
+        {{/section}}
+        {{#section 'headerMenu'}}
+            <span class="research-use pull-left m-r-1">
+                INVESTIGATIONAL USE ONLY
+            </span>
+            <span class="user-name pull-left m-r-1">{{userName}}</span>
+            <div class="menu-toggle pull-right">
+                <i class="fa fa-cog"></i>
+                <span class="caret-down"></span>
+            </div>
+        {{/section}}
+    {{/header}}
+
+    {{>Template.dynamic template=(choose this.template 'studylist') data=this}}
+</template>

legacy/LesionTracker/client/components/app/app.js

@@ -0,0 +1,125 @@
+import { Template } from 'meteor/templating';
+import { Session } from 'meteor/session';
+import { Router } from 'meteor/clinical:router';
+import { ReactiveVar } from 'meteor/reactive-var';
+import { OHIF } from 'meteor/ohif:core';
+
+Template.app.onCreated(() => {
+    const instance = Template.instance();
+    instance.headerClasses = new ReactiveVar('');
+
+    OHIF.header.dropdown.setItems([{
+        action: OHIF.user.audit,
+        text: 'View Audit Log',
+        iconClasses: 'log',
+        iconSvgUse: 'packages/ohif_viewerbase/assets/icons.svg#log',
+        separatorAfter: true
+    }, {
+        action: () => OHIF.ui.showDialog('themeSelectorModal'),
+        text: 'Themes',
+        iconClasses: 'theme',
+        iconSvgUse: 'packages/ohif_viewerbase/assets/icons.svg#theme',
+        separatorAfter: true
+    }, {
+        action: () => OHIF.ui.showDialog('serverInformationModal'),
+        text: 'Server Information',
+        iconClasses: 'server',
+        iconSvgUse: 'packages/ohif_viewerbase/assets/icons.svg#server',
+        separatorAfter: true
+    }, {
+        action: () => OHIF.ui.showDialog('userPreferencesDialog'),
+        text: 'Preferences',
+        icon: 'fa fa-user',
+        separatorAfter: true
+    }, {
+        action: OHIF.user.changePassword,
+        text: 'Change Password',
+        iconClasses: 'password',
+        iconSvgUse: 'packages/ohif_viewerbase/assets/icons.svg#password'
+    }, {
+        action: OHIF.user.logout,
+        text: 'Logout',
+        iconClasses: 'logout',
+        iconSvgUse: 'packages/ohif_viewerbase/assets/icons.svg#logout'
+    }]);
+
+    instance.autorun(() => {
+        const currentRoute = Router.current();
+        if (!currentRoute) return;
+        const routeName = currentRoute.route.getName();
+        const isViewer = routeName.indexOf('viewer') === 0;
+
+        // Add or remove the strech class from body
+        $(document.body)[isViewer ? 'addClass' : 'removeClass']('stretch');
+
+        // Set the header on its bigger version if the viewer is not opened
+        instance.headerClasses.set(isViewer ? '' : 'header-big');
+
+        // Set the viewer open state on session
+        Session.set('ViewerOpened', isViewer);
+    });
+});
+
+Template.app.events({
+    'click .js-toggle-studyList'(event, instance) {
+        event.preventDefault();
+        event.stopPropagation();
+        const isViewer = Session.get('ViewerOpened');
+
+        if (!isViewer) {
+            const timepointId = OHIF.viewer.data.currentTimepointId;
+            if (timepointId) {
+                Router.go('viewerTimepoint', { timepointId });
+            } else {
+                const { studyInstanceUids } = OHIF.viewer.data;
+                Router.go('viewerStudies', { studyInstanceUids });
+            }
+
+            return;
+        }
+
+        OHIF.ui.unsavedChanges.presentProactiveDialog('viewer.*', (hasChanges, userChoice) => {
+            if (!hasChanges) {
+                return Router.go('studylist');
+            }
+
+            switch (userChoice) {
+                case 'abort-action':
+                    return;
+                case 'save-changes':
+                    OHIF.ui.unsavedChanges.trigger('viewer', 'save', false);
+                    OHIF.ui.unsavedChanges.clear('viewer.*');
+                    break;
+                case 'abandon-changes':
+                    OHIF.ui.unsavedChanges.clear('viewer.*');
+                    break;
+            }
+
+            Router.go('studylist');
+        }, {
+            position: {
+                x: event.clientX + 15,
+                y: event.clientY + 15
+            }
+        });
+    }
+});
+
+Template.app.helpers({
+    userName: OHIF.user.getName,
+
+    studyListToggleText() {
+        const isViewer = Session.get('ViewerOpened');
+
+        // Return empty if viewer was not opened yet
+        if (!OHIF.utils.ObjectPath.get(OHIF, 'viewer.data.studyInstanceUids')) return;
+
+        return isViewer ? 'Study list' : 'Back to viewer';
+    },
+
+    dasherize(text) {
+        return text.replace(/ /g, '-').toLowerCase();
+    }
+});
+
+Session.set('defaultSignInMessage', 'Tumor tracking in your browser.');

legacy/LesionTracker/client/components/app/app.styl

@@ -0,0 +1,88 @@
+@require "{ohif:design}/app"
+
+body>.header
+
+  .brand
+    height: 30px
+    display: inline-block
+    text-decoration: none
+
+    .logo-image
+      display: inline-block
+      fill: transparent
+      float: left
+      height: 100%
+      margin: 0 8px 0 0
+      width: 30px
+
+    .logo-text
+      display: inline-block
+      font-family: $logoFontFamily
+      font-size: 14px
+      font-weight: $logoFontWeight
+      theme('color', '$textPrimaryColor')
+      line-height: 30px
+
+  .header-menu
+    .user-name
+      font-size: 13px
+
+    .menu-toggle
+      theme('border-left', 'solid 1px $defaultColor')
+      display: inline-block
+      height: 18px
+      padding: 0 8px
+
+      .fa
+        theme('color', '$defaultColor')
+        font-size: 17px
+        line-height: 18px
+
+      .caret-down
+        theme('color', '$uiGrayLight')
+        margin: 0 4px 4px 2px
+
+  .btn
+    theme('color', '$textSecondaryColor')
+    cursor: pointer
+    font-size: 13px
+    font-weight: 500
+    line-height: 26px
+
+    &:hover
+      theme('color', '$hoverColor')
+
+    &:active
+      theme('color', '$activeColor')
+
+  .studyListLinkSection
+    theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness)
+    margin: 3px 0 0 10px
+    padding: 0 0 0 10px
+
+    &#back-to-viewer-btn
+      border-left: 0
+
+  &.header-big
+    padding-left: $studyListPadding
+    padding-right: $studyListPadding
+
+    .brand
+      height: 100%
+      width: 80%
+      line-height: $topBarExpandedHeight - 10px
+
+      .logo-image
+        margin: 0 20px 0 0
+        width: 50px
+
+      .logo-text
+        font-size: 30px
+
+    .studyListLinkSection
+      border: none
+      left: 0
+      margin: 0
+      padding: 0
+      position: absolute
+      top: 0