chore: simplify drilldown utility

* semantic names help understanding what the utility functions do without having to check their implementation

lib/features/drilldown/DrilldownBreadcrumbs.js

@@ -3,7 +3,11 @@ import { find } from 'min-dash';
 
 import { escapeHTML } from 'diagram-js/lib/util/EscapeUtil';
 import { getBusinessObject, is } from '../../util/ModelUtil';
-import { isPlane, planeId, primaryShape } from '../../util/DrilldownUtil';
+import {
+  getPlaneIdFromShape,
+  getShapeIdFromPlane,
+  isPlane
+} from '../../util/DrilldownUtil';
 
 var OPEN_CLASS = 'bjs-breadcrumbs-shown';
 
@@ -32,7 +36,7 @@ export default function DrilldownBreadcrumbs(eventBus, elementRegistry, overlays
       return;
     }
 
-    var primary = elementRegistry.get(primaryShape(shape));
+    var primary = elementRegistry.get(getShapeIdFromPlane(shape));
 
     primary && eventBus.fire('element.changed', { element: primary });
   });
@@ -68,7 +72,7 @@ export default function DrilldownBreadcrumbs(eventBus, elementRegistry, overlays
       var title = escapeHTML(parent.name || parent.id);
       var link = domify('<li><span class="bjs-crumb"><a title="' + title + '">' + title + '</a></span></li>');
 
-      var parentPlane = canvas.findRoot(planeId(parent)) || canvas.findRoot(parent.id);
+      var parentPlane = canvas.findRoot(getPlaneIdFromShape(parent)) || canvas.findRoot(parent.id);
 
       // when the root is a collaboration, the process does not have a corresponding
       // element in the elementRegisty. Instead, we search for the corresponding participant

lib/features/drilldown/DrilldownOverlayBehavior.js

@@ -3,7 +3,7 @@ import inherits from 'inherits';
 import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 import { is } from '../../util/ModelUtil';
 import { classes, domify } from 'min-dom';
-import { planeId } from '../../util/DrilldownUtil';
+import { getPlaneIdFromShape } from '../../util/DrilldownUtil';
 
 var LOW_PRIORITY = 250;
 var ARROW_DOWN_SVG = '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.81801948,3.50735931 L10.4996894,9.1896894 L10.5,4 L12,4 L12,12 L4,12 L4,10.5 L9.6896894,10.4996894 L3.75735931,4.56801948 C3.46446609,4.27512627 3.46446609,3.80025253 3.75735931,3.50735931 C4.05025253,3.21446609 4.52512627,3.21446609 4.81801948,3.50735931 Z"/></svg>';
@@ -108,7 +108,7 @@ DrilldownOverlayBehavior.prototype.updateDrilldownOverlay = function(shape) {
 
 DrilldownOverlayBehavior.prototype.canDrillDown = function(element) {
   var canvas = this._canvas;
-  return is(element, 'bpmn:SubProcess') && canvas.findRoot(planeId(element));
+  return is(element, 'bpmn:SubProcess') && canvas.findRoot(getPlaneIdFromShape(element));
 };
 
 /**
@@ -150,7 +150,7 @@ DrilldownOverlayBehavior.prototype.addOverlay = function(element) {
   var button = domify('<button class="bjs-drilldown">' + ARROW_DOWN_SVG + '</button>');
 
   button.addEventListener('click', function() {
-    canvas.setRootElement(canvas.findRoot(planeId(element)));
+    canvas.setRootElement(canvas.findRoot(getPlaneIdFromShape(element)));
   });
 
   overlays.add(element, 'drilldown', {

lib/features/modeling/behavior/SubProcessPlaneBehavior.js

@@ -7,7 +7,11 @@ import { isExpanded } from '../../../util/DiUtil';
 import { getBusinessObject, is } from '../../../util/ModelUtil';
 import { getMid } from 'diagram-js/lib/layout/LayoutUtil';
 import { getBBox } from 'diagram-js/lib/util/Elements';
-import { asPlaneId, isPlane, planeId } from '../../../util/DrilldownUtil';
+import {
+  getPlaneIdFromShape,
+  isPlane,
+  toPlaneId
+} from '../../../util/DrilldownUtil';
 
 
 var LOW_PRIORITY = 400;
@@ -68,7 +72,7 @@ export default function SubProcessPlaneBehavior(
     var businessObject = getBusinessObject(shape);
     self._removeDiagram(businessObject);
 
-    var rootElement = context.newRootElement = elementRegistry.get(planeId(businessObject));
+    var rootElement = context.newRootElement = elementRegistry.get(getPlaneIdFromShape(businessObject));
 
     canvas.removeRootElement(rootElement);
   }
@@ -101,7 +105,7 @@ export default function SubProcessPlaneBehavior(
       return;
     }
 
-    var attachedRoot = elementRegistry.get(planeId(shape));
+    var attachedRoot = elementRegistry.get(getPlaneIdFromShape(shape));
 
     if (!attachedRoot) {
       return;
@@ -140,14 +144,14 @@ export default function SubProcessPlaneBehavior(
 
     // old plane could have content,
     // we remove it so it is not recursively deleted from 'shape.delete'
-    context.oldRoot = canvas.removeRootElement(planeId(oldShape));
+    context.oldRoot = canvas.removeRootElement(getPlaneIdFromShape(oldShape));
   }, true);
 
 
   this.postExecuted('shape.replace', function(context) {
     var newShape = context.newShape,
         source = context.oldRoot,
-        target = canvas.findRoot(planeId(newShape));
+        target = canvas.findRoot(getPlaneIdFromShape(newShape));
 
     if (!source || !target) {
       return;
@@ -178,19 +182,19 @@ export default function SubProcessPlaneBehavior(
     }
 
     if (isPlane(shape)) {
-      elementRegistry.updateId(shape, asPlaneId(newId));
+      elementRegistry.updateId(shape, toPlaneId(newId));
       elementRegistry.updateId(oldId, newId);
 
       return;
     }
 
-    var planeElement = elementRegistry.get(asPlaneId(oldId));
+    var planeElement = elementRegistry.get(toPlaneId(oldId));
 
     if (!planeElement) {
       return;
     }
 
-    elementRegistry.updateId(asPlaneId(oldId), asPlaneId(newId));
+    elementRegistry.updateId(toPlaneId(oldId), toPlaneId(newId));
   }, true);
 
 
@@ -211,13 +215,13 @@ export default function SubProcessPlaneBehavior(
       return;
     }
 
-    var planeElement = elementRegistry.get(asPlaneId(newId));
+    var planeElement = elementRegistry.get(toPlaneId(newId));
 
     if (!planeElement) {
       return;
     }
 
-    elementRegistry.updateId(planeElement, asPlaneId(oldId));
+    elementRegistry.updateId(planeElement, toPlaneId(oldId));
   }, true);
 
 
@@ -406,7 +410,7 @@ SubProcessPlaneBehavior.prototype._createNewDiagram = function(bpmnElement) {
   // add a virtual element (not being drawn),
   // a copy cat of our BpmnImporter code
   var planeElement = elementFactory.createRoot({
-    id: planeId(bpmnElement),
+    id: getPlaneIdFromShape(bpmnElement),
     type: bpmnElement.$type,
     di: diPlane,
     businessObject: bpmnElement,

lib/util/DrilldownUtil.js

@@ -4,47 +4,63 @@ import { getDi, is } from './ModelUtil';
 export var planeSuffix = '_plane';
 
 /**
- * Returns the ID of the plane associated with an element.
+ * Get primary shape ID for a plane.
  *
  * @param  {djs.model.Base|ModdleElement} element
- * @returns {String} id of the associated plane
+ *
+ * @returns {String}
  */
-export function planeId(element) {
+export function getShapeIdFromPlane(element) {
+  var id = element.id;
+
+  return removePlaneSuffix(id);
+}
+
+/**
+ * Get plane ID for a primary shape.
+ *
+ * @param  {djs.model.Base|ModdleElement} element
+ *
+ * @returns {String}
+ */
+export function getPlaneIdFromShape(element) {
+  var id = element.id;
+
   if (is(element, 'bpmn:SubProcess')) {
-    return element.id + planeSuffix;
+    return addPlaneSuffix(id);
   }
 
-  return element.id;
+  return id;
 }
 
 /**
- * Returns returns the plane ID for a given ID, as if it was associated with a
+ * Get plane ID for primary shape ID.
- * subprocess.
  *
- * @param {String} shape ID
+ * @param {String} id
- * @returns
+ *
+ * @returns {String}
  */
-export function asPlaneId(string) {
+export function toPlaneId(id) {
-  return string + planeSuffix;
+  return addPlaneSuffix(id);
 }
 
 /**
- * Returns wether the given element is a plane.
+ * Check wether element is plane.
  *
  * @param  {djs.model.Base|ModdleElement} element
+ *
  * @returns {Boolean}
  */
 export function isPlane(element) {
   var di = getDi(element);
+
   return is(di, 'bpmndi:BPMNPlane');
 }
 
-/**
+function addPlaneSuffix(id) {
- * Returns the ID of the primary Shape for a plane.
+  return id + planeSuffix;
- *
+}
- * @param  {djs.model.Base|ModdleElement} element
+
- * @returns {String}
+function removePlaneSuffix(id) {
- */
+  return id.replace(new RegExp(planeSuffix + '$'), '');
-export function primaryShape(element) {
-  return element.id.replace(new RegExp(planeSuffix + '$'), '');
 }