#55: Export document in PDF (Share UI)

docs-web/src/main/webapp/src/app/share/controller/Share.js

@@ -3,7 +3,7 @@
 /**
  * Share controller.
  */
-angular.module('share').controller('Share', function($scope, $state, $stateParams, Restangular) {
+angular.module('share').controller('Share', function($scope, $state, $stateParams, Restangular, $modal) {
   // Load document
   Restangular.one('document', $stateParams.documentId).get({ share: $stateParams.shareId })
       .then(function (data) {
@@ -33,4 +33,16 @@ angular.module('share').controller('Share', function($scope, $state, $stateParam
   $scope.openFile = function (file) {
     $state.go('share.file', { documentId: $stateParams.documentId, shareId: $stateParams.shareId, fileId: file.id })
   };
+
+  /**
+   * Export the current document to PDF.
+   */
+  $scope.exportPdf = function() {
+    $modal.open({
+      templateUrl: 'partial/share/share.pdf.html',
+      controller: 'ShareModalPdf'
+    });
+
+    return false;
+  };
 });

docs-web/src/main/webapp/src/app/share/controller/ShareModalPdf.js

@@ -0,0 +1,30 @@
+'use strict';
+
+/**
+ * Document modal PDF controller.
+ */
+angular.module('share').controller('ShareModalPdf', function ($scope, $window, $stateParams, $modalInstance) {
+  $scope.export = {
+    metadata: false,
+    comments: false,
+    fitimagetopage: true,
+    margin: 10
+  };
+
+  // Export to PDF
+  $scope.exportPdf = function() {
+    $window.open('../api/document/' + $stateParams.documentId
+        + '/pdf?metadata=' + $scope.export.metadata
+        + '&comments=' + $scope.export.comments
+        + '&fitimagetopage=' + $scope.export.fitimagetopage
+        + '&margin=' + $scope.export.margin
+        + '&share=' + $stateParams.shareId);
+
+    $modalInstance.close();
+  };
+
+  // Close the modal
+  $scope.close = function () {
+    $modalInstance.close();
+  }
+});

docs-web/src/main/webapp/src/partial/share/share.html

@@ -1,11 +1,32 @@
 <div class="row">
   <div class="col-md-10">
+    <div class="text-right">
+      <div class="btn-group dropdown" dropdown>
+        <button class="btn btn-default" dropdown-toggle>
+          <span class="glyphicon glyphicon-export"></span>
+          Export
+          <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li>
+            <a ng-href="../api/file/zip?id={{ document.id }}&share={{ $stateParams.shareId }}" title="Download all files">
+              <span class="glyphicon glyphicon glyphicon-compressed"></span>
+              Download files
+            </a>
+          </li>
+          <li>
+            <a ng-click="exportPdf()" title="Export document to PDF" class="pointer">
+              <span class="glyphicon glyphicon glyphicon-save-file"></span>
+              Export to PDF
+            </a>
+          </li>
+        </ul>
+      </div>
+    </div>
+
     <div class="page-header">
       <h1>
         {{ document.title }} <small>{{ document.create_date | date: 'yyyy-MM-dd' }}</small>
-        <a ng-href="../api/file/zip?id={{ document.id }}&share={{ $stateParams.shareId }}" class="btn btn-default" title="Download all files">
-          <span class="glyphicon glyphicon-download-alt"></span>
-        </a>
       </h1>
       <ul class="list-inline">
         <li ng-repeat="tag in document.tags"><span class="label label-info" ng-style="{ 'background': tag.color }">{{ tag.name }}</span></li>

docs-web/src/main/webapp/src/partial/share/share.pdf.html

@@ -0,0 +1,45 @@
+<div class="modal-header">
+  <h3>Export to PDF</h3>
+</div>
+<div class="modal-body">
+  <form class="form-horizontal">
+    <div class="form-group">
+      <div class="col-sm-offset-2 col-sm-10">
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="export.metadata" /> Export metadata
+          </label>
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="col-sm-offset-2 col-sm-10">
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="export.comments" /> Export comments
+          </label>
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="col-sm-offset-2 col-sm-10">
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="export.fitimagetopage" /> Fit image to page
+          </label>
+        </div>
+      </div>
+    </div>
+    <label for="inputMargin" class="col-sm-2 control-label">Margin</label>
+    <div class="input-group col-sm-5">
+      <input type="number" class="form-control" id="inputMargin" ng-model="export.margin" min="0" max="100" step="1">
+      <div class="input-group-addon">mm</div>
+    </div>
+  </form>
+</div>
+<div class="modal-footer">
+  <button ng-click="exportPdf()" class="btn btn-primary">
+    <span class="glyphicon glyphicon-save-file"></span> Export
+  </button>
+  <button ng-click="close()" class="btn btn-default">Cancel</button>
+</div>

docs-web/src/main/webapp/src/share.html

@@ -34,6 +34,7 @@
     <script src="app/share/app.js" type="text/javascript"></script>
     <script src="app/share/controller/Main.js" type="text/javascript"></script>
     <script src="app/share/controller/Share.js" type="text/javascript"></script>
+    <script src="app/share/controller/ShareModalPdf.js" type="text/javascript"></script>
     <script src="app/share/controller/FileView.js" type="text/javascript"></script>
     <script src="app/share/controller/FileModalView.js" type="text/javascript"></script>
     <script src="app/share/filter/Newline.js" type="text/javascript"></script>