My First Extendables’ Script for InDesign
November 11, 2010 | Snippets | en
A few days ago, Stijn Debrouwere has disclosed Extendables, an unprecedented open source framework for Adobe ExtendScript. So exciting! This project will interest many script developers, especially those dealing with InDesign. “If you're doing any serious scripting, Extendables will definitely make your life easier,” Stijn said. “It includes some of the newer Javascript 1.6+ Array methods like forEach, useful shortcuts/monkeypatches and modules for logging, HTTP connections and creating user interfaces.” I tested for you this yet young but already powerful scripting catalyst.
This article and the attached script briefly demonstrate how to achieve a handy Unicode Character Infos box in InDesign using various Extendables' shortcuts and modules. Although the framework isn't yet feature-complete, it already offers one of the most wanted ExtendScript add-on: a cool HTTP library that hides all that boring Socket
stuff and allows you to perform HTTP requests without effort.
So, what our sample script does is that it queries a Web service and displays a number of Unicode details about any single character that the user selects in the active Document:
You can download CharInfos.jsx at the bottom of this page. Don't forget you need to install Extendables too! (See the Extendables' documentation for further details.)
Quick Installation
Extendables is an open source project maintained at GitHub by Stijn Debrouwere:
http://stdbrouw.github.com/Extendables/.
Download the most recent release and unzip the entire package within your scripts folder, usually somewhere like Scripts Panel/extendables/
. In fact you can drop the Extendables' package anywhere, provided that your script properly points out to the main extendables.jsx file using a valid relative path in the #include
directive (thanks to Stijn who immediately fixed an issue in this regard):
// At the beginning of your script: #include 'relative/path/to/extendables.jsx' // Your script . . .
CharInfos.jsx has the following #include
directive —which you may need to adjust according to your own configuration:
// We here assume that the client script is located in // the parent folder of the 'extendables' folder: #include 'extendables/extendables.jsx' . . .
Extendables Main Bricks
The figure below shows the general structure of the framework and its most important components:
To get started, just remember that Extendables simplifies ExtendScript coding in two main ways:
• It adds functionalities to the core and DOM objects by feeding their prototype
. (Explore the patches folder to get more details; See also the “Javascript and DOM enhancements” overview.)
• It offers specialized modules that wrap complex features through simple interfaces, such as HTTP requests (http module) or ScriptUI stuff (ui module). (Explore the core-packages folder to see the earliest libraries; see also the “Packages” overview.)
Our Sample Script
CharInfos.jsx uses the http and the ui modules, and various handy object helpers provided by Extendables, like String.format()
, or Object.keys()
. I won't discuss here the minor details of the script, which by the way implements a raw HTML parser through XML. Broadly, we send an HTTP request to www.fileformat.info/info/unicode/... by formatting a specific URL which contains a character codepoint. The server then returns the HTML response (see an example of response by clicking here: www.fileformat.info/info/unicode/char/01FD/). Of course the InDesign user will not see the web page, we don't need it to be rendered in a browser. Our goal is just to grab the informations it contains.
Technically, this is the http module that manages the web request, while our code extracts data of interest. Thus, here is the skin-deep structure of the process:
#include 'extendables/extendables.jsx' // Tell Extendables we gonna use // the 'http' and the 'ui' modules: var http = require('http'); var ui = require('ui'); function parseHTML(/*str*/ htmlBody) { // Our HTML parser } function getUnicodeCharInfos(/*str*/ charStr) { // based on charStr Unicode value: var url = /* format the search URL */ // Sends the HTTP request to the server: var response = http.get(url); // Calls the parser var infos = parseHTML(response.body); return infos; } function displayInfos(...) { // Uses the ui module to // create a nice ScriptUI dialog box } function main() { car = /*getSelectedCharacter*/ infos = getUnicodeCharInfos(car); displayInfos(infos); } main();
That's it!
To go further in understanding and implementing these steps, I let you examine the (generously commented) code:
Comments
Thanks, Marc. Excellent example and explanation. Just what many of us need to get started.
Peter
This is a great help with Extendables and a very useful script in its own right. Thanks!
Great job Marc,
Isn't that a project you had in mind for a long time ? If so I am glad for you you could give birth to it.
Anyway, it teases my curiosity. Thanks to both you and Stijn for that one ;)
Thank you all!
> Isn't that a project you had in mind for a long time?
Yep! I never had the courage to implement a full HTTP client through the Socket object, but Stijn did it for us ;-)
This opens up countless possibilities in querying Web services from InDesign only using ExtendScript...
@+
Marc
what I do not understand with extendables is how you can GET a query response from a server, something like the usual HTML-form way "http://mywebsite/myfunc?myparam=123" does not work at all.
Even more I wonder if you can get something like the jQuery getJSON() function..
Thanks Marc,
great example. But I just can't get it to work - not ever the example files from Stijn.
I allways get an error: Javacript syntax row: 4 source: #include "object.conversions.jsx".
I'm running InDesign CS3 on OS X 10.6.6
Has someone the same problem?
Any hint is welcome.
Goetz
Just installed the CS5 version ( test version from Adobe)
Now all script work like a charm!
I hope Stijn Debrouwere is listening and can help!
Goetz
Thanks Goetz,
I suggest you send a bug report to Stijn through the Extendables' GitHub's page:
http://github.com/stdbrouw/Extendab...
You can also use this ID Scripting topic: http://forums.adobe.com/message/325...
As far as I know, Extendables has been tested in InDesign CS4 and CS5. Whether ID CS3 is supported, I really don't know.
@+
Marc
Thank you! really good job! good as the script to begin with!
When I run the script under CS5.5, it stops at HTTPError("Unable to get {}.".format(url));
The url works when I paste into a browser.
I am wondering whether I set it up right. Basically I copied the Extendables under the indesign script folder (user's).
I would appreciate if any one can help me with this. THanks
I have the same problem as Enni..when i run the script i get the same error..
..basically i want to ask another thing
i have implemented a web service that returns String..when i am using
var response = http.get("http://localhost:8080/WebServiceSam...");
i get from response.body :
<h2>AXIS error</h2>
<p>No service is available at this URL</p>
any ideas???
btw extendables its a great piece of work
Have you guys tried the interface from www.dbui.de? I think it takes it further by querying sql databases directly.