How to hide unneeded bpmn tools and options

Developers
1

I would like to customize the bpmn tools and keep it lean by hiding/removing the unneeded bpmn options as shown above.

Uploading…

2

For your first task, you should redefine the popup menu provider. For example:

To create specific menu:

var onConnectionMenuElements = {
	getEntries : function(element) {
		var entries = [];
		entries.push({
			label: 'First event',
			actionName: 'first-event',
			className: 'bpmn-icon-start-event-none',
			action : function(event, element) {
				console.log("First event",event,element);
			}
		});
		entries.push({
			label: 'Second event',
			actionName: 'second-event',
			className: 'bpmn-icon-intermediate-event-none',
			action : function(event, element) {
				console.log("Second event",event,element);
			}
		});
		return entries;
	}
};
popupMenu.registerProvider('event-type', onConnectionMenuElements);

To open this menu:

var getContextPadEntries = function(element) {
				
	var actions = {};

	if (element.type === 'label') {
		return actions;
	}

	function getReplaceMenuPosition(event) {
		var diagramContainer = canvas.getContainer(), pad = contextPad.getPad(element).html;
		var diagramRect = diagramContainer.getBoundingClientRect(), padRect = pad.getBoundingClientRect();
		var pos = {
			x : event.x - diagramRect.left - 10,
			y : event.y - diagramRect.top + 15
		};
		pos.cursor = pos;
		return pos;
	}

	if(element.businessObject.$instanceOf('bpmn:Event')){
		actions['event-type'] = {
				group: 'edit',
				className: 'bpmn-icon-intermediate-event-none',
				title: translate('Change type'),
				action: {
					click: function(event, element) {
					if(popupMenu._current && popupMenu.isOpen())popupMenu.close();
					popupMenu.create('connection-type', element).open(getReplaceMenuPosition(event));
				}
				}
		};
	}
	
	// define some entries for another types

	return actions;
};
contextPadProvider.getContextPadEntries = getContextPadEntries;
2 Likes
3

Hi Tujger, thanks for your input. I’m trying to understand the code. What instance is popupMenu ? I would like to initialize it to make the example functional.

4

Yes, of course. For example, if the main instance is bpmn then you may resolve these instances following code:

popupMenu = bpmn.get('popupMenu');
contextPadProvider = bpmn.get('contextPadProvider');
5

How about the second task? hide the items on left menu?

1 Like
6

Also the second task?

7

Please do not necrobump old topics. Instead link to this thread from new topic.