Added About modal with last commit hash, moved some dialogs to lesionTracker package from viewerbase (OHIF-52)

LesionTracker/.meteor/packages

@@ -63,3 +63,4 @@ hangingprotocols
 fastclick@1.0.12
 standard-minifier-css@1.1.8
 standard-minifier-js@1.1.8
+johdirr:meteor-git-rev

LesionTracker/.meteor/versions

@@ -65,6 +65,7 @@ iron:controller@1.0.12
 iron:core@1.0.11
 iron:dynamic-template@1.0.12
 iron:layout@1.0.12
+johdirr:meteor-git-rev@0.0.4
 jquery@1.11.9
 launch-screen@1.0.12
 lesiontracker@0.0.1

OHIFViewer/.meteor/packages

@@ -40,3 +40,4 @@ fastclick@1.0.12
 standard-minifier-css@1.1.8
 standard-minifier-js@1.1.8
 aldeed:simple-schema
+johdirr:meteor-git-rev

OHIFViewer/.meteor/versions

@@ -46,6 +46,7 @@ iron:controller@1.0.12
 iron:core@1.0.11
 iron:dynamic-template@1.0.12
 iron:layout@1.0.12
+johdirr:meteor-git-rev@0.0.4
 jquery@1.11.9
 launch-screen@1.0.12
 livedata@1.0.18

OHIFViewer/client/components/ohifViewer/ohifViewer.html

