Open-ILS/src/templates/staff/admin/workstation/t_print_config.tt2

   1 <div class="container" id="admin-workstation-printing">
   2
   3   <style>
   4     /* TODO: more context and move me */
   5     textarea {
   6       height: 400px;
   7       width: 100%;
   8     }
   9     .tab-pane .row {
  10       padding-top: 20px;
  11     }
  12     h2 { margin-bottom: 15px }
  13
  14   </style>
  15
  16   <div class="row">
  17     <div class="col-md-12">
  18       <h2>[% l('Hatch Printer Settings') %]</h2>
  19
  20       <div class="alert alert-warning"
  21         ng-if="hatchIsOpen() && !useHatchPrinting()">
  22         <p>
  23 [% l("Hatch printing is not enabled on this browser.  The settings below will have no effect until Hatch printing is enabled.") %]
  24           <a href="./admin/workstation/hatch" target="_self"
  25             title="[% l('Hatch Administration') %]">
  26             [% l('Enable Hatch Printing.') %]
  27           </a>
  28         </p>
  29       </div>
  30     </div>
  31   </div>
  32
  33   <div class="row">
  34     <div class="col-md-12">
  35       <ul class="nav nav-tabs">
  36         <li ng-class="{active : context == 'default'}">
  37           <a href='' ng-click="setContext('default')">[% l('Default') %]</a>
  38         </li>
  39         <li ng-class="{active : context == 'receipt'}">
  40           <a href='' ng-click="setContext('receipt')">[% l('Receipt') %]</a>
  41         </li>
  42         <li ng-class="{active : context == 'label'}">
  43           <a href='' ng-click="setContext('label')">[% l('Label') %]</a>
  44         </li>
  45         <li ng-class="{active : context == 'mail'}">
  46           <a href='' ng-click="setContext('mail')">[% l('Mail') %]</a>
  47         </li>
  48         <li ng-class="{active : context == 'offline'}">
  49           <a href='' ng-click="setContext('offline')">[% l('Offline') %]</a>
  50         </li>
  51         <li ng-class="{active : isTestView}" class="pull-right">
  52           <a href='' ng-click="isTestView=true">[% l('Test Printing') %]</a>
  53         </li>
  54       </ul>
  55       <div class="tab-content">
  56         <div class="tab-pane active">
  57
  58           <div class="alert alert-warning" ng-if="!isTestView && !hatchIsOpen()">
  59 [% l('Hatch is not installed in this browser.  Printing must be configured via the native browser print configuration.') %]
  60           </div>
  61
  62           <!-- printer config UI -->
  63           <div class="row" ng-hide="isTestView || !hatchIsOpen()">
  64             <div class="col-md-6">
  65               <div class="input-group">
  66                 <div class="input-group-btn" uib-dropdown>
  67                   <button type="button" class="btn btn-default" uib-dropdown-toggle>
  68                     [% l('Select Printer') %]
  69                     <span class="caret"></span></button>
  70                   <ul uib-dropdown-menu>
  71                     <li ng-repeat="printer in printers">
  72                       <a href='' ng-click="setPrinter(printer.name)">
  73                         <span ng-if="printer.name == 'hatch_file_writer'">
  74                           [% l('Hatch File Writer') %]
  75                         </span>
  76                         <span ng-if="printer.name != 'hatch_file_writer'">
  77                           {{printer.name}}
  78                         </span>
  79                       </a>
  80                     </li>
  81                   </ul>
  82                 </div><!-- /btn-group -->
  83                 <input ng-if="!printers[0]" type="text"
  84                   class="form-control" disabled="disabled"
  85                   value="[% l('No Printers Found') %]">
  86                 <input ng-if="printers[0] && !printConfig[context]" type="text"
  87                   class="form-control" disabled="disabled"
  88                   value="[% l('No Printer Selected') %]">
  89                 <input ng-if="useFileWriter()" type="text" disabled="disabled"
  90                   class="form-control" value="[% l('Hatch File Writer') %]"/>
  91                 <input ng-if="printConfig[context].printer && !useFileWriter()"
  92                   type="text" class="form-control" disabled="disabled"
  93                   value="{{printConfig[context].printer}}">
  94               </div><!-- /input-group -->
  95             </div><!-- col -->
  96             <div class="col-md-4">
  97               <span class="pad-right-min">
  98                 <button class="btn btn-warning"
  99                   ng-click="resetPrinterSettings(context)">
 100                   [% l('Reset Form') %]
 101                 </button>
 102               </span>
 103               <button class="btn btn-success"
 104                 ng-click="savePrinterSettings(context)">
 105                 [% l('Apply Changes') %]
 106               </button>
 107             </div>
 108           </div><!-- row -->
 109
 110           <div class="pad-vert"
 111             ng-show="!isTestView && hatchIsOpen() && useFileWriter()">
 112             <div class="alert alert-info">
 113               [% |l %]Hatch File Writer translates print output to plain text
 114 and writes the content to a text file in the Hatch profile directory.  No
 115 additional settings are required.[% END %]
 116             </div>
 117           </div>
 118
 119           <div class="row"
 120             ng-show="!isTestView && hatchIsOpen() && !useFileWriter()"
 121             <div class="col-md-10">
 122               <div class="row">
 123                 <div class="col-md-1"></div>
 124                 <div class="col-md-2">
 125                   <label>[% l('Print Color') %]</label>
 126                 </div>
 127                 <div class="col-md-4">
 128                   <select
 129                     class="form-control"
 130                     ng-model="printConfig[context].printColor"
 131                     ng-options="val for val in printerOptions.printColor | orderBy:'val'">
 132                   </select>
 133                 </div>
 134                 <div class="col-md-3">
 135                   <span>[% l('Default: [_1]',
 136                     '{{printerOptions.defaultPrintColor}}') %]</span>
 137                 </div>
 138               </div>
 139               <div class="row">
 140                 <div class="col-md-1"></div>
 141                 <div class="col-md-2">
 142                   <label>[% l('Paper Source') %]</label>
 143                 </div>
 144                 <div class="col-md-4">
 145                   <select
 146                     class="form-control"
 147                     ng-model="printConfig[context].paperSource"
 148                     ng-options="val for val in printerOptions.paperSource | orderBy:'val'">
 149                   </select>
 150                 </div>
 151                 <div class="col-md-3">
 152                   <span>[% l('Default: [_1]',
 153                     '{{printerOptions.defaultPaperSource}}') %]</span>
 154                 </div>
 155               </div>
 156               <div class="row">
 157                 <div class="col-md-1"></div>
 158                 <div class="col-md-2">
 159                   <label>[% l('Paper Type') %]</label>
 160                 </div>
 161                 <div class="col-md-4">
 162                   <select
 163                     class="form-control"
 164                     ng-model="printConfig[context].paper"
 165                     ng-options="val for val in printerOptions.paper | orderBy:'val'">
 166                   </select>
 167                 </div>
 168                 <div class="col-md-3">
 169                   <span>[% l('Default: [_1]',
 170                     '{{printerOptions.defaultPaper}}') %]</span>
 171                 </div>
 172               </div>
 173
 174               <div class="row">
 175                 <div class="col-md-1"></div>
 176                 <div class="col-md-2">
 177                   <label>[% l('Page Orientation') %]</label>
 178                 </div>
 179                 <div class="col-md-4">
 180                   <select
 181                     class="form-control"
 182                     ng-model="printConfig[context].pageOrientation"
 183                     ng-options="val for val in printerOptions.pageOrientation | orderBy:'val'">
 184                   </select>
 185                 </div>
 186                 <div class="col-md-3">
 187                   <span>[% l('Default: [_1]',
 188                     '{{printerOptions.defaultPageOrientation}}') %]</span>
 189                 </div>
 190               </div>
 191
 192               <div class="row">
 193                 <div class="col-md-1"></div>
 194                 <div class="col-md-2">
 195                   <label>[% l('Collation') %]</label>
 196                 </div>
 197                 <div class="col-md-4">
 198                   <select
 199                     class="form-control"
 200                     ng-model="printConfig[context].collation"
 201                     ng-options="val for val in printerOptions.collation | orderBy:'val'">
 202                   </select>
 203                 </div>
 204                 <div class="col-md-3">
 205                   <span>[% l('Default: [_1]',
 206                     '{{printerOptions.defaultCollation}}') %]</span>
 207                 </div>
 208               </div>
 209
 210               <div class="row">
 211                 <div class="col-md-1"></div>
 212                 <div class="col-md-2">
 213                   <label>[% l('Print Quality') %]</label>
 214                 </div>
 215                 <div class="col-md-4">
 216                   <select
 217                     class="form-control"
 218                     ng-model="printConfig[context].printQuality"
 219                     ng-options="val for val in printerOptions.printQuality | orderBy:'val'">
 220                   </select>
 221                 </div>
 222                 <div class="col-md-3">
 223                   <span>[% l('Default: [_1]',
 224                     '{{printerOptions.defaultPrintQuality}}') %]</span>
 225                 </div>
 226               </div>
 227
 228               <div class="row">
 229                 <div class="col-md-1"></div>
 230                 <div class="col-md-2">
 231                   <label>[% l('Print Sides') %]</label>
 232                 </div>
 233                 <div class="col-md-4">
 234                   <select
 235                     class="form-control"
 236                     ng-model="printConfig[context].printSides"
 237                     ng-options="val for val in printerOptions.printSides | orderBy:'val'">
 238                   </select>
 239                 </div>
 240                 <div class="col-md-3">
 241                   <span>[% l('Default: [_1]',
 242                     '{{printerOptions.defaultPrintSides}}') %]</span>
 243                 </div>
 244               </div>
 245
 246               <div class="row">
 247                 <div class="col-md-1"></div>
 248                 <div class="col-md-2">
 249                   <label>[% l('Number of Items') %]</label>
 250                 </div>
 251                 <div class="col-md-4">
 252                   <input type="text" size="4" class="form-control"
 253                     ng-model="printConfig[context].copies"/>
 254                 </div>
 255                 <div class="col-md-3">
 256                   <span>[% l('Default: [_1]',
 257                     '{{printerOptions.defaultCopies}}') %]</span>
 258                 </div>
 259               </div>
 260
 261               <div class="row">
 262                 <div class="col-md-1">
 263                   <input type="radio" name="margins"
 264                     ng-click="printConfig[context].autoMargins=true"
 265                     ng-checked="printConfig[context].autoMargins"/>
 266                 </div>
 267                 <div class="col-md-2">
 268                   <label>[% l('Automatic Margins') %]</label>
 269                 </div>
 270                 <div class="col-md-4">
 271                   <select
 272                     class="form-control"
 273                     ng-model="printConfig[context].marginType"
 274                     ng-disabled="!printConfig[context].autoMargins"
 275                     ng-options="val for val in printerOptions.marginType | orderBy:'val'">
 276                   </select>
 277                 </div>
 278                 <div class="col-md-3">
 279                   <span>[% l('Default: [_1]',
 280                     '{{printerOptions.defaultMarginType}}') %]</span>
 281                 </div>
 282               </div>
 283
 284               <div class="row">
 285                 <div class="col-md-1">
 286                   <input type="radio" name="margins"
 287                     ng-click="printConfig[context].autoMargins=false"
 288                     ng-checked="!printConfig[context].autoMargins"/>
 289                 </div>
 290                 <div class="col-md-2">
 291                   <label>[% l('Manual Margins') %]</label>
 292                 </div>
 293                 <div class="col-md-2">
 294                   <div class="input-group">
 295                     <span class="input-group-addon">[% l('Left') %]</span>
 296                     <input type="text" class="form-control"
 297                       ng-disabled="printConfig[context].autoMargins"
 298                       ng-model="printConfig[context].leftMargin"/>
 299                   </div>
 300                 </div>
 301                 <div class="col-md-2">
 302                   <div class="input-group">
 303                     <span class="input-group-addon">[% l('Top') %]</span>
 304                     <input type="text" class="form-control"
 305                       ng-disabled="printConfig[context].autoMargins"
 306                       ng-model="printConfig[context].topMargin"/>
 307                   </div>
 308                 </div>
 309               </div>
 310               <div class="row">
 311                 <div class="col-md-3"></div>
 312                 <div class="col-md-2">
 313                   <div class="input-group">
 314                     <span class="input-group-addon">[% l('Right') %]</span>
 315                     <input type="text" class="form-control"
 316                       ng-disabled="printConfig[context].autoMargins"
 317                       ng-model="printConfig[context].rightMargin"/>
 318                   </div>
 319                 </div>
 320                 <div class="col-md-2">
 321                   <div class="input-group">
 322                     <span class="input-group-addon">[% l('Bottom') %]</span>
 323                     <input type="text" class="form-control"
 324                       ng-disabled="printConfig[context].autoMargins"
 325                       ng-model="printConfig[context].bottomMargin"/>
 326                   </div>
 327                 </div>
 328               </div>
 329
 330               <div class="row">
 331                 <div class="col-md-1"></div>
 332                 <div class="col-md-2"><label>[% l('Page Ranges') %]</label></div>
 333                 <div class="col-md-2">
 334                   [% l('All Pages') %]
 335                   <input type='radio' name='pageRanges'
 336                     ng-checked="printConfig[context].allPages"
 337                     ng-click="printConfig[context].allPages=true"/>
 338                 </div>
 339                 <div class="col-md-2">
 340                   [% l('Page Range') %]
 341                   <input type='radio' name='pageRanges'
 342                     ng-checked="!printConfig[context].allPages"
 343                     ng-click="printConfig[context].allPages=false"/>
 344                 </div>
 345               </div>
 346               <div class="row">
 347                 <div class="col-md-3"></div>
 348                 <div class="col-md-2">
 349                   <div class="input-group">
 350                     <span class="input-group-addon">[% l('Start') %]</span>
 351                     <input type="text" class="form-control"
 352                       ng-disabled="printConfig[context].allPages"
 353                       ng-model="printConfig[context].pageRanges[0]"/>
 354                   </div>
 355                 </div>
 356                 <div class="col-md-2">
 357                   <div class="input-group">
 358                     <span class="input-group-addon">[% l('End') %]</span>
 359                     <input type="text" class="form-control"
 360                       ng-disabled="printConfig[context].allPages"
 361                       ng-model="printConfig[context].pageRanges[1]"/>
 362                   </div>
 363                 </div>
 364                 <!-- TODO: support multiple page ranges by
 365                     dynamically adding additional pageRanges[X] pairs -->
 366               </div>
 367             </div><!-- col -->
 368           </div><!-- row -->
 369
 370           <div class="row" ng-hide="isTestView || !hatchIsOpen()">
 371             <div class="col-md-12">
 372               <h3>[% l('Compiled Printer Settings') %]</h3>
 373               <pre>{{printerConfString()}}</pre>
 374             </div><!-- col -->
 375           </div><!-- row -->
 376
 377           <!-- printer test UI -->
 378           <div class="row" ng-show="isTestView">
 379             <div class="col-md-10">
 380               <div class="btn-group">
 381                 <button type="button"
 382                   class="btn btn-default btn-lg"
 383                   ng-class="{active : contentType=='text/plain'}"
 384                   ng-click="setContentType('text/plain')">[% l('Plain Text') %]</button>
 385                 <button type="button"
 386                   class="btn btn-default btn-lg"
 387                   ng-class="{active : contentType=='text/html'}"
 388                   ng-click="setContentType('text/html')">[% l('HTML') %]</button>
 389               </div>
 390             </div>
 391             <div class="col-md-2">
 392               <div class="input-group pull-right">
 393                 <div class="input-group-btn">
 394                   <button type="button"
 395                     ng-click="testPrint()"
 396                     class="btn btn-default btn-success">
 397                       [% l('Print') %]</button>
 398                   <button type="button"
 399                     ng-click="testPrint(true)"
 400                     class="btn btn-default btn-info">
 401                       [% l('Print with Dialog') %]</button>
 402                 </div>
 403               </div>
 404             </div>
 405           </div>
 406
 407           <div class="row" ng-show="isTestView">
 408             <div class="col-md-12">
 409               <div ng-show="contentType=='text/plain'"
 410 ng-init="textPrintContent='
 411 [% l('Test Print') %]
 412
 413 1234567890
 414
 415 12345678901234567890
 416
 417 123456789012345678901234567890
 418
 419 1234567890123456789012345678901234567890
 420
 421 12345678901234567890123456789012345678901234567890
 422
 423 12345678901234567890123456789012345678901234567890123456790
 424
 425 [% l('Test Print') %]
 426 '">
 427         <pre><textarea>{{textPrintContent}}</textarea></pre>
 428       </div>
 429
 430       <div ng-show="contentType=='text/html'">
 431         <textarea ng-model="htmlPrintContent"
 432 ng-init="htmlPrintContent='
 433 <div>
 434   <style>p { color: blue }</style>
 435   <h2>[% l('Test HTML Print') %]</h2>
 436   <br/>
 437   <img src=\'https://[% ctx.hostname %]/opac/images/main_logo.png\' width=\'140\' height=\'24\'/>
 438   <p>[% l('Welcome, Stranger!') %]</p>
 439   <p>{{value1}}</p>
 440   <p>{{value2}}</p>
 441   <p>{{date_value | date}}</p>
 442 </div>
 443 '">
 444                 </textarea>
 445               </div><!-- html content -->
 446             </div><!-- col -->
 447           </div><!-- row -->
 448         </div><!-- tab pane -->
 449       </div><!-- tab content -->
 450     </div><!-- col -->
 451   </div><!-- row -->
 452 </div><!-- container -->
 453