Adobe Creative Cloud

February 18, 2016 /

Adobe CEP Extensions, and developing add-ons for Audition

With the CC 2015.1 release of Audition, we implemented support for third-party integration via the Adobe Context Extensibility Platform (CEP).  This technology allows anyone with some HTML and JavaScript know-how to build integrated panels that extend or supplement the functionality of Adobe applications, offer access to third-party and web technologies without leaving the applications, and allow those services to share Application data and files back-and-forth.  There are already over 1600 addons available for Adobe desktop applications such as Premiere Pro and Photoshop.

Technology partners such as Pop Up Archive have already published extensions for Audition which can be easily installed by ensuring File Sync is enabled in your Creative Cloud Desktop application.  But I wanted to make sure something was available for everyone who downloaded the update of Audition, and so I spent some time working on a simple panel to help users find some of our favorite sites and tools.  The Adobe Audition Portal extension was born!

The Adobe Audition Portal extension can be found in the menu bar under Window > Extensions.

The Adobe Audition Portal extension can be found in the menu bar under Window > Extensions.

This portal provides fast links to our user forums, bug report form, blog, as well as downloadable content.  You folks sure like downloadable content!  By far the most visited link is to our library of over 10,000 high-quality, royalty-free sound effects, followed closely by visits to the Adobe Extensions marketplace.  If you have suggestions for additional links or updated content you’d like to see, please click the User Feedback button in the portal and send your comments!


 

If you’re not interested in what it might take to build a custom panel of your own, please feel free to quit reading and do something special just for you!  For the rest of y’all, I’ll share some of the journey and lessons I had building this panel.

A CEP Extension is essentially a native panel in an Adobe application which hosts an embedded Chromium browser which can host standard HTML 5, Javascript, and Node.js sites.  An additional JavaScript library enabled communication between the JavaScript code and the commands and metadata exposed by the host application, as well as issuing commands in Adobe’s native ExtendScript language.  ExtendScript is essentially JavaScript with a few additional commands.  I won’t go into details here, but for more information, please visit the Adobe CEP Getting Started Guide or start on the Audition Developers Network page, which includes resources for CEP development, as well as SDK’s for our file format, multitrack session, and control surface libraries.

Initially, I had hoped to build a navigation bar where each linked webpage would load in an iframe below.  This proved to be untenable as XSS (Cross-Site Security) issues prevented pages or elements from loading properly.  After trying many different approaches, I resigned to simply launching each link in the default browser.

I also wanted to be able to update the content of this panel as-needed, without requiring users to update.  In this case, I host the content on an internal Adobe server to which I have access and is secure and reliable, and the local files simply perform a JavaScript-redirect when loaded.  In case of network problems, there is an internal backup which can load, but overall the panel is of little value without connectivity.  As Audition ships in many languages, I needed to make certain the portal language reflected the installed settings.  All my strings are stored in a JSON object, with the localization for each language code wrapped inside an element ID.  Using ExtendScript, I am able to query Audition for the installed language and automatically display the correct text strings.

For users with existing web services who may wish to develop an in-app interface, it may be far simpler than you expect.  As above, a JavaScript-redirect to your own hosted server provides the ability to push changes quickly and easily, without the delays of updating to the extension marketplace and hoping users update when prompted.  The user of URL variable flags can be used to trigger the loading of additional libraries, including the necessary support libraries for CEP support, and add functionality only if the server detects the visitor is within a panel.

If you have any further questions about the Audition Portal extension, or developing your own extensions, please feel free to leave a comment on our blog, or visit our Audition Developers forum online.

Join the discussion

  • By John - 5:10 AM on February 19, 2016  

    Hi, Can you explain the difference between CEP extensions and the phased out extensibility manager mentioned here https://www.adobeexchange.com/resources/27 please?

    • By Durin Gleaves - 12:50 PM on April 13, 2016  

      The Extensibility Manager was an application that managed installation of extensions and addons. Now deprecated, most of the functionality has been shifted into the Creative Cloud desktop application. CEP Extensions themselves are the plugins and addons, and are independent of the method used to download and install them to a local computer system.