In our last Tech Monday edition, we introduced the concept of JavaScript applied to the Print market. We have received a lot of positive feedback. However some people told us that a real demonstration could help for a better understanding. Indeed, what’s the point of JavaScript when your flow is already working fine without it ? So we have decided to come back this week with a real example. Indeed, you can download the tool at the bottom of this article.
As for today, we will use pdfToolbox But we will cover other products such as Enfocus Switch or Adobe InDesign in following articles. Callas Software’s documentation already exposes JavaScript Applications We wanted to cover something new, that would make JavaScript really obvious. But obviously, we didn’t want to disclose what we have done for our customers. Eventually, we think you will enjoy this utility. Please let us know in the comments 😉
The Project
So, here is the thing. You are a printer. You want your colleagues to quickly spot prints that need to be delivered urgently. Of course, prints today have barcodes with all information you need. However, one needs to scan prints one by one. So, how could you notice quickly and easily urgent jobs?
Here are the icons we will use.
What if an icon could let you know? What if a message let me know about the delivery date?
That’s a good study case for JavaScript!
Variables
You can set two types of variables with pdfToolbox:
- Simple variable: An operator or a systeme sets a value with no specific logic
- JavaScript Script: value is set after a script is evaluated
Here we chose to use a simple variable because it’s just about the type of delivery But be sure we will widely use this varioable later!
Setting variables in pdfToolbox
Place Content
This is the main part. “Place Content” is available in Callas pdfToolbox fixups. You can place elements on top of the active document. It uses a HTML/CSS/JS template. The latter will be converted to PDF and placed into the document. As a matter of fact, pdfToolbox includes a HTML to PDF Conversion Engine also known as Callas pdfChip. We use Place Content Fixup to place our pictos at the right location. For the little curious, you need to extend the PDF mediabox here.
“Place Content” fixup allows to
add elements onto the page thanks to a HTML template.
You really need Javascript here! Indeed, you need to know which picto to display regarding to delivery type and where to position it. A web developer may be surprised by some peculiarities of the HTML/PDF engine. For example, you can use PDF documents as src attribute for img tags. Or you can set CMYK colors with specific instructions.
Thanks to these features, we can insert our pictos as native PDF files and fill our texts with a compliant color.
JavaScript for dummies
Insert pictos is no big deal so we wanted to put the bar higher. We wanted to display the expected delivery date based on the preflight date and the delivery type. There is more! As we intended to share this for the great majority, we wanted it to be localized. In short, advanced logic only JavaScript could achieve.
Once done, icon and message appear just fine!
Callas pdfChip is built on Chromium. With rares exceptions, pdfChip will do whatever you cand doo with a Chrome browser. To save some effort, we can load the Moment.js library. Then we have all advanced date processing at hand.
Moment.js library allows advanced dates processing!
Once loaded, we can call this library’s methods. Eventually we get a sweet formatting of dates in combination with delivery type and locale!
Give it a try!
Try it, it’s free! Download Callas pdfToolbox profile (V10 compatible, not Acrobat at this time). We can wait for your feedback. Feel free to comment. Any questions? Fill in the form aside!
See you soon!
