Adding custom functionality to Elvis 6 by using Action plug-ins

Action plug-ins are one of the ways of extending the functionality of Elvis. They make it possible to extend functionality in the Pro client and Brand portal by letting them open HTML pages while retaining certain context specific information. These plug-ins can be used by clicking custom buttons and menu's that are added to the interface.

The plug-in page can be a static HTML page hosted inside the Elvis plug-ins folder, but it can also be a PHP, ASP, JSP or other page hosted on a different server.

This section contains a couple tips and tricks to get you started.

Sample plug-ins and code samples

The easiest way of getting insight in how plug-ins work, is to review some of the sample action plug-ins. There are developer code samples and ready to use plug-ins available:

• Developer plug-in samples: <Config>/plugins/samples/code_samples/action_plugins
• Sample action plug-ins: <Config>/plugins/samples/action_plugins

You can see how they work and how they are configured. They are open source, so feel free to use them as the starting point of your own plug-in.

There are quite a few simple and easy to understand samples like hello_world and search_in_getty showing the basic possibilities of plug-ins. There are also technically more advanced samples like print_contact_sheet and search_other_elvis.

Configuration

The action plug-in configuration determines the characteristics of your plug-in, make sure you read through Action plug-in - configuration before you start developing.

Client context information

Context information such as the currently selected assets or folders and information about the logged in user, is passed to the plug-in page via the elvisContext plug-in. The context is a vital part of almost any action plug-in and makes it possible for your code to act on the current state of the Pro client.

Elvis API

The context information on selected assets and folders is limited. So plug-ins are often developed in conjunction with the Elvis API to retrieve extra information such as metadata, original files, previews, etc.

A lot of user interface components are available through the JavaScript libraries, like showing a list of thumbnails, asset previews, facets and many more. Using them makes it really easy to quickly build a plug-in UI.

Test and debug environment

We advise you to use an external web browser for plug-in development and testing. This way, the browser's debugging tools can be used for debuggine HTML, CSS and JavaScript. Test the plug-in in the client after the development process is completed.

One common issue when developing plug-ins that reference html, css or js files from your plug-in folder is that the Elvis Pro client tends to 'cache' your css and js files. To ease development, add the following to your Elvis server config:

preventBrowserCacheForServedFilesOfType=html, htm, css, js

Also check out the debug plug-in, this is a great tool during plug-in development.