@@ -10,11 +10,17 @@
                 </div>
             </a>
             {{ #if studyListToggleText }}
-            <div class="studyListLinkSection pull-left m-x-1 p-x-2 js-toggle-studyList">
+            <a class="btn studyListLinkSection pull-left m-x-1 p-x-2 p-y-0 js-toggle-studyList">
                 {{studyListToggleText}}
-            </div>
+            </a>
             {{ /if }}
+            <a class="btn pull-right p-y-0"
+               data-toggle="modal"
+               data-target="#aboutModal">
+                About
+            </a>
         </div>
     </div>
     {{> worklist }}
+    {{> aboutModal }}
 </template>

OHIFViewer/client/components/ohifViewer/ohifViewer.styl

@@ -31,6 +31,8 @@ $expandedHeight = 160px
 
   .studyListLinkSection
     border-left: $uiBorderThickness solid $uiBorderColor;
+    
+  .btn
     color: $textSecondaryColor
     cursor: pointer
     font-size: 13px

Packages/design/styles/common/global.styl

@@ -29,3 +29,13 @@ html hr
   -moz-user-select: none
   -ms-user-select: none
   user-select: none
+
+.modal-dialog
+  .modal-content
+    background: $primaryBackgroundColor
+    border-color: $uiBorderColor
+    color: $textSecondaryColor
+
+    .modal-header, .modal-footer
+      border-color: $uiBorderColor
+

Packages/lesiontracker/client/components/lesionTracker/lesionTracker.html

@@ -10,9 +10,9 @@
                 </div>
             </a>
             {{ #if studyListToggleText }}
-            <div class="studyListLinkSection pull-left m-x-1 p-x-2 js-toggle-studyList">
+            <a class="btn studyListLinkSection pull-left m-x-1 p-x-2 js-toggle-studyList">
                 {{studyListToggleText}}
-            </div>
+            </a>
             {{ /if }}
             <div class="userAccountSection pull-right">
                 {{>userAccountMenu}}

Packages/lesiontracker/client/components/lesionTracker/lesionTracker.styl

@@ -31,6 +31,8 @@ $expandedHeight = 160px
 
   .studyListLinkSection
     border-left: $uiBorderThickness solid $uiBorderColor;
+    
+  .btn
     color: $textSecondaryColor
     cursor: pointer
     font-size: 13px

Packages/lesiontracker/package.js

@@ -199,6 +199,14 @@ Package.onUse(function(api) {
     api.addFiles('client/components/lastLoginModal/lastLoginModal.html', 'client');
     api.addFiles('client/components/lastLoginModal/lastLoginModal.js', 'client');
 
+    api.addFiles('client/components/basic/confirmDeleteDialog/confirmDeleteDialog.html', 'client');
+    api.addFiles('client/components/basic/confirmDeleteDialog/confirmDeleteDialog.styl', 'client');
+    api.addFiles('client/components/basic/confirmDeleteDialog/confirmDeleteDialog.js', 'client');
+
+    api.addFiles('client/components/basic/emailVerification/emailVerification.html', 'client');
+    api.addFiles('client/components/basic/emailVerification/emailVerification.styl', 'client');
+    api.addFiles('client/components/basic/emailVerification/emailVerification.js', 'client');
+
     // Server functions
     api.addFiles('server/servers.js', 'server');
     api.addFiles('server/publications.js', 'server');

Packages/viewerbase/client/components/basic/aboutModal/aboutModal.html

@@ -0,0 +1,94 @@
+<template name="aboutModal">
+    <div class="modal fade"
+         id="aboutModal"
+         tabindex="-1"
+         role="dialog"
+         aria-labelledby="aboutModalLabel">
+        <div class="modal-dialog modal-lg" role="document">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button"
+                            class="close"
+                            data-dismiss="modal"
+                            aria-label="Close">
+                        <span aria-hidden="true">&times;</span>
+                    </button>
+                    <h4 class="modal-title"
+                        id="aboutModalLabel">
+                        About
+                    </h4>
+                </div>
+                <div class="modal-body">
+                    <a class='forkOnGithub'
+                       href="{{githubUrl}}">
+                        <img src="https://camo.githubusercontent.com/365986a132ccd6a44c23a9169022c0b5c890c387/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67"
+                             alt="Fork me on GitHub"
+                             data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png">
+                    </a>
+                    <div class="logo p-x-3 p-y-3">
+                        <svg class="logoImage">
+                            <use xlink:href="/packages/viewerbase/assets/icons.svg#icon-ohif-logo"></use>
+                        </svg>
+                        <a class="logoText"
+                           href="http://ohif.org">
+                            Open Health Imaging Foundation DICOM Viewer
+                        </a>
+                    </div>
+                    <div class="p-x-1 p-y-1 m-y-2">
+                        <a class="btn btn-default inline"
+                           href="https://groups.google.com/forum/#!forum/cornerstone-platform">
+                            Visit the forum
+                        </a>
+                        <a class="btn btn-default inline"
+                           href="https://github.com/OHIF/Viewers/issues">
+                            Report an issue
+                        </a>
+                    </div>
+                    <div class="p-y-1 p-x-1">
+                        <h3>Version Information</h3>
+                        <table class="table table-responsive">
+                            <thead>
+                                <tr>
+                                    <th>Name</th>
+                                    <th>Value</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>Repository URL</td>
+                                    <td>
+                                        <a href="{{githubUrl}}">{{githubUrl}}</a>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>Last Commit Hash</td>
+                                    <td>
+                                        <a href="{{githubUrl}}/commit/{{gitRev 'long'}}">
+                                        {{gitRev 'long'}}
+                                        </a>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>Latest Tag</td>
+                                    <td>
+                                        <a href="{{githubUrl}}/releases/tag/{{gitRev 'tag'}}">
+                                        {{gitRev 'tag'}}
+                                        </a>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>Branch</td>
+                                    <td>
+                                        <a href="{{githubUrl}}/tree/{{gitRev 'branch'}}">
+                                            {{gitRev 'branch'}}
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>

Packages/viewerbase/client/components/basic/aboutModal/aboutModal.js

@@ -0,0 +1,5 @@
+Template.aboutModal.helpers({
+    githubUrl() {
+        return 'https://github.com/OHIF/Viewers';
+    }
+});

Packages/viewerbase/client/components/basic/aboutModal/aboutModal.styl

@@ -0,0 +1,24 @@
+@import "{design}/app"
+
+#aboutModal
+  .logo
+    .logoText
+      display: inline-block
+      font-family: $logoFontFamily
+      font-weight: $logoFontWeight
+      color: $textPrimaryColor
+      font-size: 20pt
+      line-height: 45px
+      text-decoration: none
+
+    .logoImage
+      width: 45px
+      height: 45px
+      margin: 0 1rem
+
+  .forkOnGithub
+    position: absolute
+    top: 0
+    right: 0
+    border: 0
+    cursor: pointer

Packages/viewerbase/package.js

@@ -47,13 +47,9 @@ Package.onUse(function(api) {
     api.addFiles('client/components/basic/removableBackdrop/removableBackdrop.html', 'client');
     api.addFiles('client/components/basic/removableBackdrop/removableBackdrop.styl', 'client');
 
-    api.addFiles('client/components/basic/confirmDeleteDialog/confirmDeleteDialog.html', 'client');
+    api.addFiles('client/components/basic/aboutModal/aboutModal.html', 'client');
-    api.addFiles('client/components/basic/confirmDeleteDialog/confirmDeleteDialog.styl', 'client');
+    api.addFiles('client/components/basic/aboutModal/aboutModal.js', 'client');
-    api.addFiles('client/components/basic/confirmDeleteDialog/confirmDeleteDialog.js', 'client');
+    api.addFiles('client/components/basic/aboutModal/aboutModal.styl', 'client');
-
-    api.addFiles('client/components/basic/emailVerification/emailVerification.html', 'client');
-    api.addFiles('client/components/basic/emailVerification/emailVerification.styl', 'client');
-    api.addFiles('client/components/basic/emailVerification/emailVerification.js', 'client');
 
     // Study Browser components
     api.addFiles('client/components/studyBrowser/studyBrowser/studyBrowser.html', 'client');