UNPKG

digitickets.star-web-print

Version:

Javascript library for printing to Star Micronics printers supporting the WebPRNT interface.

590 lines (459 loc) 30.3 kB
<!DOCTYPE html> <!-- // // Star webPRNT Sample(API Receipt) // // Version 1.2.1 // // Copyright (C) 2012-2016 STAR MICRONICS CO., LTD. All Rights Reserved. // --> <html> <head> <meta charset="UTF-8"> <meta http-equiv="Expires" content="86400"> <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> <title>Star webPRNT Sample(API Receipt)</title> <link href="css/import.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="style.css" media="screen"> <link href="css/style_apireceipt.css" rel="stylesheet" type="text/css"> <script type='text/javascript' src='js/StarWebPrintBuilder.js'></script> <script type='text/javascript' src='js/StarWebPrintTrader.js'></script> <script type='text/javascript'> <!-- var request = ''; function sendMessage(request) { showNowPrinting(); var url = document.getElementById('url').value; var papertype = document.getElementById('papertype').value; var trader = new StarWebPrintTrader({url:url, papertype:papertype}); trader.onReceive = function (response) { hideNowPrinting(); var msg = '- onReceive -\n\n'; msg += 'TraderSuccess : [ ' + response.traderSuccess + ' ]\n'; // msg += 'TraderCode : [ ' + response.traderCode + ' ]\n'; msg += 'TraderStatus : [ ' + response.traderStatus + ',\n'; if (trader.isCoverOpen ({traderStatus:response.traderStatus})) {msg += '\tCoverOpen,\n';} if (trader.isOffLine ({traderStatus:response.traderStatus})) {msg += '\tOffLine,\n';} if (trader.isCompulsionSwitchClose({traderStatus:response.traderStatus})) {msg += '\tCompulsionSwitchClose,\n';} if (trader.isEtbCommandExecute ({traderStatus:response.traderStatus})) {msg += '\tEtbCommandExecute,\n';} if (trader.isHighTemperatureStop ({traderStatus:response.traderStatus})) {msg += '\tHighTemperatureStop,\n';} if (trader.isNonRecoverableError ({traderStatus:response.traderStatus})) {msg += '\tNonRecoverableError,\n';} if (trader.isAutoCutterError ({traderStatus:response.traderStatus})) {msg += '\tAutoCutterError,\n';} if (trader.isBlackMarkError ({traderStatus:response.traderStatus})) {msg += '\tBlackMarkError,\n';} if (trader.isPaperEnd ({traderStatus:response.traderStatus})) {msg += '\tPaperEnd,\n';} if (trader.isPaperNearEnd ({traderStatus:response.traderStatus})) {msg += '\tPaperNearEnd,\n';} msg += '\tEtbCounter = ' + trader.extractionEtbCounter({traderStatus:response.traderStatus}).toString() + ' ]\n'; // msg += 'Status : [ ' + response.status + ' ]\n'; // // msg += 'ResponseText : [ ' + response.responseText + ' ]\n'; alert(msg); } trader.onError = function (response) { var msg = '- onError -\n\n'; msg += '\tStatus:' + response.status + '\n'; msg += '\tResponseText:' + response.responseText + '\n\n'; msg += 'Do you want to retry?\n'; var answer = confirm(msg); if (answer) { sendMessage(request); } else { hideNowPrinting(); } } trader.sendMessage({request:request}); } function onSendAscii() { var builder = new StarWebPrintBuilder(); request = ''; request += builder.createInitializationElement(); switch (document.getElementById('paperWidth').value) { case 'inch2' : request += builder.createTextElement({characterspace:2}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'Thank you for your coming. \n'}); request += builder.createTextElement({data:"We hope you'll visit again.\n"}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Apple $20.00\n'}); request += builder.createTextElement({data:'Banana $30.00\n'}); request += builder.createTextElement({data:'Grape $40.00\n'}); request += builder.createTextElement({data:'Lemon $50.00\n'}); request += builder.createTextElement({data:'Orange $60.00\n'}); request += builder.createTextElement({emphasis:true, data:'Subtotal $200.00\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'Tax $10.00\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'Total'}); request += builder.createTextElement({width:1, data:' '}); request += builder.createTextElement({width:2, data:'$210.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Received $300.00\n'}); request += builder.createTextElement({width:2, data:'Change'}); request += builder.createTextElement({width:1, data:' '}); request += builder.createTextElement({width:2, data:'$90.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; case 'inch3DotImpact' : request += builder.createTextElement({characterspace:2}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'Thank you for your coming. \n'}); request += builder.createTextElement({data:"We hope you'll visit again.\n"}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Apple $20.00\n'}); request += builder.createTextElement({data:'Banana $30.00\n'}); request += builder.createTextElement({data:'Grape $40.00\n'}); request += builder.createTextElement({data:'Lemon $50.00\n'}); request += builder.createTextElement({data:'Orange $60.00\n'}); request += builder.createTextElement({emphasis:true, data:'Subtotal $200.00\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'Tax $10.00\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'Total $210.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Received $300.00\n'}); request += builder.createTextElement({width:2, data:'Change $90.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; default : request += builder.createTextElement({characterspace:0}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'Thank you for your coming. \n'}); request += builder.createTextElement({data:"We hope you'll visit again.\n"}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Apple $20.00\n'}); request += builder.createTextElement({data:'Banana $30.00\n'}); request += builder.createTextElement({data:'Grape $40.00\n'}); request += builder.createTextElement({data:'Lemon $50.00\n'}); request += builder.createTextElement({data:'Orange $60.00\n'}); request += builder.createTextElement({emphasis:true, data:'Subtotal $200.00\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'Tax $10.00\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'Total $210.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Received $300.00\n'}); request += builder.createTextElement({width:2, data:'Change $90.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; case 'inch4' : request += builder.createTextElement({characterspace:1}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'Thank you for your coming. \n'}); request += builder.createTextElement({data:"We hope you'll visit again.\n"}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Apple $20.00\n'}); request += builder.createTextElement({data:'Banana $30.00\n'}); request += builder.createTextElement({data:'Grape $40.00\n'}); request += builder.createTextElement({data:'Lemon $50.00\n'}); request += builder.createTextElement({data:'Orange $60.00\n'}); request += builder.createTextElement({emphasis:true, data:'Subtotal $200.00\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'Tax $10.00\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'Total $210.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'Received $300.00\n'}); request += builder.createTextElement({width:2, data:'Change $90.00\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; } request += builder.createCutPaperElement({feed:true}); sendMessage(request); } function onSendKanji() { showNowPrinting(); var builder = new StarWebPrintBuilder(); request = ''; request += builder.createInitializationElement(); var encoding = document.getElementById('encoding').value; // If you Send to printer that is not supported UTF8, DO NOT set codepage='utf8'. // UTF8に対応していないプリンタへ、漢字を送信する場合は、 // codepage='utf8'を指定しないこと。 // 正しく印刷できない場合がある。 request += builder.createTextElement({codepage:encoding}); switch (document.getElementById('paperWidth').value) { case 'inch2' : request += builder.createTextElement({characterspace:0, international:'japan'}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); //request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'お買い上げありがとうございます。またのご来店を、お待ちしております。\n'}); request += builder.createTextElement({data:'数量予約も承っております。お気軽にご連絡ください。\n'}); //request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'りんご \\2,000\n'}); request += builder.createTextElement({data:'バナナ \\3,000\n'}); request += builder.createTextElement({data:'ぶどう \\4,000\n'}); request += builder.createTextElement({data:'レモン \\5,000\n'}); request += builder.createTextElement({data:'みかん \\6,000\n'}); request += builder.createTextElement({emphasis:true, data:'小計 \\20,000\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'消費税 \\1,000\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'合計 \\21,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'お預かり \\30,000\n'}); request += builder.createTextElement({width:2, data:'お釣り \\9,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; case 'inch3DotImpact' : request += builder.createTextElement({characterspace:2, international:'japan'}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'お買い上げありがとうございました。\n'}); request += builder.createTextElement({data:'またのご来店をお待ちしております。\n'}); request += builder.createTextElement({data:'数量予約も承っております。\n'}); request += builder.createTextElement({data:'お気軽にご連絡ください。\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'りんご \\2,000\n'}); request += builder.createTextElement({data:'バナナ \\3,000\n'}); request += builder.createTextElement({data:'ぶどう \\4,000\n'}); request += builder.createTextElement({data:'レモン \\5,000\n'}); request += builder.createTextElement({data:'みかん \\6,000\n'}); request += builder.createTextElement({emphasis:true, data:'小計 \\20,000\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'消費税 \\1,000\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'合計 \\21,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'お預かり \\30,000\n'}); request += builder.createTextElement({width:2, data:'お釣り \\9,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; default : request += builder.createTextElement({characterspace:0, international:'japan'}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'お買い上げありがとうございました。\n'}); request += builder.createTextElement({data:'またのご来店をお待ちしております。\n'}); request += builder.createTextElement({data:'数量予約も承っております。\n'}); request += builder.createTextElement({data:'お気軽にご連絡ください。\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'りんご \\2,000\n'}); request += builder.createTextElement({data:'バナナ \\3,000\n'}); request += builder.createTextElement({data:'ぶどう \\4,000\n'}); request += builder.createTextElement({data:'レモン \\5,000\n'}); request += builder.createTextElement({data:'みかん \\6,000\n'}); request += builder.createTextElement({emphasis:true, data:'小計 \\20,000\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'消費税 \\1,000\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'合計 \\21,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'お預かり \\30,000\n'}); request += builder.createTextElement({width:2, data:'お釣り \\9,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; case 'inch4' : request += builder.createTextElement({characterspace:1, international:'japan'}); request += builder.createAlignmentElement({position:'right'}); request += builder.createLogoElement({number:1}); request += builder.createTextElement({data:'TEL 9999-99-9999\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createAlignmentElement({position:'center'}); request += builder.createTextElement({data:'お買い上げありがとうございました。\n'}); request += builder.createTextElement({data:'またのご来店をお待ちしております。\n'}); request += builder.createTextElement({data:'数量予約も承っております。\n'}); request += builder.createTextElement({data:'お気軽にご連絡ください。\n'}); request += builder.createAlignmentElement({position:'left'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'りんご \\2,000\n'}); request += builder.createTextElement({data:'バナナ \\3,000\n'}); request += builder.createTextElement({data:'ぶどう \\4,000\n'}); request += builder.createTextElement({data:'レモン \\5,000\n'}); request += builder.createTextElement({data:'みかん \\6,000\n'}); request += builder.createTextElement({emphasis:true, data:'小計 \\20,000\n'}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({underline:true, data:'消費税 \\1,000\n'}); request += builder.createTextElement({underline:false}); request += builder.createTextElement({emphasis:true}); request += builder.createTextElement({width:2, data:'合計 \\21,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({emphasis:false}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({data:'お預かり \\30,000\n'}); request += builder.createTextElement({width:2, data:'お釣り \\9,000\n'}); request += builder.createTextElement({width:1}); request += builder.createTextElement({data:'\n'}); request += builder.createTextElement({characterspace:0}); break; } request += builder.createCutPaperElement({feed:true}); sendMessage(request); } function nowLoading(){ document.getElementById('form').style.display="block"; document.getElementById('overlay').style.display="none"; document.getElementById('nowLoadingWrapper').style.display="none"; } function showNowPrinting(){ document.getElementById('overlay').style.display="block"; document.getElementById('nowPrintingWrapper').style.display="table"; } function hideNowPrinting(){ document.getElementById('overlay').style.opacity= 0.0; document.getElementById('overlay').style.transition= "all 0.3s"; intimer = setTimeout(function (){ document.getElementById('overlay').style.display="none"; document.getElementById('overlay').style.opacity= 1; clearTimeout(intimer); }, 300); document.getElementById('nowPrintingWrapper').style.display="none"; } window.onload = function() { nowLoading(); } // --> </script> <noscript> Your browser does not support JavaScript! </noscript> </head> <body> <div id="overlay"> <div id="nowPrintingWrapper"> <section id="nowPrinting"> <h1>Now Printing</h1> <p><img src="images/icon_loading.gif" /></p> </section> </div> <div id="nowLoadingWrapper"> <section id="nowLoading"> <h1>Now Loading</h1> <p><img src="images/icon_loading.gif" /></p> </section> </div> </div> <header id="global-header"> <h1><a href="A001.html"><img src="images/logo_01.png" alt="HOME" width="108" height="61"></a></h1> <div id="sub-logo"><a href="http://www.star-m.jp/" target="_blank"><img src="images/logo_02.png" alt="" width="120" height="13"></a></div> </header> <section class="btmMg20"> <h2 class="h2-tit-01 btmMg20">API : Receipt</h2> </section> <form onsubmit='return false;' id="form"> <div class="container"> <dl> <dt>Paper Width</dt> <dd>: <select id='paperWidth'> <option value='inch2' selected='selected'>2 Inch</option> <option value='inch3'>3 Inch</option> <option value='inch4'>4 Inch</option> </select> </dd> </dl> <dl> <dt>Encoding</dt> <dd>: <select id='encoding'> <option value='shift_jis' selected='selected'>Shift-JIS</option> <option value='utf8'>UTF-8</option> </select> </dd> </dl> <hr> <footer> <dl> <dt>URL</dt> <dd>: <input id="url" type="text" value="http://localhost:8001/StarWebPRNT/SendMessage" /></dd> </dl> <d1> <dt>Paper Type</dt> <dd>: <select id='papertype'> <option value='' selected='selected'>-</option> <option value='normal'>Normal</option> <option value='black_mark'>Black Mark</option> <option value='black_mark_and_detect_at_power_on'>Black Mark and Detect at Power On</option> </select> </dd> </dl> <input id="sendBtnAscii" type="button" value="Send (Ascii)" onclick="onSendAscii()" /> <input id="sendBtnKanji" type="button" value="Send (Kanji)" onclick="onSendKanji()" /> </footer> </div> </form> <div class="to_top"> </div> <footer id="global-footer" class="clearfix"> <a href="https://www.star-m.jp/starwebprnt-oml.html" target="_blank"><img src="images/footer-logo.png" width="123" alt="" id="footer-logo"></a> <img src="images/footer-image.png"height="54" alt=""/> </footer> </body> </html>