Web App Print
Overview
The SDK API provided by BIXOLON, is a JavaScript Library, which guides you to use B-gate’s special feature WebApp Print. This section is going to discuss about the features and functions supported by the B-gate SDK APIs.
The SDK APIs provided by BIXOLON has the ability to control and manage the B-gate Printer and the external BIXOLON printers (USB and Network) which are connected to the B-gate.
The SDK APIs are easy to integrate with your web applications allowing easy control, send and receive data from the B-gate and the printers which are connected to the B-gate as well.
API Download
SDK Download for Web App PrintReference Guide
API Integration and Detailed Information
This section will explain the detailed information about our SDK API functions and how to integrate these into your web application.
In order to integrate our SDK API Library into your web application, first our SDK API Library files (bGateWebPrintAPI_WS.js and WS_parser.js) have to be added into your web application’s js folder and then call those files via <script> tag on your web application’s index.html file.
• Example <!DOCTYPE html> <html> <head> …. <script type="text/javascript" src="js/WS_parser.js"></script> <script type="text/javascript" src="js/bGateWebPrintAPI_WS.js"></script> …. </head> <body> …. </body> </html> |
Create SDK API Library Instance
In order to use our SDK API functions in the web application, first create our bGateWebPrintAPI Library on your JavaScript file and then use this instance to call our SDK API functions.
• Syntax var bGateWebPrintAPI(); • Parameters none • Example var bgtWebPrint = new bGateWebPrintAPI(); |
Send Data
The API sendData is use to send the print data to the designated B-gate.
• Syntax var sendData(ipAddr,shopID,devID); • Parameters ipAddr = Represents the designated IP Address WebApp Print : its B-gate IP Address Cloud Server Print : Its Cloud IP Address shopID = Represents the designated Shop Name. devID = Represents the target printer ID. • Example var ipAddr = "192.168.0.100"; var shopID = "BGATE_SAMPLE_SHOP"; var devID = "local_printer";
bgtWebPrint.sendData(ipAddr,shopID,devID); |
Alignment
The API makeAlign used to align the print data.
• Syntax var makeAlign (pos) • Parameters pos (position) = position Options: 'left' , 'right' , 'center' (Default: 'left') • Example bgtWebPrint.makeAlign({pos:'center'}); |
Print Text
The API makeText used to print the text data.
• Syntax var makeText(code, ics, font, wd, ht, uline, bold, reverse, updown, rotate, lsp, data) • Parameters code (code page) = Code Page Options: 'page0' ~ 'page5' , 'page16' ~ 'page19', 'page21' ~ 'page31', 'page33' ~ 'page42', 'page47', 'page255' (Default: page0) ics (international code standard) = ICS Options: 'usa','france', 'germany', 'uk', 'denmark I' ,'sweden', 'italy', 'spain I' , 'japan', 'norway', 'denmark II', 'spain II', 'latinamerica', 'korea' (Default : usa) font = font options : 'fonta', 'fontb' 'fontc' (Default : fonta) wd = Text width options: '0' ~ '7' (Default : 0) ht = Text height options : '0' ~ '7' (Default : 0) uline = Under Line options : 'true' , 'false' (Default : false) bold = Bold options: 'true' , 'false' (Default : false) reverse(Interchange black and white) = Reverse options : 'true' , 'false' (Default : false) updown = upside-down options : 'true', 'false' (Default: false) rotate = Rotation Options : '0' , '90' (Default: 0) lsp (line space) = Line Space options : '0' ~ '255', '256'(=set line space to printer default) (Default : 256) data = Text Data • Example bgtWebPrint.maketext({code:'page0',ics:'us',font:'fonta',wd:'1',ht:'1',uline:'false',bold:'false', reverse:'false',rorate:'0',data:'Hello!World'}); bgtWebPrint.maketext({data:'Hello!World'}); bgtWebPrint.maketext({bold:'true',data:'Hello!World'}); bgtWebPrint.maketext({uline:'true', wd:'2',data:'Hello!World'}); |
Paper Feed
The API makePaperFeed used to feed the paper.
• Syntax var makePaperFeed (type, value) • Parameters type = Feed Type Options : 'line' , 'unit'(Default : line) value = Feed Value Options : '1' ~ '65535' (Default : 1) • Example bgtWebPrint.makePaperFeed({type:'line',value:'1'}); |
Print Image
The API makeImage used to print the Image Data.
• Syntax var makeImage (context, x, y, width, height) • Parameters context = HTML5 canvas context x = Image start x-coordinate position : '0' ~ '65535' y = Image start y-coordinate position : '0' ~ '65535' width = The Width of Image Data : '0' ~ '65535' height = The Height of Image Data : '0' ~ '65535' • Example Include a canvas in your html file, if you don’t want to display it then make it hidden. <!DOCTYPE html> <html> <head> …. <script type="text/javascript" src="js/WS_parser.js"></script> <script type="text/javascript" src="js/bGateWebPrintAPI_WS.js"></script> …. </head> <body> …. <div style="display:none;"> <canvas id="myHiddenCanvas" width="512" height="480"> </canvas> <img id="coupon" src="img/coupon.png" alt="canvas image"> </div> </body> </html> On your JS file get the context of your canvas and draw your image on canvas and then call our makeImage API to send image data. var dataURL="./img/coupon.png"; var image = new Image(); image.src = dataURL; var canvas = document.getElementById('myHiddenCanvas'); var context = canvas.getContext('2d'); context.drawImage(image, 0, 0, 512, 480); bgtWebPrint.makeImage(context, 0, 0, 512, 480); |
Print NV Logo
The API makeNVlogo used to print the NV Logo images stored in printer memory.
• Syntax var makeNVlogo (keycode, lsize) • Parameters keycode = Memory Location Options : '0' ~ '255' (Default: 0) lsize = NV Logo Size Options: 'normal', 'quadruple','dwd'(double width), 'dht'(double height) (Default: normal) • Example bgtWebPrint.makeNVvlogo({keycode:’0’,lsize:’normal’}) |
Print 1D Barcode
The API makeBarcode12 used to print 1-dimentional Barcode.
• Syntax var makeBarcode12 (type, hri, wd, ht, data) • Parameters type = Barcode Type Options : 'UPC_A' , 'UPC_E' , 'EAN13' , 'JAN13','EAN8',’JAN8', 'CODE39', 'ITF','CODABAR','CODE93' , 'CODE128' (Default: CODE39) hri (human readable interpretation)= HRI Print Location Options : 'none','above','below','both' (Default : none) wd (width) = Barcode Width Options : '0' ~ '255' (Default : 2) ht (height) = Barcode Height Options : '0' ~ '255'(Default : 162) data = Barcode Data • Example bgtWebPrint.makeBarcode12({data:’123456789123’, type:’code128’,hri:’none’,wd:’2’,ht:’162’}); |
Print 2-D Symbol PDF417
The API makePDF417 used to print 2-d symbol PDF471
• Syntax var makePDF417 (col, row, wd, ht, level, mode, data) • Parameters col = Columns Options: '0' ~ '30' (Default: 0) row = Row Options: '0', '3' ~ '90'(Default: 0) wd = Module Width Options : '1' ~ '4'(Default : 3) ht = Module Height Options : '2' ~ '4'(Default : 3) level = Error Correction Level Options : '0' ~ '8' (Default : 0) mode = PDF417 Mode options: '0'(Standard Mode), '1'(Simplified Mode) (Default : 0) data = 2-D symbol data • Example bgtWebPrint.makePDF417({data:'http://bixolon.com',col:'0',row:'0', wd:'3',ht:'3', mode:'0'}); |
Print 2-D Symbol QR Code
The API makeQRCODE used to print 2-d symbol QR Code
• Syntax var makeQRCODE (model, size, level, data) • Parameters model = QR Code Model Options : 'mod1' , 'mod2' (Default : mod2) size = QR Code Size Options : '1' ~ '8'(Default : 3) level = Error Correction Level Options: '0' ~ '3' (Default: 0) data = 2-D Symbol data • Example bgtWebPrint.makeQRCODE({data:'http://bixolon.com',model:'mod2',size:'3',level:'0'}); |
Paper Cut
The API makePaperCut used to print paper cut.
• Syntax var makePaperCut (cuttype) • Parameters cuttype = Paper Cut Type Options :'feed','nofeed'(Default : feed) • Example bgtWebPrint.makePaperCut({cuttype:'feed'}); |
Make Cash Draw Kick Out
The API makeDKout used to manage Cash Draw Kick out information.
• Syntax var makeDKout (connector, duration) • Parameters connector = Cash Draw Connector Pin Options : 'pin2' , 'pin5' (Default : pin2) duration = Pulse time Duration milliseconds : '50','100','150','200','250','300','400','500' (Default : 200) • Example bgtWebPrint.makeDKout({connector:'pin2',duration:'200'}); |
Internal Buzzer Sound
The API makeBuzzer used to make internal buzzer sound.
• Syntax var makeBuzzer () • Parameters none • Example bgtWebPrint.makeBuzzer(); |
Print Direct I/O Command
The API makeCmd used to print Direct I/O Commands.
• Syntax var makeCmd (command) • Parameters command = ESC/POS data command in Hexadecimal (excluding 0x) • Example bgtWebPrint.makeCmd("1d 28 4c 06 00 30 45 30 30 01 01"); |
Printer ReInit
The API makeReinit used to reinitialize the printer settings.
• Syntax var makeReinit () • Parameters none • Example bgtWebPrint.makeReinit(); |
Get Connected Printer List
The API getDeviceList used to get the printers device ID information, which are connected with B-gate.
• Syntax var getDeviceList (ipAddr,shopID, ListInputBoxID); • Parameters ipAddr = Represents the designated IP Address WebApp Print : its B-gate IP Address Cloud Server Print : Its Cloud IP Address shopID = Represents the designated Shop Name. ListInputBoxID = Represents the HTML Input Item ID name (where you want to display the device list information) • Example <In your html file> <!DOCTYPE html> <html> <head> …. <script type="text/javascript" src="js/WS_parser.js"></script> <script type="text/javascript" src="js/bGateWebPrintAPI_WS.js"></script> …. </head> <body> … <select id="devicelist"> </select> </body> </html> <In your js File> var ipAddr = "192.168.0.100"; var shopID = "BGATE_SAMPLE_SHOP"; var ListInputBoxID = "devicelist"; bgtWebPrint.getDeviceList (ipAddr,shopID, ListInputBoxID); |
Get Shop List
The API getShopList used to get the Shop ID information. In WebApp Print, it will get the B-gate Shop ID Information, However in Online Order print, it will get the all the shop ID, which are registered to Cloud Server.
• Syntax var getShopList (ipAddr, ListInputBoxID); • Parameters ipAddr = Represents the designated IP Address WebApp Print: B-gate it’s B-gate IP Address Cloud Server Print: It’s Cloud IP Address ListInputBoxID = Represents the HTML Input Item ID name (where you want to display the shop list information). • Example <In your html file> <!DOCTYPE html> <html> <head> …. <script type="text/javascript" src="js/WS_parser.js"></script> <script type="text/javascript" src="js/bGateWebPrintAPI_WS.js"></script> …. </head> <body> … <select id="shoplist"> </select> </body> </html> <In your js File> var ipAddr = "192.168.0.100"; var ListInputBoxID = "shoplist"; bgtWebPrint.getShopList(ipAddr, ListInputBoxID); |