From 894280e72366630de7081d953e1d28a67bb3e36c Mon Sep 17 00:00:00 2001 From: Nico Rehwaldt Date: Fri, 27 Jun 2014 17:52:34 +0200 Subject: [PATCH] feat(feature/bpmn-modeling): append task via context-pad Related to #6, #40 --- lib/Modeler.js | 3 +- lib/features/bpmn-modeling/BpmnFactory.js | 2 +- lib/features/bpmn-modeling/LayoutUtil.js | 11 +- .../context-pad/ContextPadProvider.js | 97 ++++++++++++++++++ lib/features/context-pad/index.js | 9 ++ resources/images/context-pad/event.png | Bin 0 -> 305 bytes resources/images/context-pad/gateway.png | Bin 0 -> 203 bytes resources/images/context-pad/task.png | Bin 0 -> 270 bytes resources/images/context-pad/trash.png | Bin 0 -> 361 bytes test/config/karma.unit.js | 6 +- .../context-pad/ContextPadProviderSpec.js | 35 +++++++ .../features/touch/TouchInteractionSpec.js | 2 - test/spec/integration/SimpleModelingSpec.js | 34 ++++++ 13 files changed, 191 insertions(+), 8 deletions(-) create mode 100644 lib/features/context-pad/ContextPadProvider.js create mode 100644 lib/features/context-pad/index.js create mode 100644 resources/images/context-pad/event.png create mode 100644 resources/images/context-pad/gateway.png create mode 100644 resources/images/context-pad/task.png create mode 100644 resources/images/context-pad/trash.png create mode 100644 test/spec/browser/features/context-pad/ContextPadProviderSpec.js create mode 100644 test/spec/integration/SimpleModelingSpec.js diff --git a/lib/Modeler.js b/lib/Modeler.js index af5ee059..bf8162d4 100644 --- a/lib/Modeler.js +++ b/lib/Modeler.js @@ -49,7 +49,8 @@ Modeler.prototype._modules = Modeler.prototype._modules.concat([ require('./features/label-editing'), require('./features/zoomscroll'), require('./features/touch'), - require('./features/movecanvas') + require('./features/movecanvas'), + require('./features/context-pad') ]); diff --git a/lib/features/bpmn-modeling/BpmnFactory.js b/lib/features/bpmn-modeling/BpmnFactory.js index 00e00cd9..4c035b44 100644 --- a/lib/features/bpmn-modeling/BpmnFactory.js +++ b/lib/features/bpmn-modeling/BpmnFactory.js @@ -37,7 +37,7 @@ BpmnFactory.prototype.createDiShape = function(semantic, position, attrs) { if (semantic.$instanceOf('bpmn:Task')) { bounds = { width: 100, height: 80 }; } else { - bounds = { width: 50, height: 50 }; + bounds = { width: 36, height: 36 }; } _.extend(bounds, { diff --git a/lib/features/bpmn-modeling/LayoutUtil.js b/lib/features/bpmn-modeling/LayoutUtil.js index 8bc742bc..d1fdcb58 100644 --- a/lib/features/bpmn-modeling/LayoutUtil.js +++ b/lib/features/bpmn-modeling/LayoutUtil.js @@ -9,7 +9,14 @@ var getMidPoint = module.exports.getMidPoint = function(bounds) { module.exports.getDirectConnectionPoints = function(boundsA, boundsB) { return [ - getMidPoint(boundsA), - getMidPoint(boundsB) + // workaround until we can compute the extend of an element + { + x: boundsA.x + boundsA.width, + y: boundsA.y + boundsA.height / 2 + }, + { + x: boundsB.x, + y: boundsB.y + boundsB.height / 2 + } ]; }; \ No newline at end of file diff --git a/lib/features/context-pad/ContextPadProvider.js b/lib/features/context-pad/ContextPadProvider.js new file mode 100644 index 00000000..61ea02b8 --- /dev/null +++ b/lib/features/context-pad/ContextPadProvider.js @@ -0,0 +1,97 @@ +'use strict'; + +var fs = require('fs'); + +var _ = require('lodash'); + + +/* jshint -W101 */ + +var images = { + EVENT: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAANNJREFUeNq0VIsNwiAQpV3AbuAIOAobMBsTwAZ0AxyhTgBOcN5TmlSsWiy+5CXA3Xs5PkdHROKf0EzPpII+x56AYrpi7ch0zJPWWiilxDAM90BKSTjnhDEG0zNTMS+zUWkSpZQUQqB3QAw5yM2aF6OAhBgjfQNyslkojbDvj5WsVZbPTS+NPJ8J1QIaaJdGZK2tNoLmsTMSPQ8OcJpvpwZLTb+2+AtgdMVgmqZqMd5WWdGIx1aLrBnLlmhy/c0e5O4W2dS0IC5ja9Pu+0ZafWw3AQYAuebLigXf9OoAAAAASUVORK5CYII=', + GATEWAY: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAG1JREFUeNqs1MsJACEMBFC1gfR/sqSUlEXZFVEzcWEG5vrAT5LNLFFyAdW32AigKiLWirAI6oiq9iIMQQP5gjAP2pAIO0EugrAVChEPm6Fr5IQ1oyRW2EejXjb1+akfkjoi1KH9tUYya7E9AgwA8H6jTs2UBDgAAAAASUVORK5CYII=', + TASK: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAALBJREFUeNpi/P//PwM1ABMDlQALiGBkZARR/ECcAMQCROr9AMQLgPgjyFeMYAJi0Hl+fn4DICDKlAsXLjB8/PjxApBpCA4eaBjFA/H/8+fP/ycWgNSC9ID0IhtUb29v/59UANID0gsyAx7YDg4OJAcwsh6qxdqoQSQYBEpgpIIDBw6AKAUwh1oJEiOLgNIGoWzy4MEDhg0bNqBkEWSDYJk2gAhfPQCFBkamHVSxBhBgAH1c5Gm2siu5AAAAAElFTkSuQmCC', + TRASH: 'iVBORw0KGgoAAAANSUhEUgAAABIAAAATCAYAAACdkl3yAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQtJREFUeNqsVNENgyAQBeM/3aCM4AZlBDagG3QFR3AENygbYCeoTlBG0AksR8QgAbGNl7xEAu+9O84Dz/OMTgkQSogJ2I7gGuUHQnDoZvAw+CSEnosJnCMxIZIg7uHt+KWX5cWg/veKsCsLY+xK44toLrSBNPwJFmWweSeE1FVV7SqM44iGYYBPZvCKdU0YoTkXSil3Ryu/CNOdJpsp4pwjKeVms2kai1gUqfShvL7vty5a27KOCI2OEAsQZoyhruvsck9o8IVS7r5ptjRwDkvbEy5S7Y0FtNwz0DmhDg5SSlH4PwkhfCN9qDQQClvdtu1Pz4g6OLAPnx/Omps3emDW4KKmlX/WC/kVYACiNOUTeEjwagAAAABJRU5ErkJggg==' +}; + +/* jshint +W101 */ + + +/** + * A provider for BPMN 2.0 elements context pad + * + * @param {ContextPad} contextPad + */ +function ContextPadProvider(contextPad, directEditing, bpmnModeling) { + + contextPad.registerProvider(this); + + this._directEditing = directEditing; + this._bpmnModeling = bpmnModeling; +} + +ContextPadProvider.$inject = [ 'contextPad', 'directEditing', 'bpmnModeling' ]; + + +ContextPadProvider.prototype.getContextPadEntries = function(element) { + + var directEditing = this._directEditing, + bpmnModeling = this._bpmnModeling; + + var actions = {}; + + if (element.type === 'label') { + return actions; + } + + var bpmnElement = element.businessObject; + + function append(element, type) { + var target = bpmnModeling.appendFlowNode(element, null, type); + directEditing.activate(target); + } + + if (bpmnElement.$instanceOf('bpmn:FlowNode') && + !bpmnElement.$instanceOf('bpmn:EndEvent')) { + + _.extend(actions, { + 'action.model-event': { + imageUrl: 'data:image/png;base64,' + images.EVENT, + action: function(e) { + append(element, 'bpmn:EndEvent'); + } + }, + /* + 'action.model-gateway': { + imageUrl: 'data:image/png;base64,' + images.GATEWAY, + action: function(e) { + append(element, 'bpmn:Gateway'); + } + }, + */ + 'action.model-task': { + imageUrl: 'data:image/png;base64,' + images.TASK, + action: function(e) { + append(element, 'bpmn:Task'); + } + } + }); + + } + + /* + _.extend(actions, { + 'action.delete': { + imageUrl: 'data:image/png;base64,' + images.TRASH, + action: function(e) { + console.log('action.delete', e); + } + } + }); + */ + + return actions; +}; + + +module.exports = ContextPadProvider; \ No newline at end of file diff --git a/lib/features/context-pad/index.js b/lib/features/context-pad/index.js new file mode 100644 index 00000000..0d6dd713 --- /dev/null +++ b/lib/features/context-pad/index.js @@ -0,0 +1,9 @@ +module.exports = { + __depends__: [ + require('diagram-js/lib/features/context-pad'), + require('diagram-js-direct-editing'), + require('../bpmn-modeling') + ], + __init__: [ 'contextPadProvider' ], + contextPadProvider: [ 'type', require('./ContextPadProvider') ] +}; \ No newline at end of file diff --git a/resources/images/context-pad/event.png b/resources/images/context-pad/event.png new file mode 100644 index 0000000000000000000000000000000000000000..3bb6f4759cc399417e4886ecb8300804a6b748ee GIT binary patch literal 305 zcmV-10nYx3P)+~HYt!!gMp}JrHvt9!x#r7?1>f}Q00000NkvXXu0mjf Diy?V@ literal 0 HcmV?d00001 diff --git a/resources/images/context-pad/gateway.png b/resources/images/context-pad/gateway.png new file mode 100644 index 0000000000000000000000000000000000000000..c673c3784eeef0b7a547623be3cf05ea10c4f9a5 GIT binary patch literal 203 zcmeAS@N?(olHy`uVBq!ia0vp^LLkh+1|-AI^@Rf|$r9IylHmNblJdl&R0hYC{G?O` z&)mfH)S%SFl*+=BsWw1Gxt=bLAr-gQTsh6jpvc1#u(k0^{iY>Trnue|4KyxHWPA4O zfd8bkI)O!uSGV8bSfHhJt!o3vtBzIQlz1GOe>NHL-DC?*(od*K#LhXUHx3vIVCg!0L}1{rUgjp4pT^n0YD#cSk}>3QOQ0hdB&Km|R}{ zWjMm!@I(1TcuxXT(uK;px;kbBg;P_w#q|to{`~mJG$E6NPcB2^DD%hvpP!%quP)Yb zrRht<7bWSC{QUg?^FtUeF<;^~VwStX$H%9_Zm>yi)zMok991M(yb_i)F|+eEXs{Zz zM{x=%cQ;&OTbT3d!9nIWUTL!hDS|1@2{X+aIO1&?TG`x|$%brX6G&jFjd_x}ZIkv+ QpxYTdUHx3vIVCg!0QVhUR{#J2 literal 0 HcmV?d00001 diff --git a/resources/images/context-pad/trash.png b/resources/images/context-pad/trash.png new file mode 100644 index 0000000000000000000000000000000000000000..d4382bb0baa32553f008c1941d97aa887bf39cdd GIT binary patch literal 361 zcmV-v0ha!WP)D`LQ{XfCvYH2et`Ww3cCgw$14 z?JA7ph=yT+PiF9nbxjzdITuPPcSkF~2-BS=n+Et*Xz+zn?!IZZG;j_}+Y>HQ?TrPr+%wQQp$-mGN>TVf2_bwV zeW)}L3R~T_?N85$IykTopC8Ven>Tu3*5IP1m4DU?`4wOQqBP|bcu4SS00000NkvXX Hu0mjf-3pTu literal 0 HcmV?d00001 diff --git a/test/config/karma.unit.js b/test/config/karma.unit.js index 14c6265e..abe925fd 100644 --- a/test/config/karma.unit.js +++ b/test/config/karma.unit.js @@ -6,13 +6,15 @@ module.exports = function(karma) { frameworks: [ 'browserify', 'jasmine' ], files: [ - 'test/spec/browser/**/*Spec.js' + 'test/spec/browser/**/*Spec.js', + 'test/spec/integration/**/*Spec.js' ], reporters: [ 'dots' ], preprocessors: { - 'test/spec/browser/**/*Spec.js': [ 'browserify' ] + 'test/spec/browser/**/*Spec.js': [ 'browserify' ], + 'test/spec/integration/**/*Spec.js': [ 'browserify' ] }, browsers: [ 'PhantomJS' ], diff --git a/test/spec/browser/features/context-pad/ContextPadProviderSpec.js b/test/spec/browser/features/context-pad/ContextPadProviderSpec.js new file mode 100644 index 00000000..00cb84d1 --- /dev/null +++ b/test/spec/browser/features/context-pad/ContextPadProviderSpec.js @@ -0,0 +1,35 @@ +'use strict'; + +var Matchers = require('../../../Matchers'), + TestHelper = require('../../../TestHelper'); + +/* global bootstrapBpmnJS, inject */ + + +var fs = require('fs'); + +var contextPadModule = require('../../../../../lib/features/context-pad'), + bpmnModule = require('../../../../../lib/draw'); + + +describe('features - context-pad', function() { + + beforeEach(Matchers.add); + + + var diagramXML = fs.readFileSync('test/fixtures/bpmn/complex.bpmn', 'utf-8'); + + var testModules = [ contextPadModule, bpmnModule ]; + + beforeEach(bootstrapBpmnJS(diagramXML, { modules: testModules })); + + + describe('bootstrap', function() { + + it('should bootstrap', inject(function(contextPadProvider) { + expect(contextPadProvider).toBeDefined(); + })); + + }); + +}); \ No newline at end of file diff --git a/test/spec/browser/features/touch/TouchInteractionSpec.js b/test/spec/browser/features/touch/TouchInteractionSpec.js index a4c3149e..fa3132ed 100644 --- a/test/spec/browser/features/touch/TouchInteractionSpec.js +++ b/test/spec/browser/features/touch/TouchInteractionSpec.js @@ -8,8 +8,6 @@ var Matchers = require('../../../Matchers'), var fs = require('fs'); -var $ = require('jquery'); - var touchModule = require('../../../../../lib/features/touch'), bpmnModule = require('../../../../../lib/draw'); diff --git a/test/spec/integration/SimpleModelingSpec.js b/test/spec/integration/SimpleModelingSpec.js new file mode 100644 index 00000000..4ea276bc --- /dev/null +++ b/test/spec/integration/SimpleModelingSpec.js @@ -0,0 +1,34 @@ +'use strict'; + +var Matchers = require('../Matchers'), + TestHelper = require('../TestHelper'); + + +var fs = require('fs'); + +var Modeler = require('../../../lib/Modeler'); + + +describe('scenario - simple modeling', function() { + + + var container; + + beforeEach(function() { + container = jasmine.getEnv().getTestContainer(); + }); + + + it('should build process from start to end event', function(done) { + + // given + var modeler = new Modeler({ container: container }); + + // when + modeler.createDiagram(function(err) { + + done(err); + }); + }); + +}); \ No newline at end of file