'use strict'; var inherits = require('inherits'); var Ids = require('ids'); var Viewer = require('./Viewer'); var NavigatedViewer = require('./NavigatedViewer'); var initialDiagram = '' + '' + '' + '' + '' + '' + '' + '' + '' + '' + '' + '' + ''; /** * A modeler for BPMN 2.0 diagrams. * * * ## Extending the Modeler * * In order to extend the viewer pass extension modules to bootstrap via the * `additionalModules` option. An extension module is an object that exposes * named services. * * The following example depicts the integration of a simple * logging component that integrates with interaction events: * * * ```javascript * * // logging component * function InteractionLogger(eventBus) { * eventBus.on('element.hover', function(event) { * console.log() * }) * } * * InteractionLogger.$inject = [ 'eventBus' ]; // minification save * * // extension module * var extensionModule = { * __init__: [ 'interactionLogger' ], * interactionLogger: [ 'type', InteractionLogger ] * }; * * // extend the viewer * var bpmnModeler = new Modeler({ additionalModules: [ extensionModule ] }); * bpmnModeler.importXML(...); * ``` * * * ## Customizing / Replacing Components * * You can replace individual diagram components by redefining them in override modules. * This works for all components, including those defined in the core. * * Pass in override modules via the `options.additionalModules` flag like this: * * ```javascript * function CustomContextPadProvider(contextPad) { * * contextPad.registerProvider(this); * * this.getContextPadEntries = function(element) { * // no entries, effectively disable the context pad * return {}; * }; * } * * CustomContextPadProvider.$inject = [ 'contextPad' ]; * * var overrideModule = { * contextPadProvider: [ 'type', CustomContextPadProvider ] * }; * * var bpmnModeler = new Modeler({ additionalModules: [ overrideModule ]}); * ``` * * @param {Object} [options] configuration options to pass to the viewer * @param {DOMElement} [options.container] the container to render the viewer in, defaults to body. * @param {String|Number} [options.width] the width of the viewer * @param {String|Number} [options.height] the height of the viewer * @param {Object} [options.moddleExtensions] extension packages to provide * @param {Array} [options.modules] a list of modules to override the default modules * @param {Array} [options.additionalModules] a list of modules to use with the default modules */ function Modeler(options) { Viewer.call(this, options); // hook ID collection into the modeler this.on('import.parse.complete', function(event) { if (!event.error) { this._collectIds(event.definitions, event.context); } }, this); this.on('diagram.destroy', function() { this.get('moddle').ids.clear(); }, this); } inherits(Modeler, Viewer); module.exports = Modeler; module.exports.Viewer = Viewer; module.exports.NavigatedViewer = NavigatedViewer; /** * Create a new diagram to start modeling. * * @param {Function} [done] */ Modeler.prototype.createDiagram = function(done) { return this.importXML(initialDiagram, done); }; /** * Create a moddle instance, attaching ids to it. * * @param {Object} options */ Modeler.prototype._createModdle = function(options) { var moddle = Viewer.prototype._createModdle.call(this, options); // attach ids to moddle to be able to track // and validated ids in the BPMN 2.0 XML document // tree moddle.ids = new Ids([ 32, 36, 1 ]); return moddle; }; /** * Collect ids processed during parsing of the * definitions object. * * @param {ModdleElement} definitions * @param {Context} context */ Modeler.prototype._collectIds = function(definitions, context) { var moddle = definitions.$model, ids = moddle.ids, id; // remove references from previous import ids.clear(); for (id in context.elementsById) { ids.claim(id, context.elementsById[id]); } }; Modeler.prototype._interactionModules = [ // non-modeling components require('diagram-js/lib/navigation/movecanvas'), require('diagram-js/lib/navigation/touch'), require('diagram-js/lib/navigation/zoomscroll') ]; Modeler.prototype._modelingModules = [ // modeling components require('diagram-js/lib/features/auto-scroll'), require('diagram-js/lib/features/bendpoints'), require('diagram-js/lib/features/move'), require('diagram-js/lib/features/resize'), require('./features/auto-resize'), require('./features/auto-place'), require('./features/editor-actions'), require('./features/context-pad'), require('./features/keyboard'), require('./features/label-editing'), require('./features/modeling'), require('./features/palette'), require('./features/replace-preview'), require('./features/snapping') ]; // modules the modeler is composed of // // - viewer modules // - interaction modules // - modeling modules Modeler.prototype._modules = [].concat( Modeler.prototype._modules, Modeler.prototype._interactionModules, Modeler.prototype._modelingModules);