Handling Events

Content Studio, like most GUI-based applications is event-based: once it has been started, it listens for events such as user mouse clicks and responds to them. Your extensions need to work in the same way, and the objects in the Javascript API provide ways of both emitting and listening for events.

To listen for and respond to events, you use an object's on method. The content-studio object, for example, has an on method that you can use to listen for various events. Every time the user opens a new editor or switches between editors by clicking on one of the editor tabs, an editor-active event is emitted. The on method lets you add a listener that associates a function with this event, so that every time an editor is activated, your function is executed. Try entering this code in the console:

no = require('notifier');
cs = require('content-studio');
cs.on('editor-active', function(editorcontrol) {no.notify('Active editor changed');});

Now try opening a new editor or clicking on a editor tab to change the active editor. The notification message "Active editor changed" should appear in the top right corner of the window:

The editor-active event contains a parameter that the listener passes to the associated function. This parameter, editorcontrol, is an object representing the editor that has become active. You can access event parameters from inside listener functions. In this case you could use the editorcontrol object's displayName property to make a more informative message:

cs.on('editor-active', function(editorcontrol) {no.notify('Opened editor ' + editorcontrol.displayName);});

More than one function can be associated with the same event. You have now associated two functions with the editor-active event, so if you click on an editor tab they will both be executed and you will see two messages displayed:

You can clear all the functions associated with an event by calling the removeAllListeners method:

cs.removeAllListeners('editor-active');

No messages will be displayed if you click on an editor tab now.

The content-studio object can also emit other events:

• editor-inactive

• panel-init

• panel-destroy

• panel-show

• panel-hide

• drop-listen

For information about these events, see the Content Studio Javascript API Reference.

Other objects that emit events (and therefore have on methods) include:

Action objects

An Action object emits an action event whenever the Content Studio user either clicks on its menu item or presses its keyboard shortcut. The action event has no parameters. You can therefore make a "Click me" menu item as follows:

no = require('notifier');
actions = require('actions');
myaction = actions.createAction('Click me', 'shortcut C');
myaction.on('action', function() {no.notify('I got clicked!');});
actions.addAction(myaction, 'file');

If you now click on File > Click me, you will see the notification message "I got clicked!".

EventEmitter objects

When you create a Content Studio side panel, an EventEmitter object is returned. This object emits an action event whenever the Content Studio user clicks inside the panel. For more information about this object, see the Content Studio Javascript API Reference.