browser staff : print config UI cont.
authorBill Erickson <berick@esilibrary.com>
Thu, 17 Apr 2014 16:01:06 +0000 (12:01 -0400)
committerBill Erickson <berick@esilibrary.com>
Thu, 17 Apr 2014 16:01:06 +0000 (12:01 -0400)
Signed-off-by: Bill Erickson <berick@esilibrary.com>
Open-ILS/src/templates/staff/admin/workstation/t_printing.tt2
Open-ILS/src/templates/staff/css/print.css.tt2
Open-ILS/src/templates/staff/t_navbar.tt2
Open-ILS/web/js/ui/default/staff/admin/workstation/app.js
Open-ILS/web/js/ui/default/staff/services/printstore.js

index 38de293..86fd3fa 100644 (file)
@@ -1,47 +1,68 @@
 <div class="container">
 
   <style>
-    /* TODO: move me */
+    /* TODO: more context and move me */
     textarea {
       height: 400px;
       width: 100%;
     }
+    .tab-pane {
+      padding-top: 20px;
+    }
       
   </style>
 
   <div class="row"> 
     <div class="col-md-12">
-      <h2>[% l('Printer Context') %]</h2>
+      <h2>[% l('Printer Settings for Remote Printing') %]</h2>
     </div>
   </div>
 
   <div class="row"> 
     <div class="col-md-12">
-      <div class="btn-group">
-        <button type="button" 
-          class="btn btn-default btn-lg" 
-          ng-class="{active : context=='default'}"
-          ng-click="setContext('default')">[% l('Default') %]</button>
-        <button type="button" 
-          class="btn btn-default btn-lg" 
-          ng-class="{active : context=='receipt'}"
-          ng-click="setContext('receipt')">[% l('Receipt') %]</button>
-        <button type="button" 
-          class="btn btn-default btn-lg" 
-          ng-class="{active : context=='label'}"
-          ng-click="setContext('label')">[% l('Label') %]</button>
-        <button type="button" 
-          class="btn btn-default btn-lg" 
-          ng-class="{active : context=='mail'}"
-          ng-click="setContext('mail')">[% l('Mail') %]</button>
-        <button type="button" 
-          class="btn btn-default btn-lg" 
-          ng-class="{active : context=='offline'}"
-          ng-click="setContext('offline')">[% l('Offline') %]</button>
+      <ul class="nav nav-tabs">
+        <li ng-class="{active : context == 'default'}">
+          <a href='' ng-click="setContext('default')">[% l('Default') %]</a>
+        </li>
+        <li ng-class="{active : context == 'receipt'}">
+          <a href='' ng-click="setContext('receipt')">[% l('Receipt') %]</a>
+        </li>
+        <li ng-class="{active : context == 'label'}">
+          <a href='' ng-click="setContext('label')">[% l('Label') %]</a>
+        </li>
+        <li ng-class="{active : context == 'mail'}">
+          <a href='' ng-click="setContext('mail')">[% l('Mail') %]</a>
+        </li>
+        <li ng-class="{active : context == 'offline'}">
+          <a href='' ng-click="setContext('offline')">[% l('Offline') %]</a>
+        </li>
+      </ul>
+      <div class="tab-content">
+        <div class="tab-pane active">
+          <div class="row">
+            <div class="col-md-6">
+              <div class="input-group">
+                <div class="input-group-btn">
+                  <button type="button" class="btn btn-default dropdown-toggle" 
+                    data-toggle="dropdown">[% l('Select Printer') %]
+                    <span class="caret"></span></button>
+                  <ul class="dropdown-menu">
+                    <li ng-repeat="printer in printers">
+                      <a href="#">{{printer['printer-name']}}</a>
+                    </li>
+                  </ul>
+                </div><!-- /btn-group -->
+                <input type="text" class="form-control" value="printe 1">
+              </div><!-- /input-group -->
+            </div>
+          </div>
+        </div>
       </div>
     </div>
   </div>
 
+  <div class="row"><div class="col-md-12"><hr/></div></div> 
+
   <div class="row"> 
     <div class="col-md-12">
       <h2>[% l('Printer Test') %]</h2>
@@ -64,7 +85,8 @@
     <div class="col-md-2">
       <button type="button" 
         ng-click="testPrint()"
-        class="btn btn-default btn-lg pull-right">[% l('Print') %]</button>
+        class="btn btn-default btn-lg pull-right btn-success">
+          [% l('Print') %]</button>
     </div>
 
   </div>
@@ -103,6 +125,7 @@ ng-init="htmlPrintContent='
   <p>[% l('Welcome, Stranger!') %]</p>
   <p>{{value1}}</p>
   <p>{{value2}}</p>
+  <p>{{date_value | date}}</p>
 </div>
 '">
         </textarea>
index c7feb78..5410ba9 100644 (file)
@@ -6,6 +6,7 @@ body div:not([id="print-div"]) { display:none }
 div { display: none }
 #print-div { display: block }
 #print-div div { display: block }
