James Lockman's Technical Blog

Posts tagged "JavaScript"

I have been asked many times over the years about Color Settings and how to synchronize them. Most people use Bridge’s Synchronize Color Settings tool, found at Edit>Color Settings…, but there are cases where organizations want to ensure that all workstations have the same Color Settings. It is possible to install a script that will set the Color Settings to a specific value. In this article, we’ll learn how to set the Color Settings in Photoshop, Illustrator and InDesign.

Photoshop, Illustrator, InDesign and many other CC desktop applications are scriptable using Javascript. You can launch scripts from the applications’ Scripts menu, or you can trigger scripts via events. In this case, we’ll use the Startup event. InDesign and Illustrator have Startup Scripts folders, and each will execute any scripts you put there when they start. Photoshop has an event manager that lets you attach specific scripts to events, such as startup or document open. We’ll look at the scripts first, and then we’ll see how to activate them.

The script

I’ve prepared a script that works for Illustrator, InDesign and Photoshop, which we can do by detecting which application is running the script. For InDesign and Photoshop, we need to set the value of an application property to set the Color Settings file, and for Illustrator, we need to call a function to set the Color Settings file. For InDesign and Photoshop, the property will be the name of the Color Settings as shown in the Color Settings dialog, so you will need to open a CC desktop app and choose Edit>Color Settings… in order to see the name of the Color Settings file you want. For Illustrator, you need the name of the .csf file. For this example, we’ll use “North America Prepress 2,” which is a built-in Color Settings file that ships will all CC installations, and which is included as “North America Prepress.csf” in all CC installations. If you make a custom Color Settings file, you will need to make note of its file name and the name that shows in the Color Settings dialog.

The property we need to set in Photoshop is called app.colorSettings. In InDesign, this property is called app.colorSettings.cmsSettings. In Illustrator, we need to call the app.loadColorSettings() method with a pointer to the specific file we want to set as the Color Settings. The script below tests for which host application and selects the proper method for setting the Color Settings. View SetColorSettings.jsx on gist.

Installation and activation

As seen below, you can create a folder in the InDesign and Illustrator application folder for startup scripts. For Illustrator, make a folder called Startup Scripts in the application folder. For InDesign, there should already be a folder called startup scripts in the Scripts folder. Create these folders in Illustrator and InDesign, and copy SetColorSettings.jsx into the two Startup Scripts folders.

Startup Folders in AI and ID

Photoshop requires additional steps, rather than just making a Startup Scripts folder. Choose Edit>Scripts>Scripts Events Manager… to open the Events Manager. You’ll need to activate Events, so click on the box to Enable Events to Run Scripts/Actions.

Script Events Manager

Once activated, you can browse to your script to attach it to the Start Application event. Make sure that Start Application is selected in the Photoshop Event menu, then click on the Script dropdown menu and choose Browse… Browse to your script, which could be one of the versions stored in one of the Startup Scripts folders from AI and ID. Select it, Click Done, then click Add to register the event. Click Done to finish setting up the startup event.

Script Events Manager

Under the hood, Photoshop has created files called Script Events Manager.xml and tw0001.dat that are stored in the Photoshop Settings folder in the user’s Preferences folder. You can create these files by hand, too. The xml file is just a list of registered events and additional scripts that will appear in the menu. The .dat file is the specific scripts that will run based on the event having fired.

Once you have the scripts installed, each time you start Photoshop, Illustrator or InDesign, they will automatically set their Color Settings to North America Prepress 2.

For many versions, Adobe Experience Manager has included support for parsing InDesign documents via InDesign Server. AEM admins could use pre-built workflow steps to send an InDesign document or InDesign Snippet to InDesign Server along with a set of scripts that InDesign Server would execute against the payload. It was possible to execute multiple scripts in sequence on the same payload, which was handy but not particularly efficient as it would invoke InDesign Server as many times as you had scripts in the workflow. In AEM 6.3, the workflow component matured to make the workflows more efficient, and to include a set of functions that help InDesign Server access content in AEM and to post output documents back to AEM for further processing. In AEM 6.4, the workflow component added a configuration to permit any MIME-type as the payload for InDesign Server, opening up a whole new set of use cases for AEM and InDesign Server.

