<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>
<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>
<p>[% l('Welcome, Stranger!') %]</p>
<p>{{value1}}</p>
<p>{{value2}}</p>
+ <p>{{date_value | date}}</p>
</div>
'">
</textarea>
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;
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));
return;
}
+ console.debug("connecting to Hatch...");
+
try {
service.socket = new WebSocket(service.hatchURL);
} catch(e) {
// 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
}
* 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'});
.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() {