@processmaker/modeler 1.24.3 → 1.25.0

package/src/components/nodes/boundaryEvent/boundaryEvent.vue

@@ -143,6 +143,7 @@ export default {
     resetToInitialPosition() {
       this.shape.position(this.validPosition.x, this.validPosition.y);
       store.commit('allowSavingElementPosition');
+      this.$emit('shape-resize');
     },
     moveBoundaryEventIfOverTask() {
       const task = this.getTaskUnderShape();
@@ -154,11 +155,13 @@ export default {
 
       this.attachBoundaryEventToTask(task);
       this.updateShapePosition(task);
+      this.$emit('shape-resize');
     },
     resetInvalidTarget() {
       if (this.invalidTargetElement) {
         resetShapeColor(this.invalidTargetElement);
         this.invalidTargetElement = null;
+        this.$emit('shape-resize');
       }
     },
     attachToValidTarget(cellView) {

package/src/components/nodes/pool/poolEventHandlers.js

@@ -25,6 +25,7 @@ export default class PoolEventHandlers {
 
   onPointerDown(cellView) {
     if (this.isNotPoolChild(cellView.model)) {
+      this.component.$emit('select-pool');
       return;
     }
 

package/src/components/paperManager.js

@@ -21,6 +21,8 @@ export default class PaperManager {
       sorting: 'sorting-approximate',
       gridSize: PaperManager.gridSize,
       drawGrid: true,
+      snapLinks: false, // disable snapping of links
+      snapElements: false, // disable snapping of elements
       clickThreshold: 10,
       perpendicularLinks: true,
       interactive: interactiveFunc,

package/src/components/toolbar/ToolBar.vue

@@ -34,7 +34,7 @@
         <div class="btn-group btn-group-sm mr-2" role="group" aria-label="Zoom controls">
           <b-button
             class="btn btn-sm btn-secondary"
-            @click="scale += scaleStep"
+            @click="paperManager.scale = paperManager.scale.sx + scaleStep"
             data-test="zoom-in"
             v-b-tooltip.hover
             :title="$t('Zoom In')"
@@ -43,7 +43,7 @@
           </b-button>
           <b-button
             class="btn btn-sm btn-secondary"
-            @click="scale = Math.max(minimumScale, scale -= scaleStep)"
+            @click="paperManager.scale = Math.max(minimumScale, paperManager.scale.sx -= scaleStep)"
             data-test="zoom-out"
             v-b-tooltip.hover
             :title="$t('Zoom Out')"
@@ -51,16 +51,17 @@
             <font-awesome-icon :icon="minusIcon" />
           </b-button>
           <b-button
+            v-if="paperManager"
             class="btn btn-sm btn-secondary"
-            @click="scale = initialScale"
-            :disabled="scale === initialScale"
+            @click="paperManager.scale = initialScale"
+            :disabled="paperManager.scale.sx === initialScale"
             data-test="zoom-reset"
             v-b-tooltip.hover
             :title="$t('Reset to initial scale')"
           >
             {{ $t('Reset') }}
           </b-button>
-          <span class="btn btn-sm btn-secondary scale-value">{{ Math.round(scale*100) }}%</span>
+          <span v-if="paperManager" class="btn btn-sm btn-secondary scale-value">{{ Math.round(paperManager.scale.sx*100) }}%</span>
         </div>
 
         <div class="btn-group btn-group-sm mr-2" role="group" aria-label="Additional controls">
@@ -121,12 +122,6 @@ export default {
     panelsCompressed: Boolean,
   },
   watch: {
-    scale(scale) {
-      this.paperManager.scale = scale;
-      if (scale === this.initialScale) {
-        this.$root.$emit('bv::hide::tooltip');
-      }
-    },
     miniMapOpen(isOpen) {
       this.$emit('toggle-mini-map-open', isOpen);
     },
@@ -168,6 +163,7 @@ export default {
   },
   methods: {
     undo() {
+      this.$emit('clearSelection');
       if (this.isRendering) {
         return;
       }
@@ -177,6 +173,7 @@ export default {
         .then(() => window.ProcessMaker.EventBus.$emit('modeler-change'));
     },
     redo() {
+      this.$emit('clearSelection');
       if (this.isRendering) {
         return;
       }

package/src/components/toolbar/toolbar.scss

@@ -1,7 +1,7 @@
 $toolbar-background-color: #FFF;
 
 .toolbar {
-  z-index: 1;
+  z-index: 2;
   height: $toolbar-height;
   cursor: auto;
   width: 100%;

package/src/mixins/highlightConfig.js

@@ -21,6 +21,7 @@ const defaultHighlighter = {
       attrs: {
         stroke: '#5096db',
         'stroke-width': 3,
+        'data-cy': 'selected',
       },
     },
   },
@@ -96,6 +97,7 @@ export default {
           this.setShapeHighlight();
           this.shape.on('change:size', () => {
             this.paperManager.awaitScheduledUpdates().then(this.setShapeHighlight);
+            this.$emit('shape-resize', this.shape);
           });
         });
     });

package/src/mixins/linkConfig.js

@@ -302,6 +302,9 @@ export default {
     }
 
     this.updateRouter();
+    this.shape.on('change:vertices', function() {
+      this.component.$emit('shape-resize');
+    });
   },
   beforeDestroy() {
     document.removeEventListener('mouseup', this.emitSave);

package/src/store.js

@@ -94,7 +94,18 @@ export default new Vuex.Store({
       state.highlightedNodes = node ? [node] : [];
     },
     addToHighlightedNodes(state, nodes) {
-      state.highlightedNodes = uniq([...state.highlightedNodes, ...nodes]);
+      const highlightedNodes = uniq([...state.highlightedNodes, ...nodes]);
+      const selectedPoolsIds = highlightedNodes
+        .filter(node => node.type === 'processmaker-modeler-pool')
+        .map(node => node.id);
+      state.highlightedNodes = highlightedNodes
+        // remove from selection the selected child nodes in the pool
+        .filter(node => {
+          if (node.pool && node.pool.component.node.id) {
+            return !selectedPoolsIds.includes(node.pool.component.node.id);
+          }
+          return true;
+        });
     },
     addNode(state, node) {
       /* Add an unchanging ID that Vue can use to track the component