Scripts Deconstructed

The InDesign Server workflow component is called Media Extraction. It began life as a way to extract the text, images and metadata from InDesign documents, and it’s a core part of the built-in DAM Update Asset workflow today. Media Extraction has a lot of power as a workflow ingredient, however, if you know how to use it. Let’s explore how the Media Extraction workflow component works in AEM 6.4.

Media Extraction works by sending a payload to InDesign Server, consisting of a document and a script that InDesign Server executes on the document. As stated above, earlier incarnations only allowed the payload to include an InDesign Document (.indd) or InDesign Snippet (.idms), but 6.4 lets us send any document, as long as it passes our MIME-type filter. You can specify the MIME-type in the Process Arguments section of the workflow step. It helps to know the MIME-type of your content. You can use one of the many resources online to help identify common MIMI-types, but you may want to upload a file of the desired type to AEM and then examine its /jcr:content/metadata/dam:MIMEtype node to see what AEM thinks it is.

Specify the allowed MIME types for your scripts. The default is InDesign and InDesign Snippet.

You will also need to send a script that can process the payload and return the resulting file back to AEM. The Media Extraction workflow component reads and sends .jsx files, which contain the actual script code, to your InDesign Server. The built-in scripts are located at /libs/settings/dam/indesign/scripts/ and you should not move or change them. You can copy them to /apps/settings/dam/indesign/scripts/, or leave them in place and put your own scripts in /apps/settings/dam/indesign/scripts/. The critical thing to know is that the .jsx files are actually script fragments, and that they are designed to be concatenated into one script at runtime.

Scripts are concatenated from top to bottom in the list of scripts specified in Process Arguments

There are four sections in Process Arguments: ExtendScript Library, Init Script, Extend Scripts, and Cleanup Script. It is not recommended to modify the ExtendScript Library, located at /libs/settings/dam/indesign/scripts/cq-lib.jsx, as it provides important functions related to processing the inbound payload and to returning the resulting file back to AEM. Read and understand the helper functions provided by the ExtendScript library; you will be glad you did.

