Permalink
..
Failed to load latest commit information.
app docs(transaction-boundaries): add example Jul 11, 2016
docs docs(transaction-boundaries): add example Jul 11, 2016
resources docs(transaction-boundaries): add example Jul 11, 2016
styles docs(transaction-boundaries): add example Jul 11, 2016
.gitignore
Gruntfile.js docs(transaction-boundaries): add example Jul 11, 2016
README.md docs(transaction-boundaries): add example Jul 11, 2016
package.json chore(examples): bump bpmn-js and diagram-js versions Sep 6, 2016

README.md

bpmn-js Transaction Boundaries Example

This example uses bpmn-js and bpmn-js-transaction-boundaries. It implements a BPMN 2.0 modeler that allows you to visualize transaction boundaries in the diagram.

demo application screenshot

Usage

Add bpmn-js-transaction-boundaries to your project:

npm install --save bpmn-js-transaction-boundaries

Now extend the bpmn-js modeler with the transaction boundaries module (cf. app/index.js for details).

var BpmnModeler = require('bpmn-js/lib/Modeler');

var transactionBoundariesModule = require('bpmn-js-transaction-boundaries');

var canvas = $('#js-canvas');

var bpmnModeler = new BpmnModeler({
  container: canvas,
  additionalModules: [
    transactionBoundariesModule
  ]
});

bpmnModeler.importXML(xml, function(err) {

  if (err) {
      console.error(err);
    } else {
      var transactionBoundaries = bpmnModeler.get('transactionBoundaries');

      transactionBoundaries.show();
    }
  });

Building the Example

You need a NodeJS development stack with npm and grunt installed to build the project.

To install all project dependencies execute

npm install

Build the example using browserify via

grunt

You may also spawn a development setup by executing

grunt auto-build

Both tasks generate the distribution ready client-side modeler application into the dist folder.

Serve the application locally or via a web server (nginx, apache, embedded).