From 0381811d03a9b1382e16dde2ec6f6b8896dcd098 Mon Sep 17 00:00:00 2001 From: Ricardo Matias Date: Wed, 15 Apr 2015 09:43:55 +0200 Subject: [PATCH] feat(space-tool): add create/remove space behaviour closes #132 --- CONTRIBUTING.md | 2 +- lib/Modeler.js | 1 + lib/features/palette/PaletteProvider.js | 19 +- test/spec/features/modeling/SpaceToolSpec.js | 225 ++++++++++++++++++ .../features/palette/PaletteProviderSpec.js | 2 +- 5 files changed, 243 insertions(+), 6 deletions(-) create mode 100644 test/spec/features/modeling/SpaceToolSpec.js diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index f76f52da..98824059 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -6,7 +6,7 @@ We love you to contribute to this project by filing bugs, helping others on the ## Creating issues We use our [issue tracker](https://github.com/bpmn-io/bpmn-js/issues) for project communication. -When using the issue tracker, +When using the issue tracker: * Be descriptive when creating an issue (what, where, when and how does a problem pop up)? * Attach steps to reproduce (if applicable) diff --git a/lib/Modeler.js b/lib/Modeler.js index 8d7c6b20..2f647844 100644 --- a/lib/Modeler.js +++ b/lib/Modeler.js @@ -68,6 +68,7 @@ Modeler.prototype._modelingModules = [ require('diagram-js/lib/features/move'), require('diagram-js/lib/features/bendpoints'), require('diagram-js/lib/features/resize'), + require('diagram-js/lib/features/space-tool'), require('diagram-js/lib/features/lasso-tool'), require('./features/modeling'), require('./features/context-pad'), diff --git a/lib/features/palette/PaletteProvider.js b/lib/features/palette/PaletteProvider.js index 95750fb0..dda6962c 100644 --- a/lib/features/palette/PaletteProvider.js +++ b/lib/features/palette/PaletteProvider.js @@ -5,24 +5,26 @@ var assign = require('lodash/object/assign'); /** * A palette provider for BPMN 2.0 elements. */ -function PaletteProvider(palette, create, elementFactory) { +function PaletteProvider(palette, create, elementFactory, spaceTool) { this._create = create; this._elementFactory = elementFactory; + this._spaceTool = spaceTool; palette.registerProvider(this); } module.exports = PaletteProvider; -PaletteProvider.$inject = [ 'palette', 'create', 'elementFactory' ]; +PaletteProvider.$inject = [ 'palette', 'create', 'elementFactory', 'spaceTool' ]; PaletteProvider.prototype.getPaletteEntries = function(element) { var actions = {}, create = this._create, - elementFactory = this._elementFactory; + elementFactory = this._elementFactory, + spaceTool = this._spaceTool; function createAction(type, group, className, title, options) { @@ -52,8 +54,17 @@ PaletteProvider.prototype.getPaletteEntries = function(element) { create.start(event, elementFactory.createParticipantShape(collapsed)); } - assign(actions, { + 'space-tool': { + group: 'tool', + className: 'icon-edit-space-tool', + title: 'Create/remove space on the diagram', + action: { + click: function(event) { + spaceTool.activateSelection(event); + } + } + }, 'create.start-event': createAction( 'bpmn:StartEvent', 'event', 'icon-start-event-none' ), diff --git a/test/spec/features/modeling/SpaceToolSpec.js b/test/spec/features/modeling/SpaceToolSpec.js new file mode 100644 index 00000000..7e13266b --- /dev/null +++ b/test/spec/features/modeling/SpaceToolSpec.js @@ -0,0 +1,225 @@ +'use strict'; + +var Matchers = require('../../../Matchers'), + TestHelper = require('../../../TestHelper'); + +/* global bootstrapModeler, inject */ + + +var modelingModule = require('../../../../lib/features/modeling'), + coreModule = require('../../../../lib/core'); + + +describe('features/modeling - create/remove space', function() { + + beforeEach(Matchers.addDeepEquals); + + + var diagramXML = require('../../../fixtures/bpmn/simple.bpmn'); + + var testModules = [ coreModule, modelingModule ]; + + beforeEach(bootstrapModeler(diagramXML, { modules: testModules })); + + + describe('create space', function() { + + + it('should create space to the right', inject(function(elementRegistry, modeling) { + + // given + var sequenceFlowElement = elementRegistry.get('SequenceFlow_3'), + sequenceFlow = sequenceFlowElement.businessObject; + + var subProcessElement = elementRegistry.get('SubProcess_1'), + subProcess = subProcessElement.businessObject; + + var endEventElement = elementRegistry.get('EndEvent_1'), + endEvent = endEventElement.businessObject; + + + var subProcOldPos = { + x: subProcessElement.x, + y: subProcessElement.y + }; + + var endEventOldPos = { + x: endEventElement.x, + y: endEventElement.y + }; + + var delta = { x: 50, y: 0 }, + direction = 'e'; + + // when + modeling.createSpace([subProcessElement, endEventElement], [], delta, direction); + + // then + expect(subProcess.di.bounds.x).toBe(subProcOldPos.x + 50); + expect(subProcess.di.bounds.y).toBe(subProcOldPos.y); + + expect(endEvent.di.bounds.x).toBe(endEventOldPos.x + 50); + expect(endEvent.di.bounds.y).toBe(endEventOldPos.y); + + expect(sequenceFlow.di.waypoint).toDeepEqual([ + { $type: 'dc:Point', x: 144, y: 230 }, + { $type: 'dc:Point', x: 350, y: 230 }, + ]); + })); + + + it('should create space downwards', inject(function(elementRegistry, modeling) { + + // given + var startEventElement = elementRegistry.get('StartEvent_2'), + startEvent = startEventElement.businessObject; + + var sequenceFlowElement = elementRegistry.get('SequenceFlow_3'), + sequenceFlow = sequenceFlowElement.businessObject; + + var subProcessElement = elementRegistry.get('SubProcess_1'), + subProcess = subProcessElement.businessObject; + + var endEventElement = elementRegistry.get('EndEvent_1'), + endEvent = endEventElement.businessObject; + + var startEventOldPos = { + x: startEventElement.x, + y: startEventElement.y + }; + + var subProcOldPos = { + x: subProcessElement.x, + y: subProcessElement.y + }; + + var endEventOldPos = { + x: endEventElement.x, + y: endEventElement.y + }; + + var delta = { x: 0, y: 50 }, + direction = 's'; + + // when + modeling.createSpace([startEventElement ,subProcessElement, endEventElement], [], delta, direction); + + // then + expect(startEvent.di.bounds.x).toBe(startEventOldPos.x); + expect(startEvent.di.bounds.y).toBe(startEventOldPos.y + 50); + + expect(subProcess.di.bounds.x).toBe(subProcOldPos.x); + expect(subProcess.di.bounds.y).toBe(subProcOldPos.y + 50); + + expect(endEvent.di.bounds.x).toBe(endEventOldPos.x); + expect(endEvent.di.bounds.y).toBe(endEventOldPos.y + 50); + + expect(sequenceFlow.di.waypoint).toDeepEqual([ + { $type: 'dc:Point', x: 144, y: 280 }, + { $type: 'dc:Point', x: 300, y: 280 }, + ]); + })); + + + it('should remove space to the left', inject(function(elementRegistry, modeling) { + + // given + var sequenceFlowElement = elementRegistry.get('SequenceFlow_3'), + sequenceFlow = sequenceFlowElement.businessObject; + + var subProcessElement = elementRegistry.get('SubProcess_1'), + subProcess = subProcessElement.businessObject; + + var endEventElement = elementRegistry.get('EndEvent_1'), + endEvent = endEventElement.businessObject; + + var subProcOldPos = { + x: subProcessElement.x, + y: subProcessElement.y + }; + + var endEventOldPos = { + x: endEventElement.x, + y: endEventElement.y + }; + + var delta = { x: -50, y: 0 }, + direction = 'w'; + + // when + modeling.createSpace([subProcessElement, endEventElement], [], delta, direction); + + // then + expect(subProcess.di.bounds.x).toBe(subProcOldPos.x - 50); + expect(subProcess.di.bounds.y).toBe(subProcOldPos.y); + + expect(endEvent.di.bounds.x).toBe(endEventOldPos.x - 50); + expect(endEvent.di.bounds.y).toBe(endEventOldPos.y); + + expect(sequenceFlow.di.waypoint).toDeepEqual([ + { $type: 'dc:Point', x: 144, y: 230 }, + { $type: 'dc:Point', x: 250, y: 230 }, + ]); + })); + + + it('should resize to the right', inject(function(elementRegistry, modeling) { + + // given + var taskElement = elementRegistry.get('Task_1'), + task = taskElement.businessObject; + + var subProcessElement = elementRegistry.get('SubProcess_1'), + subProcess = subProcessElement.businessObject; + + var startEventElement = elementRegistry.get('StartEvent_1'), + startEvent = startEventElement.businessObject; + + var startEventElement2 = elementRegistry.get('StartEvent_2'), + startEvent2 = startEventElement2.businessObject; + + var subProcOldPos = { + x: subProcessElement.x, + y: subProcessElement.y, + width: subProcessElement.width, + height: subProcessElement.height + }; + + var startEventOldPos2 = { + x: startEventElement2.x, + y: startEventElement2.y + }; + + var startEventOldPos = { + x: startEventElement.x, + y: startEventElement.y + }; + + var taskOldPos = { + x: taskElement.x, + y: taskElement.y + }; + + var delta = { x: 50, y: 0 }, + direction = 'w'; + + // when + modeling.createSpace([startEventElement, startEventElement2, taskElement], [subProcessElement], delta, direction); + + // then + expect(subProcess.di.bounds.x).toBe(subProcOldPos.x + 50); + expect(subProcess.di.bounds.y).toBe(subProcOldPos.y); + expect(subProcess.di.bounds.width).toBe(subProcOldPos.width - 50); + expect(subProcess.di.bounds.height).toBe(subProcOldPos.height); + + expect(startEvent.di.bounds.x).toBe(startEventOldPos.x + 50); + expect(startEvent.di.bounds.y).toBe(startEventOldPos.y); + + expect(startEvent2.di.bounds.x).toBe(startEventOldPos2.x + 50); + expect(startEvent2.di.bounds.y).toBe(startEventOldPos2.y); + + expect(task.di.bounds.x).toBe(taskOldPos.x + 50); + expect(task.di.bounds.y).toBe(taskOldPos.y); + })); + }); +}); diff --git a/test/spec/features/palette/PaletteProviderSpec.js b/test/spec/features/palette/PaletteProviderSpec.js index d56865d4..d9b3bc4e 100644 --- a/test/spec/features/palette/PaletteProviderSpec.js +++ b/test/spec/features/palette/PaletteProviderSpec.js @@ -32,7 +32,7 @@ describe('palette', function() { var paletteElement = domQuery('.djs-palette', container); // then - expect(domQuery.all('.entry', paletteElement).length).toBe(8); + expect(domQuery.all('.entry', paletteElement).length).toBe(9); done(err); });