If you look at the default Init Script, located at /libs/settings/dam/indesign/scripts/Init.jsx, you’ll see that it contains an unclosed try {. This try { encloses the scripts indicated in the Extend Scripts section, and it closes in the Cleanup Script, located at /libs/settings/dam/indesign/scripts/Cleanup.jsx It continues with a catch{}, as expected, for error handling. This means that each of the Extend Scripts can leverage the work done and functions defined by the preceding scripts, including the ExtendScript Library and the Init Script, as the workflow component will combine the jsx files into one before sending the single, combined script to InDesign Server.

If you do not specify an Init Script and a Cleanup Script, the Media Extraction component will use the default scripts. Study these two scripts to see how to prepare to handle the inbound payload, how to process errors, and how to clean up the temporary files mess left during your processing. It is a good idea to use the existing Init.jsx and Cleanup.jsx files as the starting and ending points for your solution, so make copies (and name them something that stands out!) in /apps/settings/dam/indesign/scripts/ and modify those for production.

Example, please

Let’s look at an example called IDSBasedThumbnails, that you can download and install from github. The package contains the scripts and a workflow model, which performs the following actions on PDF, AI, PS or EPS files:

Sends the file to InDesign Server as a payload

Places, scales and centers the document on a new InDesign document

Exports the new document as thumbnails (PNG and JPEG)

Puts the exported files back in the repository at /jcr:content/renditions/

Wipes out the debris and closes InDesign Server

You might be asking why would anyone want to do this? Well, it turns out that AEM doesn’t have native rendering for EPS files, and the default DAM Update Asset workflow uses ImageMagick to generate previews from EPS files. I thought that it would be better to use InDesign Server, as it can handle not only EPS files, but also PDF, AI, PS and a whole set of other asset types. In addition, InDesign can simulate overprints and flatten complex transparency during the export, which makes it a very accurate way to deliver color-managed previews for assets used in printing processes. Think of packaging, where there’s a lot of use of overprinting varnishes and spot colors. Also, InDesign Server is super fast at making these renditions, operates as a dedicated image processing server, and can scale to meet demand without impacting the AEM Server. Let’s dig in to the workflow and see some example output.

MIME-type and ExtendScripts for making thumbnails with InDesign Server

As you can see above, we have many allowed MIME-types to cover the various assets we want to preview. If you try to run the workflow on a Word document, it will not work, as it won’t pass the initial MIME test. We’ve left the ExtendScript Library alone, but we’ve made new Init.jsx and Cleanup.jsx files that focused specifically on non-InDesign documents as payloads. The bulk of the work happens in EPSThumbnailExport.jsx, and we’ll highlight some of that script here.

The function called exportThumbnail() does the most of the work, and there’s a helper function called myGetBounds() at the end that returns the dimensions of the rectangle contained within the margins of the page. I’ve not included that below. Also, I’ve included comments to help explain what each of the sections of code is doing. Know that many of the inputs of the exportThumbnails() function are defined by the ExtendScript Library and the Init Script, which is why those are so important to read and understand.

Once this script completes and all of the images have been written back to AEM via the putResource() calls, the Cleanup Script runs.

The result of this script is that all of the thumbnails for the specified Asset in DAM have been replaced with new thumbnails generated by InDesign Server. Here are some before and after images to give you an idea of the difference and why this model could be useful.

Here are two EPS files and one PDF uploaded to DAM. ImageMagick preview has failed to generate a preview of the EPS files, and the PDF file shows no overprinting.

In order to run the workflow, you need to have InDesign Server installed, running, and your AEM instance needs to be configured to use InDesign Server. You can either open the workflow called DAM Update Asset with IDS Previews and run it on an asset from the Workflows panel, or you can open an asset and choose Run Workflow from the bottom of the Timeline panel for a specific asset. As configured, the workflow can’t run on a folder, since the MIME-Type filter doesn’t pass folders, so you need to run it one at a time on each asset. When you do, you will see the following result, and pay close attention to the difference in the PDF thumbnail:

Once the workflow generates previews, the new thumbnails replace the existing thumbnails with color accurate, overprint-simulated previews.

The PDF thumbnail now properly respects the overprint settings in the PDF, as well as in the EPS file. This is critical in managing assets that are designed to support print workflows that make use of overprinting and multi-ink composite colors, such as packaging and book covers. You might be wondering about why the previews for the CMYK Overprints.pdf and CMYK Overprints.eps are cropped differently. This is due to the way that InDesign interprets artwork boundaries when it imports assets. InDesign uses the page boundaries as defined in the EPS file when placing onto the page. PDF files can and often do have a number of boundaries available. InDesign, by default, will select the Bounding Box (Visible Layers Only) if it is available. This box is defined by the authoring application and typically exactly bounds the edges of any visible objects on the page as determined by layer visibility. You can learn more about PDF Bounding Boxes at this InDesign Secrets article.

InDesign defaults to the Bounding Box (Visible Layers Only) when importing PDF. You need to adjust the import preferences in your script if you want to change the default PDF import behavior.

The bounding boxes constants are: PDFCrop.cropPDF, PDFCrop.cropArt, PDFCrop.cropTrim, PDFCrop.cropBleed, PDFCrop.cropMedia, PDFCrop.cropContentAllLayers, PDFCrop.cropContentVisibleLayers. You can add a line before myImageFrame.place(sourceFile) to change the behavior to match how InDesign imports EPS files:

app.pdfPlacePreferences.pdfCrop = PDFCrop.cropMedia;

If you make the change, you will need to save the JSX, then reimport the JSX to your workflow, then re-sync your workflow in order for it to become available. Importing the JSX can be a confusing step, so let’s discuss that briefly. The built-in asset browser for JSX files doesn’t let you select a JSX from the file tree. It’s a known issue and it will be fixed in a later version of AEM, but for now, the Search bar is your best friend. Just enter the name of the JSX you want to import, and it’ll appear in the search results. Select it, and you’re all set.

Use the Search bar to reimport your modified JSX to the workflow step.

Once you re-import the JSX, the change is automatically saved to the workflow, but the workflow needs to be synced to become active. Once you tap the Sync button, you’re ready to go.

Be sure to tap Sync after updating the workflow step.

After you update the JSX and re-sync the workflow, the PDF and EPS thumbnails will be similar.

You could also modify the DAM Update Asset workflow to remove ImageMagick and/or the built-in PDF renderers and replace them with a new step. You would likely want to expand the script to handle multi-page PDF and AI files, however. If you’d like to explore this option, here’s a great starting point from Mike Edel for importing multi-page PDF and AI into InDesign via scripting.

Conclusion

Being able to use InDesign Server to generate better previews for EPS and PDF and AI files is a nice new benefit of the new MIME-type options in the Media Extraction workflow. This is a relatively trivial example of what a developer can do with this new capability, however. You could create a workflow that sends a whole package of items to InDesign Server, which would do some action on those items, and then return a new file or other data to AEM. Integrators can develop new editorial and creative tools based on this new capability to enhance existing inDesign documents or create entirely new ones from scratch. We hope you will be inspired to add more InDesign Server to your AEM Assets workflows.

Many of my Enterprise customers ask how they can use Adobe Experience Manager (AEM) to automate the production of common derivative files from their InDesign files. Derivative files, you ask? InDesign files often represent the “source of truth” for many business documents, from manuals to data sheets to publications and many more types. These documents must be transformed from InDesign into something else (hence the term derivative) in order to be made available on a web site, for instance. The usual method is to export a PDF from InDesign and then upload the PDF as a new asset into the repository. This puts added burden on the author of the InDesign file as well as introducing the possibility of error due to incorrectly set PDF job options. This gets even more complicated if the author must make versions suitable to send to a commercial printer as well as a version that’s optimized for reading online as a PDF. This article provides techniques to automate the production of a web-optimized and print-optimized PDF from any InDesign file that appears in AEM Assets.

This article assumes that you have access to Adobe Experience Manager Assets and InDesign Server. In this example, I use AEM 6.1 and InDesign CC Server 2015, but the technique should work with AEM 5.6.1 and higher and ID Server CS6 and higher. You need to ensure that you have configured your AEM Author environment to work with InDesign server according to the documentation found here. The foundation of any successful integration (beyond configuration!) is the combination of Scripts, Workflow Models, and Workflow Launchers.

You can download a package that contains the scripts and a workflow model you can use today. When you install the package, you will have new scripts located at /etc/dam/indesign/scripts and /etc/workflow/scripts. You will also see a new Workflow Model located at /etc/workflow/models/dam/. The Workflow Launcher must be reconfigured, since I didn’t want to disrupt your existing workflows after you install the package.

Scripts

Scripts tell AEM or external applications what to do, and they form the basis of any InDesign Server-based solution. There are two sets of scripts used here: one set for InDesign Server to generate the PDFs and the other for AEM to move the resulting files. First, let’s look at the JavaScript to tell InDesign Server what we want it to do and how we want it to respond to the request.

There are a number of InDesign Server scripts included in the basic AEM installation, and I’ve modified /etc/dam/indesign/scripts/PDFExport.jsx to request specific kinds of PDF from InDesign Server. In addition, the script writes the new PDF files into the InDesign file’s /renditions node. These two scripts are located at /etc/dam/indesign/scripts/PDFExport_Print.jsx and at /etc/dam/indesign/scripts/PDFExport_Web.jsx. I could have easily combined these two operations into one script, but I wanted to leave you the option to easily enable or disable each one according to your requirements. You can also combine them yourself or make them fancier, responding to properties you set on the InDesign file in AEM (via XMP) and read out with InDesign Server. Here is the code for PDFExport_Web.jsx, which is almost identical to PDFExport_Print.jsx. The difference is in the value of pdfExportPreset in line 31, the filename set in line 56, and the function return value set in line 57.

To use these scripts, you need to have a PDF Joboptions file installed in InDesign Server to export your PDF. When you install the package, you will find a new folder at /content/dam/InDesign Server joboptions that contains two PDF Export Presets for InDesign Server. Move these two files to Applications/Adobe InDesign CC Server 2015/Resources/Adobe PDF/settings/mul and then restart InDesign Server to load the new settings.

Now that we have the InDesign Server pieces in place, let’s look at the AEM script. This is an ECMA script, which is very much like JavaScript, and it’s located at /etc/workflow/scripts/move-pdf-renditions.ecma. I’ve written it as a function that’s called twice, once for each PDF rendition, so it’s easy to add or remove other renditions as you see fit. This script will be called from the Workflow Model, which we’ll look at next. Here’s the script code.

Workflow Model

There will be a new Workflow Model in your Workflows list called DAM Update Asset with PDF move located at /etc/workflow/models/dam/update_asset_pdf/. It is similar to and derived from the standard DAM Update Asset workflow that comes with every AEM installation. I have changed one existing step (Media Extraction) and added a new step (a Process step called “Move PDFs from Renditions”).

These two workflow steps are different from the standard DAM Update Assets workflow

The Media Extraction step is designed to convert InDesign documents to other formats required by AEM Assets for a number of key functionalities. These include generating sub-assets (images that are embedded within the InDesign file), page images, extraction of text, and metadata synchronization, among other things. Media Extraction sends the script (and a pointer to the InDesign file) as its payload to InDesign Server. InDesign Server then runs the script and returns something to AEM. It is important that you do not remove any of the existing scripts that Media Extraction launches, but you can always add additional steps. Here, we added two additional scripts to the workflow step: PDFExport_Print.jsx and PDFExport_Web.jsx

The Print and Web PDF Export scripts have been added to the Media Extraction Workflow Step.

Immediately after Media Extraction, I added a new Process step that executes an ECMA script in AEM. For many users, they will access AEM Assets via their desktop using the AEM Assets Companion tool or the Creative Cloud Desktop tool, so this workflow ensures that they get the renditions they need in a place that’s easy to find. Also, users of AEM Assets will be able to search for these PDFs like any other asset under management. This script copies the PDFs from /renditions as new assets adjacent to the InDesign file. It is best to leave the PDFs in /renditions so that they can be used by components that might offer the PDF as a download, for instance.

The new Process step executes an ECMA script that copies the new PDF files so that they are accessible on the desktop.

Workflow Launcher

Lastly, it is necessary to change the Workflow Launcher that is triggered whenever a file appears in the repository or whenever a file is modified in the repository. I did not include this change in the package so that you can install the package with no impact on your running system. When you are ready and have tuned the scripts for your workflow, then you can enable the Workflow in the Workflow Launcher panel.

The Launcher is designed to run a workflow when a specific condition is met. This workflow looks for any file that appears in the repository and then runs the DAM Update Asset workflow on it. You need to change the workflow to DAM Update Asset with PDF Move and then Save the changes.

Change the workflow that is triggered by the Launcher

Once you’ve saved the Launcher, you are ready to test. Upload an InDesign document into AEM using your preferred method. You can use drag and drop in a Browser window, AEM Assets Companion, or CC Desktop Tool. If you happen to catch the InDesign Server console, you will see new entries that report on whether IDS was successful at exporting PDF renditions. In a short while, your new PDF files will magically appear next to the InDesign file. Now, go ahead an edit that InDesign file and save it back to AEM Assets. Again, the workflow will run and new PDF files will replace the existing ones, ensuring that you always have access to the latest versions. And, since they are assets under management, you can always revert to earlier versions of the PDF by looking at the asset timeline in a browser.

Conclusion

This new workflow and the scripts that support it expose a new behavior for AEM Assets. While convenient for the user, since it automatically generates useful and necessary derivatives of the source InDesign asset, it enforces known good business processes by encapsulating approved PDF Export settings into he workflow. It also reduces errors by automating a task that otherwise would require several configuration steps in InDesign before they could export the PDF.

I hope that you find this useful, and that you use it as a starting point for further InDesign Server automation using AEM Assets.

Many of my DPS customers want to incorporate note taking into their DPS apps. Over the years, there have been several examples posted to DevNet, including one by me back in 2013. One of the challenges with that solution was that it requires the designer to make multiple copies of the underlying HTML file in order to support placing the note taking overlay on more than one page in an article. I have gone back and revised that code to make it work with a single HTML file that supports any number of pages in an article. You can read about the new technique here.

The new system has CSS styling to help match it to your brand. In addition, I’ve added a button to email a specific note as well as the whole set of notes. I’ve also been working on extending the system to include thumbnail images of the specific pages in the email. I’ve got a little more work to do on that before I’m ready to share it, but keep your eyes here (and on DevNet) for a follow-up article about embedding images in email messages from DPS.