Oxygen XML Web Author includes support for side views that can improve the editing experience for users by providing more information about the edited document. The JavaScript API provides control over which views are rendered, and provides support for installing a new view from either a plugin or a document framework.
Removing a View
To disable the Review side view, simply include the following code snippet at the top of the JavaScript plugin file:
To obtain a list with the IDs of all the defined views, type the following code in the browser console:
Installing a Custom View
To implement a custom view, first you need to add it in the layout by calling the following code snippet when your plugin is loaded:
Next you need to implement a view renderer. The following is a simple example of such a view renderer:
/**
* CMS View Renderer
*/
MyViewRenderer = function() {
sync.view.ViewRenderer.call(this);
};
MyViewRenderer.prototype = Object.create(sync.view.ViewRenderer.prototype);
MyViewRenderer.prototype.constructor = MyViewRenderer;
MyViewRenderer.prototype.getTitle = function() {
return 'Custom View';
};
MyViewRenderer.prototype.install = function(element) {
element.innerHTML = 'Welcome to my view';
};
For more customization options for a view renderer, see the sync.view.ViewRenderer class.
Later, when you want to actually render the custom view, you should install a view renderer for it. You can also specify if the view should be closed when the editor is opened, and the side where to install the view:
var viewProperties = {initiallyClosed: false, side: 'right'};
workspace.getViewManager().installView('cms-custom-view', new MyViewRenderer(), viewProperties);
Contributing a Custom View from a Framework
Framework custom code is executed after the view layout is created. The good news is that several views are reserved for frameworks to use. Their IDs are 'framework-specific-N' (with N being from 1 to 9). Thus, you do not have to call sync.view.ViewManager#addView. Instead, just use one of these IDs, as in the following: