How to access the clipboard module as an additional module in Bower

Developers Modeler
1

I’m using the last version of bpmn-js, but I don’t know how to add addtional modules like the clipboard module using Bower.

Using browserify is easy:

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

var Clipboard = require('diagram-js/lib/features/clipboard/Clipboard');

var clipboard = new Clipboard();

var modeler = new BpmnJS({
    container: document.querySelector("canvas"),
    position: 'absolute',
    additionalModules: [
      { clipboard: [ 'value', clipboard ] }
    ]
  });

But using Bower, I can’t find the way to access the Clipboard class from bpmn-js.

2

You would have to bundle the clipboard module individually using Browserify for example.

3

If I only copy the Clipboard class:

function Clipboard() {}

Clipboard.prototype.get = function() {
  return this._data;
};

Clipboard.prototype.set = function(data) {
  this._data = data;
};

Clipboard.prototype.clear = function() {
  var data = this._data;

  delete this._data;

  return data;
};

Clipboard.prototype.isEmpty = function() {
  return !this._data;
};
4

Simply copying the Clipboard class should just work, too.

:sunny:

5

Last question.

To copy & paste, do I have to do this way ?

modeler.get('editorActions').trigger('copy');  // for copy
modeler.get('editorActions').trigger('paste');  // for paste
1 Like