From 699399f3394986cd2b4a25ebeda759bd96960a66 Mon Sep 17 00:00:00 2001
From: Francis Lachapelle <flachapelle@inverse.ca>
Date: Fri, 26 Feb 2016 15:41:53 -0500
Subject: [PATCH] (css) Initial media print (for messages only)

---
 NEWS                                          |  1 +
 UI/Templates/MailerUI/UIxMailViewTemplate.wox | 12 ++++--
 .../js/Mailer/MessageController.js            |  5 +++
 UI/WebServerResources/scss/core/print.scss    | 39 +++++++++++++++++++
 UI/WebServerResources/scss/styles.scss        |  1 +
 5 files changed, 55 insertions(+), 3 deletions(-)
 create mode 100644 UI/WebServerResources/scss/core/print.scss

diff --git a/NEWS b/NEWS
index 560f4f40e..b25c3e6ec 100644
--- a/NEWS
+++ b/NEWS
@@ -20,6 +20,7 @@ Enhancements
  - [web] list search now displays a warning regarding the minlength constraint
  - [web] loading an LDAP-based addressbook is now instantaneous when listRequiresDot is disabled (#438, #3464)
  - [web] improve display of messages with many recipients
+ - [web] initial stylesheet for printing
  - [eas] now support EAS MIME truncation
 
 Bug fixes
diff --git a/UI/Templates/MailerUI/UIxMailViewTemplate.wox b/UI/Templates/MailerUI/UIxMailViewTemplate.wox
index 21ab51893..07a0c0343 100644
--- a/UI/Templates/MailerUI/UIxMailViewTemplate.wox
+++ b/UI/Templates/MailerUI/UIxMailViewTemplate.wox
@@ -87,6 +87,12 @@
                   <var:string label:value="View Message Source"/>
                 </md-button>
               </md-menu-item>
+              <md-menu-item>
+                <md-button label:aria-label="Print..."
+                           ng-click="viewer.print()">
+                  <var:string label:value="Print..."/>
+                </md-button>
+              </md-menu-item>
               <md-menu-divider><!-- divider --></md-menu-divider>
               <md-menu-item>
                 <md-button label:aria-label="Convert To Event"
@@ -192,7 +198,7 @@
           </div>
 
           <!-- S/MIME Signature -->
-          <md-whiteframe class="md-whiteframe-z2" layout="row" layout-align="space-between center"
+          <md-whiteframe class="md-whiteframe-z2 sg-no-print" layout="row" layout-align="space-between center"
                          ng-show="::viewer.message.$smime.message">
             <div layout="row" layout-align="start center">
               <div class="md-tile-left">
@@ -204,7 +210,7 @@
           </md-whiteframe>
 
           <!-- Load external images -->
-          <md-whiteframe class="md-whiteframe-z2" layout="row" layout-align="space-between center"
+          <md-whiteframe class="md-whiteframe-z2 sg-no-print" layout="row" layout-align="space-between center"
                          ng-show="viewer.message.$hasUnsafeContent">
             <div layout="row" layout-align="start center" class="layout-fill">
               <div class="md-tile-left">
@@ -220,7 +226,7 @@
           </md-whiteframe>
 
           <!-- Return Receipt / Send MDN -->
-          <md-whiteframe class="md-whiteframe-z2" layout="column" layout-align="center start"
+          <md-whiteframe class="md-whiteframe-z2 sg-no-print" layout="column" layout-align="center start"
                          ng-show="viewer.message.shouldAskReceipt == 1">
             <div layout="row" layout-align="start center">
               <div class="md-tile-left">
diff --git a/UI/WebServerResources/js/Mailer/MessageController.js b/UI/WebServerResources/js/Mailer/MessageController.js
index 1a1712541..03f619a3a 100644
--- a/UI/WebServerResources/js/Mailer/MessageController.js
+++ b/UI/WebServerResources/js/Mailer/MessageController.js
@@ -35,6 +35,7 @@
     vm.saveMessage = saveMessage;
     vm.toggleRawSource = toggleRawSource;
     vm.showRawSource = false;
+    vm.print = print;
     vm.convertToEvent = convertToEvent;
     vm.convertToTask = convertToTask;
 
@@ -257,6 +258,10 @@
       }
     }
 
+    function print($event) {
+      $window.print();
+    }
+
     function convertToEvent($event) {
       return convertToComponent($event, 'appointment');
     }
diff --git a/UI/WebServerResources/scss/core/print.scss b/UI/WebServerResources/scss/core/print.scss
new file mode 100644
index 000000000..9cce86227
--- /dev/null
+++ b/UI/WebServerResources/scss/core/print.scss
@@ -0,0 +1,39 @@
+/// print.scss -*- Mode: scss; indent-tabs-mode: nil; basic-offset: 2 -*-
+
+// Common print media stylesheet
+// See https://github.com/angular/material/issues/1747
+
+@media print {
+
+  // Don't print some components
+  md-sidenav,
+  md-card-actions,
+  .toolbar-main,
+  .view-list,
+  .sg-reversible.sg-flip .sg-face,
+  .sg-reversible:not(.sg-flip) .sg-back,
+  .sg-no-print
+   {
+    display: none !important;
+  }
+
+  // Content must be visible to be printed on multiple pages
+  md-content,
+  md-card-content,
+  md-card-content pre,
+  .view-detail,
+  .sg-reversible:not(.sg-flip) .sg-face,
+  .sg-reversible.sg-flip .sg-back {
+    overflow: visible !important;
+  }
+
+  // Remove shadow from Cards
+  md-card {
+    box-shadow: none !important;
+  }
+
+  // Ignore layout-fill style
+  .layout-fill {
+    height: auto !important;
+  }
+}
\ No newline at end of file
diff --git a/UI/WebServerResources/scss/styles.scss b/UI/WebServerResources/scss/styles.scss
index 837bede92..5eb117959 100755
--- a/UI/WebServerResources/scss/styles.scss
+++ b/UI/WebServerResources/scss/styles.scss
@@ -22,6 +22,7 @@
 @import 'core/structure';
 @import 'core/layout';
 @import 'core/typography';
+@import 'core/print';
 
 // Original angular-material components
 // ------------------------------------------------------------------------------