ScriptActions - predefined JavaScript

The basics

As mentioned before the new ScriptActions are small bites of JavaScript code which enrich your campaign by adding effects like MouseOver-effects, dynamically showing or hiding layout items or interacting with JS-APIs like Facebook or Google+.

There exists several pre-defined ScriptActions inside of the DirectSmile CrossMedia Designer which give you already some basic enrichments. You can easily drag and drop them on supported items like the following:

  • Images
  • Texts
  • Groups
  • Headlines
  • DirectSmileSets
  • Slideshow
  • Infobox
  • Selection

How to use

All you need to do is to drag & drop the ScriptAction from the left pane (figure 1) onto your item where you want to add the script. Then the ItemTree will show that there is an asigned ScriptAction (figure 2)

Figure 2: Image with assigned ScriptAction

Whenever you have a ScriptAction in focus (it is highlighted red like in figure 2) you will get the properties view in the bottom instead of the database view or error list. It should look something like in figure 3 - depending on the selected ScriptActions it will differ from amount of properties and their types.

Figure 3: Properties of a ScriptAction

Figure 1: Left menupane with ScriptActions

In our example we picked the "Cursor Hover" ScriptActions which will simply define two cursor styles when hovering or leaving the item you've assigned the ScriptAction to. By default it is set to "pointer" when hovering and "default" when leaving the item - as it is standard for most web pages.

Each item has a small description text which will try to explain its function and effect. Additionally you can go to the examples-section to look there for a more detailed description.

Editing ScriptActions

You can edit any ScriptAction which you have placed in your design tree. Just right-click on it when it is in focus and select "Edit ScriptAction" to open up the ScriptActionEditor - there you will be able to edit everything you want. But beware of the code - we strictly recommend that you know how to program JavaScript.

Create new ScriptActions

In case you want to create a new ScriptAction from the scratch all you need to do is simply drag & drop the "Blank action" from the menu pane onto your item and then edit it. Finally you can export it do allow others to use it or share it with the DirectSmile community. See the next section to learn how to ex- and import ScriptActions.

Ex- and importing ScriptActions

Figure 4: Account ScriptActions Tab

To export a ScriptAction all you need to do is to right-click on a focused ScriptAction and select "Export ScriptAction" from the context-menu. Then you will be prompted to save the ZIP file to your local drive. Then you will be able to share this ZIP-file containing your ScriptAction with other DSMX users - simply give them the file.

To import a ScriptAction select the "Actions"-tab from the left menu pane and there switch to the account ScriptActions (as seen in figure 4). There you can now add ScriptActions via the green plus sign.