Printing on POS from Angularjs client - javascript

I have developed a token dispensing system (web based POS) with key component being a kiosk screen with angularjs on the client side and Java/Springs on the server side. The kiosk setup would be a normal (Win OS) Google Chrome browser window running on full screen mode, fitted with a thermal printer to print token slip.
The kiosk will dispense a token slip when the user clicks on a button (say 'Get Token') on the screen. The slip will contain a token number, a barcode and other miscellaneous info (like timestamp and kiosk id). The barcode has to be generated from the data I get from server side API call.
What I am looking for is a solution to silently (without print preview) print a token slip on the thermal printer connected to the client (kiosk) when the user clicks on a button on the kiosk screen.
Creating an iframe on-the-fly or binding values to a pre-defined html template is not helping since the data to be printed is not just plain text. It also has the barcode.
Any help would be much appreciated!!!

I haven't try completed solution as your demand, but you can try 2 separate steps below:
From server side API, you should generate an PDF for exactly
expectation print version as you want (mPDF is my best
recommendation) .
Disable print preview mode in google chrome with start up parameter "disable-print-preview"
(make your own shortcut at the desktop to run Chrome without print
preview mode. Then using javascript to do the print like you did
with iframe or new window.
PS: a good tip for a shortcut from techlogon: http://techlogon.com/2012/03/29/how-to-disable-print-preview-in-chrome/

Related

How to mirror an HTML page on web and mobile in realtime

I am trying to create a project where i can mirror text written on a web page in a browser to reflect in a mobile version on the same page.
I thought i'll use query params to create a chat room like scenario wherein he can key in a message on a web browser in a PC and that will reflect on the same chat room in the browser but it's not working.
Any idea on how i can accomplish that?

How to print webpage via FGL printer (Boca System)

I working on website for ticketing system where admins need to print tickets via Boca printer. Problem is that Boca use FGL (Friendly Ghost Language) which is a standard in ticket printing.
Is there some kind "secret" where I can be connected, some javascript, or PHP code with some BASH script what I can use to trigger prnting from web page?
Generaly I have a template in HTML format where I put user informations and barcode dynamicly and that need to be printed.
Thanks.
If your Boca is connected via a serial port you would have to resort to some underlaying mechanism to communicate to this serial port from a webpage; node-serial (or a java applet if you're into obsolete technologies) would be a solution.
The programming manual is available here for printing a simple text and cut the ticket you would pass the following command:
Hello World<p>
(replace <p> by <q> if you don't want it to cut the ticket)
If your Boca is connected via USB you can print on it via the supplied driver. A solution would be to generate a PDF with the correct ticket's dimensions and then print it out (the user would see the OS print dialog).

Javascript to print with wifi printer

I´m making a simple webapp, I want that when it is open in mobile phones print some data using the user´s wifi printer which most of cases will be an Epson L355.
Can anybody give me a clue or sample to achieve this?
Thank you all.
You won't be able to do this because you don't have access to the user's printer. Instead, you can just generate a pdf and redirect user on it.
The user will then be able to download / print the pdf via his inline PDF viewer.
You can do it by following this :
How to force files to open in browser instead of download (pdf)?

Silently print PDF on Google Chrome

i'm developing a Ruby on Rails application and i trying to print a PDF in silent mode, in the words, after user press print dialog confirmation, the application get the default printer and send it.
One of my options, is create a Google Chrome extension, that user can manage the printer and size of paper and etc, only once. And all time that user want to print a PDF the extension send it silently to the default printer.
So, how can i do this extension?
There's any way to manage user print config with js?
There are a better way to do that?
Thanks.

Printing Receipt from Django Web Application

I am developing a web-based POS. Unfortunately, POS must print through a thermal receipt printer (TM-T88IV, Epson). The web application is based on Django. Is there any idea on how the system could automatically print a receipt whenever a user clicks a control in the web application?
I was thinking of creating other services in python for that purpose, but that would defeat the purpose of having a web application, where all you need is a browser, without any extra installation.
The printer is connected to the client by the way, and the printing should be "silently" triggered, which means that there is no need for human intervention. Once the transaction is finalized, the printing should starts.
Any suggestion is welcomed!
I see two ways to accomplish it:
First method - Configure your browser
Notes
Good solution if you have one printer for every client (because you can use the default printer only). Keep in mind that you can remove your print server (useful for very resource limited devices) making a script that the browser should automatically execute for open your file. You can use something like this:
#!/bin/bash
printer="/dev/usb/lp0"
encoding_needed=true #false
if $encoding_needed; then
iconv -c -t 437 $1 > $printer
else
cat $1 > $printer
fi
Firefox
Manual setup:
Open about:config
Create a new boolean value called print.always_print_silent and set it to True
Create a new boolean value called print.show_print_progress and set it to False
Use an extension, like: https://addons.mozilla.org/en-us/firefox/addon/attendprint/
Keep in mind that there are other extensions for making kiosks, for example:
https://addons.mozilla.org/en-us/firefox/addon/r-kiosk/
https://addons.mozilla.org/en-us/firefox/addon/mkiosk/
Chrome
You can start it with those options: --kiosk --kiosk-printing
Internet Explorer
For kiosk mode see: http://support.microsoft.com/kb/154780
Second method - Server handles every printer
Notes
Good solution if:
You have more clients than printers (few money or faulty printers)
More printers than clients (different printers or paper colors for different needs)
Clients that can't print directly (PDA/smartphones)
You want to know the printer status
How to do
Connect printers (to the clients and/or to the server)
Share printers connected to clients over the network
Manage every printer from your Django server
Two options here: print an html page or provide a PDF file.
Note: it was not clear initially that prints should be automatic, which means the answer is not directly useful to OP.
HTML + "Print Me"
Show the receipt as an html page, then create a media="print" CSS stylesheet which the browser will use when printing the receipt. There's a lot to say about CSS print style sheets, but what's important is that you should remove all navigation elements and images that are going to be expensive to print.
When you do this, the user will simply have to print the page himself. You can also add a "Print Me" button which is going to show your user a printer dialog. This is done via JavaScript:
Print this page
(This is a bit obstrusive for your clients who don't have JS, check this tutorial about JS printing for a better way.)
PDF
Generate a PDF in Django, and show it to the user. He will be free to print it or save it on his computer later. Most web sites do this since it's far easier to control the layout of a PDF file, and it will be easier to make it look like a real receipt.
XSL-FO can help you do this (it translates an XML to a PDF with a "stylesheet").
A more Pythonic way seems to be explained in the Django docs
The above pages lists alternatives such as xhtml2pdf (Pisa) which seems to be used a lot on StackOverflow
If using raw/esc/p try jzebra on google code.

Categories