+#print-div pre { border: none }
 
 [%# 
 vim: ft=css 
index b2c80a0..9eb14d9 100644 (file)
@@ -83,7 +83,7 @@
           <li>
             <a href="./admin/workstation/index" target="_self">
               <span class="glyphicon glyphicon-hdd"></span>
-              [% l('Workstation Administration') %]
+              [% l('Workstation') %]
             </a>
           </li>
        </ul>
index 2c77311..e47fc38 100644 (file)
@@ -32,6 +32,9 @@ angular.module('egWorkstationAdmin', ['ngRoute', 'ui.bootstrap', 'egCoreMod', 'e
 function($scope , egPrintStore) {
     console.log('PrintingCtrl');
 
+    egPrintStore.printers()
+    .then(function(printers) { $scope.printers = printers });
+
     $scope.setContext = function(ctx) { $scope.context = ctx }
     $scope.setContentType = function(type) { $scope.contentType = type }
     $scope.testPrint = function() {
@@ -41,7 +44,11 @@ function($scope , egPrintStore) {
             egPrintStore.print(
                 $scope.contentType, 
                 $scope.htmlPrintContent, 
-                {'value1' : 'Value One', 'value2' : 'Value Two'}
+                {
+                    value1 : 'Value One', 
+                    value2 : 'Value Two',
+                    date_value : '2015-02-04T14:04:34-0400'
+                }
             );
         }
     }
index b959638..2dbf595 100644 (file)
@@ -20,8 +20,8 @@
 angular.module('egCoreMod')
 
 .factory('egPrintStore', 
-           ['$q','$window','$timeout','$compile','$rootScope',
-    function($q , $window , $timeout , $compile , $rootScope) {
+           ['$q','$window','$timeout','$interpolate','$rootScope',
+    function($q , $window , $timeout , $interpolate , $rootScope) {
 
     var service = {};
     service.msgId = 0;
@@ -38,7 +38,7 @@ angular.module('egCoreMod')
         var msg2 = {};
         // shallow copy and scrub msg before sending
         angular.forEach(msg, function(val, key) {
-            if (key.match(/deferred|printScope/)) return;
+            if (key.match(/deferred/)) return;
             msg2[key] = val;
         });
         service.socket.send(JSON.stringify(msg2));
@@ -129,6 +129,8 @@ angular.module('egCoreMod')
             return;
         }
 
+        console.debug("connecting to Hatch...");
+
         try {
             service.socket = new WebSocket(service.hatchURL);
         } catch(e) {
@@ -180,13 +182,7 @@ angular.module('egCoreMod')
 
     // print locally via the browser
     service.browserPrint = function(msg) {
-        // let our local print container handle printing
-        var content = msg.content;
-        if (msg.contentType == 'text/html') {
-            content = 
-                service.processHtmlTemplate(msg.content, msg.printScope)
-        }
-        service.onBrowserPrint(msg.contentType, content);
+        service.onBrowserPrint(msg.contentType, msg.content);
         msg.success = true; // assume browser print succeeded
     }
 
@@ -194,38 +190,41 @@ angular.module('egCoreMod')
      * TODO: local and hatch templates need to go through generation..
      * */
 
-    service.processHtmlTemplate = function(template, printScope) {
+    service.interpolateHtmlTemplate = function(template, printScope) {
         // TODO: for print template security, we must scrub
         // the scope object and remove any references to 
         // functions or objects.  Otherwise, print templates
         // would have the power to modify data via the scope
         var subScope = $rootScope.$new();
         angular.forEach(printScope, function(val, key) {subScope[key] = val});
-        var element = angular.element(template);                           
-        element = $compile(element)(subScope); 
-        console.log('element zero ' + element[0]);
-        return element[0];
+        var html = $interpolate(template)(subScope); 
+        subScope.$destroy();
+        return html;
     }
 
 
     // print the provided content
     // supported values for contentType are 'text/html' and 'text/plain'
     service.print = function(contentType, content, printScope) {
-        if (service.hatchAvailable === false) {
-            service.browserPrint(contentType, content);
-            return $q.when();
-        } 
+
+        if (contentType == 'text/html') {
+            content = service.interpolateHtmlTemplate(content, printScope);
+            console.debug('generated HTML ' + content);
+        }
         
         return service.dispatchRequest({
             key : 'no-op', 
             action : 'print',
             content : content, 
-            contentType : contentType,
-            printScope : printScope
+            contentType : contentType
             //printer : printer // TODO: prefs, etc.
         });
     }
 
+    service.printers = function() {
+        return service.dispatchRequest({key : 'no-op', action : 'printers'});
+    }
+
     // get the value for a stored item
     service.getItem = function(key) {
         return service.dispatchRequest({key : key, action : 'get'});
@@ -307,37 +306,30 @@ angular.module('egCoreMod')
 .directive('egPrintContainer', function() {
     return {
         restrict : 'AE',
-        template : '<div>' +
-            '<div id="eg-print-container-for-html"></div>' +
-            '<div ng-if="contentType==\'text/plain\'">' +
-                '<style>pre {border:none}</style>' +
-                '<pre>{{printContent}}</pre></div>' +
-            '</div>',
-
+        template : '<div id="eg-print-container-for-html"></div>',
         controller : 
                    ['$scope','$window','$timeout','egPrintStore', 
             function($scope , $window , $timeout, egPrintStore) {
 
-                // if contentType == 'text/html', content is a DOM node
                 egPrintStore.onBrowserPrint = function(contentType, content) {
-                    console.log('print content ' + content);
-                    $scope.contentType = contentType;
                     switch(contentType) {
                         case 'text/csv':
                         case 'text/plain':
-                            $scope.printContent = content;
-                            break;
+                            // preserve newlines, spaces, etc.
+                            content = '<pre>' + content + '</pre>';
                         case 'text/html':
                             // TODO: make this angular-y
                             var div = document.getElementById('eg-print-container-for-html');
                             while (div.childNodes[0])
                                 div.removeChild(div.childNodes[0]);
-                            div.appendChild(content);
+                            div.innerHTML = content;
                     }
 
                     // force the template to absorb the data before printing
                     // if an apply/digest loop is not already in progress
                     //if (!$scope.$$phase) $scope.$apply();
+                    //
+                    // TODO: apply() may no longer be necessary
 
                     $timeout(
                         function() {