+ );
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/TransformationButton.js b/components/bpmn-q/modeler-component/editor/ui/TransformationButton.js
index 72872ad0..fdfca914 100644
--- a/components/bpmn-q/modeler-component/editor/ui/TransformationButton.js
+++ b/components/bpmn-q/modeler-component/editor/ui/TransformationButton.js
@@ -1,4 +1,4 @@
-import React, {useState} from "react";
+import React, { useState } from "react";
/**
* React button which contains a transformation function to transform the workflow. The button contains a button and a
@@ -9,34 +9,40 @@ import React, {useState} from "react";
* @constructor
*/
export default function TransformationButton(props) {
+ const {
+ title,
+ name,
+ className,
+ selectedCallback, // callback for propagating changes of the checkbox
+ isChecked, // initial value for the checkbox
+ } = props;
- const {
- transformWorkflow, // transformation function of this component
- title,
- name,
- className,
- selectedCallback, // callback for propagating changes of the checkbox
- isChecked, // initial value for the checkbox
- } = props;
+ const [checked, setChecked] = useState(isChecked);
- const [checked, setChecked] = useState(isChecked);
+ // call selectedCallback if the checkbox changes
+ const handleCheckboxChange = () => {
+ setChecked(!checked);
+ selectedCallback(!checked, name);
+ };
- // call selectedCallback if the checkbox changes
- const handleCheckboxChange = () => {
- setChecked(!checked);
- selectedCallback(!checked, name);
- };
-
- return (
-
+ );
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/TransformationToolbarButton.js b/components/bpmn-q/modeler-component/editor/ui/TransformationToolbarButton.js
index 7dd079d5..56d7133c 100644
--- a/components/bpmn-q/modeler-component/editor/ui/TransformationToolbarButton.js
+++ b/components/bpmn-q/modeler-component/editor/ui/TransformationToolbarButton.js
@@ -1,8 +1,8 @@
-import React, {useRef, useState, useEffect} from 'react';
+import React, { useRef, useState, useEffect } from "react";
import TransformationButton from "./TransformationButton";
-import {getXml, handleTransformedWorkflow} from '../util/IoUtilities';
-import NotificationHandler from './notifications/NotificationHandler';
-import {getModeler} from '../ModelerHandler';
+import { getXml, handleTransformedWorkflow } from "../util/IoUtilities";
+import NotificationHandler from "./notifications/NotificationHandler";
+import { getModeler } from "../ModelerHandler";
/**
* Component which groups the TransformationButtons defined by the plugins. Each button defines a transformation function which
@@ -16,166 +16,172 @@ import {getModeler} from '../ModelerHandler';
* @constructor
*/
export default function TransformationToolbarButton(props) {
+ const {
+ subButtons, // list of transformation buttons
+ title,
+ styleClass,
+ } = props;
- const {
- subButtons, // list of transformation buttons
- title,
- styleClass,
- } = props;
+ // flag defining if the subButtons should be displayed or not
+ const [isToggleOn, setToggleOn] = useState(false);
- // flag defining if the subButtons should be displayed or not
- const [isToggleOn, setToggleOn] = useState(false);
+ const wrapperRef = useRef(null);
- const wrapperRef = useRef(null);
+ // initially activate all transformations
+ const initialTransformationStates = {};
+ subButtons.forEach(function (button) {
+ initialTransformationStates[button.props.name] = true;
+ });
- // initially activate all transformations
- const initialTransformationStates = {};
- subButtons.forEach(function (button) {
- initialTransformationStates[button.props.name] = true;
- });
-
- /*
+ /*
Saves whether a transformation should be executed, if the state of a transformation is true,
this transformation will be executed
*/
- const [transformationStates, setTransformationStates] = useState(initialTransformationStates);
-
- // execute the transformation functions of each button
- async function startTransformation() {
-
- // get current workflow of the modeler as xml string
- const modeler = getModeler();
- let xml = await getXml(modeler);
- let tmp;
-
- // show notification if at least one transformation function is active
- if (Object.entries(transformationStates).some((state) => state[1])) {
- NotificationHandler.getInstance().displayNotification({
- type: 'info',
- title: 'Workflow Transformation Started!',
- content: 'Successfully started transformation process for the current workflow!',
- duration: 7000
- });
- }
-
- try {
- // start all active transformations
- for (let transformationButton of subButtons) {
-
- if (transformationStates[transformationButton.props.name]) {
-
- console.log('Starting Transformation for ' + transformationButton.props.name);
-
- // execute transformation function of the button
- tmp = await transformationButton.props.transformWorkflow(xml);
-
- if (tmp && tmp.status === 'transformed') {
- xml = tmp.xml;
-
- } else {
-
- // break process if one transformation failes
- const cause = tmp.cause || 'Transformation failed because of an unexpected error.';
-
- NotificationHandler.getInstance().displayNotification({
- type: 'warning',
- title: `Unable to transform ${transformationButton.props.name} elements in the workflow`,
- content: cause,
- duration: 10000
- });
- }
- }
- }
- if (xml) {
+ const [transformationStates, setTransformationStates] = useState(
+ initialTransformationStates
+ );
+
+ // execute the transformation functions of each button
+ async function startTransformation() {
+ // get current workflow of the modeler as xml string
+ const modeler = getModeler();
+ let xml = await getXml(modeler);
+ let tmp;
+
+ // show notification if at least one transformation function is active
+ if (Object.entries(transformationStates).some((state) => state[1])) {
+ NotificationHandler.getInstance().displayNotification({
+ type: "info",
+ title: "Workflow Transformation Started!",
+ content:
+ "Successfully started transformation process for the current workflow!",
+ duration: 7000,
+ });
+ }
- // handle transformed workflow (open in new tab, save to file storage etc.)
- await handleTransformedWorkflow(xml);
- }
+ try {
+ // start all active transformations
+ for (let transformationButton of subButtons) {
+ if (transformationStates[transformationButton.props.name]) {
+ console.log(
+ "Starting Transformation for " + transformationButton.props.name
+ );
+
+ // execute transformation function of the button
+ tmp = await transformationButton.props.transformWorkflow(xml);
+
+ if (tmp && tmp.status === "transformed") {
+ xml = tmp.xml;
+ } else {
+ // break process if one transformation fails
+ const cause =
+ tmp.cause ||
+ "Transformation failed because of an unexpected error.";
- } catch (error) {
NotificationHandler.getInstance().displayNotification({
- type: 'warning',
- title: 'Error during transformation',
- content: 'An unexpected error occurred during transformation. Please check the formatting of your workflow.',
- duration: 10000
+ type: "warning",
+ title: `Unable to transform ${transformationButton.props.name} elements in the workflow`,
+ content: cause,
+ duration: 10000,
});
- console.log(error);
+ return;
+ }
}
+ }
+ // handle transformed workflow (open in new tab, save to file storage etc.)
+ await handleTransformedWorkflow(xml);
+ } catch (error) {
+ NotificationHandler.getInstance().displayNotification({
+ type: "warning",
+ title: "Error during transformation",
+ content:
+ "An unexpected error occurred during transformation. Please check the formatting of your workflow.",
+ duration: 10000,
+ });
+ console.log(error);
}
-
- // callback to activate/ deactivate a transformation
- function selectedCallback(isActive, transformationName) {
- const newState = transformationStates;
- newState[transformationName] = isActive;
- setTransformationStates(newState);
+ }
+
+ // callback to activate/ deactivate a transformation
+ function selectedCallback(isActive, transformationName) {
+ const newState = transformationStates;
+ newState[transformationName] = isActive;
+ setTransformationStates(newState);
+ }
+
+ // opens/ closes subButtons by inverting isToggleOn
+ function handleClick() {
+ if (!isToggleOn) {
+ // dispatch event to close other extensible buttons
+ const newEvent = new CustomEvent("new-extensible-button-opened", {
+ detail: {
+ openButtonId: title + styleClass,
+ },
+ });
+ return document.dispatchEvent(newEvent);
}
- // opens/ closes subButtons by inverting isToggleOn
- function handleClick() {
-
- if (!isToggleOn) {
-
- // dispatch event to close other extensible buttons
- const newEvent = new CustomEvent('new-extensible-button-opened', {
- detail: {
- openButtonId: title + styleClass,
- },
- });
- return document.dispatchEvent(newEvent);
- }
-
- setToggleOn(!isToggleOn);
- }
-
- // close displayed TransformationButtons if another ExtensibleButton is opening
- const openingListener = event => {
- const currentId = title + styleClass;
- setToggleOn(currentId === event.detail.openButtonId);
+ setToggleOn(!isToggleOn);
+ }
+
+ // close displayed TransformationButtons if another ExtensibleButton is opening
+ const openingListener = (event) => {
+ const currentId = title + styleClass;
+ setToggleOn(currentId === event.detail.openButtonId);
+ };
+
+ useEffect(() => {
+ document.addEventListener("new-extensible-button-opened", openingListener);
+ return () => {
+ document.removeEventListener(
+ "new-extensible-button-opened",
+ openingListener
+ );
};
-
- useEffect(() => {
- document.addEventListener('new-extensible-button-opened', openingListener);
- return () => {
- document.removeEventListener('new-extensible-button-opened', openingListener);
- };
- }, []);
-
- return (
-
-
-
-
- startTransformation()}>
- {title}
-
-
-
-
-
-
-
-
-
-
- {isToggleOn &&
-
- {
- subButtons.map(function (entry, index) {
- return ();
- })
- }
-
- }
+ }, []);
+
+ return (
+
+
+
+
+ startTransformation()}>
+ {title}
+
+
+
+
+
+
+
+
+
+ {isToggleOn && (
+
+ {subButtons.map(function (entry, index) {
+ return (
+
- );
-}
\ No newline at end of file
+ )}
+
+ );
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/UploadButton.js b/components/bpmn-q/modeler-component/editor/ui/UploadButton.js
index fd1b8a45..43bca713 100644
--- a/components/bpmn-q/modeler-component/editor/ui/UploadButton.js
+++ b/components/bpmn-q/modeler-component/editor/ui/UploadButton.js
@@ -1,5 +1,5 @@
import React from "react";
-import { uploadToGitHub } from '../../extensions/quantme/qrm-manager/git-handler';
+import { uploadToGitHub } from "../../extensions/quantme/qrm-manager/git-handler";
import { getModeler } from "../ModelerHandler";
/**
@@ -9,13 +9,15 @@ import { getModeler } from "../ModelerHandler";
* @constructor
*/
export default function UploadButton() {
-
- return (
-
uploadToGitHub(getModeler())}>
-
- Upload
-
-
- );
-}
\ No newline at end of file
+ return (
+
uploadToGitHub(getModeler())}
+ >
+
+ Upload
+
+
+ );
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/XMLViewerButton.js b/components/bpmn-q/modeler-component/editor/ui/XMLViewerButton.js
index aa59adfd..71fc52f2 100644
--- a/components/bpmn-q/modeler-component/editor/ui/XMLViewerButton.js
+++ b/components/bpmn-q/modeler-component/editor/ui/XMLViewerButton.js
@@ -10,54 +10,55 @@ import { loadDiagram } from "../util/IoUtilities";
* @constructor
*/
export default function XMLViewerButton() {
+ const [enabledXMLView, setEnabledXMLView] = useState(false);
+ function enableXMLViewer(enabledXMLView) {
+ let modelerContainer = document.getElementById("modeler-container");
+ let editor = document.getElementById("editor");
+ let editorWrap = document.getElementById("editor_wrap");
+ let panel = document.getElementById("properties");
+ let aceEditor = ace.edit(editor);
+ if (!enabledXMLView) {
+ modelerContainer.style.height = "93vh";
+ editor.style.display = "block";
+ editor.style.height = "93vh";
+ panel.style.display = "none";
+ editorWrap.style.display = "block";
- const [enabledXMLView, setEnabledXMLView] = useState(false);
- function enableXMLViewer(enabledXMLView) {
- let modelerContainer = document.getElementById('modeler-container');
- let editor = document.getElementById('editor');
- let editorWrap = document.getElementById('editor_wrap');
- let panel = document.getElementById("properties");
- let aceEditor = ace.edit(editor);
- if (!enabledXMLView) {
- modelerContainer.style.height = '93vh';
- editor.style.display = 'block';
- editor.style.height = '93vh';
- panel.style.display = 'none';
- editorWrap.style.display = 'block';
+ // Dynamically set the value of the editor
+ let xml = getModeler().xml;
+ if (xml.xml != undefined) {
+ xml = xml.xml;
+ }
+ aceEditor.setValue(xml);
+ } else {
+ modelerContainer.style.height = "98vh";
+ editor.style.display = "none";
+ panel.style.display = "block";
+ editorWrap.style.display = "none";
- // Dynamically set the value of the editor
- let xml = getModeler().xml;
- if (xml.xml != undefined) {
- xml = xml.xml;
- }
- aceEditor.setValue(xml);
- } else {
- modelerContainer.style.height = '98vh';
- editor.style.display = 'none';
- panel.style.display = 'block';
- editorWrap.style.display = 'none';
-
-
- aceEditor.getSession().on('change', function () {
- update();
- });
-
- function update() {
- let xml = aceEditor.getSession().getValue();
- loadDiagram(xml, getModeler());
- }
- }
-
- setEnabledXMLView(!enabledXMLView)
+ aceEditor.getSession().on("change", function () {
+ update();
+ });
+ // eslint-disable-next-line no-inner-declarations
+ function update() {
+ let xml = aceEditor.getSession().getValue();
+ loadDiagram(xml, getModeler());
+ }
}
- return (
-
enableXMLViewer(enabledXMLView)}>
-
- XML Viewer
-
-
- );
-}
\ No newline at end of file
+ setEnabledXMLView(!enabledXMLView);
+ }
+
+ return (
+
enableXMLViewer(enabledXMLView)}
+ >
+
+ XML Viewer
+
+
+ );
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/modal/EscapeTrap.js b/components/bpmn-q/modeler-component/editor/ui/modal/EscapeTrap.js
index 64d61dc6..b2c2490a 100644
--- a/components/bpmn-q/modeler-component/editor/ui/modal/EscapeTrap.js
+++ b/components/bpmn-q/modeler-component/editor/ui/modal/EscapeTrap.js
@@ -9,31 +9,28 @@
*/
export default function EscapeTrap(onEscape) {
-
- function handleKeyDown(event) {
- if (isEscape(event)) {
- onEscape(event);
- }
+ function handleKeyDown(event) {
+ if (isEscape(event)) {
+ onEscape(event);
}
+ }
- function mount() {
- document.addEventListener('keydown', handleKeyDown);
- }
+ function mount() {
+ document.addEventListener("keydown", handleKeyDown);
+ }
- function unmount() {
- document.removeEventListener('keydown', handleKeyDown);
- }
-
- return {
- mount,
- unmount
- };
+ function unmount() {
+ document.removeEventListener("keydown", handleKeyDown);
+ }
+ return {
+ mount,
+ unmount,
+ };
}
-
// helpers ///////////////
function isEscape(event) {
- return event.key === 'Escape';
+ return event.key === "Escape";
}
diff --git a/components/bpmn-q/modeler-component/editor/ui/modal/FocusTrap.js b/components/bpmn-q/modeler-component/editor/ui/modal/FocusTrap.js
index ea140b29..1ae23514 100644
--- a/components/bpmn-q/modeler-component/editor/ui/modal/FocusTrap.js
+++ b/components/bpmn-q/modeler-component/editor/ui/modal/FocusTrap.js
@@ -9,115 +9,109 @@
*/
const focusableElementsSelector = [
- 'a[href]',
- 'button:not([disabled])',
- 'area[href]',
- 'input:not([disabled])',
- 'select:not([disabled])',
- 'textarea:not([disabled])',
- 'iframe',
- 'object',
- 'embed',
- '*[tabindex]',
- '*[contenteditable]'
+ "a[href]",
+ "button:not([disabled])",
+ "area[href]",
+ "input:not([disabled])",
+ "select:not([disabled])",
+ "textarea:not([disabled])",
+ "iframe",
+ "object",
+ "embed",
+ "*[tabindex]",
+ "*[contenteditable]",
].join();
export default function FocusTrap(getElement) {
+ let tabbing = false;
- let tabbing = false;
+ function restoreFocus(target) {
+ const first = getFirstFocusableElement(),
+ last = getLastFocusableElement();
- function restoreFocus(target) {
-
- const first = getFirstFocusableElement(),
- last = getLastFocusableElement();
-
- // do nothing if there is no focusable element
- if (!first) {
- return;
- }
-
- if (target !== first) {
- first.focus();
- } else {
- last.focus();
- }
- }
-
- function handleBlur(event) {
-
- // do nothing if focus stays inside the modal
- if (getElement().contains(event.relatedTarget)) {
- return;
- }
-
- if (!tabbing) {
- return;
- }
-
- restoreFocus(event.target);
+ // do nothing if there is no focusable element
+ if (!first) {
+ return;
}
- function handleKeyDown(event) {
- if (isTab(event)) {
- tabbing = true;
- }
+ if (target !== first) {
+ first.focus();
+ } else {
+ last.focus();
}
+ }
- function handleKeyUp(event) {
- tabbing = false;
+ function handleBlur(event) {
+ // do nothing if focus stays inside the modal
+ if (getElement().contains(event.relatedTarget)) {
+ return;
}
- function getFirstFocusableElement() {
- return getFocusableElements()[0];
+ if (!tabbing) {
+ return;
}
- function getLastFocusableElement() {
- const elements = getFocusableElements();
+ restoreFocus(event.target);
+ }
- return elements[elements.length - 1];
+ function handleKeyDown(event) {
+ if (isTab(event)) {
+ tabbing = true;
}
+ }
- function getFocusableElements() {
- return getElement().querySelectorAll(focusableElementsSelector);
- }
+ function handleKeyUp() {
+ tabbing = false;
+ }
- function focus() {
+ function getFirstFocusableElement() {
+ return getFocusableElements()[0];
+ }
- // focus the first focusable element if currently
- // focussed element is outside the modal
- if (getElement().contains(document.activeElement)) {
- return;
- }
+ function getLastFocusableElement() {
+ const elements = getFocusableElements();
- const focusable = getFirstFocusableElement();
+ return elements[elements.length - 1];
+ }
- focusable && focusable.focus();
+ function getFocusableElements() {
+ return getElement().querySelectorAll(focusableElementsSelector);
+ }
+
+ function focus() {
+ // focus the first focusable element if currently
+ // focussed element is outside the modal
+ if (getElement().contains(document.activeElement)) {
+ return;
}
- function mount() {
- focus();
+ const focusable = getFirstFocusableElement();
- document.addEventListener('blur', handleBlur, true);
- document.addEventListener('keydown', handleKeyDown);
- document.addEventListener('keyup', handleKeyUp);
- }
+ focusable && focusable.focus();
+ }
- function unmount() {
- document.removeEventListener('blur', handleBlur, true);
- document.removeEventListener('keydown', handleKeyDown);
- document.removeEventListener('keyup', handleKeyUp);
- }
+ function mount() {
+ focus();
- return {
- mount,
- unmount
- };
+ document.addEventListener("blur", handleBlur, true);
+ document.addEventListener("keydown", handleKeyDown);
+ document.addEventListener("keyup", handleKeyUp);
+ }
-}
+ function unmount() {
+ document.removeEventListener("blur", handleBlur, true);
+ document.removeEventListener("keydown", handleKeyDown);
+ document.removeEventListener("keyup", handleKeyUp);
+ }
+ return {
+ mount,
+ unmount,
+ };
+}
// helpers ///////////////
function isTab(event) {
- return event.key === 'Tab';
+ return event.key === "Tab";
}
diff --git a/components/bpmn-q/modeler-component/editor/ui/modal/KeyboardInteractionTrap.js b/components/bpmn-q/modeler-component/editor/ui/modal/KeyboardInteractionTrap.js
index ae12c0b0..c09af83d 100644
--- a/components/bpmn-q/modeler-component/editor/ui/modal/KeyboardInteractionTrap.js
+++ b/components/bpmn-q/modeler-component/editor/ui/modal/KeyboardInteractionTrap.js
@@ -8,10 +8,9 @@
* except in compliance with the MIT License.
*/
-import React, {PureComponent, createContext} from 'react';
+import React, { PureComponent, createContext } from "react";
-export const KeyboardInteractionTrapContext = createContext(() => {
-});
+export const KeyboardInteractionTrapContext = createContext(() => {});
/**
* A wrapper around a react component that ensures that
@@ -26,72 +25,70 @@ export const KeyboardInteractionTrapContext = createContext(() => {
* is a modal that user and keyboard focus.
*/
export default function KeyboardInteractionTrap(props) {
- return (
-
- {triggerAction => (
-
- {props.children || null}
-
- )}
-
- );
+ return (
+
+ {(triggerAction) => (
+
+ {props.children || null}
+
+ )}
+
+ );
}
class KeyboardInteractionTrapComponent extends PureComponent {
+ handleFocus = (event) => {
+ this.updateMenu(event.target);
+ };
- handleFocus = (event) => {
- this.updateMenu(event.target);
- };
+ updateMenu(element) {
+ const enabled = ["INPUT", "TEXTAREA"].includes(element.tagName);
- updateMenu(element) {
+ const editMenu = [
+ [
+ {
+ role: "undo",
+ enabled,
+ },
+ {
+ role: "redo",
+ enabled,
+ },
+ ],
+ [
+ {
+ role: "copy",
+ enabled,
+ },
+ {
+ role: "cut",
+ enabled,
+ },
+ {
+ role: "paste",
+ enabled,
+ },
+ {
+ role: "selectAll",
+ enabled,
+ },
+ ],
+ ];
- const enabled = ['INPUT', 'TEXTAREA'].includes(element.tagName);
+ this.props.triggerAction("update-menu", { editMenu });
+ }
- const editMenu = [
- [
- {
- role: 'undo',
- enabled
- },
- {
- role: 'redo',
- enabled
- },
- ],
- [
- {
- role: 'copy',
- enabled
- },
- {
- role: 'cut',
- enabled
- },
- {
- role: 'paste',
- enabled
- },
- {
- role: 'selectAll',
- enabled
- }
- ]
- ];
+ componentDidMount() {
+ window.addEventListener("focus", this.handleFocus);
- this.props.triggerAction('update-menu', {editMenu});
- }
+ this.updateMenu(document.activeElement);
+ }
- componentDidMount() {
- window.addEventListener('focus', this.handleFocus);
+ componentWillUnmount() {
+ window.removeEventListener("focus", this.handleFocus);
+ }
- this.updateMenu(document.activeElement);
- }
-
- componentWillUnmount() {
- window.removeEventListener('focus', this.handleFocus);
- }
-
- render() {
- return this.props.children;
- }
+ render() {
+ return this.props.children;
+ }
}
diff --git a/components/bpmn-q/modeler-component/editor/ui/modal/Modal.js b/components/bpmn-q/modeler-component/editor/ui/modal/Modal.js
index fdb41868..d686695e 100644
--- a/components/bpmn-q/modeler-component/editor/ui/modal/Modal.js
+++ b/components/bpmn-q/modeler-component/editor/ui/modal/Modal.js
@@ -7,72 +7,70 @@
* Camunda licenses this file to you under the MIT; you may not use this file
* except in compliance with the MIT License.
*/
-import React, {PureComponent} from 'react';
-import ReactDOM from 'react-dom';
+import React, { PureComponent } from "react";
+import ReactDOM from "react-dom";
-import classNames from 'classnames';
+import classNames from "classnames";
-import FocusTrap from './FocusTrap';
-import EscapeTrap from './EscapeTrap';
-import KeyboardInteractionTrap from './KeyboardInteractionTrap';
+import FocusTrap from "./FocusTrap";
+import EscapeTrap from "./EscapeTrap";
+import KeyboardInteractionTrap from "./KeyboardInteractionTrap";
/**
* React component to display a modal.
*/
export default class Modal extends PureComponent {
+ constructor(props) {
+ super(props);
- constructor(props) {
- super(props);
+ this.modalRef = React.createRef();
- this.modalRef = React.createRef();
+ this.focusTrap = FocusTrap(() => {
+ return this.modalRef.current;
+ });
- this.focusTrap = FocusTrap(() => {
- return this.modalRef.current;
- });
+ this.escapeTrap = EscapeTrap(() => {
+ this.close();
+ });
+ }
- this.escapeTrap = EscapeTrap(() => {
- this.close();
- });
- }
-
- close = () => {
- if (this.props.onClose) {
- return this.props.onClose();
- }
- };
-
- componentDidMount() {
- this.focusTrap.mount();
- this.escapeTrap.mount();
- }
-
- componentWillUnmount() {
- this.focusTrap.unmount();
- this.escapeTrap.unmount();
- }
-
- render() {
-
- const {
- className,
- children,
- onClose
- } = this.props;
-
- return ReactDOM.createPortal(
-
-
-
-
- {children}
- {onClose && ()}
-
-
-
,
- document.body
- );
+ close = () => {
+ if (this.props.onClose) {
+ return this.props.onClose();
}
+ };
+
+ componentDidMount() {
+ this.focusTrap.mount();
+ this.escapeTrap.mount();
+ }
+
+ componentWillUnmount() {
+ this.focusTrap.unmount();
+ this.escapeTrap.unmount();
+ }
+
+ render() {
+ const { className, children, onClose } = this.props;
+
+ return ReactDOM.createPortal(
+
+
+
+
+ {children}
+ {onClose &&
+
+
,
+ document.body
+ );
+ }
}
Modal.Body = Body;
@@ -83,65 +81,55 @@ Modal.Close = Close;
Modal.Footer = Footer;
-
function Title(props) {
- const {
- children,
- className,
- ...rest
- } = props;
-
- return (
-
-
- {children}
-
-
- );
+ const { children, className, ...rest } = props;
+
+ return (
+
+
{children}
+
+ );
}
function Close(props) {
- const {
- onClick
- } = props;
-
- return (
-
- {/*
-
-
- );
+ const { onClick } = props;
+
+ return (
+
+ {/*
+
+
+ );
}
function Body(props) {
- const {
- children,
- className,
- ...rest
- } = props;
-
- return (
-
- {children}
-
- );
+ const { children, className, ...rest } = props;
+
+ return (
+
+ {children}
+
+ );
}
function Footer(props) {
- const {
- children,
- className,
- ...rest
- } = props;
-
- return (
-
- {props.children}
-
- );
+ const { className, ...rest } = props;
+
+ return (
+
+ {props.children}
+
+ );
}
diff --git a/components/bpmn-q/modeler-component/editor/ui/modal/index.js b/components/bpmn-q/modeler-component/editor/ui/modal/index.js
index 66958478..e4020b9e 100644
--- a/components/bpmn-q/modeler-component/editor/ui/modal/index.js
+++ b/components/bpmn-q/modeler-component/editor/ui/modal/index.js
@@ -8,4 +8,4 @@
* except in compliance with the MIT License.
*/
-export {default as Modal} from './Modal';
+export { default as Modal } from "./Modal";
diff --git a/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.css b/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.css
index fdb63990..33d47382 100644
--- a/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.css
+++ b/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.css
@@ -1,39 +1,39 @@
.qwm-Notification {
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
- font-size: 12px;
- box-sizing: border-box;
- width: 300px;
- background: var(--color-ffffff);
- box-shadow: 0 1px 4px var(--color-000000-opacity-10);
- border-radius: 2px;
- padding: 20px;
- margin-bottom: 20px;
+ font-size: 12px;
+ box-sizing: border-box;
+ width: 300px;
+ background: var(--color-ffffff);
+ box-shadow: 0 1px 4px var(--color-000000-opacity-10);
+ border-radius: 2px;
+ padding: 20px;
+ margin-bottom: 20px;
}
.qwm-Notification h2 {
- margin: 0;
- font-weight: normal;
+ margin: 0;
+ font-weight: normal;
}
.qwm-Notification .qwm-content {
- margin-top: 10px;
+ margin-top: 10px;
}
.qwm-Notification .qwm-close {
- vertical-align: middle;
- padding: 0 2px;
- margin-left: 3px;
- font-size: 18px;
- line-height: 9px;
- width: 13px;
- float: right;
+ vertical-align: middle;
+ padding: 0 2px;
+ margin-left: 3px;
+ font-size: 18px;
+ line-height: 9px;
+ width: 13px;
+ float: right;
}
.qwm-Notification .qwm-close:before {
- content: '×';
+ content: "×";
}
.qwm-Notification .qwm-close:hover {
- color: var(--blue-darken-48);
-}
\ No newline at end of file
+ color: var(--blue-darken-48);
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.js b/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.js
index 3cafffec..df088c03 100644
--- a/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.js
+++ b/components/bpmn-q/modeler-component/editor/ui/notifications/Notification.js
@@ -8,9 +8,9 @@
* except in compliance with the MIT License.
*/
-import React, {PureComponent} from 'react';
+import React, { PureComponent } from "react";
-export const NOTIFICATION_TYPES = ['info', 'success', 'error', 'warning'];
+export const NOTIFICATION_TYPES = ["info", "success", "error", "warning"];
/**
* React component to display notifications
@@ -18,65 +18,61 @@ export const NOTIFICATION_TYPES = ['info', 'success', 'error', 'warning'];
* @type {string[]}
*/
export default class Notification extends PureComponent {
- static getDerivedStateFromError() {
- return {error: true};
- }
+ static getDerivedStateFromError() {
+ return { error: true };
+ }
- state = {
- error: false
- };
+ state = {
+ error: false,
+ };
- componentDidMount() {
- const {duration} = this.props;
+ componentDidMount() {
+ const { duration } = this.props;
- if (duration) {
- this.setupTimeout(duration);
- }
+ if (duration) {
+ this.setupTimeout(duration);
}
+ }
- componentDidUpdate(previousProps) {
- const currentDuration = this.props.duration;
-
- const {duration: previousDuration} = previousProps;
-
- if (currentDuration !== previousDuration) {
- this.resetTimeout();
+ componentDidUpdate(previousProps) {
+ const currentDuration = this.props.duration;
- currentDuration && this.setupTimeout(currentDuration);
- }
- }
-
- componentWillUnmount() {
- this.resetTimeout();
- }
+ const { duration: previousDuration } = previousProps;
- setupTimeout(duration) {
- this.timeout = setTimeout(() => {
- this.props.close();
- }, duration);
- }
-
- resetTimeout() {
- this.timeout && clearTimeout(this.timeout);
- }
-
- componentDidCatch() {
- this.props.close();
- }
+ if (currentDuration !== previousDuration) {
+ this.resetTimeout();
- render() {
- const {
- close,
- content,
- title,
- } = this.props;
-
- return this.state.error ? null :
-
-
- {title}
-
- {content && {content}
}
- ;
+ currentDuration && this.setupTimeout(currentDuration);
}
+ }
+
+ componentWillUnmount() {
+ this.resetTimeout();
+ }
+
+ setupTimeout(duration) {
+ this.timeout = setTimeout(() => {
+ this.props.close();
+ }, duration);
+ }
+
+ resetTimeout() {
+ this.timeout && clearTimeout(this.timeout);
+ }
+
+ componentDidCatch() {
+ this.props.close();
+ }
+
+ render() {
+ const { close, content, title } = this.props;
+
+ return this.state.error ? null : (
+
+
+
{title}
+ {content &&
{content}
}
+
+ );
+ }
}
diff --git a/components/bpmn-q/modeler-component/editor/ui/notifications/NotificationHandler.js b/components/bpmn-q/modeler-component/editor/ui/notifications/NotificationHandler.js
index b65579b7..ba1ce2c4 100644
--- a/components/bpmn-q/modeler-component/editor/ui/notifications/NotificationHandler.js
+++ b/components/bpmn-q/modeler-component/editor/ui/notifications/NotificationHandler.js
@@ -1,7 +1,7 @@
import React from "react";
import Notifications from "./Notifications";
-export const NOTIFICATION_TYPES = ['info', 'success', 'error', 'warning'];
+export const NOTIFICATION_TYPES = ["info", "success", "error", "warning"];
/**
* Handler to manage notifications displayed to the user. Use getInstance() to get the current instance of the handler.
@@ -9,62 +9,66 @@ export const NOTIFICATION_TYPES = ['info', 'success', 'error', 'warning'];
* Implements the Singleton pattern.
*/
export default class NotificationHandler {
+ static instance = undefined;
- static instance = undefined;
-
- static getInstance() {
- if (this.instance) {
- return this.instance;
- } else {
- this.instance = new NotificationHandler([]);
- return this.instance;
- }
+ static getInstance() {
+ if (this.instance) {
+ return this.instance;
+ } else {
+ this.instance = new NotificationHandler([]);
+ return this.instance;
}
+ }
- constructor(notifications) {
- this.notifications = notifications;
- this.currentNotificationId = -1;
- this.notificationRef = React.createRef();
- }
+ constructor(notifications) {
+ this.notifications = notifications;
+ this.currentNotificationId = -1;
+ this.notificationRef = React.createRef();
+ }
- /**
- * Creates a new Notifications React Component with a fixed ref to access the methods of the component.
- *
- * @param notifications The initial set of components to display wright after creation.
- * @param notificationsContainer DOM element the notifications are rendered into.
- * @returns the created Notifications React Component
- */
- createNotificationsComponent(notifications, notificationsContainer) {
- if (notifications) {
- this.notifications = notifications;
- }
- return
;
+ /**
+ * Creates a new Notifications React Component with a fixed ref to access the methods of the component.
+ *
+ * @param notifications The initial set of components to display wright after creation.
+ * @param notificationsContainer DOM element the notifications are rendered into.
+ * @returns the created Notifications React Component
+ */
+ createNotificationsComponent(notifications, notificationsContainer) {
+ if (notifications) {
+ this.notifications = notifications;
}
+ return (
+ {notificationComponents}
, this.container);
- }
-}
\ No newline at end of file
+ const id = this.currentNotificationId++;
+
+ const close = () => {
+ console.log("close");
+ this._closeNotification(id);
+ };
+
+ const update = (newProps) => {
+ this._updateNotification(id, newProps);
+ };
+
+ const notification = {
+ content,
+ duration,
+ id,
+ close,
+ title,
+ type,
+ };
+
+ this.setState({
+ notifications: [...notifications, notification],
+ });
+
+ return {
+ close,
+ update,
+ };
+ }
+
+ /**
+ * Close all displayed Notifications.
+ */
+ closeNotifications() {
+ this.setState({ notifications: [] });
+ }
+
+ _updateNotification(id, options) {
+ const notifications = this.state.notifications.map((notification) => {
+ const { id: currentId } = notification;
+
+ return currentId !== id ? notification : { ...notification, ...options };
+ });
+
+ this.setState({ notifications: notifications });
+ }
+
+ /**
+ * Close the Notification with the given ID.
+ *
+ * @param id The ID of the Notification to close.
+ * @private
+ */
+ _closeNotification(id) {
+ const notifications = this.state.notifications.filter(
+ ({ id: currentId }) => currentId !== id
+ );
+ this.setState({ notifications: notifications });
+ }
+
+ render() {
+ let { notifications } = this.state;
+ notifications = notifications || [];
+ const notificationComponents = notifications
+ .map(({ id, ...props }) => {
+ return {notificationComponents}
,
+ this.container
+ );
+ }
+}
diff --git a/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationSpec.js b/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationSpec.js
index 647f922d..50d66299 100644
--- a/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationSpec.js
+++ b/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationSpec.js
@@ -10,44 +10,36 @@
/* global sinon */
-import React from 'react';
+import React from "react";
-import {
- mount,
- shallow
-} from 'enzyme';
+import { mount, shallow } from "enzyme";
-import Notification from '../Notification';
-import {describe, it, after, before} from "mocha";
+import Notification from "../Notification";
+import { describe, it, after, before } from "mocha";
-const { expect } = require('chai')
+const { expect } = require("chai");
-describe('', function() {
-
- it('should render', function() {
+describe("", function () {
+ it("should render", function () {
shallow( is set', function() {
-
+ it("should close automatically when is set", function () {
// given
const closeSpy = sinon.spy();
- shallow(', function() {
expect(closeSpy).to.have.been.calledOnce;
});
-
- it('should handle changes', function() {
-
+ it("should handle changes", function () {
// given
const closeSpy = sinon.spy();
- const notification = shallow(', function() {
expect(closeSpy).to.have.been.calledOnce;
});
-
- it('should NOT close automatically when is NOT set', function() {
-
+ it("should NOT close automatically when is NOT set", function () {
// given
const closeSpy = sinon.spy();
- shallow(', function() {
// then
expect(closeSpy).to.have.not.been.called;
});
-
});
-
- describe('error boundary', function() {
-
+ describe("error boundary", function () {
let wrapper;
- afterEach(function() {
+ afterEach(function () {
wrapper && wrapper.unmount();
});
-
- it('should close notification if it throws', function() {
-
+ it("should close notification if it throws", function () {
// given
- const Content = () => 'content';
+ const Content = () => "content";
const closeSpy = sinon.spy();
- wrapper = mount(', function() {
// then
expect(closeSpy).to.have.been.calledOnce;
});
-
});
-
});
diff --git a/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationsSpec.js b/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationsSpec.js
index fb25bb12..8ba39f03 100644
--- a/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationsSpec.js
+++ b/components/bpmn-q/modeler-component/editor/ui/notifications/__tests__/NotificationsSpec.js
@@ -8,35 +8,30 @@
* except in compliance with the MIT License.
*/
-import React from 'react';
+import React from "react";
-import { shallow } from 'enzyme';
+import { shallow } from "enzyme";
-import Notifications from '..';
-import Notification from '../Notification';
+import Notifications from "..";
+import Notification from "../Notification";
+import { expect } from "chai";
-
-describe('', function() {
-
- it('should render', function() {
- shallow(", function () {
+ it("should render", function () {
+ shallow(\n' +
- ' \n' +
- ' \n' +
- ' \n' +
- ' \n' +
- ' \n' +
- ' \n' +
- ' \n' +
- ' \n' +
- ' ';
+const NEW_DIAGRAM_XML =
+ '\n' +
+ '\n' +
+ ' \n' +
+ ' \n" +
+ ' \n' +
+ ' \n' +
+ ' \n' +
+ ' \n" +
+ " \n" +
+ " \n" +
+ " ";
/**
* Saves a given bpmn diagram as a bpmn file to the locale storage of the user.
@@ -29,15 +35,22 @@ const NEW_DIAGRAM_XML = '\n' +
* @param fileName The name of the file.
* @returns {Promise}
*/
-export async function saveXmlAsLocalFile(xml, fileName = editorConfig.getFileName()) {
- const bpmnFile = await new File([xml], fileName, { type: 'text/xml' });
-
- const link = document.createElement('a');
- link.download = fileName + '.bpmn';
- link.href = URL.createObjectURL(bpmnFile);
- link.click();
-
- dispatchWorkflowEvent(workflowEventTypes.SAVED, xml, editorConfig.getFileName());
+export async function saveXmlAsLocalFile(
+ xml,
+ fileName = editorConfig.getFileName()
+) {
+ const bpmnFile = await new File([xml], fileName, { type: "text/xml" });
+
+ const link = document.createElement("a");
+ link.download = fileName + ".bpmn";
+ link.href = URL.createObjectURL(bpmnFile);
+ link.click();
+
+ dispatchWorkflowEvent(
+ workflowEventTypes.SAVED,
+ xml,
+ editorConfig.getFileName()
+ );
}
/**
@@ -47,19 +60,32 @@ export async function saveXmlAsLocalFile(xml, fileName = editorConfig.getFileNam
* @param fileName The name of the file.
* @returns {Promise}
*/
-export async function saveModelerAsLocalFile(modeler, fileName = editorConfig.getFileName(), fileFormat = editorConfig.getFileFormat(), openWindow = true) {
- const xml = await getXml(modeler);
- if (fileFormat === saveFileFormats.BPMN || fileFormat === saveFileFormats.ALL) {
- if (openWindow) {
- await openFileDialog(xml, fileName, saveFileFormats.BPMN);
- } else {
- await saveXmlAsLocalFile(xml, fileName);
- }
- }
-
- if (fileFormat === saveFileFormats.ALL || fileFormat === saveFileFormats.SVG || fileFormat === saveFileFormats.PNG) {
- await saveWorkflowAsSVG(modeler, fileName, fileFormat);
+export async function saveModelerAsLocalFile(
+ modeler,
+ fileName = editorConfig.getFileName(),
+ fileFormat = editorConfig.getFileFormat(),
+ openWindow = true
+) {
+ const xml = await getXml(modeler);
+ if (
+ fileFormat === saveFileFormats.BPMN ||
+ fileFormat === saveFileFormats.ALL
+ ) {
+ if (openWindow) {
+ await openFileDialog(modeler, xml, fileName, saveFileFormats.BPMN);
+ } else {
+ modeler.oldXml = xml;
+ await saveXmlAsLocalFile(xml, fileName);
}
+ }
+
+ if (
+ fileFormat === saveFileFormats.ALL ||
+ fileFormat === saveFileFormats.SVG ||
+ fileFormat === saveFileFormats.PNG
+ ) {
+ await saveWorkflowAsSVG(modeler, fileName, fileFormat);
+ }
}
/**
@@ -69,8 +95,8 @@ export async function saveModelerAsLocalFile(modeler, fileName = editorConfig.ge
* @returns {Promise<*>} The xml diagram.
*/
export async function getXml(modeler) {
- const { xml } = await modeler.saveXML({ format: true });
- return xml;
+ const { xml } = await modeler.saveXML({ format: true });
+ return xml;
}
/**
@@ -82,22 +108,26 @@ export async function getXml(modeler) {
* @returns {Promise} Undefined, if an error occurred during import.
*/
export async function loadDiagram(xml, modeler, dispatchEvent = true) {
- if (xml !== '') {
- try {
- const result = await modeler.importXML(xml);
- modeler.xml = xml;
-
- if (dispatchEvent) {
- dispatchWorkflowEvent(workflowEventTypes.LOADED, xml, editorConfig.getFileName());
- }
-
- return result;
- } catch (err) {
- console.error(err);
-
- return { error: err };
- }
+ if (xml !== "") {
+ try {
+ const result = await modeler.importXML(xml);
+ modeler.xml = xml;
+
+ if (dispatchEvent) {
+ dispatchWorkflowEvent(
+ workflowEventTypes.LOADED,
+ xml,
+ editorConfig.getFileName()
+ );
+ }
+
+ return result;
+ } catch (err) {
+ console.error(err);
+
+ return { error: err };
}
+ }
}
/**
@@ -106,7 +136,7 @@ export async function loadDiagram(xml, modeler, dispatchEvent = true) {
* @param modeler the given modeler to open the new bpmn diagram in.
*/
export function createNewDiagram(modeler) {
- loadDiagram(NEW_DIAGRAM_XML, modeler).then();
+ loadDiagram(NEW_DIAGRAM_XML, modeler).then();
}
/**
@@ -117,70 +147,103 @@ export function createNewDiagram(modeler) {
* @param viewMap a list of views to deploy with the workflow, i.e., the name of the view and the corresponding xml
* @return {Promise<{status: string}>} a promise with the deployment status as well as the endpoint of the deployed workflow if successful
*/
-export async function deployWorkflowToCamunda(workflowName, workflowXml, viewMap) {
- console.log('Deploying workflow to Camunda Engine at endpoint: %s', editorConfig.getCamundaEndpoint());
-
- // add required form data fields
- const form = new FormData();
- form.append('deployment-name', workflowName);
- form.append('deployment-source', 'QuantME Modeler');
- form.append('deploy-changed-only', 'false');
-
- // add bpmn file ending if not present
- let fileName = workflowName;
- if (!fileName.endsWith('.bpmn')) {
- fileName = fileName + '.bpmn';
- }
-
- // add diagram to the body
- const bpmnFile = new File([workflowXml], fileName, { type: 'text/xml' });
- form.append('data', bpmnFile);
-
- // upload all provided views
- for (const [key, value] of Object.entries(viewMap)) {
- console.info('Adding view with name: ', key);
-
- // add view xml to the body
- form.append(key, value, {
- filename: fileName.replace('.bpmn', key + '.xml'),
- contentType: 'text/xml'
- });
- }
-
- // make the request and wait for the response of the deployment endpoint
- try {
- const response = await fetch(editorConfig.getCamundaEndpoint() + '/deployment/create', {
- method: 'POST',
- body: form,
- });
-
- if (response.ok) {
-
- // retrieve deployment results from response
- const result = await response.json();
- console.info('Deployment provides result: ', result);
- console.info('Deployment successful with deployment id: %s', result['id']);
-
- // abort if there is not exactly one deployed process definition
- if (Object.values(result['deployedProcessDefinitions'] || {}).length !== 1) {
- console.error('Invalid size of deployed process definitions list: ' + Object.values(result['deployedProcessDefinitions'] || {}).length);
- return { status: 'failed' };
- }
-
- dispatchWorkflowEvent(workflowEventTypes.DEPLOYED, workflowXml, workflowName);
-
- return {
- status: 'deployed',
- deployedProcessDefinition: Object.values(result['deployedProcessDefinitions'] || {})[0]
- };
- } else {
- console.error('Deployment of workflow returned invalid status code: %s', response.status);
- return { status: 'failed', message: 'Deployment of workflow returned invalid response: ' + response };
- }
- } catch (error) {
- console.error('Error while executing post to deploy workflow: ' + error);
- return { status: 'failed', message: 'Error while executing post to deploy workflow: ' + error };
+export async function deployWorkflowToCamunda(
+ workflowName,
+ workflowXml,
+ viewMap
+) {
+ console.log(
+ "Deploying workflow to Camunda Engine at endpoint: %s",
+ editorConfig.getCamundaEndpoint()
+ );
+
+ // add required form data fields
+ const form = new FormData();
+ form.append("deployment-name", workflowName);
+ form.append("deployment-source", "QuantME Modeler");
+ form.append("deploy-changed-only", "false");
+
+ // add bpmn file ending if not present
+ let fileName = workflowName;
+ if (!fileName.endsWith(".bpmn")) {
+ fileName = fileName + ".bpmn";
+ }
+
+ // add diagram to the body
+ const bpmnFile = new File([workflowXml], fileName, { type: "text/xml" });
+ form.append("data", bpmnFile);
+
+ // upload all provided views
+ for (const [key, value] of Object.entries(viewMap)) {
+ console.info("Adding view with name: ", key);
+
+ // add view xml to the body
+ form.append(key, value, {
+ filename: fileName.replace(".bpmn", key + ".xml"),
+ contentType: "text/xml",
+ });
+ }
+
+ // make the request and wait for the response of the deployment endpoint
+ try {
+ const response = await fetch(
+ editorConfig.getCamundaEndpoint() + "/deployment/create",
+ {
+ method: "POST",
+ body: form,
+ }
+ );
+
+ if (response.ok) {
+ // retrieve deployment results from response
+ const result = await response.json();
+ console.info("Deployment provides result: ", result);
+ console.info(
+ "Deployment successful with deployment id: %s",
+ result["id"]
+ );
+
+ // abort if there is not exactly one deployed process definition
+ if (
+ Object.values(result["deployedProcessDefinitions"] || {}).length !== 1
+ ) {
+ console.error(
+ "Invalid size of deployed process definitions list: " +
+ Object.values(result["deployedProcessDefinitions"] || {}).length
+ );
+ return { status: "failed" };
+ }
+
+ dispatchWorkflowEvent(
+ workflowEventTypes.DEPLOYED,
+ workflowXml,
+ workflowName
+ );
+
+ return {
+ status: "deployed",
+ deployedProcessDefinition: Object.values(
+ result["deployedProcessDefinitions"] || {}
+ )[0],
+ };
+ } else {
+ console.error(
+ "Deployment of workflow returned invalid status code: %s",
+ response.status
+ );
+ return {
+ status: "failed",
+ message:
+ "Deployment of workflow returned invalid response: " + response,
+ };
}
+ } catch (error) {
+ console.error("Error while executing post to deploy workflow: " + error);
+ return {
+ status: "failed",
+ message: "Error while executing post to deploy workflow: " + error,
+ };
+ }
}
/**
@@ -191,28 +254,33 @@ export async function deployWorkflowToCamunda(workflowName, workflowXml, viewMap
* @returns {Promise}
*/
export async function handleTransformedWorkflow(workflowXml) {
- const fileName = editorConfig.getFileName().split('.')[0] + '_transformed.bpmn';
-
- // dispatch workflow transformed event
- const eventNotCaught = dispatchWorkflowEvent(workflowEventTypes.TRANSFORMED, workflowXml, fileName);
-
- console.log(`Transformed Workflow Event caught? - ${eventNotCaught}`);
-
- // execute respective handle function if event was not already solved
- if (eventNotCaught) {
- const handlerId = editorConfig.getTransformedWorkflowHandler();
-
- switch (handlerId) {
- case transformedWorkflowHandlers.NEW_TAB: // open workflow in new browser tab
- openInNewTab(workflowXml, fileName);
- break;
- case transformedWorkflowHandlers.SAVE_AS_FILE: // save workflow to local file system
- await saveXmlAsLocalFile(workflowXml, fileName);
- break;
- default:
- console.log(`Invalid transformed workflow handler ID ${handlerId}`);
- }
+ const fileName =
+ editorConfig.getFileName().split(".")[0] + "_transformed.bpmn";
+
+ // dispatch workflow transformed event
+ const eventNotCaught = dispatchWorkflowEvent(
+ workflowEventTypes.TRANSFORMED,
+ workflowXml,
+ fileName
+ );
+
+ console.log(`Transformed Workflow Event caught? - ${eventNotCaught}`);
+
+ // execute respective handle function if event was not already solved
+ if (eventNotCaught) {
+ const handlerId = editorConfig.getTransformedWorkflowHandler();
+
+ switch (handlerId) {
+ case transformedWorkflowHandlers.NEW_TAB: // open workflow in new browser tab
+ openInNewTab(workflowXml, fileName);
+ break;
+ case transformedWorkflowHandlers.SAVE_AS_FILE: // save workflow to local file system
+ await saveXmlAsLocalFile(workflowXml, fileName);
+ break;
+ default:
+ console.log(`Invalid transformed workflow handler ID ${handlerId}`);
}
+ }
}
/**
@@ -222,125 +290,149 @@ export async function handleTransformedWorkflow(workflowXml) {
* @param fileName The name of the workflow.
*/
export function openInNewTab(workflowXml, fileName) {
-
- const newWindow = window.open(window.location.href, "_blank");
-
- newWindow.onload = function () {
-
- // Pass the XML string to the new window using postMessage
- newWindow.postMessage({ workflow: workflowXml, name: fileName }, window.location.href);
- };
+ const newWindow = window.open(window.location.href, "_blank");
+
+ newWindow.onload = function () {
+ // Pass the XML string to the new window using postMessage
+ newWindow.postMessage(
+ { workflow: workflowXml, name: fileName },
+ window.location.href
+ );
+ };
}
-export function setAutoSaveInterval(autoSaveFileOption = editorConfig.getAutoSaveFileOption()) {
- if (autoSaveFileOption === autoSaveFile.INTERVAL) {
- getModeler().autosaveIntervalId = setInterval(() => { saveFile(); }, editorConfig.getAutoSaveIntervalSize());
- } else {
- saveFile();
- }
+export function setAutoSaveInterval(
+ autoSaveFileOption = editorConfig.getAutoSaveFileOption()
+) {
+ if (autoSaveFileOption === autoSaveFile.INTERVAL) {
+ getModeler().autosaveIntervalId = setInterval(() => {
+ saveFile();
+ }, editorConfig.getAutoSaveIntervalSize());
+ } else {
+ saveFile();
+ }
}
export function saveFile() {
- // extract the xml and save it to a file
- getModeler().saveXML({ format: true }, function (err, xml) {
- if (!err) {
- let oldXml = getModeler().oldXml;
- if (oldXml !== xml && oldXml !== undefined) {
- // Save the XML
- console.log('Autosaved:', xml);
- getModeler().oldXml = xml;
- const timestamp = getTimestamp();
- const filename = `${editorConfig.getFileName().replace('.bpmn','')}_autosave_${timestamp}`;
- saveXmlAsLocalFile(xml, filename);
- }
- }
- });
+ // extract the xml and save it to a file
+ getModeler().saveXML({ format: true }, function (err, xml) {
+ if (!err) {
+ let oldXml = getModeler().oldXml;
+ if (oldXml !== xml && oldXml !== undefined) {
+ // Save the XML
+ console.log("Autosaved:", xml);
+ getModeler().oldXml = xml;
+ const timestamp = getTimestamp();
+ const filename = `${editorConfig
+ .getFileName()
+ .replace(".bpmn", "")}_autosave_${timestamp}`;
+ saveXmlAsLocalFile(xml, filename);
+ }
+ }
+ });
}
function getTimestamp() {
- const date = new Date();
- return date.toISOString().replace(/:/g, '-');
+ const date = new Date();
+ return date.toISOString().replace(/:/g, "-");
}
export async function saveWorkflowAsSVG(modeler, fileName, fileFormat) {
- modeler.saveSVG({ format: true }, function (error, svg) {
- if (error) {
- return;
- }
-
- if (fileFormat === saveFileFormats.ALL || fileFormat === saveFileFormats.SVG) {
- openFileDialog(svg, fileName, saveFileFormats.SVG)
- }
- if (fileFormat === saveFileFormats.ALL || fileFormat === saveFileFormats.PNG) {
- convertSvgToPng(svg, fileName, saveFileFormats.PNG);
- }
- });
+ modeler.saveSVG({ format: true }, function (error, svg) {
+ if (error) {
+ return;
+ }
+
+ if (
+ fileFormat === saveFileFormats.ALL ||
+ fileFormat === saveFileFormats.SVG
+ ) {
+ openFileDialog(modeler, svg, fileName, saveFileFormats.SVG);
+ }
+ if (
+ fileFormat === saveFileFormats.ALL ||
+ fileFormat === saveFileFormats.PNG
+ ) {
+ convertSvgToPng(svg, fileName, saveFileFormats.PNG);
+ }
+ });
}
// Function to convert SVG to PNG using an external library
function convertSvgToPng(svg, fileName, fileFormat) {
- var img = new Image();
- img.onload = function () {
- var canvas = document.createElement('canvas');
- canvas.width = img.width;
- canvas.height = img.height;
- var ctx = canvas.getContext('2d');
- ctx.drawImage(img, 0, 0, img.width, img.height);
- var pngDataUrl = canvas.toDataURL('image/png');
- downloadPng(pngDataUrl, fileName, fileFormat);
- };
- img.src = 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svg)));
+ var img = new Image();
+ img.onload = function () {
+ var canvas = document.createElement("canvas");
+ canvas.width = img.width;
+ canvas.height = img.height;
+ var ctx = canvas.getContext("2d");
+ ctx.drawImage(img, 0, 0, img.width, img.height);
+ var pngDataUrl = canvas.toDataURL("image/png");
+ downloadPng(pngDataUrl, fileName, fileFormat);
+ };
+ img.src =
+ "data:image/svg+xml;base64," + btoa(unescape(encodeURIComponent(svg)));
}
// Function to initiate the PNG download
function downloadPng(pngDataUrl, fileName, fileFormat) {
- openFileUrlDialog(pngDataUrl, fileName, fileFormat);
+ openFileUrlDialog(pngDataUrl, fileName, fileFormat);
}
-async function openFileDialog(content, fileName, fileFormat) {
- let suggestedName = fileName;
- if (suggestedName.includes('.bpmn')) {
- suggestedName = fileName.split('.bpmn')[0];
- }
- let fileHandle = await window.showSaveFilePicker({
- startIn: 'downloads', suggestedName: suggestedName + fileFormat, types: [
- {
- description: "BPMN file",
- accept: { "text/plain": [".bpmn"] },
- },
- {
- description: "SVG file",
- accept: { "text/plain": [".svg"] },
- }
- ]
- });
- writeFile(fileHandle, content);
+async function openFileDialog(modeler, content, fileName, fileFormat) {
+ let suggestedName = fileName;
+ if (suggestedName.includes(".bpmn")) {
+ suggestedName = fileName.split(".bpmn")[0];
+ }
+ let fileHandle = await window.showSaveFilePicker({
+ startIn: "downloads",
+ suggestedName: suggestedName + fileFormat,
+ types: [
+ {
+ description: "BPMN file",
+ accept: { "text/plain": [".bpmn"] },
+ },
+ {
+ description: "SVG file",
+ accept: { "text/plain": [".svg"] },
+ },
+ ],
+ });
+ writeFile(fileHandle, content);
+ if (
+ fileFormat === saveFileFormats.BPMN ||
+ fileFormat === saveFileFormats.ALL
+ ) {
+ modeler.oldXml = content;
+ }
}
async function openFileUrlDialog(content, fileName, fileFormat) {
- let suggestedName = fileName;
- if (suggestedName.includes('.bpmn')) {
- suggestedName = fileName.split('.bpmn')[0];
- }
- let fileHandle = await window.showSaveFilePicker({
- startIn: 'downloads', suggestedName: suggestedName + fileFormat, types: [
- {
- description: "PNG file",
- accept: { "text/plain": [".png"] },
- }
- ]
- });
- writeURLToFile(fileHandle, content);
+ let suggestedName = fileName;
+ if (suggestedName.includes(".bpmn")) {
+ suggestedName = fileName.split(".bpmn")[0];
+ }
+ let fileHandle = await window.showSaveFilePicker({
+ startIn: "downloads",
+ suggestedName: suggestedName + fileFormat,
+ types: [
+ {
+ description: "PNG file",
+ accept: { "text/plain": [".png"] },
+ },
+ ],
+ });
+ writeURLToFile(fileHandle, content);
}
async function writeFile(fileHandle, contents) {
- const writable = await fileHandle.createWritable();
- await writable.write(contents);
- await writable.close();
+ const writable = await fileHandle.createWritable();
+ await writable.write(contents);
+ await writable.close();
}
async function writeURLToFile(fileHandle, url) {
- const writable = await fileHandle.createWritable();
- const response = await fetch(url);
- await response.body.pipeTo(writable);
-}
\ No newline at end of file
+ const writable = await fileHandle.createWritable();
+ const response = await fetch(url);
+ await response.body.pipeTo(writable);
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/ModellingUtilities.js b/components/bpmn-q/modeler-component/editor/util/ModellingUtilities.js
index 07f57e2a..be056752 100644
--- a/components/bpmn-q/modeler-component/editor/util/ModellingUtilities.js
+++ b/components/bpmn-q/modeler-component/editor/util/ModellingUtilities.js
@@ -1,8 +1,7 @@
-import { createTempModelerFromXml } from '../ModelerHandler';
-import { getInputOutput } from './camunda-utils/InputOutputUtil';
-import { getExtension } from './camunda-utils/ExtensionElementsUtil';
-import { useService } from 'bpmn-js-properties-panel';
-import { is } from 'bpmn-js/lib/util/ModelUtil';
+import { createTempModelerFromXml } from "../ModelerHandler";
+import { getInputOutput } from "./camunda-utils/InputOutputUtil";
+import { getExtension } from "./camunda-utils/ExtensionElementsUtil";
+import { is } from "bpmn-js/lib/util/ModelUtil";
/**
* Returns all start events of the workflow defined by the process businessObject
@@ -11,7 +10,9 @@ import { is } from 'bpmn-js/lib/util/ModelUtil';
* @returns {*[]} All found start event elements of the workflow.
*/
export function getStartEvents(processBo) {
- return processBo.flowElements.filter((element) => element.$type === 'bpmn:StartEvent');
+ return processBo.flowElements.filter(
+ (element) => element.$type === "bpmn:StartEvent"
+ );
}
/**
@@ -22,28 +23,34 @@ export function getStartEvents(processBo) {
* @param processVariable The process variable which should be created through the executionn listener
*/
export function addExecutionListener(element, moddle, processVariable) {
-
- // create the execution listener for the process variable
- const listener = {
- event: 'start',
- expression: '${execution.setVariable("' + processVariable.name + '", ' + processVariable.value + ')}',
- };
-
- const elementBo = element.businessObject;
- let extensionElements = elementBo.extensionElements;
-
- // create new extension element if needed
- if (!extensionElements) {
- extensionElements = moddle.create('bpmn:ExtensionElements');
- }
-
- if (!extensionElements.values) {
- extensionElements.values = [];
- }
-
- // add execution listener to the extension element of the element
- extensionElements.values.push(moddle.create('camunda:ExecutionListener', listener));
- elementBo.extensionElements = extensionElements;
+ // create the execution listener for the process variable
+ const listener = {
+ event: "start",
+ expression:
+ '${execution.setVariable("' +
+ processVariable.name +
+ '", ' +
+ processVariable.value +
+ ")}",
+ };
+
+ const elementBo = element.businessObject;
+ let extensionElements = elementBo.extensionElements;
+
+ // create new extension element if needed
+ if (!extensionElements) {
+ extensionElements = moddle.create("bpmn:ExtensionElements");
+ }
+
+ if (!extensionElements.values) {
+ extensionElements.values = [];
+ }
+
+ // add execution listener to the extension element of the element
+ extensionElements.values.push(
+ moddle.create("camunda:ExecutionListener", listener)
+ );
+ elementBo.extensionElements = extensionElements;
}
/**
@@ -57,19 +64,31 @@ export function addExecutionListener(element, moddle, processVariable) {
* @param moddle The moddle module of the bpmn-js modeler
* @param modeling The modeling module of the bpmn-js modeler
*/
-export function addFormFieldForMap(elementID, name, keyValueMap, elementRegistry, moddle, modeling) {
-
- // create the properties of the form field
- let formFieldData =
- {
- defaultValue: '',
- id: name.replace(/\s+/g, '_'),
- label: name,
- type: 'string',
- };
-
- // create the form field for the key value map
- addFormFieldDataForMap(elementID, formFieldData, keyValueMap, elementRegistry, moddle, modeling);
+export function addFormFieldForMap(
+ elementID,
+ name,
+ keyValueMap,
+ elementRegistry,
+ moddle,
+ modeling
+) {
+ // create the properties of the form field
+ let formFieldData = {
+ defaultValue: "",
+ id: name.replace(/\s+/g, "_"),
+ label: name,
+ type: "string",
+ };
+
+ // create the form field for the key value map
+ addFormFieldDataForMap(
+ elementID,
+ formFieldData,
+ keyValueMap,
+ elementRegistry,
+ moddle,
+ modeling
+ );
}
/**
@@ -83,13 +102,19 @@ export function addFormFieldForMap(elementID, name, keyValueMap, elementRegistry
* @param moddle The moddle module of the bpmn-js modeler
* @param modeling The modeling module of the bpmn-js modeler
*/
-export function addFormFieldDataForMap(elementID, formFieldData, keyValueMap, elementRegistry, moddle, modeling) {
-
- // create camunda properties for each entry of the key value map
- formFieldData.properties = createCamundaProperties(keyValueMap, moddle);
-
- // create form field for form field data
- addFormField(elementID, formFieldData, elementRegistry, moddle, modeling);
+export function addFormFieldDataForMap(
+ elementID,
+ formFieldData,
+ keyValueMap,
+ elementRegistry,
+ moddle,
+ modeling
+) {
+ // create camunda properties for each entry of the key value map
+ formFieldData.properties = createCamundaProperties(keyValueMap, moddle);
+
+ // create form field for form field data
+ addFormField(elementID, formFieldData, elementRegistry, moddle, modeling);
}
/**
@@ -101,27 +126,35 @@ export function addFormFieldDataForMap(elementID, formFieldData, keyValueMap, el
* @param moddle The moddle module of the bpmn-js modeler
* @param modeling The modeling module of the bpmn-js modeler
*/
-export function addFormField(elementID, formFieldData, elementRegistry, moddle, modeling) {
-
- const element = elementRegistry.get(elementID);
- const extensionElements = getExtensionElements(element.businessObject, moddle);
-
- // get form data extension
- let form = getExtension(element.businessObject, 'camunda:FormData');
-
- console.log(`Found form data ${form}.`);
-
- if (!form) {
- form = moddle.create('camunda:FormData');
- }
-
- // create form field
- const formField = moddle.create('camunda:FormField', formFieldData);
-
- // save from field
- pushFormField(form, formField);
- extensionElements.values = [form];
- modeling.updateProperties(element, { extensionElements: extensionElements });
+export function addFormField(
+ elementID,
+ formFieldData,
+ elementRegistry,
+ moddle,
+ modeling
+) {
+ const element = elementRegistry.get(elementID);
+ const extensionElements = getExtensionElements(
+ element.businessObject,
+ moddle
+ );
+
+ // get form data extension
+ let form = getExtension(element.businessObject, "camunda:FormData");
+
+ console.log(`Found form data ${form}.`);
+
+ if (!form) {
+ form = moddle.create("camunda:FormData");
+ }
+
+ // create form field
+ const formField = moddle.create("camunda:FormField", formFieldData);
+
+ // save from field
+ pushFormField(form, formField);
+ extensionElements.values = [form];
+ modeling.updateProperties(element, { extensionElements: extensionElements });
}
/**
@@ -132,19 +165,19 @@ export function addFormField(elementID, formFieldData, elementRegistry, moddle,
* @returns {bpmn:ExtensionElements} The extension elements of the businessObject
*/
export function getExtensionElements(businessObject, moddle) {
- let extensionElements = businessObject.get('extensionElements');
+ let extensionElements = businessObject.get("extensionElements");
- // create extension elements if not already defined
- if (!extensionElements) {
- extensionElements = moddle.create('bpmn:ExtensionElements');
- }
+ // create extension elements if not already defined
+ if (!extensionElements) {
+ extensionElements = moddle.create("bpmn:ExtensionElements");
+ }
- // init values if undefined
- if (!extensionElements.values) {
- extensionElements.values = [];
- }
+ // init values if undefined
+ if (!extensionElements.values) {
+ extensionElements.values = [];
+ }
- return extensionElements;
+ return extensionElements;
}
/**
@@ -154,17 +187,18 @@ export function getExtensionElements(businessObject, moddle) {
* @param formField The given Camunda form field.
*/
export function pushFormField(form, formField) {
-
- // get all fields of the form with the id of the given form field
- const existingFieldsWithID = form.get('fields').filter(function (elem) {
- return elem.id === formField.id;
- });
-
- // update existing form fields
- for (let i = 0; i < existingFieldsWithID.length; i++) {
- form.get('fields').splice(form.get('fields').indexOf(existingFieldsWithID[i]));
- }
- form.get('fields').push(formField);
+ // get all fields of the form with the id of the given form field
+ const existingFieldsWithID = form.get("fields").filter(function (elem) {
+ return elem.id === formField.id;
+ });
+
+ // update existing form fields
+ for (let i = 0; i < existingFieldsWithID.length; i++) {
+ form
+ .get("fields")
+ .splice(form.get("fields").indexOf(existingFieldsWithID[i]));
+ }
+ form.get("fields").push(formField);
}
/**
@@ -174,11 +208,11 @@ export function pushFormField(form, formField) {
* @returns {*} the root process element
*/
export function getRootProcess(definitions) {
- for (let i = 0; i < definitions.rootElements.length; i++) {
- if (definitions.rootElements[i].$type === 'bpmn:Process') {
- return definitions.rootElements[i];
- }
+ for (let i = 0; i < definitions.rootElements.length; i++) {
+ if (definitions.rootElements[i].$type === "bpmn:Process") {
+ return definitions.rootElements[i];
}
+ }
}
/**
@@ -188,8 +222,8 @@ export function getRootProcess(definitions) {
* @return the definitions from the xml definitions
*/
export async function getDefinitionsFromXml(xml) {
- let bpmnModeler = await createTempModelerFromXml(xml);
- return bpmnModeler.getDefinitions();
+ let bpmnModeler = await createTempModelerFromXml(xml);
+ return bpmnModeler.getDefinitions();
}
/**
@@ -199,12 +233,15 @@ export async function getDefinitionsFromXml(xml) {
* @return the flow element if only one is defined, or undefined if none or multiple flow elements exist in the process
*/
export function getSingleFlowElement(process) {
- let flowElements = process.flowElements;
- if (flowElements.length !== 1) {
- console.log('Process contains %i flow elements but must contain exactly one!', flowElements.length);
- return undefined;
- }
- return flowElements[0];
+ let flowElements = process.flowElements;
+ if (flowElements.length !== 1) {
+ console.log(
+ "Process contains %i flow elements but must contain exactly one!",
+ flowElements.length
+ );
+ return undefined;
+ }
+ return flowElements[0];
}
/**
@@ -217,39 +254,47 @@ export function getSingleFlowElement(process) {
* @param elementRegistry The element registry containing the elements of the current workflow
* @returns {boolean} True, if element1 is connected via sequence flows with element2, false else.
*/
-export function findSequenceFlowConnection(element1, element2, visited, elementRegistry) {
-
- // exit condition of the recursion, element2 is reached
- if (element1 === element2) {
- return true;
- }
-
- // store element1 as visited
- visited.add(element1);
-
- // search recursively for element2 in all outgoing connections
- const connections = element1.outgoing;
-
- for (let i = 0; i < connections.length; i++) {
-
- const connection = connections[i];
-
- // only search in elements connected via sequence flow
- if (connection.type === 'bpmn:SequenceFlow') {
-
- const nextElement = connection.target;
-
- // recursive call with new element
- if (!visited.has(nextElement)) {
-
- // return true if recursive call finds element2
- if (findSequenceFlowConnection(nextElement, element2, visited, elementRegistry)) {
- return true;
- }
- }
+export function findSequenceFlowConnection(
+ element1,
+ element2,
+ visited,
+ elementRegistry
+) {
+ // exit condition of the recursion, element2 is reached
+ if (element1 === element2) {
+ return true;
+ }
+
+ // store element1 as visited
+ visited.add(element1);
+
+ // search recursively for element2 in all outgoing connections
+ const connections = element1.outgoing;
+
+ for (let i = 0; i < connections.length; i++) {
+ const connection = connections[i];
+
+ // only search in elements connected via sequence flow
+ if (connection.type === "bpmn:SequenceFlow") {
+ const nextElement = connection.target;
+
+ // recursive call with new element
+ if (!visited.has(nextElement)) {
+ // return true if recursive call finds element2
+ if (
+ findSequenceFlowConnection(
+ nextElement,
+ element2,
+ visited,
+ elementRegistry
+ )
+ ) {
+ return true;
}
+ }
}
- return false;
+ }
+ return false;
}
/**
@@ -259,49 +304,51 @@ export function findSequenceFlowConnection(element1, element2, visited, elementR
* @param bpmnFactory the BPMN factory to create new BPMN elements
*/
export function getCamundaInputOutput(bo, bpmnFactory) {
-
- // retrieve InputOutput element if already defined
- let inputOutput = getInputOutput(bo);
-
- // create new InputOutput element if non existent
- if (!inputOutput || inputOutput.length === 0) {
-
- const extensionEntry = addEntry(bo, bo, bpmnFactory.create('camunda:InputOutput'), bpmnFactory);
-
- if (extensionEntry['extensionElements']) {
- bo.extensionElements = extensionEntry['extensionElements'];
- } else {
- bo.extensionElements = extensionEntry['context']['currentObject'];
- }
- inputOutput = getExtension(bo, 'camunda:InputOutput');
-
- if (!inputOutput) {
- let inout = bpmnFactory.create('camunda:InputOutput');
- inout.inputParameters = [];
- inout.outputParameters = [];
- bo.extensionElements.values.push(inout);
- return inout;
- } else {
-
- // initialize parameters as empty arrays to avoid access errors
- inputOutput.inputParameters = [];
- inputOutput.outputParameters = [];
-
- // if there are multiple input/output definitions, take the first one as the modeler only uses this one
- return inputOutput;
- }
+ // retrieve InputOutput element if already defined
+ let inputOutput = getInputOutput(bo);
+
+ // create new InputOutput element if non existent
+ if (!inputOutput || inputOutput.length === 0) {
+ const extensionEntry = addEntry(
+ bo,
+ bo,
+ bpmnFactory.create("camunda:InputOutput"),
+ bpmnFactory
+ );
+
+ if (extensionEntry["extensionElements"]) {
+ bo.extensionElements = extensionEntry["extensionElements"];
+ } else {
+ bo.extensionElements = extensionEntry["context"]["currentObject"];
}
+ inputOutput = getExtension(bo, "camunda:InputOutput");
+
+ if (!inputOutput) {
+ let inout = bpmnFactory.create("camunda:InputOutput");
+ inout.inputParameters = [];
+ inout.outputParameters = [];
+ bo.extensionElements.values.push(inout);
+ return inout;
+ } else {
+ // initialize parameters as empty arrays to avoid access errors
+ inputOutput.inputParameters = [];
+ inputOutput.outputParameters = [];
- // init input/output parameters if undefined
- if (!inputOutput.inputParameters) {
- inputOutput.inputParameters = [];
+ // if there are multiple input/output definitions, take the first one as the modeler only uses this one
+ return inputOutput;
}
+ }
- if (!inputOutput.outputParameters) {
- inputOutput.outputParameters = [];
- }
+ // init input/output parameters if undefined
+ if (!inputOutput.inputParameters) {
+ inputOutput.inputParameters = [];
+ }
+
+ if (!inputOutput.outputParameters) {
+ inputOutput.outputParameters = [];
+ }
- return inputOutput;
+ return inputOutput;
}
/**
@@ -313,10 +360,10 @@ export function getCamundaInputOutput(bo, bpmnFactory) {
* @param bpmnFactory
*/
export function setInputParameter(task, name, value, bpmnFactory) {
- let parameter = getInputParameter(task, name, bpmnFactory);
- if (parameter) {
- parameter.value = value;
- }
+ let parameter = getInputParameter(task, name, bpmnFactory);
+ if (parameter) {
+ parameter.value = value;
+ }
}
/**
@@ -328,10 +375,10 @@ export function setInputParameter(task, name, value, bpmnFactory) {
* @param bpmnFactory
*/
export function setOutputParameter(task, name, value, bpmnFactory) {
- let parameter = getOutputParameter(task, name, bpmnFactory);
- if (parameter) {
- parameter.value = value;
- }
+ let parameter = getOutputParameter(task, name, bpmnFactory);
+ if (parameter) {
+ parameter.value = value;
+ }
}
/**
@@ -342,15 +389,15 @@ export function setOutputParameter(task, name, value, bpmnFactory) {
* @param type The given value
*/
export function getInputParameter(task, name, bpmnFactory) {
- const extensionElement = getCamundaInputOutput(task, bpmnFactory);
+ const extensionElement = getCamundaInputOutput(task, bpmnFactory);
- if (extensionElement && extensionElement.inputParameters) {
- for (const parameter of extensionElement.inputParameters) {
- if (parameter.name === name) {
- return parameter;
- }
- }
+ if (extensionElement && extensionElement.inputParameters) {
+ for (const parameter of extensionElement.inputParameters) {
+ if (parameter.name === name) {
+ return parameter;
+ }
}
+ }
}
/**
@@ -361,15 +408,15 @@ export function getInputParameter(task, name, bpmnFactory) {
* @param bpmnFactory
*/
export function getOutputParameter(task, name, bpmnFactory) {
- const extensionElement = getCamundaInputOutput(task, bpmnFactory);
+ const extensionElement = getCamundaInputOutput(task, bpmnFactory);
- if (extensionElement && extensionElement.outputParameters) {
- for (const parameter of extensionElement.outputParameters) {
- if (parameter.name === name) {
- return parameter;
- }
- }
+ if (extensionElement && extensionElement.outputParameters) {
+ for (const parameter of extensionElement.outputParameters) {
+ if (parameter.name === name) {
+ return parameter;
+ }
}
+ }
}
/**
@@ -380,16 +427,25 @@ export function getOutputParameter(task, name, bpmnFactory) {
* @param value Value of the input parameter.
* @param bpmnFactory The bpmnFactory of the bpmn-js modeler.
*/
-export function addCamundaInputParameter(businessObject, name, value, bpmnFactory) {
-
- // get camunda io extension element
- const inputOutputExtensions = getCamundaInputOutput(businessObject, bpmnFactory);
-
- // add new input parameter
- inputOutputExtensions.inputParameters.push(bpmnFactory.create('camunda:InputParameter', {
- name: name,
- value: value,
- }));
+export function addCamundaInputParameter(
+ businessObject,
+ name,
+ value,
+ bpmnFactory
+) {
+ // get camunda io extension element
+ const inputOutputExtensions = getCamundaInputOutput(
+ businessObject,
+ bpmnFactory
+ );
+
+ // add new input parameter
+ inputOutputExtensions.inputParameters.push(
+ bpmnFactory.create("camunda:InputParameter", {
+ name: name,
+ value: value,
+ })
+ );
}
/**
@@ -400,16 +456,25 @@ export function addCamundaInputParameter(businessObject, name, value, bpmnFactor
* @param value Value of the output parameter.
* @param bpmnFactory The bpmnFactory of the bpmn-js modeler.
*/
-export function addCamundaOutputParameter(businessObject, name, value, bpmnFactory) {
-
- // get camunda io extension element
- const inputOutputExtensions = getCamundaInputOutput(businessObject, bpmnFactory);
-
- // add new output parameter
- inputOutputExtensions.outputParameters.push(bpmnFactory.create('camunda:OutputParameter', {
- name: name,
- value: value,
- }));
+export function addCamundaOutputParameter(
+ businessObject,
+ name,
+ value,
+ bpmnFactory
+) {
+ // get camunda io extension element
+ const inputOutputExtensions = getCamundaInputOutput(
+ businessObject,
+ bpmnFactory
+ );
+
+ // add new output parameter
+ inputOutputExtensions.outputParameters.push(
+ bpmnFactory.create("camunda:OutputParameter", {
+ name: name,
+ value: value,
+ })
+ );
}
/**
@@ -420,22 +485,29 @@ export function addCamundaOutputParameter(businessObject, name, value, bpmnFacto
* @param keyValueMap key value map of the input parameter.
* @param bpmnFactory The bpmnFactory of the bpmn-js modeler.
*/
-export function addCamundaInputMapParameter(businessObject, name, keyValueMap, bpmnFactory) {
-
- // get camunda io extension element
- const inputOutputExtensions = getCamundaInputOutput(businessObject, bpmnFactory);
-
- // create a camunda map element for the key value map
- const map = createCamundaMap(keyValueMap, bpmnFactory);
-
- // add the created map as new input parameter
- const input = bpmnFactory.create('camunda:InputParameter', {
- name: name,
- definition: map,
- });
-
- map.$parent = input;
- inputOutputExtensions.inputParameters.push(input);
+export function addCamundaInputMapParameter(
+ businessObject,
+ name,
+ keyValueMap,
+ bpmnFactory
+) {
+ // get camunda io extension element
+ const inputOutputExtensions = getCamundaInputOutput(
+ businessObject,
+ bpmnFactory
+ );
+
+ // create a camunda map element for the key value map
+ const map = createCamundaMap(keyValueMap, bpmnFactory);
+
+ // add the created map as new input parameter
+ const input = bpmnFactory.create("camunda:InputParameter", {
+ name: name,
+ definition: map,
+ });
+
+ map.$parent = input;
+ inputOutputExtensions.inputParameters.push(input);
}
/**
@@ -446,22 +518,29 @@ export function addCamundaInputMapParameter(businessObject, name, keyValueMap, b
* @param keyValueMap key value map of the output parameter.
* @param bpmnFactory The bpmnFactory of the bpmn-js modeler.
*/
-export function addCamundaOutputMapParameter(businessObject, name, keyValueMap, bpmnFactory) {
-
- // get camunda io extension element
- const inputOutputExtensions = getCamundaInputOutput(businessObject, bpmnFactory);
-
- // create a camunda map element for the key value map
- const map = createCamundaMap(keyValueMap, bpmnFactory);
-
- // add the created map as new output parameter
- const output = bpmnFactory.create('camunda:OutputParameter', {
- name: name,
- definition: map,
- });
-
- map.$parent = output;
- inputOutputExtensions.outputParameters.push(output);
+export function addCamundaOutputMapParameter(
+ businessObject,
+ name,
+ keyValueMap,
+ bpmnFactory
+) {
+ // get camunda io extension element
+ const inputOutputExtensions = getCamundaInputOutput(
+ businessObject,
+ bpmnFactory
+ );
+
+ // create a camunda map element for the key value map
+ const map = createCamundaMap(keyValueMap, bpmnFactory);
+
+ // add the created map as new output parameter
+ const output = bpmnFactory.create("camunda:OutputParameter", {
+ name: name,
+ definition: map,
+ });
+
+ map.$parent = output;
+ inputOutputExtensions.outputParameters.push(output);
}
/**
@@ -472,25 +551,24 @@ export function addCamundaOutputMapParameter(businessObject, name, keyValueMap,
* @returns {camunda:Map} The created camunda map element
*/
export function createCamundaMap(keyValueMap, bpmnFactory) {
-
- // create camunda entry elements for the key value entries
- const mapEntries = keyValueMap.map(function ({ name, value }) {
- return bpmnFactory.create('camunda:Entry', {
- key: name,
- value: value,
- });
+ // create camunda entry elements for the key value entries
+ const mapEntries = keyValueMap.map(function ({ name, value }) {
+ return bpmnFactory.create("camunda:Entry", {
+ key: name,
+ value: value,
});
+ });
- // create the camunda map for the entries
- const map = bpmnFactory.create('camunda:Map', {
- entries: mapEntries,
- });
+ // create the camunda map for the entries
+ const map = bpmnFactory.create("camunda:Map", {
+ entries: mapEntries,
+ });
- for (let entry of mapEntries) {
- entry.$parent = map;
- }
+ for (let entry of mapEntries) {
+ entry.$parent = map;
+ }
- return map;
+ return map;
}
/**
@@ -502,25 +580,24 @@ export function createCamundaMap(keyValueMap, bpmnFactory) {
* @returns {camunda:Properties} The camunda properties element
*/
export function createCamundaProperties(keyValueMap, moddle) {
-
- // create camunda property elements for each map entry
- const mapEntries = keyValueMap.map(function ({ name, value }) {
- return moddle.create('camunda:Property', {
- id: name,
- value: value,
- });
+ // create camunda property elements for each map entry
+ const mapEntries = keyValueMap.map(function ({ name, value }) {
+ return moddle.create("camunda:Property", {
+ id: name,
+ value: value,
});
+ });
- // create camunda properties element containing the created property elements
- const map = moddle.create('camunda:Properties', {
- values: mapEntries,
- });
+ // create camunda properties element containing the created property elements
+ const map = moddle.create("camunda:Properties", {
+ values: mapEntries,
+ });
- for (let entry of mapEntries) {
- entry.$parent = map;
- }
+ for (let entry of mapEntries) {
+ entry.$parent = map;
+ }
- return map;
+ return map;
}
/**
@@ -531,7 +608,7 @@ export function createCamundaProperties(keyValueMap, moddle) {
* @return true if the given element is a flow like element, false otherwise
*/
export function isFlowLikeElement(type) {
- return type === 'bpmn:SequenceFlow' || type === 'bpmn:Association';
+ return type === "bpmn:SequenceFlow" || type === "bpmn:Association";
}
/**
@@ -541,20 +618,22 @@ export function isFlowLikeElement(type) {
* @return the list of flow elements
*/
export function getFlowElementsRecursively(startElement) {
- let flowElements = [];
-
- if (startElement.flowElements !== undefined) {
- for (let i = 0; i < startElement.flowElements.length; i++) {
- let flowElement = startElement.flowElements[i];
-
- if (flowElement.$type === 'bpmn:SubProcess') {
- flowElements = flowElements.concat(getFlowElementsRecursively(flowElement));
- } else {
- flowElements.push(flowElement);
- }
- }
+ let flowElements = [];
+
+ if (startElement.flowElements !== undefined) {
+ for (let i = 0; i < startElement.flowElements.length; i++) {
+ let flowElement = startElement.flowElements[i];
+
+ if (flowElement.$type === "bpmn:SubProcess") {
+ flowElements = flowElements.concat(
+ getFlowElementsRecursively(flowElement)
+ );
+ } else {
+ flowElements.push(flowElement);
+ }
}
- return flowElements;
+ }
+ return flowElements;
}
/**
@@ -564,14 +643,15 @@ export function getFlowElementsRecursively(startElement) {
* @returns {string} The documentation property as a string
*/
export function getDocumentation(businessObject) {
-
- // get documentation
- const documentationArray = businessObject.documentation || [];
-
- // convert documentation to string
- return documentationArray.map(function (documentation) {
- return documentation.text;
- }).join('\n');
+ // get documentation
+ const documentationArray = businessObject.documentation || [];
+
+ // convert documentation to string
+ return documentationArray
+ .map(function (documentation) {
+ return documentation.text;
+ })
+ .join("\n");
}
/**
@@ -582,9 +662,11 @@ export function getDocumentation(businessObject) {
* @param bpmnFactory The bpmnFactory of the bpmn-js modeler
*/
export function setDocumentation(element, newDocumentation, bpmnFactory) {
- element.businessObject.documentation = [bpmnFactory.create('bpmn:Documentation', {
- text: newDocumentation,
- })];
+ element.businessObject.documentation = [
+ bpmnFactory.create("bpmn:Documentation", {
+ text: newDocumentation,
+ }),
+ ];
}
/**
@@ -597,20 +679,25 @@ export function setDocumentation(element, newDocumentation, bpmnFactory) {
* @returns {{extensionElements: elementType}} The updated extension elements
*/
export function addEntry(businessObject, element, entry, bpmnFactory) {
- let extensionElements = businessObject.get('extensionElements');
-
- // if there is no extensionElements list, create one
- if (!extensionElements) {
- extensionElements = createElement('bpmn:ExtensionElements', { values: [entry] }, businessObject, bpmnFactory);
- return { extensionElements: extensionElements };
- }
-
- // add extension element to list if it exists
- entry.$parent = extensionElements;
- let values = extensionElements.get('values');
- values.push(entry);
- extensionElements.set('values', values);
+ let extensionElements = businessObject.get("extensionElements");
+
+ // if there is no extensionElements list, create one
+ if (!extensionElements) {
+ extensionElements = createElement(
+ "bpmn:ExtensionElements",
+ { values: [entry] },
+ businessObject,
+ bpmnFactory
+ );
return { extensionElements: extensionElements };
+ }
+
+ // add extension element to list if it exists
+ entry.$parent = extensionElements;
+ let values = extensionElements.get("values");
+ values.push(entry);
+ extensionElements.set("values", values);
+ return { extensionElements: extensionElements };
}
/**
@@ -623,10 +710,10 @@ export function addEntry(businessObject, element, entry, bpmnFactory) {
* @returns {elementType} The created element
*/
export function createElement(elementType, properties, parent, factory) {
- let element = factory.create(elementType, properties);
- element.$parent = parent;
+ let element = factory.create(elementType, properties);
+ element.$parent = parent;
- return element;
+ return element;
}
/**
@@ -641,21 +728,28 @@ export function createElement(elementType, properties, parent, factory) {
* @param autoPlace The create module of the bpmn-js modeler
* @returns {Shape} The new created diagram element
*/
-export function appendElement(type, element, event, bpmnFactory, elementFactory, create, autoPlace) {
-
- const businessObject = bpmnFactory.create(type);
- const shape = elementFactory.createShape({
- type: type,
- businessObject: businessObject
- });
-
- if (autoPlace) {
- autoPlace.append(element, shape);
- } else {
- create.start(event, shape);
- }
-
- return shape;
+export function appendElement(
+ type,
+ element,
+ event,
+ bpmnFactory,
+ elementFactory,
+ create,
+ autoPlace
+) {
+ const businessObject = bpmnFactory.create(type);
+ const shape = elementFactory.createShape({
+ type: type,
+ businessObject: businessObject,
+ });
+
+ if (autoPlace) {
+ autoPlace.append(element, shape);
+ } else {
+ create.start(event, shape);
+ }
+
+ return shape;
}
/**
@@ -665,12 +759,19 @@ export function appendElement(type, element, event, bpmnFactory, elementFactory,
* @param replacementType The type of the new connection.
* @param modeling The modeling module of the bpmn-js modeler.
*/
-export function replaceConnection(connectionElement, replacementType, modeling) {
- const sourceElement = connectionElement.source;
- const targetElement = connectionElement.target;
-
- modeling.removeConnection(connectionElement);
- modeling.connect(sourceElement, targetElement, { type: replacementType, waypoints: connectionElement.waypoints });
+export function replaceConnection(
+ connectionElement,
+ replacementType,
+ modeling
+) {
+ const sourceElement = connectionElement.source;
+ const targetElement = connectionElement.target;
+
+ modeling.removeConnection(connectionElement);
+ modeling.connect(sourceElement, targetElement, {
+ type: replacementType,
+ waypoints: connectionElement.waypoints,
+ });
}
/**
@@ -681,16 +782,19 @@ export function replaceConnection(connectionElement, replacementType, modeling)
* @returns {boolean} True if the given element is connected with an element of the given type, false else.
*/
export function isConnectedWith(element, connectedElementType) {
-
- const outgoingConnections = element.outgoing || [];
- const incomingConnections = element.incoming || [];
-
- // check if a source or target of a connection is of the given type
- for (let connectedElement of outgoingConnections.concat(incomingConnections)) {
- if (is(connectedElement.source, connectedElementType) || is(connectedElement.target, connectedElementType)) {
- return true;
- }
+ const outgoingConnections = element.outgoing || [];
+ const incomingConnections = element.incoming || [];
+
+ // check if a source or target of a connection is of the given type
+ for (let connectedElement of outgoingConnections.concat(
+ incomingConnections
+ )) {
+ if (
+ is(connectedElement.source, connectedElementType) ||
+ is(connectedElement.target, connectedElementType)
+ ) {
+ return true;
}
- return false;
+ }
+ return false;
}
-
diff --git a/components/bpmn-q/modeler-component/editor/util/PopupMenuUtilities.js b/components/bpmn-q/modeler-component/editor/util/PopupMenuUtilities.js
index 28b44753..d707e6cc 100644
--- a/components/bpmn-q/modeler-component/editor/util/PopupMenuUtilities.js
+++ b/components/bpmn-q/modeler-component/editor/util/PopupMenuUtilities.js
@@ -11,29 +11,35 @@
* @param customStyleClass The style class of the MoreOptionsEntry.
* @returns {{label: string, className: string, action: Function}} The created MoreOptionsEntry
*/
-export function createMoreOptionsEntryWithReturn(originalElement, title, entryName, popupMenu, options, customStyleClass) {
-
- const lessOptionsEntry = createLessOptionsEntry(
- originalElement,
- 'Change Element',
- 'All Entries',
- popupMenu,
- undefined,
- );
-
- // entries of the new popup menu
- let entries = {};
- entries['replace-by-less-options'] = lessOptionsEntry;
- entries = Object.assign(entries, options);
-
- return createMoreOptionsEntry(
- title,
- title,
- entryName,
- popupMenu,
- entries,
- customStyleClass,
- );
+export function createMoreOptionsEntryWithReturn(
+ originalElement,
+ title,
+ entryName,
+ popupMenu,
+ options,
+ customStyleClass
+) {
+ const lessOptionsEntry = createLessOptionsEntry(
+ originalElement,
+ "Change Element",
+ "All Entries",
+ popupMenu,
+ undefined
+ );
+
+ // entries of the new popup menu
+ let entries = {};
+ entries["replace-by-less-options"] = lessOptionsEntry;
+ entries = Object.assign(entries, options);
+
+ return createMoreOptionsEntry(
+ title,
+ title,
+ entryName,
+ popupMenu,
+ entries,
+ customStyleClass
+ );
}
/**
@@ -55,27 +61,37 @@ export function createMoreOptionsEntryWithReturn(originalElement, title, entryNa
* @returns {{ label: string, className: string, action: function}}: The popup menu entry which shows another popup menu
* when clicked.
*/
-export function createMoreOptionsEntry(optionsType, title, entryName, popupMenu, entries, customStyleClass) {
-
- // add customStyleClass to the default classname if set
- const classname = customStyleClass ? 'qwm-popup-menu-more-options ' + customStyleClass : 'popup-menu-more-options';
-
- // create a popup menu entry which triggers a new popup menu for the optionsType
- return {
- label: entryName,
- className: classname,
- moreOptions: entries,
- action: function () {
-
- popupMenu.openWithEntries({type: optionsType}, "bpmn-replace", entries,
- {
- title: title,
- width: 300,
- search: true,
- }
- );
+export function createMoreOptionsEntry(
+ optionsType,
+ title,
+ entryName,
+ popupMenu,
+ entries,
+ customStyleClass
+) {
+ // add customStyleClass to the default classname if set
+ const classname = customStyleClass
+ ? "qwm-popup-menu-more-options " + customStyleClass
+ : "popup-menu-more-options";
+
+ // create a popup menu entry which triggers a new popup menu for the optionsType
+ return {
+ label: entryName,
+ className: classname,
+ moreOptions: entries,
+ action: function () {
+ popupMenu.openWithEntries(
+ { type: optionsType },
+ "bpmn-replace",
+ entries,
+ {
+ title: title,
+ width: 300,
+ search: true,
}
- };
+ );
+ },
+ };
}
/**
@@ -91,22 +107,25 @@ export function createMoreOptionsEntry(optionsType, title, entryName, popupMenu,
* @param entries The entries of the new popup menu (optional)
* @returns {{action: action, className: string, label}} The created LessOptionsEntry
*/
-export function createLessOptionsEntry(originalElement, title, entryName, popupMenu, entries) {
-
- // create a popup menu entry which triggers a new popup menu for the optionsType
- return {
- label: entryName,
- className: 'qwm-popup-menu-less-options',
- action: function () {
- popupMenu.openWithEntries(originalElement, "bpmn-replace", entries,
- {
- title: title,
- width: 300,
- search: true,
- }
- );
- }
- };
+export function createLessOptionsEntry(
+ originalElement,
+ title,
+ entryName,
+ popupMenu,
+ entries
+) {
+ // create a popup menu entry which triggers a new popup menu for the optionsType
+ return {
+ label: entryName,
+ className: "qwm-popup-menu-less-options",
+ action: function () {
+ popupMenu.openWithEntries(originalElement, "bpmn-replace", entries, {
+ title: title,
+ width: 300,
+ search: true,
+ });
+ },
+ };
}
/**
@@ -118,17 +137,26 @@ export function createLessOptionsEntry(originalElement, title, entryName, popupM
* @param replaceElement The replaceElement function of the bpmn-js modeler.
* @returns {{}} Object containing the created menu entries.
*/
-export function createMenuEntries(element, definitions, translate, replaceElement) {
-
- let menuEntries = {};
- let id;
-
- // create menu entries for each entry in the definitions
- for (let definition of definitions) {
- id = definition.id || definition.actionName;
- menuEntries[id] = createMenuEntry(element, definition, translate, replaceElement);
- }
- return menuEntries;
+export function createMenuEntries(
+ element,
+ definitions,
+ translate,
+ replaceElement
+) {
+ let menuEntries = {};
+ let id;
+
+ // create menu entries for each entry in the definitions
+ for (let definition of definitions) {
+ id = definition.id || definition.actionName;
+ menuEntries[id] = createMenuEntry(
+ element,
+ definition,
+ translate,
+ replaceElement
+ );
+ }
+ return menuEntries;
}
/**
@@ -141,23 +169,28 @@ export function createMenuEntries(element, definitions, translate, replaceElemen
* @param action The action which is triggered when the menu entry is selected, if undefined the replaceAction is used.
* @returns {{action: (function(): *), className, label}} The created menu entry.
*/
-export function createMenuEntry(element, definition, translate, replaceElement, action = undefined) {
-
- // replace the element by the element type defined in definition.target
- const replaceAction = function () {
- console.log(definition.target);
- return replaceElement(element, definition.target);
- };
-
- const label = definition.label || '';
-
- action = action || replaceAction;
-
- return {
- label: translate(label),
- className: definition.className,
- action: action
- };
+export function createMenuEntry(
+ element,
+ definition,
+ translate,
+ replaceElement,
+ action = undefined
+) {
+ // replace the element by the element type defined in definition.target
+ const replaceAction = function () {
+ console.log(definition.target);
+ return replaceElement(element, definition.target);
+ };
+
+ const label = definition.label || "";
+
+ action = action || replaceAction;
+
+ return {
+ label: translate(label),
+ className: definition.className,
+ action: action,
+ };
}
/**
@@ -167,16 +200,17 @@ export function createMenuEntry(element, definition, translate, replaceElement,
* @returns {*|unknown[]} List of menu entries or a single entry if the given entry is not a MoreOptionsEntry
*/
export function getMoreOptions(entry) {
- if (entry.moreOptions) {
-
- // skip first entry because this is the entry for returning to the original menu
- return Object.entries(entry.moreOptions).slice(1).flatMap(function ([key, value]) {
- value.id = key;
-
- // recursively resolve each menu entry
- return getMoreOptions(value);
- });
- } else {
- return entry;
- }
-}
\ No newline at end of file
+ if (entry.moreOptions) {
+ // skip first entry because this is the entry for returning to the original menu
+ return Object.entries(entry.moreOptions)
+ .slice(1)
+ .flatMap(function ([key, value]) {
+ value.id = key;
+
+ // recursively resolve each menu entry
+ return getMoreOptions(value);
+ });
+ } else {
+ return entry;
+ }
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/RenderUtilities.js b/components/bpmn-q/modeler-component/editor/util/RenderUtilities.js
index 5395db0b..67ac4b50 100644
--- a/components/bpmn-q/modeler-component/editor/util/RenderUtilities.js
+++ b/components/bpmn-q/modeler-component/editor/util/RenderUtilities.js
@@ -1,10 +1,10 @@
import {
- append as svgAppend,
- attr as svgAttr,
- create as svgCreate,
- innerSVG,
- select as svgSelect
-} from 'tiny-svg';
+ append as svgAppend,
+ attr as svgAttr,
+ create as svgCreate,
+ innerSVG,
+ select as svgSelect,
+} from "tiny-svg";
/**
* Draw svg path with the given attributes.
@@ -15,44 +15,13 @@ import {
* @returns {SVGPathElement}
*/
export function drawPath(parentGfx, d, attrs) {
+ const path = svgCreate("path");
+ svgAttr(path, { d: d });
+ svgAttr(path, attrs);
- const path = svgCreate('path');
- svgAttr(path, {d: d});
- svgAttr(path, attrs);
+ svgAppend(parentGfx, path);
- svgAppend(parentGfx, path);
-
- return path;
-}
-
-/**
- * Draw a SVG rectangle with the given width, height, border radius and color
- *
- * Copied from https://github.com/bpmn-io/bpmn-js/blob/master/lib/draw/BpmnRenderer.js
- *
- * @param parentNode The parent element the svg rectangle is appended to.
- * @param width The given width
- * @param height The given height
- * @param borderRadius The given border radius
- * @param color The given color
- * @returns {SVGRectElement}
- */
-function drawRect(parentNode, width, height, borderRadius, color) {
- const rect = svgCreate('rect');
-
- svgAttr(rect, {
- width: width,
- height: height,
- rx: borderRadius,
- ry: borderRadius,
- stroke: color,
- strokeWidth: 2,
- fill: color
- });
-
- svgAppend(parentNode, rect);
-
- return rect;
+ return path;
}
/**
@@ -65,28 +34,28 @@ function drawRect(parentNode, width, height, borderRadius, color) {
* @returns The created svg element
*/
export function drawTaskSVG(parentGfx, importSVG, svgAttributes, foreground) {
- const innerSvgStr = importSVG.svg,
- transformDef = importSVG.transform;
+ const innerSvgStr = importSVG.svg,
+ transformDef = importSVG.transform;
- const groupDef = svgCreate('g');
- svgAttr(groupDef, {transform: transformDef});
- innerSVG(groupDef, innerSvgStr);
+ const groupDef = svgCreate("g");
+ svgAttr(groupDef, { transform: transformDef });
+ innerSVG(groupDef, innerSvgStr);
- if(!foreground) {
- // set task box opacity to 0 such that icon can be in the background
- svgAttr(svgSelect(parentGfx, 'rect'), { 'fill-opacity': 0 });
- }
+ if (!foreground) {
+ // set task box opacity to 0 such that icon can be in the background
+ svgAttr(svgSelect(parentGfx, "rect"), { "fill-opacity": 0 });
+ }
- if (svgAttributes) {
- svgAttr(groupDef, svgAttributes);
- }
+ if (svgAttributes) {
+ svgAttr(groupDef, svgAttributes);
+ }
- if(foreground) {
- parentGfx.append(groupDef);
- } else {
- parentGfx.prepend(groupDef);
- }
- return groupDef;
+ if (foreground) {
+ parentGfx.append(groupDef);
+ } else {
+ parentGfx.prepend(groupDef);
+ }
+ return groupDef;
}
/**
@@ -97,16 +66,16 @@ export function drawTaskSVG(parentGfx, importSVG, svgAttributes, foreground) {
* @param svgAttributes Attributes for the SVG
*/
export function drawDataElementSVG(parentGfx, importSVG, svgAttributes) {
- const innerSvgStr = importSVG.svg,
- transformDef = importSVG.transform;
+ const innerSvgStr = importSVG.svg,
+ transformDef = importSVG.transform;
- const groupDef = svgCreate('g');
- svgAttr(groupDef, {transform: transformDef});
- innerSVG(groupDef, innerSvgStr);
+ const groupDef = svgCreate("g");
+ svgAttr(groupDef, { transform: transformDef });
+ innerSVG(groupDef, innerSvgStr);
- if (svgAttributes) {
- svgAttr(groupDef, svgAttributes);
- }
+ if (svgAttributes) {
+ svgAttr(groupDef, svgAttributes);
+ }
- parentGfx.append(groupDef);
-}
\ No newline at end of file
+ parentGfx.append(groupDef);
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/TransformationUtilities.js b/components/bpmn-q/modeler-component/editor/util/TransformationUtilities.js
index 000a5b8e..6ee8f156 100644
--- a/components/bpmn-q/modeler-component/editor/util/TransformationUtilities.js
+++ b/components/bpmn-q/modeler-component/editor/util/TransformationUtilities.js
@@ -1,5 +1,5 @@
-import { isFlowLikeElement } from './ModellingUtilities';
-import { getDi, is } from 'bpmn-js/lib/util/ModelUtil';
+import { isFlowLikeElement } from "./ModellingUtilities";
+import { getDi, is } from "bpmn-js/lib/util/ModelUtil";
/**
* Insert the given element and all child elements into the diagram
@@ -13,101 +13,135 @@ import { getDi, is } from 'bpmn-js/lib/util/ModelUtil';
* @param oldElement an old element that is only required if it should be replaced by the new element
* @return {{success: boolean, idMap: *, element: *}}
*/
-export function insertShape(definitions, parent, newElement, idMap, replace, modeler, oldElement) {
- console.log('Inserting shape for element: ', newElement);
- let bpmnReplace = modeler.get('bpmnReplace');
- let bpmnFactory = modeler.get('bpmnFactory');
- let modeling = modeler.get('modeling');
- let elementRegistry = modeler.get('elementRegistry');
-
- // create new id map if not provided
- if (idMap === undefined) {
- idMap = {};
- }
-
- let element;
- if (!isFlowLikeElement(newElement.$type)) {
- if (replace) {
-
- // replace old element to retain attached sequence flow, associations, data objects, ...
- element = bpmnReplace.replaceElement(elementRegistry.get(oldElement.id), { type: newElement.$type });
- } else {
-
- // create new shape for this element
- element = modeling.createShape({ type: newElement.$type }, { x: 50, y: 50 }, parent, {});
- }
+export function insertShape(
+ definitions,
+ parent,
+ newElement,
+ idMap,
+ replace,
+ modeler,
+ oldElement
+) {
+ console.log("Inserting shape for element: ", newElement);
+ let bpmnReplace = modeler.get("bpmnReplace");
+ let bpmnFactory = modeler.get("bpmnFactory");
+ let modeling = modeler.get("modeling");
+ let elementRegistry = modeler.get("elementRegistry");
+
+ // create new id map if not provided
+ if (idMap === undefined) {
+ idMap = {};
+ }
+
+ let element;
+ if (!isFlowLikeElement(newElement.$type)) {
+ if (replace) {
+ // replace old element to retain attached sequence flow, associations, data objects, ...
+ element = bpmnReplace.replaceElement(elementRegistry.get(oldElement.id), {
+ type: newElement.$type,
+ });
} else {
-
- // create connection between two previously created elements
- let sourceElement = elementRegistry.get(idMap[newElement.sourceRef.id]);
- let targetElement = elementRegistry.get(idMap[newElement.targetRef.id]);
- element = modeling.connect(sourceElement, targetElement, { type: newElement.$type });
+ // create new shape for this element
+ element = modeling.createShape(
+ { type: newElement.$type },
+ { x: 50, y: 50 },
+ parent,
+ {}
+ );
}
-
- // store id to create sequence flows
- idMap[newElement['id']] = element.id;
-
- // if the element is a subprocess, check if it is expanded in the replacement fragment and expand the new element
- if (['bpmn:SubProcess', 'quantme:QuantumHardwareSelectionSubprocess', 'quantme:CircuitCuttingSubprocess'].includes(newElement.$type)) {
-
- // get the shape element related to the subprocess
- let shape = getDi(element);
-
- // expand the replacement subprocess if the detector subprocess was expanded
- if (shape && (newElement.isExpanded === 'true')) {
- shape.isExpanded = true;
- }
-
- // preserve messages defined in ReceiveTasks
- } else if (newElement.$type === 'bpmn:ReceiveTask' && newElement.messageRef) {
-
- // get message from the replacement and check if a corresponding message was already created
- let oldMessage = newElement.messageRef;
- if (idMap[oldMessage.id] === undefined) {
-
- // add a new message element to the definitions document and link it to the receive task
- let message = bpmnFactory.create('bpmn:Message');
- message.name = oldMessage.name;
- definitions.rootElements.push(message);
- modeling.updateProperties(element, { 'messageRef': message });
-
- // store id if other receive tasks reference the same message
- idMap[oldMessage.id] = message.id;
- } else {
-
- // reuse already created message and add it to receive task
- modeling.updateProperties(element, { 'messageRef': idMap[oldMessage.id] });
- }
+ } else {
+ // create connection between two previously created elements
+ let sourceElement = elementRegistry.get(idMap[newElement.sourceRef.id]);
+ let targetElement = elementRegistry.get(idMap[newElement.targetRef.id]);
+ element = modeling.connect(sourceElement, targetElement, {
+ type: newElement.$type,
+ });
+ }
+
+ // store id to create sequence flows
+ idMap[newElement["id"]] = element.id;
+
+ // if the element is a subprocess, check if it is expanded in the replacement fragment and expand the new element
+ if (
+ [
+ "bpmn:SubProcess",
+ "quantme:QuantumHardwareSelectionSubprocess",
+ "quantme:CircuitCuttingSubprocess",
+ ].includes(newElement.$type)
+ ) {
+ // get the shape element related to the subprocess
+ let shape = getDi(element);
+
+ // expand the replacement subprocess if the detector subprocess was expanded
+ if (shape && newElement.isExpanded === "true") {
+ shape.isExpanded = true;
}
- // add element to which a boundary event is attached
- if (newElement.$type === 'bpmn:BoundaryEvent') {
- let hostElement = elementRegistry.get(idMap[newElement.attachedToRef.id]);
- modeling.updateProperties(element, { 'attachedToRef': hostElement.businessObject });
- element.host = hostElement;
+ // preserve messages defined in ReceiveTasks
+ } else if (newElement.$type === "bpmn:ReceiveTask" && newElement.messageRef) {
+ // get message from the replacement and check if a corresponding message was already created
+ let oldMessage = newElement.messageRef;
+ if (idMap[oldMessage.id] === undefined) {
+ // add a new message element to the definitions document and link it to the receive task
+ let message = bpmnFactory.create("bpmn:Message");
+ message.name = oldMessage.name;
+ definitions.rootElements.push(message);
+ modeling.updateProperties(element, { messageRef: message });
+
+ // store id if other receive tasks reference the same message
+ idMap[oldMessage.id] = message.id;
+ } else {
+ // reuse already created message and add it to receive task
+ modeling.updateProperties(element, { messageRef: idMap[oldMessage.id] });
}
-
- // update the properties of the new element
- modeling.updateProperties(element, getPropertiesToCopy(newElement));
-
- // recursively handle children of the current element
- let resultTuple = insertChildElements(definitions, element, newElement, idMap, modeler);
-
- // add artifacts with their shapes to the diagram
- let success = resultTuple['success'];
- idMap = resultTuple['idMap'];
- let artifacts = newElement.artifacts;
- if (artifacts) {
- console.log('Element contains %i artifacts. Adding corresponding shapes...', artifacts.length);
- for (let i = 0; i < artifacts.length; i++) {
- let result = insertShape(definitions, element, artifacts[i], idMap, false, modeler);
- success = success && result['success'];
- idMap = result['idMap'];
- }
+ }
+
+ // add element to which a boundary event is attached
+ if (newElement.$type === "bpmn:BoundaryEvent") {
+ let hostElement = elementRegistry.get(idMap[newElement.attachedToRef.id]);
+ modeling.updateProperties(element, {
+ attachedToRef: hostElement.businessObject,
+ });
+ element.host = hostElement;
+ }
+
+ // update the properties of the new element
+ modeling.updateProperties(element, getPropertiesToCopy(newElement));
+
+ // recursively handle children of the current element
+ let resultTuple = insertChildElements(
+ definitions,
+ element,
+ newElement,
+ idMap,
+ modeler
+ );
+
+ // add artifacts with their shapes to the diagram
+ let success = resultTuple["success"];
+ idMap = resultTuple["idMap"];
+ let artifacts = newElement.artifacts;
+ if (artifacts) {
+ console.log(
+ "Element contains %i artifacts. Adding corresponding shapes...",
+ artifacts.length
+ );
+ for (let i = 0; i < artifacts.length; i++) {
+ let result = insertShape(
+ definitions,
+ element,
+ artifacts[i],
+ idMap,
+ false,
+ modeler
+ );
+ success = success && result["success"];
+ idMap = result["idMap"];
}
+ }
- // return success flag and idMap with id mappings of this element and all children
- return { success: success, idMap: idMap, element: element };
+ // return success flag and idMap with id mappings of this element and all children
+ return { success: success, idMap: idMap, element: element };
}
/**
@@ -120,47 +154,75 @@ export function insertShape(definitions, parent, newElement, idMap, replace, mod
* @param modeler the BPMN modeler containing the target BPMN diagram
* @return {{success: boolean, idMap: *, element: *}}
*/
-export function insertChildElements(definitions, parent, newElement, idMap, modeler) {
-
- let success = true;
- let flowElements = newElement.flowElements;
- let boundaryEvents = [];
- let sequenceflows = [];
- if (flowElements) {
- console.log('Element contains %i children. Adding corresponding shapes...', flowElements.length);
- for (let i = 0; i < flowElements.length; i++) {
-
- // skip elements with references and add them after all other elements to set correct references
- if (flowElements[i].$type === 'bpmn:SequenceFlow') {
- sequenceflows.push(flowElements[i]);
- continue;
- }
- if (flowElements[i].$type === 'bpmn:BoundaryEvent') {
- boundaryEvents.push(flowElements[i]);
- continue;
- }
-
- let result = insertShape(definitions, parent, flowElements[i], idMap, false, modeler);
- success = success && result['success'];
- idMap = result['idMap'];
- }
+export function insertChildElements(
+ definitions,
+ parent,
+ newElement,
+ idMap,
+ modeler
+) {
+ let success = true;
+ let flowElements = newElement.flowElements;
+ let boundaryEvents = [];
+ let sequenceflows = [];
+ if (flowElements) {
+ console.log(
+ "Element contains %i children. Adding corresponding shapes...",
+ flowElements.length
+ );
+ for (let i = 0; i < flowElements.length; i++) {
+ // skip elements with references and add them after all other elements to set correct references
+ if (flowElements[i].$type === "bpmn:SequenceFlow") {
+ sequenceflows.push(flowElements[i]);
+ continue;
+ }
+ if (flowElements[i].$type === "bpmn:BoundaryEvent") {
+ boundaryEvents.push(flowElements[i]);
+ continue;
+ }
+
+ let result = insertShape(
+ definitions,
+ parent,
+ flowElements[i],
+ idMap,
+ false,
+ modeler
+ );
+ success = success && result["success"];
+ idMap = result["idMap"];
+ }
- // handle boundary events with new ids of added elements
- for (let i = 0; i < boundaryEvents.length; i++) {
- let result = insertShape(definitions, parent, boundaryEvents[i], idMap, false, modeler);
- success = success && result['success'];
- idMap = result['idMap'];
- }
+ // handle boundary events with new ids of added elements
+ for (let i = 0; i < boundaryEvents.length; i++) {
+ let result = insertShape(
+ definitions,
+ parent,
+ boundaryEvents[i],
+ idMap,
+ false,
+ modeler
+ );
+ success = success && result["success"];
+ idMap = result["idMap"];
+ }
- // handle boundary events with new ids of added elements
- for (let i = 0; i < sequenceflows.length; i++) {
- let result = insertShape(definitions, parent, sequenceflows[i], idMap, false, modeler);
- success = success && result['success'];
- idMap = result['idMap'];
- }
+ // handle boundary events with new ids of added elements
+ for (let i = 0; i < sequenceflows.length; i++) {
+ let result = insertShape(
+ definitions,
+ parent,
+ sequenceflows[i],
+ idMap,
+ false,
+ modeler
+ );
+ success = success && result["success"];
+ idMap = result["idMap"];
}
+ }
- return { success: success, idMap: idMap, element: parent };
+ return { success: success, idMap: idMap, element: parent };
}
/**
@@ -170,43 +232,42 @@ export function insertChildElements(definitions, parent, newElement, idMap, mode
* @return the properties to copy
*/
export function getPropertiesToCopy(element) {
- let properties = {};
- for (let key in element) {
-
- // ignore properties from parent element
- if (!element.hasOwnProperty(key)) {
- continue;
- }
-
- // ignore properties such as type
- if (key.startsWith('$')) {
- continue;
- }
+ let properties = {};
+ for (let key in element) {
+ // ignore properties from parent element
+ if (!element.hasOwnProperty(key)) {
+ continue;
+ }
- // ignore id as it is automatically generated with the shape
- if (key === 'id') {
- continue;
- }
+ // ignore properties such as type
+ if (key.startsWith("$")) {
+ continue;
+ }
- // ignore flow elements, as the children are added afterwards
- if (key === 'flowElements') {
- continue;
- }
+ // ignore id as it is automatically generated with the shape
+ if (key === "id") {
+ continue;
+ }
- // ignore artifacts, as they are added afterwards with their shapes
- if (key === 'artifacts') {
- continue;
- }
+ // ignore flow elements, as the children are added afterwards
+ if (key === "flowElements") {
+ continue;
+ }
- // ignore messages, as they are added before
- if (key === 'messageRef') {
- continue;
- }
+ // ignore artifacts, as they are added afterwards with their shapes
+ if (key === "artifacts") {
+ continue;
+ }
- properties[key] = element[key];
+ // ignore messages, as they are added before
+ if (key === "messageRef") {
+ continue;
}
- return properties;
+ properties[key] = element[key];
+ }
+
+ return properties;
}
/**
@@ -217,25 +278,31 @@ export function getPropertiesToCopy(element) {
* @param elementType The searched element type
* @returns {*[]} All elements of the process with the elementType
*/
-export function getAllElementsInProcess(processBo, elementRegistry, elementType) {
-
- // retrieve parent object for later replacement
- const processElement = elementRegistry.get(processBo.id);
-
- const elements = [];
- const flowElementBos = processBo.flowElements;
- for (let i = 0; i < flowElementBos.length; i++) {
- let flowElementBo = flowElementBos[i];
- if (flowElementBo.$type && flowElementBo.$type === elementType) {
- elements.push({ element: flowElementBo, parent: processElement });
- }
+export function getAllElementsInProcess(
+ processBo,
+ elementRegistry,
+ elementType
+) {
+ // retrieve parent object for later replacement
+ const processElement = elementRegistry.get(processBo.id);
+
+ const elements = [];
+ const flowElementBos = processBo.flowElements;
+ for (let i = 0; i < flowElementBos.length; i++) {
+ let flowElementBo = flowElementBos[i];
+ if (flowElementBo.$type && flowElementBo.$type === elementType) {
+ elements.push({ element: flowElementBo, parent: processElement });
+ }
- // recursively retrieve service tasks if subprocess is found
- if (flowElementBo.$type && flowElementBo.$type === 'bpmn:SubProcess') {
- Array.prototype.push.apply(elements, getAllElementsInProcess(flowElementBo, elementRegistry, elementType));
- }
+ // recursively retrieve service tasks if subprocess is found
+ if (flowElementBo.$type && flowElementBo.$type === "bpmn:SubProcess") {
+ Array.prototype.push.apply(
+ elements,
+ getAllElementsInProcess(flowElementBo, elementRegistry, elementType)
+ );
}
- return elements;
+ }
+ return elements;
}
/**
@@ -246,18 +313,21 @@ export function getAllElementsInProcess(processBo, elementRegistry, elementType)
* @param elementType The searched element type
* @returns {*[]} All elements of the process with the elementType
*/
-export function getAllElementsForProcess(processBo, elementRegistry, elementType) {
-
- // retrieve parent object for later replacement
- const processElement = elementRegistry.get(processBo.id);
-
- const elements = [];
- const flowElements = processBo.flowElements;
- for (let i = 0; i < flowElements.length; i++) {
- let flowElement = flowElements[i];
- if (is(flowElement, elementType)) {
- elements.push({ element: flowElement, parent: processElement });
- }
+export function getAllElementsForProcess(
+ processBo,
+ elementRegistry,
+ elementType
+) {
+ // retrieve parent object for later replacement
+ const processElement = elementRegistry.get(processBo.id);
+
+ const elements = [];
+ const flowElements = processBo.flowElements;
+ for (let i = 0; i < flowElements.length; i++) {
+ let flowElement = flowElements[i];
+ if (is(flowElement, elementType)) {
+ elements.push({ element: flowElement, parent: processElement });
}
- return elements;
+ }
+ return elements;
}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ConnectorUtil.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ConnectorUtil.js
index c0c238d0..09c7981d 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ConnectorUtil.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ConnectorUtil.js
@@ -4,24 +4,24 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import {
- getServiceTaskLikeBusinessObject
-} from './ImplementationTypeUtils';
-import {getExtensionElementsList} from "./ExtensionElementsUtil";
-import {getImplementationType} from "../../../extensions/quantme/utilities/ImplementationTypeHelperExtension";
+import { getServiceTaskLikeBusinessObject } from "./ImplementationTypeUtils";
+import { getExtensionElementsList } from "./ExtensionElementsUtil";
+import { getImplementationType } from "../../../extensions/quantme/utilities/ImplementationTypeHelperExtension";
export function areConnectorsSupported(element) {
- const businessObject = getServiceTaskLikeBusinessObject(element);
- return businessObject && getImplementationType(businessObject) === 'connector';
+ const businessObject = getServiceTaskLikeBusinessObject(element);
+ return (
+ businessObject && getImplementationType(businessObject) === "connector"
+ );
}
export function getConnectors(businessObject) {
- return getExtensionElementsList(businessObject, 'camunda:Connector');
+ return getExtensionElementsList(businessObject, "camunda:Connector");
}
export function getConnector(element) {
- const businessObject = getServiceTaskLikeBusinessObject(element);
- const connectors = getConnectors(businessObject);
+ const businessObject = getServiceTaskLikeBusinessObject(element);
+ const connectors = getConnectors(businessObject);
- return connectors[0];
-}
\ No newline at end of file
+ return connectors[0];
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ElementUtil.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ElementUtil.js
index 3d356d04..42d6e04f 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ElementUtil.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ElementUtil.js
@@ -4,11 +4,9 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import Ids from 'ids';
+import Ids from "ids";
-import {
- is
-} from 'bpmn-js/lib/util/ModelUtil';
+import { is } from "bpmn-js/lib/util/ModelUtil";
/**
* Create a new element and set its parent.
@@ -21,48 +19,48 @@ import {
* @returns {djs.model.Base} element which is created
*/
export function createElement(elementType, properties, parent, factory) {
- const element = factory.create(elementType, properties);
+ const element = factory.create(elementType, properties);
- if (parent) {
- element.$parent = parent;
- }
+ if (parent) {
+ element.$parent = parent;
+ }
- return element;
+ return element;
}
/**
* generate a semantic id with given prefix
*/
export function nextId(prefix) {
- const ids = new Ids([32, 32, 1]);
+ const ids = new Ids([32, 32, 1]);
- return ids.nextPrefixed(prefix);
+ return ids.nextPrefixed(prefix);
}
export function getRoot(businessObject) {
- let parent = businessObject;
+ let parent = businessObject;
- while (parent.$parent) {
- parent = parent.$parent;
- }
+ while (parent.$parent) {
+ parent = parent.$parent;
+ }
- return parent;
+ return parent;
}
export function filterElementsByType(objectList, type) {
- const list = objectList || [];
+ const list = objectList || [];
- return list.filter(element => is(element, type));
+ return list.filter((element) => is(element, type));
}
export function findRootElementsByType(businessObject, referencedType) {
- const root = getRoot(businessObject);
+ const root = getRoot(businessObject);
- return filterElementsByType(root.get('rootElements'), referencedType);
+ return filterElementsByType(root.get("rootElements"), referencedType);
}
export function findRootElementById(businessObject, type, id) {
- const elements = findRootElementsByType(businessObject, type);
+ const elements = findRootElementsByType(businessObject, type);
- return elements.find(element => element.id === id);
+ return elements.find((element) => element.id === id);
}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/EventDefinitionUtil.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/EventDefinitionUtil.js
index 8711935a..460eacec 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/EventDefinitionUtil.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/EventDefinitionUtil.js
@@ -4,37 +4,34 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import {
- isAny
-} from 'bpmn-js/lib/features/modeling/util/ModelingUtil';
+import { isAny } from "bpmn-js/lib/features/modeling/util/ModelingUtil";
-import {
- getBusinessObject,
- is
-} from 'bpmn-js/lib/util/ModelUtil';
+import { getBusinessObject, is } from "bpmn-js/lib/util/ModelUtil";
-import {
- find
-} from 'min-dash';
+import { find } from "min-dash";
export function isErrorSupported(element) {
- return isAny(element, [
- 'bpmn:StartEvent',
- 'bpmn:BoundaryEvent',
- 'bpmn:EndEvent'
- ]) && !!getErrorEventDefinition(element);
+ return (
+ isAny(element, [
+ "bpmn:StartEvent",
+ "bpmn:BoundaryEvent",
+ "bpmn:EndEvent",
+ ]) && !!getErrorEventDefinition(element)
+ );
}
export function getErrorEventDefinition(element) {
- return getEventDefinition(element, 'bpmn:ErrorEventDefinition');
+ return getEventDefinition(element, "bpmn:ErrorEventDefinition");
}
export function isTimerSupported(element) {
- return isAny(element, [
- 'bpmn:StartEvent',
- 'bpmn:IntermediateCatchEvent',
- 'bpmn:BoundaryEvent'
- ]) && !!getTimerEventDefinition(element);
+ return (
+ isAny(element, [
+ "bpmn:StartEvent",
+ "bpmn:IntermediateCatchEvent",
+ "bpmn:BoundaryEvent",
+ ]) && !!getTimerEventDefinition(element)
+ );
}
/**
@@ -45,125 +42,132 @@ export function isTimerSupported(element) {
* @return {string|undefined} the timer definition type
*/
export function getTimerDefinitionType(timer) {
+ if (!timer) {
+ return;
+ }
- if (!timer) {
- return;
- }
+ const timeDate = timer.get("timeDate");
+ if (typeof timeDate !== "undefined") {
+ return "timeDate";
+ }
- const timeDate = timer.get('timeDate');
- if (typeof timeDate !== 'undefined') {
- return 'timeDate';
- }
+ const timeCycle = timer.get("timeCycle");
+ if (typeof timeCycle !== "undefined") {
+ return "timeCycle";
+ }
- const timeCycle = timer.get('timeCycle');
- if (typeof timeCycle !== 'undefined') {
- return 'timeCycle';
- }
-
- const timeDuration = timer.get('timeDuration');
- if (typeof timeDuration !== 'undefined') {
- return 'timeDuration';
- }
+ const timeDuration = timer.get("timeDuration");
+ if (typeof timeDuration !== "undefined") {
+ return "timeDuration";
+ }
}
export function getTimerEventDefinition(element) {
- return getEventDefinition(element, 'bpmn:TimerEventDefinition');
+ return getEventDefinition(element, "bpmn:TimerEventDefinition");
}
export function getError(element) {
- const errorEventDefinition = getErrorEventDefinition(element);
+ const errorEventDefinition = getErrorEventDefinition(element);
- return errorEventDefinition && errorEventDefinition.get('errorRef');
+ return errorEventDefinition && errorEventDefinition.get("errorRef");
}
export function getEventDefinition(element, eventType) {
- const businessObject = getBusinessObject(element);
+ const businessObject = getBusinessObject(element);
- const eventDefinitions = businessObject.get('eventDefinitions') || [];
+ const eventDefinitions = businessObject.get("eventDefinitions") || [];
- return find(eventDefinitions, function (definition) {
- return is(definition, eventType);
- });
+ return find(eventDefinitions, function (definition) {
+ return is(definition, eventType);
+ });
}
export function isMessageSupported(element) {
- return is(element, 'bpmn:ReceiveTask') || (
- isAny(element, [
- 'bpmn:StartEvent',
- 'bpmn:EndEvent',
- 'bpmn:IntermediateThrowEvent',
- 'bpmn:BoundaryEvent',
- 'bpmn:IntermediateCatchEvent'
- ]) && !!getMessageEventDefinition(element)
- );
+ return (
+ is(element, "bpmn:ReceiveTask") ||
+ (isAny(element, [
+ "bpmn:StartEvent",
+ "bpmn:EndEvent",
+ "bpmn:IntermediateThrowEvent",
+ "bpmn:BoundaryEvent",
+ "bpmn:IntermediateCatchEvent",
+ ]) &&
+ !!getMessageEventDefinition(element))
+ );
}
export function getMessageEventDefinition(element) {
- if (is(element, 'bpmn:ReceiveTask')) {
- return getBusinessObject(element);
- }
+ if (is(element, "bpmn:ReceiveTask")) {
+ return getBusinessObject(element);
+ }
- return getEventDefinition(element, 'bpmn:MessageEventDefinition');
+ return getEventDefinition(element, "bpmn:MessageEventDefinition");
}
export function getMessage(element) {
- const messageEventDefinition = getMessageEventDefinition(element);
+ const messageEventDefinition = getMessageEventDefinition(element);
- return messageEventDefinition && messageEventDefinition.get('messageRef');
+ return messageEventDefinition && messageEventDefinition.get("messageRef");
}
export function getLinkEventDefinition(element) {
- return getEventDefinition(element, 'bpmn:LinkEventDefinition');
+ return getEventDefinition(element, "bpmn:LinkEventDefinition");
}
export function getSignalEventDefinition(element) {
- return getEventDefinition(element, 'bpmn:SignalEventDefinition');
+ return getEventDefinition(element, "bpmn:SignalEventDefinition");
}
export function isLinkSupported(element) {
- return isAny(element, [
- 'bpmn:IntermediateThrowEvent',
- 'bpmn:IntermediateCatchEvent'
- ]) && !!getLinkEventDefinition(element);
+ return (
+ isAny(element, [
+ "bpmn:IntermediateThrowEvent",
+ "bpmn:IntermediateCatchEvent",
+ ]) && !!getLinkEventDefinition(element)
+ );
}
export function isSignalSupported(element) {
- return is(element, 'bpmn:Event') && !!getSignalEventDefinition(element);
+ return is(element, "bpmn:Event") && !!getSignalEventDefinition(element);
}
export function getSignal(element) {
- const signalEventDefinition = getSignalEventDefinition(element);
+ const signalEventDefinition = getSignalEventDefinition(element);
- return signalEventDefinition && signalEventDefinition.get('signalRef');
+ return signalEventDefinition && signalEventDefinition.get("signalRef");
}
export function getEscalationEventDefinition(element) {
- return getEventDefinition(element, 'bpmn:EscalationEventDefinition');
+ return getEventDefinition(element, "bpmn:EscalationEventDefinition");
}
export function isEscalationSupported(element) {
- return is(element, 'bpmn:Event') && !!getEscalationEventDefinition(element);
+ return is(element, "bpmn:Event") && !!getEscalationEventDefinition(element);
}
export function getEscalation(element) {
- const escalationEventDefinition = getEscalationEventDefinition(element);
+ const escalationEventDefinition = getEscalationEventDefinition(element);
- return escalationEventDefinition && escalationEventDefinition.get('escalationRef');
+ return (
+ escalationEventDefinition && escalationEventDefinition.get("escalationRef")
+ );
}
export function isCompensationSupported(element) {
- return isAny(element, [
- 'bpmn:EndEvent',
- 'bpmn:IntermediateThrowEvent'
- ]) && !!getCompensateEventDefinition(element);
+ return (
+ isAny(element, ["bpmn:EndEvent", "bpmn:IntermediateThrowEvent"]) &&
+ !!getCompensateEventDefinition(element)
+ );
}
export function getCompensateEventDefinition(element) {
- return getEventDefinition(element, 'bpmn:CompensateEventDefinition');
+ return getEventDefinition(element, "bpmn:CompensateEventDefinition");
}
export function getCompensateActivity(element) {
- const compensateEventDefinition = getCompensateEventDefinition(element);
+ const compensateEventDefinition = getCompensateEventDefinition(element);
- return compensateEventDefinition && compensateEventDefinition.get('activityRef');
+ return (
+ compensateEventDefinition && compensateEventDefinition.get("activityRef")
+ );
}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ExtensionElementsUtil.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ExtensionElementsUtil.js
index d39748d2..b66abacc 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ExtensionElementsUtil.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ExtensionElementsUtil.js
@@ -4,11 +4,11 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import {is} from 'bpmn-js/lib/util/ModelUtil';
+import { is } from "bpmn-js/lib/util/ModelUtil";
-import {createElement} from './ElementUtil';
+import { createElement } from "./ElementUtil";
-import {isArray} from 'min-dash';
+import { isArray } from "min-dash";
/**
* Get extension elements of business object. Optionally filter by type.
@@ -18,33 +18,33 @@ import {isArray} from 'min-dash';
* @returns {Array}
*/
export function getExtensionElementsList(businessObject, type = undefined) {
- const extensionElements = businessObject.get('extensionElements');
+ const extensionElements = businessObject.get("extensionElements");
- if (!extensionElements) {
- return [];
- }
+ if (!extensionElements) {
+ return [];
+ }
- const values = extensionElements.get('values');
+ const values = extensionElements.get("values");
- if (!values || !values.length) {
- return [];
- }
+ if (!values || !values.length) {
+ return [];
+ }
- if (type) {
- return values.filter(value => is(value, type));
- }
- return values;
+ if (type) {
+ return values.filter((value) => is(value, type));
+ }
+ return values;
}
export function getExtension(element, type) {
- const extensionElements = getExtensionElementsList(element);
- if (!extensionElements) {
- return null;
- }
-
- return extensionElements.filter(function (e) {
- return e.$instanceOf(type);
- })[0];
+ const extensionElements = getExtensionElementsList(element);
+ if (!extensionElements) {
+ return null;
+ }
+
+ return extensionElements.filter(function (e) {
+ return e.$instanceOf(type);
+ })[0];
}
/**
@@ -55,49 +55,55 @@ export function getExtension(element, type) {
* @param {ModdleElement|Array} extensionElementsToAdd
* @param {CommandStack} commandStack
*/
-export function addExtensionElements(element, businessObject, extensionElementToAdd, bpmnFactory, commandStack) {
- const commands = [];
-
- let extensionElements = businessObject.get('extensionElements');
-
- // (1) create bpmn:ExtensionElements if it doesn't exist
- if (!extensionElements) {
- extensionElements = createElement(
- 'bpmn:ExtensionElements',
- {
- values: []
- },
- businessObject,
- bpmnFactory
- );
-
- commands.push({
- cmd: 'element.updateModdleProperties',
- context: {
- element,
- moddleElement: businessObject,
- properties: {
- extensionElements
- }
- }
- });
- }
-
- extensionElementToAdd.$parent = extensionElements;
-
- // (2) add extension element to list
+export function addExtensionElements(
+ element,
+ businessObject,
+ extensionElementToAdd,
+ bpmnFactory,
+ commandStack
+) {
+ const commands = [];
+
+ let extensionElements = businessObject.get("extensionElements");
+
+ // (1) create bpmn:ExtensionElements if it doesn't exist
+ if (!extensionElements) {
+ extensionElements = createElement(
+ "bpmn:ExtensionElements",
+ {
+ values: [],
+ },
+ businessObject,
+ bpmnFactory
+ );
+
commands.push({
- cmd: 'element.updateModdleProperties',
- context: {
- element,
- moddleElement: extensionElements,
- properties: {
- values: [...extensionElements.get('values'), extensionElementToAdd]
- }
- }
+ cmd: "element.updateModdleProperties",
+ context: {
+ element,
+ moddleElement: businessObject,
+ properties: {
+ extensionElements,
+ },
+ },
});
-
- commandStack.execute('properties-panel.multi-command-executor', commands);
+ }
+
+ extensionElementToAdd.$parent = extensionElements;
+
+ // (2) add extension element to list
+ commands.push({
+ cmd: "element.updateModdleProperties",
+ context: {
+ element,
+ moddleElement: extensionElements,
+ properties: {
+ values: [...extensionElements.get("values"), extensionElementToAdd],
+ },
+ },
+ });
+
+ commandStack.execute("properties-panel.multi-command-executor", commands);
}
/**
@@ -108,19 +114,26 @@ export function addExtensionElements(element, businessObject, extensionElementTo
* @param {ModdleElement|Array} extensionElementsToRemove
* @param {CommandStack} commandStack
*/
-export function removeExtensionElements(element, businessObject, extensionElementsToRemove, commandStack) {
- if (!isArray(extensionElementsToRemove)) {
- extensionElementsToRemove = [extensionElementsToRemove];
- }
-
- const extensionElements = businessObject.get('extensionElements'),
- values = extensionElements.get('values').filter(value => !extensionElementsToRemove.includes(value));
-
- commandStack.execute('element.updateModdleProperties', {
- element,
- moddleElement: extensionElements,
- properties: {
- values
- }
- });
+export function removeExtensionElements(
+ element,
+ businessObject,
+ extensionElementsToRemove,
+ commandStack
+) {
+ if (!isArray(extensionElementsToRemove)) {
+ extensionElementsToRemove = [extensionElementsToRemove];
+ }
+
+ const extensionElements = businessObject.get("extensionElements"),
+ values = extensionElements
+ .get("values")
+ .filter((value) => !extensionElementsToRemove.includes(value));
+
+ commandStack.execute("element.updateModdleProperties", {
+ element,
+ moddleElement: extensionElements,
+ properties: {
+ values,
+ },
+ });
}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/FormTypeUtils.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/FormTypeUtils.js
index 15773e02..97c1cf68 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/FormTypeUtils.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/FormTypeUtils.js
@@ -4,30 +4,30 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import {isDefined} from 'min-dash';
+import { isDefined } from "min-dash";
-import {
- getBusinessObject,
- is
-} from 'bpmn-js/lib/util/ModelUtil';
+import { getBusinessObject, is } from "bpmn-js/lib/util/ModelUtil";
export function getFormRefBinding(element) {
- const businessObject = getBusinessObject(element);
+ const businessObject = getBusinessObject(element);
- return businessObject.get('camunda:formRefBinding') || 'latest';
+ return businessObject.get("camunda:formRefBinding") || "latest";
}
export function getFormType(element) {
- const businessObject = getBusinessObject(element);
+ const businessObject = getBusinessObject(element);
- if (isDefined(businessObject.get('camunda:formKey'))) {
- return 'formKey';
- } else if (isDefined(businessObject.get('camunda:formRef'))) {
- return 'formRef';
- }
+ if (isDefined(businessObject.get("camunda:formKey"))) {
+ return "formKey";
+ } else if (isDefined(businessObject.get("camunda:formRef"))) {
+ return "formRef";
+ }
}
export function isFormSupported(element) {
- return (is(element, 'bpmn:StartEvent') && !is(element.parent, 'bpmn:SubProcess'))
- || is(element, 'bpmn:UserTask');
-}
\ No newline at end of file
+ return (
+ (is(element, "bpmn:StartEvent") &&
+ !is(element.parent, "bpmn:SubProcess")) ||
+ is(element, "bpmn:UserTask")
+ );
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ImplementationTypeUtils.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ImplementationTypeUtils.js
index ecdd4755..7c50566a 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ImplementationTypeUtils.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ImplementationTypeUtils.js
@@ -4,16 +4,10 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import {
- getBusinessObject,
- is
-} from 'bpmn-js/lib/util/ModelUtil';
+import { getBusinessObject, is } from "bpmn-js/lib/util/ModelUtil";
-import {
- isAny
-} from 'bpmn-js/lib/features/modeling/util/ModelingUtil';
-import {getMessageEventDefinition} from "./EventDefinitionUtil";
-import {getExtensionElementsList} from "./ExtensionElementsUtil";
+import { isAny } from "bpmn-js/lib/features/modeling/util/ModelingUtil";
+import { getMessageEventDefinition } from "./EventDefinitionUtil";
/**
* Check whether an element is camunda:ServiceTaskLike
@@ -23,7 +17,7 @@ import {getExtensionElementsList} from "./ExtensionElementsUtil";
* @return {boolean} a boolean value
*/
export function isServiceTaskLike(element) {
- return is(element, 'camunda:ServiceTaskLike');
+ return is(element, "camunda:ServiceTaskLike");
}
/**
@@ -34,7 +28,7 @@ export function isServiceTaskLike(element) {
* @return {boolean} a boolean value
*/
export function isDmnCapable(element) {
- return is(element, 'camunda:DmnCapable');
+ return is(element, "camunda:DmnCapable");
}
/**
@@ -45,18 +39,16 @@ export function isDmnCapable(element) {
* @return {boolean} a boolean value
*/
export function isExternalCapable(element) {
- return is(element, 'camunda:ExternalCapable');
+ return is(element, "camunda:ExternalCapable");
}
/**
* Returns 'true'
*
- * @param {djs.model.Base} element
- *
* @return {boolean} true
*/
-export function isDeploymentCapable(element) {
- return true;
+export function isDeploymentCapable() {
+ return true;
}
/**
@@ -69,20 +61,21 @@ export function isDeploymentCapable(element) {
* @return {ModdleElement} the 'camunda:ServiceTaskLike' business object
*/
export function getServiceTaskLikeBusinessObject(element) {
-
- if (is(element, 'bpmn:IntermediateThrowEvent') || is(element, 'bpmn:EndEvent')) {
-
- // change business object to 'messageEventDefinition' when
- // the element is a message intermediate throw event or message end event
- // because the camunda extensions (e.g. camunda:class) are in the message
- // event definition tag and not in the intermediate throw event or end event tag
- const messageEventDefinition = getMessageEventDefinition(element);
- if (messageEventDefinition) {
- element = messageEventDefinition;
- }
+ if (
+ is(element, "bpmn:IntermediateThrowEvent") ||
+ is(element, "bpmn:EndEvent")
+ ) {
+ // change business object to 'messageEventDefinition' when
+ // the element is a message intermediate throw event or message end event
+ // because the camunda extensions (e.g. camunda:class) are in the message
+ // event definition tag and not in the intermediate throw event or end event tag
+ const messageEventDefinition = getMessageEventDefinition(element);
+ if (messageEventDefinition) {
+ element = messageEventDefinition;
}
+ }
- return isServiceTaskLike(element) && getBusinessObject(element);
+ return isServiceTaskLike(element) && getBusinessObject(element);
}
// /**
@@ -156,11 +149,13 @@ export function getServiceTaskLikeBusinessObject(element) {
// }
export function isListener(element) {
- return this.isTaskListener(element) || this.isExecutionListener(element);
+ return this.isTaskListener(element) || this.isExecutionListener(element);
}
export function getListenerBusinessObject(businessObject) {
- if (isAny(businessObject, ['camunda:ExecutionListener', 'camunda:TaskListener'])) {
- return businessObject;
- }
+ if (
+ isAny(businessObject, ["camunda:ExecutionListener", "camunda:TaskListener"])
+ ) {
+ return businessObject;
+ }
}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/InputOutputUtil.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/InputOutputUtil.js
index 7cf6645e..c30c287a 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/InputOutputUtil.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/InputOutputUtil.js
@@ -4,25 +4,20 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import {
- isAny
-} from 'bpmn-js/lib/features/modeling/util/ModelingUtil';
+import { isAny } from "bpmn-js/lib/features/modeling/util/ModelingUtil";
-import {
- getBusinessObject,
- is
-} from 'bpmn-js/lib/util/ModelUtil';
-import {getExtensionElementsList} from "./ExtensionElementsUtil";
-import {createElement, nextId} from "./ElementUtil";
+import { getBusinessObject, is } from "bpmn-js/lib/util/ModelUtil";
+import { getExtensionElementsList } from "./ExtensionElementsUtil";
+import { createElement, nextId } from "./ElementUtil";
function getElements(businessObject, type, property) {
- const elements = getExtensionElementsList(businessObject, type);
- return !property ? elements : (elements[0] || {})[property] || [];
+ const elements = getExtensionElementsList(businessObject, type);
+ return !property ? elements : (elements[0] || {})[property] || [];
}
function getParameters(element, prop) {
- const inputOutput = getInputOutput(element);
- return (inputOutput && inputOutput.get(prop)) || [];
+ const inputOutput = getInputOutput(element);
+ return (inputOutput && inputOutput.get(prop)) || [];
}
/**
@@ -33,16 +28,15 @@ function getParameters(element, prop) {
* @return {ModdleElement} the inputOutput object
*/
export function getInputOutput(element) {
- if (is(element, 'camunda:Connector')) {
- return element.get('inputOutput');
- }
+ if (is(element, "camunda:Connector")) {
+ return element.get("inputOutput");
+ }
- const businessObject = getBusinessObject(element);
+ const businessObject = getBusinessObject(element);
- return (getElements(businessObject, 'camunda:InputOutput') || [])[0];
+ return (getElements(businessObject, "camunda:InputOutput") || [])[0];
}
-
/**
* Return all input parameters existing in the business object, and
* an empty array if none exist.
@@ -52,7 +46,7 @@ export function getInputOutput(element) {
* @return {Array} a list of input parameter objects
*/
export function getInputParameters(element) {
- return getParameters(element, 'inputParameters');
+ return getParameters(element, "inputParameters");
}
/**
@@ -64,122 +58,137 @@ export function getInputParameters(element) {
* @return {Array} a list of output parameter objects
*/
export function getOutputParameters(element) {
- return getParameters(element, 'outputParameters');
+ return getParameters(element, "outputParameters");
}
-
export function isInputOutputSupported(element) {
- const businessObject = getBusinessObject(element);
-
- return (
- is(businessObject, 'bpmn:FlowNode') && !(
- isAny(businessObject, ['bpmn:StartEvent', 'bpmn:BoundaryEvent', 'bpmn:Gateway']) ||
- is(businessObject, 'bpmn:SubProcess') && businessObject.get('triggeredByEvent')
- )
- );
+ const businessObject = getBusinessObject(element);
+
+ return (
+ is(businessObject, "bpmn:FlowNode") &&
+ !(
+ isAny(businessObject, [
+ "bpmn:StartEvent",
+ "bpmn:BoundaryEvent",
+ "bpmn:Gateway",
+ ]) ||
+ (is(businessObject, "bpmn:SubProcess") &&
+ businessObject.get("triggeredByEvent"))
+ )
+ );
}
export function areInputParametersSupported(element) {
- return isInputOutputSupported(element);
+ return isInputOutputSupported(element);
}
export function areOutputParametersSupported(element) {
- const businessObject = getBusinessObject(element);
- return (
- isInputOutputSupported(element) &&
- !is(businessObject, 'bpmn:EndEvent') &&
- !businessObject.loopCharacteristics
- );
+ const businessObject = getBusinessObject(element);
+ return (
+ isInputOutputSupported(element) &&
+ !is(businessObject, "bpmn:EndEvent") &&
+ !businessObject.loopCharacteristics
+ );
}
export function getInputOutputType(parameter) {
- const definitionTypes = {
- 'camunda:Map': 'map',
- 'camunda:List': 'list',
- 'camunda:Script': 'script'
- };
+ const definitionTypes = {
+ "camunda:Map": "map",
+ "camunda:List": "list",
+ "camunda:Script": "script",
+ };
- let type = 'stringOrExpression';
+ let type = "stringOrExpression";
- const definition = parameter.get('definition');
- if (typeof definition !== 'undefined') {
- type = definitionTypes[definition.$type];
- }
+ const definition = parameter.get("definition");
+ if (typeof definition !== "undefined") {
+ type = definitionTypes[definition.$type];
+ }
- return type;
+ return type;
}
export function CreateParameterCmd(element, type, parent, bpmnFactory) {
- const isInput = type === 'camunda:InputParameter';
-
- const newParameter = createElement(type, {
- name: nextId(isInput ? 'Input_' : 'Output_')
- }, parent, bpmnFactory);
-
- const propertyName = isInput ? 'inputParameters' : 'outputParameters';
-
- return {
- cmd: 'element.updateModdleProperties',
- context: {
- element,
- moddleElement: parent,
- properties: {
- [propertyName]: [...parent.get(propertyName), newParameter]
- }
- }
- };
+ const isInput = type === "camunda:InputParameter";
+
+ const newParameter = createElement(
+ type,
+ {
+ name: nextId(isInput ? "Input_" : "Output_"),
+ },
+ parent,
+ bpmnFactory
+ );
+
+ const propertyName = isInput ? "inputParameters" : "outputParameters";
+
+ return {
+ cmd: "element.updateModdleProperties",
+ context: {
+ element,
+ moddleElement: parent,
+ properties: {
+ [propertyName]: [...parent.get(propertyName), newParameter],
+ },
+ },
+ };
}
export function AddParameterCmd(element, type, bpmnFactory) {
- const commands = [];
- const businessObject = getBusinessObject(element);
-
- let extensionElements = businessObject.get('extensionElements');
-
- // (1) ensure extension elements
- if (!extensionElements) {
- extensionElements = createElement(
- 'bpmn:ExtensionElements',
- {values: []},
- businessObject,
- bpmnFactory
- );
-
- commands.push({
- cmd: 'element.updateModdleProperties',
- context: {
- element,
- moddleElement: businessObject,
- properties: {extensionElements}
- }
- });
- }
-
- // (2) ensure inputOutput
- let inputOutput = getInputOutput(element);
-
- if (!inputOutput) {
- const parent = extensionElements;
-
- inputOutput = createElement('camunda:InputOutput', {
- inputParameters: [],
- outputParameters: []
- }, parent, bpmnFactory);
-
- commands.push({
- cmd: 'element.updateModdleProperties',
- context: {
- element,
- moddleElement: extensionElements,
- properties: {
- values: [...extensionElements.get('values'), inputOutput]
- }
- }
- });
- }
-
- // (3) create + add parameter
- commands.push(CreateParameterCmd(element, type, inputOutput, bpmnFactory));
-
- return commands;
-}
\ No newline at end of file
+ const commands = [];
+ const businessObject = getBusinessObject(element);
+
+ let extensionElements = businessObject.get("extensionElements");
+
+ // (1) ensure extension elements
+ if (!extensionElements) {
+ extensionElements = createElement(
+ "bpmn:ExtensionElements",
+ { values: [] },
+ businessObject,
+ bpmnFactory
+ );
+
+ commands.push({
+ cmd: "element.updateModdleProperties",
+ context: {
+ element,
+ moddleElement: businessObject,
+ properties: { extensionElements },
+ },
+ });
+ }
+
+ // (2) ensure inputOutput
+ let inputOutput = getInputOutput(element);
+
+ if (!inputOutput) {
+ const parent = extensionElements;
+
+ inputOutput = createElement(
+ "camunda:InputOutput",
+ {
+ inputParameters: [],
+ outputParameters: [],
+ },
+ parent,
+ bpmnFactory
+ );
+
+ commands.push({
+ cmd: "element.updateModdleProperties",
+ context: {
+ element,
+ moddleElement: extensionElements,
+ properties: {
+ values: [...extensionElements.get("values"), inputOutput],
+ },
+ },
+ });
+ }
+
+ // (3) create + add parameter
+ commands.push(CreateParameterCmd(element, type, inputOutput, bpmnFactory));
+
+ return commands;
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ValidationUtil.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ValidationUtil.js
index 38375c25..a2d1b959 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/ValidationUtil.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/ValidationUtil.js
@@ -22,36 +22,34 @@ const ID_REGEX = /^[a-z_][\w-.]*$/i;
* @return {String} error message
*/
export function isIdValid(element, idValue, translate) {
- const assigned = element.$model.ids.assigned(idValue);
- const idAlreadyExists = assigned && assigned !== element;
+ const assigned = element.$model.ids.assigned(idValue);
+ const idAlreadyExists = assigned && assigned !== element;
- if (!idValue) {
- return translate('ID must not be empty.');
- }
+ if (!idValue) {
+ return translate("ID must not be empty.");
+ }
- if (idAlreadyExists) {
- return translate('ID must be unique.');
- }
+ if (idAlreadyExists) {
+ return translate("ID must be unique.");
+ }
- return validateId(idValue, translate);
+ return validateId(idValue, translate);
}
export function validateId(idValue, translate) {
+ if (containsSpace(idValue)) {
+ return translate("ID must not contain spaces.");
+ }
- if (containsSpace(idValue)) {
- return translate('ID must not contain spaces.');
+ if (!ID_REGEX.test(idValue)) {
+ if (QNAME_REGEX.test(idValue)) {
+ return translate("ID must not contain prefix.");
}
- if (!ID_REGEX.test(idValue)) {
-
- if (QNAME_REGEX.test(idValue)) {
- return translate('ID must not contain prefix.');
- }
-
- return translate('ID must be a valid QName.');
- }
+ return translate("ID must be a valid QName.");
+ }
}
export function containsSpace(value) {
- return SPACE_REGEX.test(value);
-}
\ No newline at end of file
+ return SPACE_REGEX.test(value);
+}
diff --git a/components/bpmn-q/modeler-component/editor/util/camunda-utils/generateImage.js b/components/bpmn-q/modeler-component/editor/util/camunda-utils/generateImage.js
index a7ae2aa5..9b45f361 100644
--- a/components/bpmn-q/modeler-component/editor/util/camunda-utils/generateImage.js
+++ b/components/bpmn-q/modeler-component/editor/util/camunda-utils/generateImage.js
@@ -4,56 +4,59 @@
* This code and the accompanying materials are made available by camunda under the
* terms of the MIT License.
*/
-import canvg from 'canvg-browser';
+import canvg from "canvg-browser";
// list of defined encodings
-const ENCODINGS = [
- 'image/png',
- 'image/jpeg'
-];
+const ENCODINGS = ["image/png", "image/jpeg"];
const INITIAL_SCALE = 3;
const FINAL_SCALE = 1;
const SCALE_STEP = 1;
-const DATA_URL_REGEX = /^data:((?:\w+\/(?:(?!;).)+)?)((?:;[\w\W]*?[^;])*),(.+)$/;
-
+const DATA_URL_REGEX =
+ /^data:((?:\w+\/(?:(?!;).)+)?)((?:;[\w\W]*?[^;])*),(.+)$/;
export default function generateImage(type, svg) {
- const encoding = 'image/' + type;
-
- if (ENCODINGS.indexOf(encoding) === -1) {
- throw new Error('<' + type + '> is an unknown type for converting svg to image');
- }
+ const encoding = "image/" + type;
- const initialSVG = svg;
+ if (ENCODINGS.indexOf(encoding) === -1) {
+ throw new Error(
+ "<" + type + "> is an unknown type for converting svg to image"
+ );
+ }
- let dataURL = '';
+ const initialSVG = svg;
- for (let scale = INITIAL_SCALE; scale >= FINAL_SCALE; scale -= SCALE_STEP) {
+ let dataURL = "";
- let canvas = document.createElement('canvas');
+ for (let scale = INITIAL_SCALE; scale >= FINAL_SCALE; scale -= SCALE_STEP) {
+ let canvas = document.createElement("canvas");
- svg = initialSVG.replace(/width="([^"]+)" height="([^"]+)"/, function (_, widthStr, heightStr) {
- return `width="${parseInt(widthStr, 10) * scale}" height="${parseInt(heightStr, 10) * scale}"`;
- });
+ svg = initialSVG.replace(
+ /width="([^"]+)" height="([^"]+)"/,
+ function (_, widthStr, heightStr) {
+ return `width="${parseInt(widthStr, 10) * scale}" height="${
+ parseInt(heightStr, 10) * scale
+ }"`;
+ }
+ );
- canvg(canvas, svg);
+ canvg(canvas, svg);
- // make the background white for every format
- let context = canvas.getContext('2d');
+ // make the background white for every format
+ let context = canvas.getContext("2d");
- context.globalCompositeOperation = 'destination-over';
- context.fillStyle = 'white';
+ context.globalCompositeOperation = "destination-over";
+ context.fillStyle = "white";
- context.fillRect(0, 0, canvas.width, canvas.height);
+ context.fillRect(0, 0, canvas.width, canvas.height);
- dataURL = canvas.toDataURL(encoding);
+ dataURL = canvas.toDataURL(encoding);
- if (DATA_URL_REGEX.test(dataURL)) {
- return dataURL;
- }
+ if (DATA_URL_REGEX.test(dataURL)) {
+ return dataURL;
}
+ }
- throw new Error('Error happened generating image. Diagram size is too big.');
+ throw new Error("Error happened generating image. Diagram size is too big.");
}
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/Constants.js b/components/bpmn-q/modeler-component/extensions/data-extension/Constants.js
index ba0289c1..707137f7 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/Constants.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/Constants.js
@@ -1,19 +1,21 @@
// Type names of the data flow extension elements
-export const DATA_MAP_OBJECT = 'dataflow:DataMapObject';
-export const DATA_STORE_MAP = 'dataflow:DataStoreMap';
-export const TRANSFORMATION_TASK = 'dataflow:TransformationTask';
-export const TRANSFORMATION_ASSOCIATION = 'dataflow:TransformationAssociation';
-export const INPUT_TRANSFORMATION_ASSOCIATION = 'dataflow:InputTransformationAssociation';
-export const OUTPUT_TRANSFORMATION_ASSOCIATION = 'dataflow:OutputTransformationAssociation';
-export const KEY_VALUE_ENTRY = 'dataflow:KeyValueEntry';
+export const DATA_MAP_OBJECT = "dataflow:DataMapObject";
+export const DATA_STORE_MAP = "dataflow:DataStoreMap";
+export const TRANSFORMATION_TASK = "dataflow:TransformationTask";
+export const TRANSFORMATION_ASSOCIATION = "dataflow:TransformationAssociation";
+export const INPUT_TRANSFORMATION_ASSOCIATION =
+ "dataflow:InputTransformationAssociation";
+export const OUTPUT_TRANSFORMATION_ASSOCIATION =
+ "dataflow:OutputTransformationAssociation";
+export const KEY_VALUE_ENTRY = "dataflow:KeyValueEntry";
// Property names of the data flow extension elements
-export const CONTENT = 'content';
-export const DETAILS = 'details';
-export const PARAMETERS = 'parameters';
-export const EXPRESSIONS = 'expressions';
+export const CONTENT = "content";
+export const DETAILS = "details";
+export const PARAMETERS = "parameters";
+export const EXPRESSIONS = "expressions";
// Unique identifiers of the icon SVGs
-export const TASK_TYPE_TRANSFORMATION_TASK = 'TASK_TYPE_TRANSFORMATION_TASK';
-export const DATA_TYPE_DATA_MAP_OBJECT = 'DATA_TYPE_DATA_MAP_OBJECT';
-export const DATA_TYPE_DATA_STORE_MAP = 'DATA_TYPE_DATA_STORE_MAP';
\ No newline at end of file
+export const TASK_TYPE_TRANSFORMATION_TASK = "TASK_TYPE_TRANSFORMATION_TASK";
+export const DATA_TYPE_DATA_MAP_OBJECT = "DATA_TYPE_DATA_MAP_OBJECT";
+export const DATA_TYPE_DATA_STORE_MAP = "DATA_TYPE_DATA_STORE_MAP";
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/DataFlowPlugin.js b/components/bpmn-q/modeler-component/extensions/data-extension/DataFlowPlugin.js
index d4a31260..af7e64ab 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/DataFlowPlugin.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/DataFlowPlugin.js
@@ -1,40 +1,44 @@
-import React from 'react';
+import React from "react";
-import DataFlowExtensionModule from './';
-import TransformationButton from '../../editor/ui/TransformationButton';
-import {getModeler} from '../../editor/ModelerHandler';
-import {getXml} from '../../editor/util/IoUtilities';
-import {startDataFlowReplacementProcess} from './transformation/TransformationManager';
-import TransformationTaskConfigurationsTab from './transf-task-configs/TransformationTaskConfigurationsTab';
-import dataStyles from './resources/data-flow-styles.css';
+import DataFlowExtensionModule from "./";
+import TransformationButton from "../../editor/ui/TransformationButton";
+import { startDataFlowReplacementProcess } from "./transformation/TransformationManager";
+import TransformationTaskConfigurationsTab from "./transf-task-configs/TransformationTaskConfigurationsTab";
+import dataStyles from "./resources/data-flow-styles.css";
import ExtensibleButton from "../../editor/ui/ExtensibleButton";
import UpdateTransformationTaskConfigurationsButton from "./ui/UpdateTransformationConfigurations";
-let dataflowModdleDescriptor = require('./resources/data-flow-extension.json');
+let dataflowModdleDescriptor = require("./resources/data-flow-extension.json");
/**
* Plugin Object of the DataFlow extension. Used to register the plugin in the plugin handler of the modeler.
*/
export default {
- name: 'dataflow',
- buttons: []}
- title="DataFlow"
- styleClass="dataflow-plugin-icon"
- description="Show buttons of the QHAna plugin"/>
- ],
- configTabs: [
- {
- tabId: 'DataEndpointsTab',
- tabTitle: 'Data Flow Plugin',
- configTab: TransformationTaskConfigurationsTab,
- },
- ],
- extensionModule: DataFlowExtensionModule,
- moddleDescription: dataflowModdleDescriptor,
- styling: [dataStyles],
- transformExtensionButton: {
- return await startDataFlowReplacementProcess(xml);
- }
- }/>,
-};
\ No newline at end of file
+ name: "dataflow",
+ buttons: [
+ {
+ return await startDataFlowReplacementProcess(xml);
+ }}
+ />
+ ),
+};
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/config/DataConfigManager.js b/components/bpmn-q/modeler-component/extensions/data-extension/config/DataConfigManager.js
index d42aa0f6..72d296b7 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/config/DataConfigManager.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/config/DataConfigManager.js
@@ -1,8 +1,8 @@
-import {getPluginConfig} from "../../../editor/plugin/PluginConfigHandler";
+import { getPluginConfig } from "../../../editor/plugin/PluginConfigHandler";
// default config entries used if no value is specified in the initial plugin config
const defaultConfig = {
- configurationsEndpoint: process.env.SERVICE_DATA_CONFIG
+ configurationsEndpoint: process.env.SERVICE_DATA_CONFIG,
};
// current config
@@ -14,10 +14,13 @@ let config = {};
* @return {string} the currently specified endpoint url of the Configurations endpoint
*/
export function getConfigurationsEndpoint() {
- if (config.configurationsEndpoint === undefined) {
- setConfigurationsEndpoint(getPluginConfig('dataflow').configurationsEndpoint || defaultConfig.configurationsEndpoint);
- }
- return config.configurationsEndpoint;
+ if (config.configurationsEndpoint === undefined) {
+ setConfigurationsEndpoint(
+ getPluginConfig("dataflow").configurationsEndpoint ||
+ defaultConfig.configurationsEndpoint
+ );
+ }
+ return config.configurationsEndpoint;
}
/**
@@ -26,16 +29,15 @@ export function getConfigurationsEndpoint() {
* @param configurationsEndpoint the endpoint url of the transformation task Configurations endpoint
*/
export function setConfigurationsEndpoint(configurationsEndpoint) {
- if (configurationsEndpoint !== null && configurationsEndpoint !== undefined) {
-
- // remove trailing slashes
- config.configurationsEndpoint = configurationsEndpoint.replace(/\/$/, '');
- }
+ if (configurationsEndpoint !== null && configurationsEndpoint !== undefined) {
+ // remove trailing slashes
+ config.configurationsEndpoint = configurationsEndpoint.replace(/\/$/, "");
+ }
}
/**
* Resets the all config entries
*/
export function resetConfig() {
- config = {};
-}
\ No newline at end of file
+ config = {};
+}
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/index.js b/components/bpmn-q/modeler-component/extensions/data-extension/index.js
index 50f5a2f4..61d2e849 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/index.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/index.js
@@ -1,23 +1,23 @@
-import DataFlowRenderer from './rendering/DataFlowRenderer';
-import DataFlowReplaceMenuProvider from './menu/DataFlowReplaceMenuProvider';
-import DataFlowPaletteProvider from './palette/DataFlowPaletteProvider';
-import DataFlowRulesProvider from './rules/DataFlowRulesProvider';
-import DataReplaceConnectionBehavior from './rules/DataReplaceConnectionBehaviour';
-import DataFlowPropertiesProvider from './properties-panel/DataFlowPropertiesProvider';
+import DataFlowRenderer from "./rendering/DataFlowRenderer";
+import DataFlowReplaceMenuProvider from "./menu/DataFlowReplaceMenuProvider";
+import DataFlowPaletteProvider from "./palette/DataFlowPaletteProvider";
+import DataFlowRulesProvider from "./rules/DataFlowRulesProvider";
+import DataReplaceConnectionBehavior from "./rules/DataReplaceConnectionBehaviour";
+import DataFlowPropertiesProvider from "./properties-panel/DataFlowPropertiesProvider";
export default {
- __init__: [
- 'dataFlowRenderer',
- 'dataFlowMenuProvider',
- 'dataFlowPaletteProvider',
- 'dataFlowRules',
- 'replaceConnectionBehavior',
- 'dataFlowPropertiesProvider'
- ],
- dataFlowRenderer: ['type', DataFlowRenderer],
- dataFlowMenuProvider: ['type', DataFlowReplaceMenuProvider],
- dataFlowPaletteProvider: ['type', DataFlowPaletteProvider],
- dataFlowRules: ['type', DataFlowRulesProvider],
- replaceConnectionBehavior: ['type', DataReplaceConnectionBehavior],
- dataFlowPropertiesProvider: ['type', DataFlowPropertiesProvider]
-};
\ No newline at end of file
+ __init__: [
+ "dataFlowRenderer",
+ "dataFlowMenuProvider",
+ "dataFlowPaletteProvider",
+ "dataFlowRules",
+ "replaceConnectionBehavior",
+ "dataFlowPropertiesProvider",
+ ],
+ dataFlowRenderer: ["type", DataFlowRenderer],
+ dataFlowMenuProvider: ["type", DataFlowReplaceMenuProvider],
+ dataFlowPaletteProvider: ["type", DataFlowPaletteProvider],
+ dataFlowRules: ["type", DataFlowRulesProvider],
+ replaceConnectionBehavior: ["type", DataReplaceConnectionBehavior],
+ dataFlowPropertiesProvider: ["type", DataFlowPropertiesProvider],
+};
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceMenuProvider.js b/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceMenuProvider.js
index 2451670a..84734d4d 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceMenuProvider.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceMenuProvider.js
@@ -1,259 +1,315 @@
-import {is} from 'bpmn-js/lib/util/ModelUtil';
-import * as replaceOptions from './DataFlowReplaceOptions';
+import { is } from "bpmn-js/lib/util/ModelUtil";
+import * as replaceOptions from "./DataFlowReplaceOptions";
import {
- createMenuEntries,
- createMenuEntry,
- createMoreOptionsEntryWithReturn
+ createMenuEntries,
+ createMenuEntry,
+ createMoreOptionsEntryWithReturn,
} from "../../../editor/util/PopupMenuUtilities";
-import * as consts from '../Constants';
-import {createConfigurationsEntries} from '../../../editor/configurations/ConfigurationsUtil';
-import {getTransformationTaskConfigurations} from '../transf-task-configs/TransformationTaskConfigurations';
-import {replaceConnection} from '../../../editor/util/ModellingUtilities';
-import { filter } from 'min-dash';
-import { isDifferentType } from 'bpmn-js/lib/features/popup-menu/util/TypeUtil';
+import * as consts from "../Constants";
+import { createConfigurationsEntries } from "../../../editor/configurations/ConfigurationsUtil";
+import { getTransformationTaskConfigurations } from "../transf-task-configs/TransformationTaskConfigurations";
+import { replaceConnection } from "../../../editor/util/ModellingUtilities";
+import { filter } from "min-dash";
+import { isDifferentType } from "bpmn-js/lib/features/popup-menu/util/TypeUtil";
/**
* Menu Provider for bpmn-replace which is opened for a diagram element. Adds replacement entries to replace the element with the
* data flow extension elements.
*/
export default class DataFlowReplaceMenuProvider {
- constructor(popupMenu, translate, bpmnReplace, modeling, bpmnFactory, moddle, elementRegistry, commandStack) {
- popupMenu.registerProvider("bpmn-replace", this);
+ constructor(
+ popupMenu,
+ translate,
+ bpmnReplace,
+ modeling,
+ bpmnFactory,
+ moddle,
+ elementRegistry,
+ commandStack
+ ) {
+ popupMenu.registerProvider("bpmn-replace", this);
- this.replaceElement = bpmnReplace.replaceElement;
- this.translate = translate;
- this.modeling = modeling;
- this.bpmnFactory = bpmnFactory;
- this.moddle = moddle;
- this.elementRegistry = elementRegistry;
- this.commandStack = commandStack;
- this.popupMenu = popupMenu;
- }
-
- /**
- * Define header entries for the data flow elements
- *
- * @param element
- * @returns {(function(*): ({}))|*}
- */
- getPopupMenuHeaderEntries(element) {
- return function (entries) {
-
- // remove all header entries (it is only the collection marker) for DataMapObjects because they do not support them
- if (is(element, consts.DATA_MAP_OBJECT)) {
- return {};
- }
- return entries;
- };
- }
-
- /**
- * Overwrites the default menu provider to add menu entries to replace the element with DataFlow extension elements
- *
- * @param element the element for which the replacement entries are requested
- * @returns {*} an array with menu entries
- */
- getPopupMenuEntries(element) {
- const self = this;
- return function (entries) {
-
- // do not show entries for extension elements of other plugins
- if (!(element.type.startsWith('bpmn') || element.type.startsWith('dataflow'))) {
- return entries;
- }
+ this.replaceElement = bpmnReplace.replaceElement;
+ this.translate = translate;
+ this.modeling = modeling;
+ this.bpmnFactory = bpmnFactory;
+ this.moddle = moddle;
+ this.elementRegistry = elementRegistry;
+ this.commandStack = commandStack;
+ this.popupMenu = popupMenu;
+ }
- // set entries for the transformation task configurations as replacement for a DataFlow transformation task
- if (is(element, consts.TRANSFORMATION_TASK)) {
- let configEntries = {};
- const dataConfigurations = createConfigurationsEntries(
- element,
- 'dataflow-transformation-task-icon',
- getTransformationTaskConfigurations(),
- self.bpmnFactory,
- self.modeling,
- self.commandStack,
- self.replaceElement
- );
+ /**
+ * Define header entries for the data flow elements
+ *
+ * @param element
+ * @returns {(function(*): ({}))|*}
+ */
+ getPopupMenuHeaderEntries(element) {
+ return function (entries) {
+ // remove all header entries (it is only the collection marker) for DataMapObjects because they do not support them
+ if (is(element, consts.DATA_MAP_OBJECT)) {
+ return {};
+ }
+ return entries;
+ };
+ }
- if (element.businessObject.name) {
- configEntries = createMenuEntries(element, replaceOptions.TASK, self.translate, self.replaceElement);
- return Object.assign(configEntries, dataConfigurations);
- }
- return Object.assign(dataConfigurations, entries);
- }
+ /**
+ * Overwrites the default menu provider to add menu entries to replace the element with DataFlow extension elements
+ *
+ * @param element the element for which the replacement entries are requested
+ * @returns {*} an array with menu entries
+ */
+ getPopupMenuEntries(element) {
+ const self = this;
+ return function (entries) {
+ // do not show entries for extension elements of other plugins
+ if (
+ !(
+ element.type.startsWith("bpmn") || element.type.startsWith("dataflow")
+ )
+ ) {
+ return entries;
+ }
- // add MoreOptionsEntry for transformation task as replacement for BPMN task types
- if (is(element, 'bpmn:Task')) {
- const taskEntries = self.createTransformationTasksEntries(element);
- return Object.assign(taskEntries, entries);
- }
-
- // add entries for data map objects as replacement for BPMN data objects
- if (is(element, 'bpmn:DataObjectReference')) {
- let filteredOptions = filter(replaceOptions.DATA_OBJECT, isDifferentType(element));
- const dataEntries = createMenuEntries(element, filteredOptions, self.translate, self.replaceElement);
- return Object.assign(dataEntries, entries);
- }
-
- // add entries for data store maps as replacement for BPMN data stores
- if (is(element, 'bpmn:DataStoreReference')) {
- let filteredOptions = filter(replaceOptions.DATA_STORE, isDifferentType(element));
- const storeEntries = createMenuEntries(element, filteredOptions, self.translate, self.replaceElement);
- return Object.assign(storeEntries, entries);
- }
+ // set entries for the transformation task configurations as replacement for a DataFlow transformation task
+ if (is(element, consts.TRANSFORMATION_TASK)) {
+ let configEntries = {};
+ const dataConfigurations = createConfigurationsEntries(
+ element,
+ "dataflow-transformation-task-icon",
+ getTransformationTaskConfigurations(),
+ self.bpmnFactory,
+ self.modeling,
+ self.commandStack,
+ self.replaceElement
+ );
- // set entry for transformation association as replacement for BPMN data association
- if (is(element, 'bpmn:DataAssociation') && !is(element, consts.TRANSFORMATION_ASSOCIATION)) {
- const associationEntry = self.createTransformationAssociationEntry(element);
- if (associationEntry) {
- return associationEntry;
- }
- }
+ if (element.businessObject.name) {
+ configEntries = createMenuEntries(
+ element,
+ replaceOptions.TASK,
+ self.translate,
+ self.replaceElement
+ );
+ return Object.assign(configEntries, dataConfigurations);
+ }
+ return Object.assign(dataConfigurations, entries);
+ }
- // add entry for data association as replacement for DataFlow transformation association
- if (is(element, consts.TRANSFORMATION_ASSOCIATION)) {
- const dataAssociationEntry = self.createDataAssociationEntry(element);
- if (dataAssociationEntry) {
- return Object.assign(dataAssociationEntry, entries);
- }
- }
- return entries;
- };
- }
+ // add MoreOptionsEntry for transformation task as replacement for BPMN task types
+ if (is(element, "bpmn:Task")) {
+ const taskEntries = self.createTransformationTasksEntries(element);
+ return Object.assign(taskEntries, entries);
+ }
- /**
- * Create MoreOptionEntries with replacement entries for a transformation task, including the loaded configurations
- * for transformation tasks.
- *
- * @param element The element the replacement entries are requested for
- * @returns {{'replace-by-more-transf-task-options': {label: string, className: string, action: Function}}}
- */
- createTransformationTasksEntries(element) {
- const popupMenu = this.popupMenu;
- const translate = this.translate;
- const replaceElement = this.replaceElement;
- const bpmnFactory = this.bpmnFactory;
- const modeling = this.modeling;
- const commandStack = this.commandStack;
+ // add entries for data map objects as replacement for BPMN data objects
+ if (is(element, "bpmn:DataObjectReference")) {
+ let filteredOptions = filter(
+ replaceOptions.DATA_OBJECT,
+ isDifferentType(element)
+ );
+ const dataEntries = createMenuEntries(
+ element,
+ filteredOptions,
+ self.translate,
+ self.replaceElement
+ );
+ return Object.assign(dataEntries, entries);
+ }
- // create replacement entries for each loaded transformation task configuration
- let options = createConfigurationsEntries(
- element,
- 'bpmn-icon-dataflow-transformation-task',
- getTransformationTaskConfigurations(),
- bpmnFactory,
- modeling,
- commandStack,
- replaceElement
+ // add entries for data store maps as replacement for BPMN data stores
+ if (is(element, "bpmn:DataStoreReference")) {
+ let filteredOptions = filter(
+ replaceOptions.DATA_STORE,
+ isDifferentType(element)
);
- let filteredOptions = filter(replaceOptions.TASK, isDifferentType(element));
- options = Object.assign(createMenuEntries(element, filteredOptions, translate, replaceElement), options);
+ const storeEntries = createMenuEntries(
+ element,
+ filteredOptions,
+ self.translate,
+ self.replaceElement
+ );
+ return Object.assign(storeEntries, entries);
+ }
- return {
- ['replace-by-more-transf-task-options']: createMoreOptionsEntryWithReturn(
- element,
- 'Transformation Tasks',
- 'Transformation Tasks',
- popupMenu,
- options,
- 'dataflow-transformation-tasks-menu-icon'
- )
- };
- }
+ // set entry for transformation association as replacement for BPMN data association
+ if (
+ is(element, "bpmn:DataAssociation") &&
+ !is(element, consts.TRANSFORMATION_ASSOCIATION)
+ ) {
+ const associationEntry =
+ self.createTransformationAssociationEntry(element);
+ if (associationEntry) {
+ return associationEntry;
+ }
+ }
- /**
- * Create replacement entry to replace a data association with a DataFlow transformation association if the data
- * association connects a DataMapObject with an activity.
- *
- * @param element The element the replacement entries are requested for
- * @returns {{}} The created replacement entry
- */
- createTransformationAssociationEntry(element) {
+ // add entry for data association as replacement for DataFlow transformation association
+ if (is(element, consts.TRANSFORMATION_ASSOCIATION)) {
+ const dataAssociationEntry = self.createDataAssociationEntry(element);
+ if (dataAssociationEntry) {
+ return Object.assign(dataAssociationEntry, entries);
+ }
+ }
+ return entries;
+ };
+ }
- const modeling = this.modeling;
- const translate = this.translate;
- const replaceElement = this.replaceElement;
+ /**
+ * Create MoreOptionEntries with replacement entries for a transformation task, including the loaded configurations
+ * for transformation tasks.
+ *
+ * @param element The element the replacement entries are requested for
+ * @returns {{'replace-by-more-transf-task-options': {label: string, className: string, action: Function}}}
+ */
+ createTransformationTasksEntries(element) {
+ const popupMenu = this.popupMenu;
+ const translate = this.translate;
+ const replaceElement = this.replaceElement;
+ const bpmnFactory = this.bpmnFactory;
+ const modeling = this.modeling;
+ const commandStack = this.commandStack;
- const entryId = 'replace-with-transformation-flow';
+ // create replacement entries for each loaded transformation task configuration
+ let options = createConfigurationsEntries(
+ element,
+ "bpmn-icon-dataflow-transformation-task",
+ getTransformationTaskConfigurations(),
+ bpmnFactory,
+ modeling,
+ commandStack,
+ replaceElement
+ );
+ let filteredOptions = filter(replaceOptions.TASK, isDifferentType(element));
+ options = Object.assign(
+ createMenuEntries(element, filteredOptions, translate, replaceElement),
+ options
+ );
- // if DataObjectMap -- TransformationAssociation -> Activity
- if (is(element.source, consts.DATA_MAP_OBJECT) &&
- (is(element.target, 'bpmn:Activity') && !is(element.target, consts.DATA_MAP_OBJECT))) {
+ return {
+ ["replace-by-more-transf-task-options"]: createMoreOptionsEntryWithReturn(
+ element,
+ "Transformation Tasks",
+ "Transformation Tasks",
+ popupMenu,
+ options,
+ "dataflow-transformation-tasks-menu-icon"
+ ),
+ };
+ }
- // create definition for menu entry to replace with a transformation association
- const definition = {
- label: 'Transformation Association',
- id: entryId,
- className: 'bpmn-icon-dataflow-transformation-association',
- };
+ /**
+ * Create replacement entry to replace a data association with a DataFlow transformation association if the data
+ * association connects a DataMapObject with an activity.
+ *
+ * @param element The element the replacement entries are requested for
+ * @returns {{}} The created replacement entry
+ */
+ createTransformationAssociationEntry(element) {
+ const modeling = this.modeling;
+ const translate = this.translate;
+ const replaceElement = this.replaceElement;
- // define action to replace with a transformation association
- const action = function () {
- let associationType = consts.OUTPUT_TRANSFORMATION_ASSOCIATION;
+ const entryId = "replace-with-transformation-flow";
- // replace with an input or output transformation association depending on the type of the data association
- if (is(element, 'bpmn:DataInputAssociation')) {
- associationType = consts.INPUT_TRANSFORMATION_ASSOCIATION;
- }
- replaceConnection(element, associationType, modeling);
- };
+ // if DataObjectMap -- TransformationAssociation -> Activity
+ if (
+ is(element.source, consts.DATA_MAP_OBJECT) &&
+ is(element.target, "bpmn:Activity") &&
+ !is(element.target, consts.DATA_MAP_OBJECT)
+ ) {
+ // create definition for menu entry to replace with a transformation association
+ const definition = {
+ label: "Transformation Association",
+ id: entryId,
+ className: "bpmn-icon-dataflow-transformation-association",
+ };
- // create menu entry
- return {
- [entryId]: createMenuEntry(element, definition, translate, replaceElement, action),
- };
- }
- }
+ // define action to replace with a transformation association
+ const action = function () {
+ let associationType = consts.OUTPUT_TRANSFORMATION_ASSOCIATION;
- /**
- * Create replacement entry to replace a DataFlow transformation association with a data association if the
- * transformation association does NOT connect two DataMapObjects.
- *
- * @param element The element the replacement entries are requested for
- * @returns {{}} The created replacement entry
- */
- createDataAssociationEntry(element) {
- const modeling = this.modeling;
- const translate = this.translate;
- const replaceElement = this.replaceElement;
+ // replace with an input or output transformation association depending on the type of the data association
+ if (is(element, "bpmn:DataInputAssociation")) {
+ associationType = consts.INPUT_TRANSFORMATION_ASSOCIATION;
+ }
+ replaceConnection(element, associationType, modeling);
+ };
- // create entry if transformation association does NOT connect two data map objects
- if (!(is(element.source, consts.DATA_MAP_OBJECT) && is(element.target, consts.DATA_MAP_OBJECT))) {
+ // create menu entry
+ return {
+ [entryId]: createMenuEntry(
+ element,
+ definition,
+ translate,
+ replaceElement,
+ action
+ ),
+ };
+ }
+ }
- // create definition of menu entry
- const entryId = 'replace-with-data-association';
- const definition = {
- label: 'Data Association',
- id: entryId,
- className: 'bpmn-icon-dataflow-data-association-icon',
- };
+ /**
+ * Create replacement entry to replace a DataFlow transformation association with a data association if the
+ * transformation association does NOT connect two DataMapObjects.
+ *
+ * @param element The element the replacement entries are requested for
+ * @returns {{}} The created replacement entry
+ */
+ createDataAssociationEntry(element) {
+ const modeling = this.modeling;
+ const translate = this.translate;
+ const replaceElement = this.replaceElement;
- // create action to replace the transformation association by a data association
- const action = function () {
- let associationType = 'bpmn:DataOutputAssociation';
+ // create entry if transformation association does NOT connect two data map objects
+ if (
+ !(
+ is(element.source, consts.DATA_MAP_OBJECT) &&
+ is(element.target, consts.DATA_MAP_OBJECT)
+ )
+ ) {
+ // create definition of menu entry
+ const entryId = "replace-with-data-association";
+ const definition = {
+ label: "Data Association",
+ id: entryId,
+ className: "bpmn-icon-dataflow-data-association-icon",
+ };
- // replace with an input or output data association depending on the type of the transformation association
- if (is(element, consts.INPUT_TRANSFORMATION_ASSOCIATION)) {
- associationType = 'bpmn:DataInputAssociation';
- }
- replaceConnection(element, associationType, modeling);
- };
+ // create action to replace the transformation association by a data association
+ const action = function () {
+ let associationType = "bpmn:DataOutputAssociation";
- // create menu entry
- return {
- [entryId]: createMenuEntry(element, definition, translate, replaceElement, action),
- };
+ // replace with an input or output data association depending on the type of the transformation association
+ if (is(element, consts.INPUT_TRANSFORMATION_ASSOCIATION)) {
+ associationType = "bpmn:DataInputAssociation";
}
+ replaceConnection(element, associationType, modeling);
+ };
+
+ // create menu entry
+ return {
+ [entryId]: createMenuEntry(
+ element,
+ definition,
+ translate,
+ replaceElement,
+ action
+ ),
+ };
}
+ }
}
DataFlowReplaceMenuProvider.$inject = [
- 'popupMenu',
- 'translate',
- 'bpmnReplace',
- 'modeling',
- 'bpmnFactory',
- 'moddle',
- 'elementRegistry',
- 'commandStack',
+ "popupMenu",
+ "translate",
+ "bpmnReplace",
+ "modeling",
+ "bpmnFactory",
+ "moddle",
+ "elementRegistry",
+ "commandStack",
];
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceOptions.js b/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceOptions.js
index 26732859..b7529e93 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceOptions.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/menu/DataFlowReplaceOptions.js
@@ -1,37 +1,37 @@
-import * as consts from '../Constants';
+import * as consts from "../Constants";
// replace options for a BPMN task
export const TASK = [
- {
- id: 'dataflow-transformation-task',
- label: 'Data Transformation Task',
- className: 'dataflow-transformation-task-menu-icon',
- target: {
- type: consts.TRANSFORMATION_TASK
- }
+ {
+ id: "dataflow-transformation-task",
+ label: "Data Transformation Task",
+ className: "dataflow-transformation-task-menu-icon",
+ target: {
+ type: consts.TRANSFORMATION_TASK,
},
+ },
];
// replace options for a BPMN data store
export const DATA_STORE = [
- {
- id: 'dataflow-data-store-map',
- label: 'Data Store Map',
- className: 'dataflow-data-store-map-icon',
- target: {
- type: consts.DATA_STORE_MAP
- }
+ {
+ id: "dataflow-data-store-map",
+ label: "Data Store Map",
+ className: "dataflow-data-store-map-icon",
+ target: {
+ type: consts.DATA_STORE_MAP,
},
+ },
];
// replace options for BPMN data object
export const DATA_OBJECT = [
- {
- id: 'dataflow-data-map-object',
- label: 'Data Map Object',
- className: 'dataflow-data-map-object-menu-icon',
- target: {
- type: consts.DATA_MAP_OBJECT
- }
+ {
+ id: "dataflow-data-map-object",
+ label: "Data Map Object",
+ className: "dataflow-data-map-object-menu-icon",
+ target: {
+ type: consts.DATA_MAP_OBJECT,
},
-];
\ No newline at end of file
+ },
+];
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/palette/DataFlowPaletteProvider.js b/components/bpmn-q/modeler-component/extensions/data-extension/palette/DataFlowPaletteProvider.js
index bf0fdd1f..4bd7ae3c 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/palette/DataFlowPaletteProvider.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/palette/DataFlowPaletteProvider.js
@@ -1,95 +1,93 @@
-import * as consts from '../Constants';
+import * as consts from "../Constants";
export default class DataFlowPaletteProvider {
+ constructor(bpmnFactory, create, elementFactory, palette, translate) {
+ this.bpmnFactory = bpmnFactory;
+ this.create = create;
+ this.elementFactory = elementFactory;
+ this.translate = translate;
- constructor(bpmnFactory, create, elementFactory, palette, translate) {
- this.bpmnFactory = bpmnFactory;
- this.create = create;
- this.elementFactory = elementFactory;
- this.translate = translate;
+ palette.registerProvider(this);
+ }
- palette.registerProvider(this);
- }
-
- getPaletteEntries() {
- return this.createPlanqkServiceTaskEntry();
- }
-
- createPlanqkServiceTaskEntry() {
- const {bpmnFactory, create, elementFactory, translate} = this;
+ getPaletteEntries() {
+ return this.createPlanqkServiceTaskEntry();
+ }
- // start creation of a DataMapObject
- function createDataMapObject(event) {
- const businessObject = bpmnFactory.create(consts.DATA_MAP_OBJECT);
- let shape = elementFactory.createShape({
- type: consts.DATA_MAP_OBJECT,
- businessObject: businessObject
- });
- create.start(event, shape);
- }
+ createPlanqkServiceTaskEntry() {
+ const { bpmnFactory, create, elementFactory, translate } = this;
- // start creation of a DataStoreMap
- function createDataStoreMap(event) {
- const businessObject = bpmnFactory.create(consts.DATA_STORE_MAP);
- let shape = elementFactory.createShape({
- type: consts.DATA_STORE_MAP,
- businessObject: businessObject
- });
- create.start(event, shape);
- }
+ // start creation of a DataMapObject
+ function createDataMapObject(event) {
+ const businessObject = bpmnFactory.create(consts.DATA_MAP_OBJECT);
+ let shape = elementFactory.createShape({
+ type: consts.DATA_MAP_OBJECT,
+ businessObject: businessObject,
+ });
+ create.start(event, shape);
+ }
- // start creation of a TransformationTask
- function createTransformationTask(event) {
- const businessObject = bpmnFactory.create(consts.TRANSFORMATION_TASK);
- let shape = elementFactory.createShape({
- type: consts.TRANSFORMATION_TASK,
- businessObject: businessObject
- });
- create.start(event, shape);
- }
-
+ // start creation of a DataStoreMap
+ function createDataStoreMap(event) {
+ const businessObject = bpmnFactory.create(consts.DATA_STORE_MAP);
+ let shape = elementFactory.createShape({
+ type: consts.DATA_STORE_MAP,
+ businessObject: businessObject,
+ });
+ create.start(event, shape);
+ }
- return {
- // add separator line to delimit the new group
- 'dataflow-separator': {
- group: 'dataflowExt',
- separator: true
- },
- 'create.dataflow-data-map-object': {
- group: 'dataflowExt',
- className: 'dataflow-data-map-object-palette-icon',
- title: translate('Creates a Data Map Object to model data items'),
- action: {
- click: createDataMapObject,
- dragstart: createDataMapObject,
- }
- },
- 'create.dataflow-data-store-map': {
- group: 'dataflowExt',
- className: 'dataflow-data-store-map-task-palette-icon',
- title: translate('Creates a Data Store Map to model data stores'),
- action: {
- click: createDataStoreMap,
- dragstart: createDataStoreMap,
- }
- },
- 'create.data-flow-transformation-task': {
- group: 'dataflowExt',
- className: 'dataflow-transformation-task-palette-icon',
- title: translate('Creates a task ot specify data transformations in'),
- action: {
- click: createTransformationTask,
- dragstart: createTransformationTask,
- }
- }
- };
+ // start creation of a TransformationTask
+ function createTransformationTask(event) {
+ const businessObject = bpmnFactory.create(consts.TRANSFORMATION_TASK);
+ let shape = elementFactory.createShape({
+ type: consts.TRANSFORMATION_TASK,
+ businessObject: businessObject,
+ });
+ create.start(event, shape);
}
+
+ return {
+ // add separator line to delimit the new group
+ "dataflow-separator": {
+ group: "dataflowExt",
+ separator: true,
+ },
+ "create.dataflow-data-map-object": {
+ group: "dataflowExt",
+ className: "dataflow-data-map-object-palette-icon",
+ title: translate("Creates a Data Map Object to model data items"),
+ action: {
+ click: createDataMapObject,
+ dragstart: createDataMapObject,
+ },
+ },
+ "create.dataflow-data-store-map": {
+ group: "dataflowExt",
+ className: "dataflow-data-store-map-task-palette-icon",
+ title: translate("Creates a Data Store Map to model data stores"),
+ action: {
+ click: createDataStoreMap,
+ dragstart: createDataStoreMap,
+ },
+ },
+ "create.data-flow-transformation-task": {
+ group: "dataflowExt",
+ className: "dataflow-transformation-task-palette-icon",
+ title: translate("Creates a task ot specify data transformations in"),
+ action: {
+ click: createTransformationTask,
+ dragstart: createTransformationTask,
+ },
+ },
+ };
+ }
}
DataFlowPaletteProvider.$inject = [
- 'bpmnFactory',
- 'create',
- 'elementFactory',
- 'palette',
- 'translate'
+ "bpmnFactory",
+ "create",
+ "elementFactory",
+ "palette",
+ "translate",
];
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/DataFlowPropertiesProvider.js b/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/DataFlowPropertiesProvider.js
index 0d779baf..bd30798d 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/DataFlowPropertiesProvider.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/DataFlowPropertiesProvider.js
@@ -1,10 +1,10 @@
-import keyValueMap from './KeyValueMap';
-import {is} from 'bpmn-js/lib/util/ModelUtil';
-import {ListGroup} from '@bpmn-io/properties-panel';
-import * as consts from '../Constants';
-import * as configConsts from '../../../editor/configurations/Constants';
-import ConfigurationsProperties from '../../../editor/configurations/ConfigurationsProperties';
-import {getTransformationTaskConfiguration} from '../transf-task-configs/TransformationTaskConfigurations';
+import keyValueMap from "./KeyValueMap";
+import { is } from "bpmn-js/lib/util/ModelUtil";
+import { ListGroup } from "@bpmn-io/properties-panel";
+import * as consts from "../Constants";
+import * as configConsts from "../../../editor/configurations/Constants";
+import ConfigurationsProperties from "../../../editor/configurations/ConfigurationsProperties";
+import { getTransformationTaskConfiguration } from "../transf-task-configs/TransformationTaskConfigurations";
const LOW_PRIORITY = 500;
@@ -16,64 +16,82 @@ const LOW_PRIORITY = 500;
* @param {Function} translate The translate function of the bpmn-js modeler
* @param injector Injector module of the bpmn-js modeler used to load the required dependencies.
*/
-export default function DataFlowPropertiesProvider(propertiesPanel, translate, injector) {
-
+export default function DataFlowPropertiesProvider(
+ propertiesPanel,
+ translate,
+ injector
+) {
+ /**
+ * Return the property groups provided for the given element.
+ *
+ * @param element The given element
+ *
+ * @return groups middleware
+ */
+ this.getGroups = function (element) {
/**
- * Return the property groups provided for the given element.
+ * Return a middleware that adds groups for the properties of the DataFlow elements
*
- * @param element The given element
+ * @param {Object[]} groups The default groups for the element
*
- * @return groups middleware
+ * @return {Object[]} modified groups
*/
- this.getGroups = function (element) {
-
- /**
- * Return a middleware that adds groups for the properties of the DataFlow elements
- *
- * @param {Object[]} groups The default groups for the element
- *
- * @return {Object[]} modified groups
- */
- return function (groups) {
-
- // add group for displaying the content attribute of a DataMapObject as a key value map
- if (is(element, consts.DATA_MAP_OBJECT)) {
- groups.push(createDataMapObjectGroup(element, injector, translate));
- }
-
- // add group for displaying the details attribute of a DataStoreMap as a key value map
- if (is(element, consts.DATA_STORE_MAP)) {
- groups.push(createDataStoreMapGroup(element, injector, translate));
- }
-
- // add group for displaying the properties of transformation task and its configurations
- if (is(element, consts.TRANSFORMATION_TASK)) {
-
- // load applied configuration
- const selectedConfiguration = getTransformationTaskConfiguration(element.businessObject.get(configConsts.SELECT_CONFIGURATIONS_ID));
- if (selectedConfiguration) {
-
- // add properties group for properties defined by the configuration
- groups.splice(1, 0, createTransformationTaskConfigurationsGroup(element, injector, translate, selectedConfiguration));
- }
-
- // add entries for the parameters attribute of a transformation task
- groups.push(createTransformationTaskGroup(element, injector, translate));
- }
-
- // add group for displaying the expressions attribute fo the transformation association
- if (is(element, consts.TRANSFORMATION_ASSOCIATION)) {
- groups.push(createTransformationAssociationGroup(element, injector, translate));
- }
-
- return groups;
- };
+ return function (groups) {
+ // add group for displaying the content attribute of a DataMapObject as a key value map
+ if (is(element, consts.DATA_MAP_OBJECT)) {
+ groups.push(createDataMapObjectGroup(element, injector, translate));
+ }
+
+ // add group for displaying the details attribute of a DataStoreMap as a key value map
+ if (is(element, consts.DATA_STORE_MAP)) {
+ groups.push(createDataStoreMapGroup(element, injector, translate));
+ }
+
+ // add group for displaying the properties of transformation task and its configurations
+ if (is(element, consts.TRANSFORMATION_TASK)) {
+ // load applied configuration
+ const selectedConfiguration = getTransformationTaskConfiguration(
+ element.businessObject.get(configConsts.SELECT_CONFIGURATIONS_ID)
+ );
+ if (selectedConfiguration) {
+ // add properties group for properties defined by the configuration
+ groups.splice(
+ 1,
+ 0,
+ createTransformationTaskConfigurationsGroup(
+ element,
+ injector,
+ translate,
+ selectedConfiguration
+ )
+ );
+ }
+
+ // add entries for the parameters attribute of a transformation task
+ groups.push(
+ createTransformationTaskGroup(element, injector, translate)
+ );
+ }
+
+ // add group for displaying the expressions attribute fo the transformation association
+ if (is(element, consts.TRANSFORMATION_ASSOCIATION)) {
+ groups.push(
+ createTransformationAssociationGroup(element, injector, translate)
+ );
+ }
+
+ return groups;
};
+ };
- propertiesPanel.registerProvider(LOW_PRIORITY, this);
+ propertiesPanel.registerProvider(LOW_PRIORITY, this);
}
-DataFlowPropertiesProvider.$inject = ['propertiesPanel', 'translate', 'injector'];
+DataFlowPropertiesProvider.$inject = [
+ "propertiesPanel",
+ "translate",
+ "injector",
+];
/**
* Creates a properties group for displaying the custom properties of a DataFlow data map object. This group contains
@@ -85,13 +103,13 @@ DataFlowPropertiesProvider.$inject = ['propertiesPanel', 'translate', 'injector'
* @returns {{add: function(*): void, component: ((function(import('../PropertiesPanel').ListGroupDefinition): preact.VNode)|*), id: string, label, items: *}}
*/
function createDataMapObjectGroup(element, injector, translate) {
- const attributeName = consts.CONTENT;
- return {
- id: 'dataMapObjectProperties',
- label: translate('Content'),
- component: ListGroup,
- ...keyValueMap({element, injector, attributeName})
- };
+ const attributeName = consts.CONTENT;
+ return {
+ id: "dataMapObjectProperties",
+ label: translate("Content"),
+ component: ListGroup,
+ ...keyValueMap({ element, injector, attributeName }),
+ };
}
/**
@@ -104,13 +122,13 @@ function createDataMapObjectGroup(element, injector, translate) {
* @returns {{add: function(*): void, component: ((function(import('../PropertiesPanel').ListGroupDefinition): preact.VNode)|*), id: string, label, items: *}}
*/
function createDataStoreMapGroup(element, injector, translate) {
- const attributeName = consts.DETAILS;
- return {
- id: 'dataStoreMapProperties',
- label: translate('Details'),
- component: ListGroup,
- ...keyValueMap({element, injector, attributeName})
- };
+ const attributeName = consts.DETAILS;
+ return {
+ id: "dataStoreMapProperties",
+ label: translate("Details"),
+ component: ListGroup,
+ ...keyValueMap({ element, injector, attributeName }),
+ };
}
/**
@@ -123,13 +141,13 @@ function createDataStoreMapGroup(element, injector, translate) {
* @returns {{add: function(*): void, component: ((function(import('../PropertiesPanel').ListGroupDefinition): preact.VNode)|*), id: string, label, items: *}}
*/
function createTransformationTaskGroup(element, injector, translate) {
- const attributeName = consts.PARAMETERS;
- return {
- id: 'transformationTaskProperties',
- label: translate('Parameters'),
- component: ListGroup,
- ...keyValueMap({element, injector, attributeName})
- };
+ const attributeName = consts.PARAMETERS;
+ return {
+ id: "transformationTaskProperties",
+ label: translate("Parameters"),
+ component: ListGroup,
+ ...keyValueMap({ element, injector, attributeName }),
+ };
}
/**
@@ -142,13 +160,13 @@ function createTransformationTaskGroup(element, injector, translate) {
* @returns {{add: function(*): void, component: ((function(import('../PropertiesPanel').ListGroupDefinition): preact.VNode)|*), id: string, label, items: *}}
*/
function createTransformationAssociationGroup(element, injector, translate) {
- const attributeName = consts.EXPRESSIONS;
- return {
- id: 'transformationAssociationProperties',
- label: translate('Expressions'),
- component: ListGroup,
- ...keyValueMap({element, injector, attributeName})
- };
+ const attributeName = consts.EXPRESSIONS;
+ return {
+ id: "transformationAssociationProperties",
+ label: translate("Expressions"),
+ component: ListGroup,
+ ...keyValueMap({ element, injector, attributeName }),
+ };
}
/**
@@ -160,11 +178,20 @@ function createTransformationAssociationGroup(element, injector, translate) {
* @param configuration The given configuration applied to the element
* @returns {{entries: (*), id: string, label}} The created properties group.
*/
-function createTransformationTaskConfigurationsGroup(element, injector, translate, configuration) {
-
- return {
- id: 'serviceTaskConfigurationsGroupProperties',
- label: translate(configuration.groupLabel || 'Configurations Properties'),
- entries: ConfigurationsProperties(element, injector, translate, configuration)
- };
-}
\ No newline at end of file
+function createTransformationTaskConfigurationsGroup(
+ element,
+ injector,
+ translate,
+ configuration
+) {
+ return {
+ id: "serviceTaskConfigurationsGroupProperties",
+ label: translate(configuration.groupLabel || "Configurations Properties"),
+ entries: ConfigurationsProperties(
+ element,
+ injector,
+ translate,
+ configuration
+ ),
+ };
+}
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueEntry.js b/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueEntry.js
index 96a37267..cb7414c1 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueEntry.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueEntry.js
@@ -1,109 +1,96 @@
-import React from "@bpmn-io/properties-panel/preact/compat";
-import {TextFieldEntry} from '@bpmn-io/properties-panel';
+import { TextFieldEntry } from "@bpmn-io/properties-panel";
-import {useService} from 'bpmn-js-properties-panel';
+import { useService } from "bpmn-js-properties-panel";
/**
* Preact component for an entry for the properties panel which displays a Name and a Value Entry.
*/
export default function KeyValueEntry(props) {
+ const { idPrefix, parameter } = props;
- const {
- idPrefix,
- parameter
- } = props;
-
- return [
- {
- id: idPrefix + '-key',
- component: Key,
- idPrefix,
- parameter
- },
- {
- id: idPrefix + '-value',
- component: Value,
- idPrefix,
- parameter
- },
- ];
+ return [
+ {
+ id: idPrefix + "-key",
+ component: Key,
+ idPrefix,
+ parameter,
+ },
+ {
+ id: idPrefix + "-value",
+ component: Value,
+ idPrefix,
+ parameter,
+ },
+ ];
}
/**
* Preact component consisting of a TextFieldEntry for the name property of the given parameter.
*/
function Key(props) {
- const {
- idPrefix,
- element,
- parameter
- } = props;
+ const { idPrefix, element, parameter } = props;
- const commandStack = useService('commandStack');
- const translate = useService('translate');
- const debounce = useService('debounceInput');
+ const commandStack = useService("commandStack");
+ const translate = useService("translate");
+ const debounce = useService("debounceInput");
- // set name property of parameter to the new value
- const setValue = (value) => {
- commandStack.execute('element.updateModdleProperties', {
- element,
- moddleElement: parameter,
- properties: {
- name: value
- }
- });
- };
+ // set name property of parameter to the new value
+ const setValue = (value) => {
+ commandStack.execute("element.updateModdleProperties", {
+ element,
+ moddleElement: parameter,
+ properties: {
+ name: value,
+ },
+ });
+ };
- const getValue = (parameter) => {
- return parameter.name;
- };
+ const getValue = (parameter) => {
+ return parameter.name;
+ };
- return TextFieldEntry({
- element: parameter,
- id: idPrefix + '-name',
- label: translate('Name'),
- getValue,
- setValue,
- debounce
- });
+ return TextFieldEntry({
+ element: parameter,
+ id: idPrefix + "-name",
+ label: translate("Name"),
+ getValue,
+ setValue,
+ debounce,
+ });
}
/**
* Preact component consisting of a TextFieldEntry for the key property of the given parameter.
*/
function Value(props) {
- const {
- idPrefix,
- element,
- parameter
- } = props;
+ const { idPrefix, element, parameter } = props;
- const commandStack = useService('commandStack');
- const translate = useService('translate');
- const debounce = useService('debounceInput');
+ const commandStack = useService("commandStack");
+ const translate = useService("translate");
+ const debounce = useService("debounceInput");
- // set value property of parameter to the new value
- const setValue = (value) => {
- // return parameter.value = value;
- commandStack.execute('element.updateModdleProperties', {
- element,
- moddleElement: parameter,
- properties: {
- value: value
- }
- });
- };
+ // set value property of parameter to the new value
+ const setValue = (value) => {
+ // return parameter.value = value;
+ commandStack.execute("element.updateModdleProperties", {
+ element,
+ moddleElement: parameter,
+ properties: {
+ value: value,
+ },
+ });
+ };
- const getValue = (parameter) => {
- return parameter.value;
- };
+ const getValue = (parameter) => {
+ return parameter.value;
+ };
- return TextFieldEntry({
- element: parameter,
- id: idPrefix + '-value',
- label: translate('Value'),
- getValue,
- setValue,
- debounce
- });
-}
\ No newline at end of file
+ return TextFieldEntry({
+ element: parameter,
+ id: idPrefix + "-value",
+ label: translate("Value"),
+ getValue,
+ setValue,
+ debounce,
+ });
+}
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueMap.js b/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueMap.js
index 78155f6c..aa29b48e 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueMap.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/properties-panel/KeyValueMap.js
@@ -1,10 +1,8 @@
-import {
- getBusinessObject
-} from 'bpmn-js/lib/util/ModelUtil';
-import KeyValueEntry from './KeyValueEntry';
-import {without} from 'min-dash';
-import * as consts from '../Constants';
-import {nextId} from '../../../editor/util/camunda-utils/ElementUtil';
+import { getBusinessObject } from "bpmn-js/lib/util/ModelUtil";
+import KeyValueEntry from "./KeyValueEntry";
+import { without } from "min-dash";
+import * as consts from "../Constants";
+import { nextId } from "../../../editor/util/camunda-utils/ElementUtil";
/**
* Entry of the properties panel which displays a key value map. Entries can be added or removed over the UI of the
@@ -17,36 +15,39 @@ import {nextId} from '../../../editor/util/camunda-utils/ElementUtil';
* @returns {{add: ((function(*): void)|*), items: {entries: [{component: function(*): preact.VNode, parameter: *, idPrefix: *, id: string},{component: function(*): preact.VNode, parameter: *, idPrefix: *, id: string}], autoFocusEntry: string, id: string, label, remove: function(*): void}[]}}
* @constructor
*/
-export default function KeyValueMap({element, injector, attributeName}) {
+export default function KeyValueMap({ element, injector, attributeName }) {
+ const bpmnFactory = injector.get("bpmnFactory"),
+ commandStack = injector.get("commandStack");
- const bpmnFactory = injector.get('bpmnFactory'),
- commandStack = injector.get('commandStack');
+ // load key value map property
+ const keyValueMap = element.businessObject.get(attributeName) || [];
- // load key value map property
- const keyValueMap = element.businessObject.get(attributeName) || [];
-
- // create a KeyValueEntry for each entry of keyValueMap
- const keyValueEntires = keyValueMap.map((keyValueEntry, index) => {
-
- const id = element.id + '-parameter-' + index;
-
- return {
- id,
- label: keyValueEntry.get('name') || '',
- entries: KeyValueEntry({
- idPrefix: id,
- element,
- parameter: keyValueEntry
- }),
- autoFocusEntry: id + '-name',
- remove: removeFactory({commandStack, element, parameter: keyValueEntry, attributeName})
- };
- });
+ // create a KeyValueEntry for each entry of keyValueMap
+ const keyValueEntires = keyValueMap.map((keyValueEntry, index) => {
+ const id = element.id + "-parameter-" + index;
return {
- items: keyValueEntires,
- add: addFactory({element, bpmnFactory, commandStack, attributeName})
+ id,
+ label: keyValueEntry.get("name") || "",
+ entries: KeyValueEntry({
+ idPrefix: id,
+ element,
+ parameter: keyValueEntry,
+ }),
+ autoFocusEntry: id + "-name",
+ remove: removeFactory({
+ commandStack,
+ element,
+ parameter: keyValueEntry,
+ attributeName,
+ }),
};
+ });
+
+ return {
+ items: keyValueEntires,
+ add: addFactory({ element, bpmnFactory, commandStack, attributeName }),
+ };
}
/**
@@ -59,23 +60,28 @@ export default function KeyValueMap({element, injector, attributeName}) {
* @param attributeName The attributeName defining the property with the key value map in it.
* @returns {(function(*): void)|*}
*/
-function removeFactory({commandStack, element, keyValueEntry, attributeName}) {
- return function (event) {
- event.stopPropagation();
+function removeFactory({
+ commandStack,
+ element,
+ keyValueEntry,
+ attributeName,
+}) {
+ return function (event) {
+ event.stopPropagation();
- // get key value map
- let keyValueMap = element.businessObject.get(attributeName) || [];
+ // get key value map
+ let keyValueMap = element.businessObject.get(attributeName) || [];
- // remove the given key value entry
- keyValueMap = without(keyValueMap, keyValueEntry);
+ // remove the given key value entry
+ keyValueMap = without(keyValueMap, keyValueEntry);
- // save updated key value map in the element
- commandStack.execute('element.updateModdleProperties', {
- element,
- moddleElement: element.businessObject,
- properties: {[attributeName]: keyValueMap},
- });
- };
+ // save updated key value map in the element
+ commandStack.execute("element.updateModdleProperties", {
+ element,
+ moddleElement: element.businessObject,
+ properties: { [attributeName]: keyValueMap },
+ });
+ };
}
/**
@@ -88,21 +94,24 @@ function removeFactory({commandStack, element, keyValueEntry, attributeName}) {
* @param attributeName The name of the property the key value map is saved in.
* @returns {(function(*): void)|*}
*/
-function addFactory({element, bpmnFactory, commandStack, attributeName}) {
- return function (event) {
- event.stopPropagation();
+function addFactory({ element, bpmnFactory, commandStack, attributeName }) {
+ return function (event) {
+ event.stopPropagation();
- const businessObject = getBusinessObject(element);
- const keyValueMap = businessObject.get(attributeName);
+ const businessObject = getBusinessObject(element);
+ const keyValueMap = businessObject.get(attributeName);
- // create a new key value entry
- const param = bpmnFactory.create(consts.KEY_VALUE_ENTRY, {name: nextId('Entry_'), value: ''});
+ // create a new key value entry
+ const param = bpmnFactory.create(consts.KEY_VALUE_ENTRY, {
+ name: nextId("Entry_"),
+ value: "",
+ });
- // update key value map
- commandStack.execute('element.updateModdleProperties', {
- element,
- moddleElement: businessObject,
- properties: {[attributeName]: keyValueMap.concat(param)},
- });
- };
+ // update key value map
+ commandStack.execute("element.updateModdleProperties", {
+ element,
+ moddleElement: businessObject,
+ properties: { [attributeName]: keyValueMap.concat(param) },
+ });
+ };
}
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowRenderer.js b/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowRenderer.js
index 51ddb976..21bc117a 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowRenderer.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowRenderer.js
@@ -1,133 +1,155 @@
import BpmnRenderer from "bpmn-js/lib/draw/BpmnRenderer";
-import * as consts from '../Constants';
-import {attr as svgAttr} from 'tiny-svg';
-import {drawDataElementSVG, drawTaskSVG} from "../../../editor/util/RenderUtilities";
-import {getSVG} from "./DataFlowSVGMap";
-import {extractConfigSVG} from '../../../editor/configurations/ConfigurationsUtil';
+import * as consts from "../Constants";
+import { attr as svgAttr } from "tiny-svg";
+import {
+ drawDataElementSVG,
+ drawTaskSVG,
+} from "../../../editor/util/RenderUtilities";
+import { getSVG } from "./DataFlowSVGMap";
+import { extractConfigSVG } from "../../../editor/configurations/ConfigurationsUtil";
/**
* Custom renderer for the DataFlow elements. Extends the BpmnRenderer of bpmn-js.
*/
export default class DataFlowRenderer extends BpmnRenderer {
-
- constructor(config, eventBus, styles, pathMap, canvas, textRenderer) {
- super(config, eventBus, styles, pathMap, canvas, textRenderer, 1001);
-
- // create handlers to render the data flow extension elements
- this.dataFlowHandler = {
- [consts.DATA_MAP_OBJECT]: function (self, parentGfx, element) {
- const task = self.renderer('bpmn:DataObject')(parentGfx, element);
-
- let svg = extractConfigSVG(element) || getSVG(consts.DATA_TYPE_DATA_MAP_OBJECT);
- drawDataElementSVG(parentGfx, svg);
-
- return task;
- },
- [consts.DATA_STORE_MAP]: function (self, parentGfx, element) {
- const task = self.renderer('bpmn:DataStoreReference')(parentGfx, element);
-
- let svg = extractConfigSVG(element) || getSVG(consts.DATA_TYPE_DATA_STORE_MAP);
- drawDataElementSVG(parentGfx, svg);
-
- return task;
- },
- [consts.TRANSFORMATION_TASK]: function (self, parentGfx, element) {
- const task = self.renderer('bpmn:Task')(parentGfx, element);
-
- let svg = extractConfigSVG(element) || getSVG(consts.TASK_TYPE_TRANSFORMATION_TASK);
- drawTaskSVG(parentGfx, svg);
-
- return task;
- },
- [consts.TRANSFORMATION_ASSOCIATION]: function (self, parentGfx, element) {
- const flow = self.renderer('bpmn:DataOutputAssociation')(parentGfx, element);
-
- svgAttr(flow, {
- strokeDasharray: '15, 10', //width, space of the stroke
- strokeLinecap: 'square',
- });
-
- return flow;
- },
- [consts.INPUT_TRANSFORMATION_ASSOCIATION]: function (self, parentGfx, element) {
- const flow = self.renderer('bpmn:DataInputAssociation')(parentGfx, element);
-
- svgAttr(flow, {
- strokeDasharray: '15, 10', //width, space of the stroke
- strokeLinecap: 'square',
- });
-
- return flow;
- },
- [consts.OUTPUT_TRANSFORMATION_ASSOCIATION]: function (self, parentGfx, element) {
- const flow = self.renderer('bpmn:DataOutputAssociation')(parentGfx, element);
-
- svgAttr(flow, {
- strokeDasharray: '15, 10', //width, space of the stroke
- strokeLinecap: 'square',
- });
-
- return flow;
- }
- };
- }
-
- renderer(type) {
-
- return this.handlers[type];
+ constructor(config, eventBus, styles, pathMap, canvas, textRenderer) {
+ super(config, eventBus, styles, pathMap, canvas, textRenderer, 1001);
+
+ // create handlers to render the data flow extension elements
+ this.dataFlowHandler = {
+ [consts.DATA_MAP_OBJECT]: function (self, parentGfx, element) {
+ const task = self.renderer("bpmn:DataObject")(parentGfx, element);
+
+ let svg =
+ extractConfigSVG(element) || getSVG(consts.DATA_TYPE_DATA_MAP_OBJECT);
+ drawDataElementSVG(parentGfx, svg);
+
+ return task;
+ },
+ [consts.DATA_STORE_MAP]: function (self, parentGfx, element) {
+ const task = self.renderer("bpmn:DataStoreReference")(
+ parentGfx,
+ element
+ );
+
+ let svg =
+ extractConfigSVG(element) || getSVG(consts.DATA_TYPE_DATA_STORE_MAP);
+ drawDataElementSVG(parentGfx, svg);
+
+ return task;
+ },
+ [consts.TRANSFORMATION_TASK]: function (self, parentGfx, element) {
+ const task = self.renderer("bpmn:Task")(parentGfx, element);
+
+ let svg =
+ extractConfigSVG(element) ||
+ getSVG(consts.TASK_TYPE_TRANSFORMATION_TASK);
+ drawTaskSVG(parentGfx, svg);
+
+ return task;
+ },
+ [consts.TRANSFORMATION_ASSOCIATION]: function (self, parentGfx, element) {
+ const flow = self.renderer("bpmn:DataOutputAssociation")(
+ parentGfx,
+ element
+ );
+
+ svgAttr(flow, {
+ strokeDasharray: "15, 10", //width, space of the stroke
+ strokeLinecap: "square",
+ });
+
+ return flow;
+ },
+ [consts.INPUT_TRANSFORMATION_ASSOCIATION]: function (
+ self,
+ parentGfx,
+ element
+ ) {
+ const flow = self.renderer("bpmn:DataInputAssociation")(
+ parentGfx,
+ element
+ );
+
+ svgAttr(flow, {
+ strokeDasharray: "15, 10", //width, space of the stroke
+ strokeLinecap: "square",
+ });
+
+ return flow;
+ },
+ [consts.OUTPUT_TRANSFORMATION_ASSOCIATION]: function (
+ self,
+ parentGfx,
+ element
+ ) {
+ const flow = self.renderer("bpmn:DataOutputAssociation")(
+ parentGfx,
+ element
+ );
+
+ svgAttr(flow, {
+ strokeDasharray: "15, 10", //width, space of the stroke
+ strokeLinecap: "square",
+ });
+
+ return flow;
+ },
+ };
+ }
+
+ renderer(type) {
+ return this.handlers[type];
+ }
+
+ canRender(element) {
+ // only return true if handler for rendering is registered
+ return this.dataFlowHandler[element.type];
+ }
+
+ /**
+ * Draw new shape for the given element based on its type.
+ *
+ * @param parentNode Parent of the given element
+ * @param element The given element
+ * @returns {*}
+ */
+ drawShape(parentNode, element) {
+ console.log("Draw Shape of type " + element.type);
+
+ // handle DataFlow elements
+ if (element.type in this.dataFlowHandler) {
+ const h = this.dataFlowHandler[element.type];
+
+ /* jshint -W040 */
+ return h(this, parentNode, element);
}
-
- canRender(element) {
-
- // only return true if handler for rendering is registered
- return this.dataFlowHandler[element.type];
+ }
+
+ /**
+ * Draw new connection for the given connection element.
+ *
+ * @param parentGfx Parent of the given element
+ * @param connectionElement The given connection element
+ * @returns {*}
+ */
+ drawConnection(parentGfx, connectionElement) {
+ console.log("Draw Connection of type " + connectionElement.type);
+
+ if (connectionElement.type in this.dataFlowHandler) {
+ let h = this.dataFlowHandler[connectionElement.type];
+ return h(this, parentGfx, connectionElement);
}
- /**
- * Draw new shape for the given element based on its type.
- *
- * @param parentNode Parent of the given element
- * @param element The given element
- * @returns {*}
- */
- drawShape(parentNode, element) {
-
- console.log("Draw Shape of type " + element.type);
-
- // handle DataFlow elements
- if (element.type in this.dataFlowHandler) {
- const h = this.dataFlowHandler[element.type];
-
- /* jshint -W040 */
- return h(this, parentNode, element);
- }
- }
-
- /**
- * Draw new connection for the given connection element.
- *
- * @param parentGfx Parent of the given element
- * @param connectionElement The given connection element
- * @returns {*}
- */
- drawConnection(parentGfx, connectionElement) {
-
- console.log("Draw Connection of type " + connectionElement.type);
-
- if (connectionElement.type in this.dataFlowHandler) {
- let h = this.dataFlowHandler[connectionElement.type];
- return h(this, parentGfx, connectionElement);
- }
-
- return super.drawConnection(parentGfx, connectionElement);
- }
+ return super.drawConnection(parentGfx, connectionElement);
+ }
}
DataFlowRenderer.$inject = [
- 'config',
- 'eventBus',
- 'styles',
- 'pathMap',
- 'canvas',
- 'textRenderer'
-];
\ No newline at end of file
+ "config",
+ "eventBus",
+ "styles",
+ "pathMap",
+ "canvas",
+ "textRenderer",
+];
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowSVGMap.js b/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowSVGMap.js
index 1564de86..9c907ba2 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowSVGMap.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/rendering/DataFlowSVGMap.js
@@ -1,6 +1,7 @@
import * as consts from "../Constants";
-const DATA_FLOW_MAP_LOGO = 'Data Configurations endpoint configuration:
-
- );
+ return (
+ <>
+ Data Configurations endpoint configuration:
+
+
+ );
}
TransformationTaskConfigurationsTab.prototype.config = () => {
- const modeler = getModeler();
+ const modeler = getModeler();
- modeler.config.transformationTaskConfigurationsEndpointChanged = dataConfigManager.getConfigurationsEndpoint();
-};
\ No newline at end of file
+ modeler.config.transformationTaskConfigurationsEndpointChanged =
+ dataConfigManager.getConfigurationsEndpoint();
+};
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/transformation/TransformationManager.js b/components/bpmn-q/modeler-component/extensions/data-extension/transformation/TransformationManager.js
index 9671fcb8..59ad87df 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/transformation/TransformationManager.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/transformation/TransformationManager.js
@@ -1,20 +1,23 @@
-import { is } from 'bpmn-js/lib/util/ModelUtil';
-import { getXml } from '../../../editor/util/IoUtilities';
-import { createTempModelerFromXml } from '../../../editor/ModelerHandler';
-import * as consts from '../Constants';
+import { is } from "bpmn-js/lib/util/ModelUtil";
+import { getXml } from "../../../editor/util/IoUtilities";
+import { createTempModelerFromXml } from "../../../editor/ModelerHandler";
+import * as consts from "../Constants";
import {
- getAllElementsForProcess,
- getAllElementsInProcess,
- insertShape
-} from '../../../editor/util/TransformationUtilities';
+ getAllElementsForProcess,
+ getAllElementsInProcess,
+ insertShape,
+} from "../../../editor/util/TransformationUtilities";
import {
- addCamundaInputMapParameter,
- addCamundaInputParameter,
- addCamundaOutputMapParameter,
- addFormField, findSequenceFlowConnection, getDocumentation,
- getRootProcess, setDocumentation,
-} from '../../../editor/util/ModellingUtilities';
-import { layout } from '../../quantme/replacement/layouter/Layouter';
+ addCamundaInputMapParameter,
+ addCamundaInputParameter,
+ addCamundaOutputMapParameter,
+ addFormField,
+ findSequenceFlowConnection,
+ getDocumentation,
+ getRootProcess,
+ setDocumentation,
+} from "../../../editor/util/ModellingUtilities";
+import { layout } from "../../quantme/replacement/layouter/Layouter";
/**
* Replace data flow extensions with camunda bpmn elements so that it complies with the standard
@@ -23,182 +26,260 @@ import { layout } from '../../quantme/replacement/layouter/Layouter';
* @returns {Promise<{xml: *, status: string}|{cause: string, status: string}>}
*/
export async function startDataFlowReplacementProcess(xml) {
- let modeler = await createTempModelerFromXml(xml);
- let elementRegistry = modeler.get('elementRegistry');
- let modeling = modeler.get('modeling');
-
- // get root element of the current diagram
- const definitions = modeler.getDefinitions();
- const rootProcess = getRootProcess(definitions);
-
- console.log(rootProcess);
-
- if (typeof rootProcess === 'undefined') {
-
- console.log('Unable to retrieve root process element from definitions!');
- return { status: 'failed', cause: 'Unable to retrieve root process element from definitions!' };
+ let modeler = await createTempModelerFromXml(xml);
+ let elementRegistry = modeler.get("elementRegistry");
+ let modeling = modeler.get("modeling");
+
+ // get root element of the current diagram
+ const definitions = modeler.getDefinitions();
+ const rootProcess = getRootProcess(definitions);
+
+ console.log(rootProcess);
+
+ if (typeof rootProcess === "undefined") {
+ console.log("Unable to retrieve root process element from definitions!");
+ return {
+ status: "failed",
+ cause: "Unable to retrieve root process element from definitions!",
+ };
+ }
+
+ // Mark process as executable
+ rootProcess.isExecutable = true;
+
+ const bpmnFactory = modeler.get("bpmnFactory");
+ const moddle = modeler.get("moddle");
+
+ // for each transformation association
+ const transformationAssociations = elementRegistry.filter(function (element) {
+ console.log(element.id);
+ return is(element, consts.TRANSFORMATION_ASSOCIATION);
+ });
+ console.log(
+ "Found " +
+ transformationAssociations.length +
+ " TransformationAssociations."
+ );
+
+ let targetDataMapObject,
+ sourceDataMapObject,
+ targetActivityElement,
+ targetContent;
+
+ for (let transformationAssociation of transformationAssociations) {
+ // if source === DataMapObject: expressions als inputs im target
+ if (
+ transformationAssociation.source.type === consts.DATA_MAP_OBJECT &&
+ transformationAssociation.target.type !== consts.DATA_MAP_OBJECT
+ ) {
+ targetActivityElement = transformationAssociation.target;
+
+ const expressions = transformationAssociation.businessObject.get(
+ consts.EXPRESSIONS
+ );
+ for (let expression of expressions) {
+ addCamundaInputParameter(
+ targetActivityElement.businessObject,
+ expression.name,
+ expression.value,
+ bpmnFactory
+ );
+ }
}
- // Mark process as executable
- rootProcess.isExecutable = true;
-
- const bpmnFactory = modeler.get('bpmnFactory');
- const moddle = modeler.get('moddle');
-
- // for each transformation association
- const transformationAssociations = elementRegistry.filter(function (element) {
- console.log(element.id);
- return is(element, consts.TRANSFORMATION_ASSOCIATION);
- });
- console.log('Found ' + transformationAssociations.length + ' TransformationAssociations.');
-
- let targetDataMapObject,
+ // if target && source === DataMapObject: add expressions to content of target data map object
+ if (
+ transformationAssociation.source.type === consts.DATA_MAP_OBJECT &&
+ transformationAssociation.target.type === consts.DATA_MAP_OBJECT
+ ) {
+ targetDataMapObject = transformationAssociation.target;
+ sourceDataMapObject = transformationAssociation.source;
+ targetContent =
+ targetDataMapObject.businessObject.get(consts.CONTENT) || [];
+
+ const expressions = transformationAssociation.businessObject.get(
+ consts.EXPRESSIONS
+ );
+ for (let expression of expressions) {
+ targetContent.push(
+ bpmnFactory.create(consts.KEY_VALUE_ENTRY, {
+ name: expression.name,
+ value: expression.value,
+ })
+ );
+ }
+
+ // mark target data map objects as created through a transformation association
+ sourceDataMapObject.businessObject.createsThroughTransformation = true;
+ targetDataMapObject.businessObject.createdByTransformation = true;
+
+ // document the transformation in the source and target elements
+ const currentSourceDoc =
+ getDocumentation(sourceDataMapObject.businessObject) || "";
+ setDocumentation(
sourceDataMapObject,
- targetActivityElement,
- targetContent;
-
- for (let transformationAssociation of transformationAssociations) {
-
- // if source === DataMapObject: expressions als inputs im target
- if ((transformationAssociation.source.type === consts.DATA_MAP_OBJECT) && (transformationAssociation.target.type !== consts.DATA_MAP_OBJECT)) {
- targetActivityElement = transformationAssociation.target;
-
- const expressions = transformationAssociation.businessObject.get(consts.EXPRESSIONS);
- for (let expression of expressions) {
- addCamundaInputParameter(targetActivityElement.businessObject, expression.name, expression.value, bpmnFactory);
- }
- }
-
- // if target && source === DataMapObject: add expressions to content of target data map object
- if ((transformationAssociation.source.type === consts.DATA_MAP_OBJECT) && (transformationAssociation.target.type === consts.DATA_MAP_OBJECT)) {
- targetDataMapObject = transformationAssociation.target;
- sourceDataMapObject = transformationAssociation.source;
- targetContent = targetDataMapObject.businessObject.get(consts.CONTENT) || [];
-
- const expressions = transformationAssociation.businessObject.get(consts.EXPRESSIONS);
- for (let expression of expressions) {
- targetContent.push(bpmnFactory.create(consts.KEY_VALUE_ENTRY, {
- name: expression.name,
- value: expression.value
- }));
- }
-
- // mark target data map objects as created through a transformation association
- sourceDataMapObject.businessObject.createsThroughTransformation = true;
- targetDataMapObject.businessObject.createdByTransformation = true;
-
- // document the transformation in the source and target elements
- const currentSourceDoc = getDocumentation(sourceDataMapObject.businessObject) || '';
- setDocumentation(sourceDataMapObject, currentSourceDoc.concat(createTransformationSourceDocs(transformationAssociation)), bpmnFactory);
-
- const currentTargetDoc = getDocumentation(targetDataMapObject.businessObject) || '';
- setDocumentation(targetDataMapObject, currentTargetDoc.concat(createTransformationTargetDocs(transformationAssociation)), bpmnFactory);
- }
+ currentSourceDoc.concat(
+ createTransformationSourceDocs(transformationAssociation)
+ ),
+ bpmnFactory
+ );
+
+ const currentTargetDoc =
+ getDocumentation(targetDataMapObject.businessObject) || "";
+ setDocumentation(
+ targetDataMapObject,
+ currentTargetDoc.concat(
+ createTransformationTargetDocs(transformationAssociation)
+ ),
+ bpmnFactory
+ );
}
-
- // for each data association
- const dataAssociations = elementRegistry.filter(function (element) {
- return is(element, 'bpmn:DataAssociation');
- });
- console.log('Found ' + dataAssociations.length + ' DataAssociations.');
-
- let source,
- target,
- dataMapObject,
- activity,
- businessObject;
-
- for (let dataAssociation of dataAssociations) {
- source = dataAssociation.source;
- target = dataAssociation.target;
-
- // if source === DataMapObject: content als input in target activity
- if (source.type === consts.DATA_MAP_OBJECT) {
- activity = target;
- dataMapObject = source;
- businessObject = dataMapObject.businessObject;
-
- addCamundaInputMapParameter(activity.businessObject, businessObject.name, businessObject.get(consts.CONTENT), bpmnFactory);
- }
-
- // if target === DataMapObject: content als output in source
- if (target.type === consts.DATA_MAP_OBJECT) {
- dataMapObject = target;
- activity = source;
- businessObject = dataMapObject.businessObject;
-
- if (source.type === 'bpmn:StartEvent') {
-
- const name = businessObject.get('name');
-
- for (let c of businessObject.get(consts.CONTENT)) {
- let formField =
- {
- 'defaultValue': c.value,
- 'id': name + '.' + c.name,
- 'label': name + '.' + c.name,
- 'type': 'string'
- };
- addFormField(activity.id, formField, elementRegistry, moddle, modeling);
- }
-
- } else {
- addCamundaOutputMapParameter(activity.businessObject, businessObject.name, businessObject.get(consts.CONTENT), bpmnFactory);
- }
- }
- }
-
- const globalProcessVariables = {};
-
- // transform DataMapObjects to data objects
- let transformationSuccess = transformDataMapObjects(rootProcess, definitions, globalProcessVariables, modeler);
- if (!transformationSuccess) {
- const failureMessage = `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` + transformationSuccess.failedData.id + ' failed. Aborting process!';
- console.log(failureMessage);
- return {
- status: 'failed',
- cause: failureMessage,
- };
+ }
+
+ // for each data association
+ const dataAssociations = elementRegistry.filter(function (element) {
+ return is(element, "bpmn:DataAssociation");
+ });
+ console.log("Found " + dataAssociations.length + " DataAssociations.");
+
+ let source, target, dataMapObject, activity, businessObject;
+
+ for (let dataAssociation of dataAssociations) {
+ source = dataAssociation.source;
+ target = dataAssociation.target;
+
+ // if source === DataMapObject: content als input in target activity
+ if (source.type === consts.DATA_MAP_OBJECT) {
+ activity = target;
+ dataMapObject = source;
+ businessObject = dataMapObject.businessObject;
+
+ addCamundaInputMapParameter(
+ activity.businessObject,
+ businessObject.name,
+ businessObject.get(consts.CONTENT),
+ bpmnFactory
+ );
}
- // transform DataStoreMap to data stores
- transformationSuccess = transformDataStoreMaps(rootProcess, definitions, globalProcessVariables, modeler);
- if (!transformationSuccess) {
- const failureMessage = `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` + transformationSuccess.failedData.id + ' failed. Aborting process!';
- console.log(failureMessage);
- return {
- status: 'failed',
- cause: failureMessage,
- };
+ // if target === DataMapObject: content als output in source
+ if (target.type === consts.DATA_MAP_OBJECT) {
+ dataMapObject = target;
+ activity = source;
+ businessObject = dataMapObject.businessObject;
+
+ if (source.type === "bpmn:StartEvent") {
+ const name = businessObject.get("name");
+
+ for (let c of businessObject.get(consts.CONTENT)) {
+ let formField = {
+ defaultValue: c.value,
+ id: name + "." + c.name,
+ label: name + "." + c.name,
+ type: "string",
+ };
+ addFormField(
+ activity.id,
+ formField,
+ elementRegistry,
+ moddle,
+ modeling
+ );
+ }
+ } else {
+ addCamundaOutputMapParameter(
+ activity.businessObject,
+ businessObject.name,
+ businessObject.get(consts.CONTENT),
+ bpmnFactory
+ );
+ }
}
-
- // transform TransformationTasks to service tasks
- transformationSuccess = transformTransformationTask(rootProcess, definitions, globalProcessVariables, modeler);
+ }
+
+ const globalProcessVariables = {};
+
+ // transform DataMapObjects to data objects
+ let transformationSuccess = transformDataMapObjects(
+ rootProcess,
+ definitions,
+ globalProcessVariables,
+ modeler
+ );
+ if (!transformationSuccess) {
+ const failureMessage =
+ `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` +
+ transformationSuccess.failedData.id +
+ " failed. Aborting process!";
+ console.log(failureMessage);
+ return {
+ status: "failed",
+ cause: failureMessage,
+ };
+ }
+
+ // transform DataStoreMap to data stores
+ transformationSuccess = transformDataStoreMaps(
+ rootProcess,
+ definitions,
+ globalProcessVariables,
+ modeler
+ );
+ if (!transformationSuccess) {
+ const failureMessage =
+ `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` +
+ transformationSuccess.failedData.id +
+ " failed. Aborting process!";
+ console.log(failureMessage);
+ return {
+ status: "failed",
+ cause: failureMessage,
+ };
+ }
+
+ // transform TransformationTasks to service tasks
+ transformationSuccess = transformTransformationTask(
+ rootProcess,
+ definitions,
+ globalProcessVariables,
+ modeler
+ );
+ if (!transformationSuccess) {
+ const failureMessage =
+ `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` +
+ transformationSuccess.failedData.id +
+ " failed. Aborting process!";
+ console.log(failureMessage);
+ return {
+ status: "failed",
+ cause: failureMessage,
+ };
+ }
+
+ if (Object.entries(globalProcessVariables).length > 0) {
+ transformationSuccess = createProcessContextVariablesTask(
+ globalProcessVariables,
+ rootProcess,
+ definitions,
+ modeler
+ );
if (!transformationSuccess) {
- const failureMessage = `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` + transformationSuccess.failedData.id + ' failed. Aborting process!';
- console.log(failureMessage);
- return {
- status: 'failed',
- cause: failureMessage,
- };
+ const failureMessage =
+ `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` +
+ transformationSuccess.failedData.id +
+ " failed. Aborting process!";
+ console.log(failureMessage);
+ return {
+ status: "failed",
+ cause: failureMessage,
+ };
}
+ }
- if (Object.entries(globalProcessVariables).length > 0) {
- transformationSuccess = createProcessContextVariablesTask(globalProcessVariables, rootProcess, definitions, modeler);
- if (!transformationSuccess) {
- const failureMessage = `Replacement of Data modeling construct ${transformationSuccess.failedData.type} with Id ` + transformationSuccess.failedData.id + ' failed. Aborting process!';
- console.log(failureMessage);
- return {
- status: 'failed',
- cause: failureMessage,
- };
- }
- }
-
- layout(modeling, elementRegistry, rootProcess);
+ layout(modeling, elementRegistry, rootProcess);
- const transformedXML = await getXml(modeler);
- return { status: 'transformed', xml: transformedXML };
+ const transformedXML = await getXml(modeler);
+ return { status: "transformed", xml: transformedXML };
}
/**
@@ -213,59 +294,79 @@ export async function startDataFlowReplacementProcess(xml) {
* @return {{success: boolean}|{success: boolean, failedData: *}} Success flag with True if transformation was successful,
* False else with details in failedData.
*/
-function transformDataMapObjects(rootProcess, definitions, processContextVariables, modeler) {
- let bpmnFactory = modeler.get('bpmnFactory');
- let elementRegistry = modeler.get('elementRegistry');
-
- // get all data map objects of the current process including subprocesses
- const dataObjectMaps = getAllElementsInProcess(rootProcess, elementRegistry, consts.DATA_MAP_OBJECT);
- console.log('Found ' + dataObjectMaps.length + ' DataObjectMapReferences to replace.');
-
- // replace all data map objects with data objects and transform the content attribute
- for (let dataElement of dataObjectMaps) {
-
- const dataMapObjectBo = dataElement.element;
- const dataMapObjectElement = elementRegistry.get(dataMapObjectBo.id);
-
- const isUsedBeforeInit = isDataMapObjectUsedBeforeInitialized(dataMapObjectElement, elementRegistry);
-
- // check if the content of the data map object has to be published in process content
- if (dataMapObjectBo.createdByTransformation
- || dataMapObjectBo.createsThroughTransformation
- || !dataMapObjectElement.incoming
- || dataMapObjectElement.incoming.length === 0
- || isUsedBeforeInit) {
-
- // const startEvents = getStartEvents();
- const processElement = dataElement.parent;
-
- if (!processContextVariables[processElement.id]) {
- processContextVariables[processElement.id] = [];
- }
-
- // publish content of the data map object as process variable in process context
- processContextVariables[processElement.id].push({
- name: dataMapObjectBo.name,
- map: dataMapObjectBo.get(consts.CONTENT)
- });
- }
-
- // replace data map object by data object
- const dataObject = bpmnFactory.create('bpmn:DataObjectReference');
- const result = insertShape(definitions, dataObject.parent, dataObject, {}, true, modeler, dataMapObjectBo);
+function transformDataMapObjects(
+ rootProcess,
+ definitions,
+ processContextVariables,
+ modeler
+) {
+ let bpmnFactory = modeler.get("bpmnFactory");
+ let elementRegistry = modeler.get("elementRegistry");
+
+ // get all data map objects of the current process including subprocesses
+ const dataObjectMaps = getAllElementsInProcess(
+ rootProcess,
+ elementRegistry,
+ consts.DATA_MAP_OBJECT
+ );
+ console.log(
+ "Found " + dataObjectMaps.length + " DataObjectMapReferences to replace."
+ );
+
+ // replace all data map objects with data objects and transform the content attribute
+ for (let dataElement of dataObjectMaps) {
+ const dataMapObjectBo = dataElement.element;
+ const dataMapObjectElement = elementRegistry.get(dataMapObjectBo.id);
+
+ const isUsedBeforeInit = isDataMapObjectUsedBeforeInitialized(
+ dataMapObjectElement,
+ elementRegistry
+ );
+
+ // check if the content of the data map object has to be published in process content
+ if (
+ dataMapObjectBo.createdByTransformation ||
+ dataMapObjectBo.createsThroughTransformation ||
+ !dataMapObjectElement.incoming ||
+ dataMapObjectElement.incoming.length === 0 ||
+ isUsedBeforeInit
+ ) {
+ // const startEvents = getStartEvents();
+ const processElement = dataElement.parent;
+
+ if (!processContextVariables[processElement.id]) {
+ processContextVariables[processElement.id] = [];
+ }
- if (result.success) {
+ // publish content of the data map object as process variable in process context
+ processContextVariables[processElement.id].push({
+ name: dataMapObjectBo.name,
+ map: dataMapObjectBo.get(consts.CONTENT),
+ });
+ }
- // set documentation property of the data object to document the data map object it replaces
- const currentDoc = getDocumentation(dataMapObjectBo) || '';
- const dataDoc = createDataMapObjectDocs(dataMapObjectBo);
- setDocumentation(result.element, currentDoc.concat(dataDoc), bpmnFactory);
- } else {
- return { success: false, failedData: dataMapObjectBo };
- }
+ // replace data map object by data object
+ const dataObject = bpmnFactory.create("bpmn:DataObjectReference");
+ const result = insertShape(
+ definitions,
+ dataObject.parent,
+ dataObject,
+ {},
+ true,
+ modeler,
+ dataMapObjectBo
+ );
+ if (result.success) {
+ // set documentation property of the data object to document the data map object it replaces
+ const currentDoc = getDocumentation(dataMapObjectBo) || "";
+ const dataDoc = createDataMapObjectDocs(dataMapObjectBo);
+ setDocumentation(result.element, currentDoc.concat(dataDoc), bpmnFactory);
+ } else {
+ return { success: false, failedData: dataMapObjectBo };
}
- return { success: true };
+ }
+ return { success: true };
}
/**
@@ -279,23 +380,40 @@ function transformDataMapObjects(rootProcess, definitions, processContextVariabl
* @return {{success: boolean}|{success: boolean, failedData: *}} Success flag with True if transformation was successful,
* False else with details in failedData.
*/
-function transformDataStoreMaps(rootProcess, definitions, processContextVariables, modeler) {
- let elementRegistry = modeler.get('elementRegistry');
-
- // get all data store maps of the current process including the data store maps in subprocesses
- const dataStoreElements = getAllElementsInProcess(rootProcess, elementRegistry, consts.DATA_STORE_MAP);
- console.log('Found ' + dataStoreElements.length + ' DataObjectMapReferences to replace.');
-
- // replace all data store maps and transform their details attributes
- for (let dataElement of dataStoreElements) {
- const result = transformDataStoreMap(dataElement.element, dataElement.parent, definitions, processContextVariables, modeler);
-
- if (!result.success) {
- // break transformation and propagate failure
- return { success: false, failedData: dataElement.element };
- }
+function transformDataStoreMaps(
+ rootProcess,
+ definitions,
+ processContextVariables,
+ modeler
+) {
+ let elementRegistry = modeler.get("elementRegistry");
+
+ // get all data store maps of the current process including the data store maps in subprocesses
+ const dataStoreElements = getAllElementsInProcess(
+ rootProcess,
+ elementRegistry,
+ consts.DATA_STORE_MAP
+ );
+ console.log(
+ "Found " + dataStoreElements.length + " DataObjectMapReferences to replace."
+ );
+
+ // replace all data store maps and transform their details attributes
+ for (let dataElement of dataStoreElements) {
+ const result = transformDataStoreMap(
+ dataElement.element,
+ dataElement.parent,
+ definitions,
+ processContextVariables,
+ modeler
+ );
+
+ if (!result.success) {
+ // break transformation and propagate failure
+ return { success: false, failedData: dataElement.element };
}
- return { success: true };
+ }
+ return { success: true };
}
/**
@@ -310,38 +428,49 @@ function transformDataStoreMaps(rootProcess, definitions, processContextVariable
* @return {{success: boolean}|{success: boolean, failedData: *}} Success flag with True if transformation was successful,
* False else with details in failedData.
*/
-export function transformDataStoreMap(dataStoreMap, parentElement, definitions, processContextVariables, modeler) {
-
- const bpmnFactory = modeler.get('bpmnFactory');
-
- const processElement = parentElement;
- if (!processContextVariables[processElement.id]) {
- processContextVariables[processElement.id] = [];
- }
-
- // publish details of the data store map as process variable in process context
- processContextVariables[processElement.id].push({
- name: dataStoreMap.name,
- map: dataStoreMap.get(consts.DETAILS)
- });
-
- // replace data store map by data store
- const dataStore = bpmnFactory.create('bpmn:DataStoreReference');
- const result = insertShape(definitions, dataStore.parent, dataStore, {}, true, modeler, dataStoreMap);
-
- if (result.success) {
-
- // set documentation property of the data store to document the data store map it replaces
- const currentDoc = getDocumentation(dataStoreMap) || '';
- const dataDoc = createDataStoreMapDocs(dataStoreMap);
- setDocumentation(result.element, currentDoc.concat(dataDoc), bpmnFactory);
- } else {
- return { success: false, failedData: dataStoreMap };
- }
- return { success: true };
+export function transformDataStoreMap(
+ dataStoreMap,
+ parentElement,
+ definitions,
+ processContextVariables,
+ modeler
+) {
+ const bpmnFactory = modeler.get("bpmnFactory");
+
+ const processElement = parentElement;
+ if (!processContextVariables[processElement.id]) {
+ processContextVariables[processElement.id] = [];
+ }
+
+ // publish details of the data store map as process variable in process context
+ processContextVariables[processElement.id].push({
+ name: dataStoreMap.name,
+ map: dataStoreMap.get(consts.DETAILS),
+ });
+
+ // replace data store map by data store
+ const dataStore = bpmnFactory.create("bpmn:DataStoreReference");
+ const result = insertShape(
+ definitions,
+ dataStore.parent,
+ dataStore,
+ {},
+ true,
+ modeler,
+ dataStoreMap
+ );
+
+ if (result.success) {
+ // set documentation property of the data store to document the data store map it replaces
+ const currentDoc = getDocumentation(dataStoreMap) || "";
+ const dataDoc = createDataStoreMapDocs(dataStoreMap);
+ setDocumentation(result.element, currentDoc.concat(dataDoc), bpmnFactory);
+ } else {
+ return { success: false, failedData: dataStoreMap };
+ }
+ return { success: true };
}
-
/**
* Transform TransformationTasks to service tasks. Add the parameters attribute of the TransformationTask as a camunda map
* inputs of the service task.
@@ -353,31 +482,56 @@ export function transformDataStoreMap(dataStoreMap, parentElement, definitions,
* @return {{success: boolean}|{success: boolean, failedData: *}} Success flag with True if transformation was successful,
* False else with details in failedData.
*/
-function transformTransformationTask(rootProcess, definitions, processContextVariables, modeler) {
- let bpmnFactory = modeler.get('bpmnFactory');
- let elementRegistry = modeler.get('elementRegistry');
-
- // get all transformation task of the root process including the tasks in subprocesses
- const transformationTasks = getAllElementsInProcess(rootProcess, elementRegistry, consts.TRANSFORMATION_TASK);
- console.log('Found ' + transformationTasks.length + ' DataObjectMapReferences to replace.');
-
- // transform each task into a service task and add the parameters attribute to the inputs of the service task.
- for (let taskElement of transformationTasks) {
-
- const transformationTask = taskElement.element;
-
- // replace transformation task by new service task
- const serviceTask = bpmnFactory.create('bpmn:ServiceTask');
- const result = insertShape(definitions, serviceTask.parent, serviceTask, {}, true, modeler, transformationTask);
-
- if (!result.success) {
- return { success: false, failedData: transformationTask };
- }
-
- // add parameters attribute as camunda map to service task inputs
- addCamundaInputMapParameter(result.element.businessObject, consts.PARAMETERS, transformationTask.get(consts.PARAMETERS), bpmnFactory);
+function transformTransformationTask(
+ rootProcess,
+ definitions,
+ processContextVariables,
+ modeler
+) {
+ let bpmnFactory = modeler.get("bpmnFactory");
+ let elementRegistry = modeler.get("elementRegistry");
+
+ // get all transformation task of the root process including the tasks in subprocesses
+ const transformationTasks = getAllElementsInProcess(
+ rootProcess,
+ elementRegistry,
+ consts.TRANSFORMATION_TASK
+ );
+ console.log(
+ "Found " +
+ transformationTasks.length +
+ " DataObjectMapReferences to replace."
+ );
+
+ // transform each task into a service task and add the parameters attribute to the inputs of the service task.
+ for (let taskElement of transformationTasks) {
+ const transformationTask = taskElement.element;
+
+ // replace transformation task by new service task
+ const serviceTask = bpmnFactory.create("bpmn:ServiceTask");
+ const result = insertShape(
+ definitions,
+ serviceTask.parent,
+ serviceTask,
+ {},
+ true,
+ modeler,
+ transformationTask
+ );
+
+ if (!result.success) {
+ return { success: false, failedData: transformationTask };
}
- return { success: true };
+
+ // add parameters attribute as camunda map to service task inputs
+ addCamundaInputMapParameter(
+ result.element.businessObject,
+ consts.PARAMETERS,
+ transformationTask.get(consts.PARAMETERS),
+ bpmnFactory
+ );
+ }
+ return { success: true };
}
/**
@@ -390,36 +544,60 @@ function transformTransformationTask(rootProcess, definitions, processContextVar
* @param modeler The modeler containing the workflow to transform
* @return {{success: boolean}} True if the ProcessVariablesTask could be successfully created, False else.
*/
-export function createProcessContextVariablesTask(processContextVariables, rootProcess, definitions, modeler) {
- const elementRegistry = modeler.get('elementRegistry');
- const bpmnFactory = modeler.get('bpmnFactory');
- const modeling = modeler.get('modeling');
-
- // add for each process or subprocess a new task to create process variables
- for (let processEntry of Object.entries(processContextVariables)) {
- const processId = processEntry[0];
- const processBo = elementRegistry.get(processId).businessObject;
-
- const startEvents = getAllElementsForProcess(processBo, elementRegistry, 'bpmn:StartEvent');
-
- console.log(`Found ${startEvents && startEvents.length} StartEvents in process ${processId}`);
- console.log(startEvents);
-
- // add ProcessVariablesTask after each start event
- for (let event of startEvents) {
- const startEventBo = event.element;
- const startEventElement = elementRegistry.get(startEventBo.id);
-
- const newTaskBo = getProcessContextVariablesTask(startEventElement, event.parent, bpmnFactory, modeling, elementRegistry);
-
- // add camunda map to outputs for each entry
- for (let processVariable of processContextVariables[processId]) {
- addCamundaOutputMapParameter(newTaskBo, processVariable.name, processVariable.map, bpmnFactory);
- }
- }
+export function createProcessContextVariablesTask(
+ processContextVariables,
+ rootProcess,
+ definitions,
+ modeler
+) {
+ const elementRegistry = modeler.get("elementRegistry");
+ const bpmnFactory = modeler.get("bpmnFactory");
+ const modeling = modeler.get("modeling");
+
+ // add for each process or subprocess a new task to create process variables
+ for (let processEntry of Object.entries(processContextVariables)) {
+ const processId = processEntry[0];
+ const processBo = elementRegistry.get(processId).businessObject;
+
+ const startEvents = getAllElementsForProcess(
+ processBo,
+ elementRegistry,
+ "bpmn:StartEvent"
+ );
+
+ console.log(
+ `Found ${
+ startEvents && startEvents.length
+ } StartEvents in process ${processId}`
+ );
+ console.log(startEvents);
+
+ // add ProcessVariablesTask after each start event
+ for (let event of startEvents) {
+ const startEventBo = event.element;
+ const startEventElement = elementRegistry.get(startEventBo.id);
+
+ const newTaskBo = getProcessContextVariablesTask(
+ startEventElement,
+ event.parent,
+ bpmnFactory,
+ modeling,
+ elementRegistry
+ );
+
+ // add camunda map to outputs for each entry
+ for (let processVariable of processContextVariables[processId]) {
+ addCamundaOutputMapParameter(
+ newTaskBo,
+ processVariable.name,
+ processVariable.map,
+ bpmnFactory
+ );
+ }
}
+ }
- return { success: true };
+ return { success: true };
}
/**
@@ -433,52 +611,69 @@ export function createProcessContextVariablesTask(processContextVariables, rootP
* @param elementRegistry The elementRegistry containing the current elements of the workflow.
* @return {bpmn:Task} The ProcessContextVariables task for the start event
*/
-function getProcessContextVariablesTask(startEventElement, parent, bpmnFactory, modeling, elementRegistry) {
-
- const startEventBo = startEventElement.businessObject;
-
- let processVariablesTaskBo;
-
- // check if ProcessContextVariables task already exists
- if (startEventElement.outgoing[0]
- && startEventElement.outgoing[0].target
- && startEventElement.outgoing[0].target.businessObject.name === 'Create Process Variables [Generated]') {
- processVariablesTaskBo = startEventElement.outgoing[0].target.businessObject;
-
- } else {
- processVariablesTaskBo = bpmnFactory.create('bpmn:Task');
- processVariablesTaskBo.name = 'Create Process Variables [Generated]';
-
- const outgoingFlowElements = startEventBo.outgoing || [];
-
- // height difference between the position of the center of a start event and a task
- const Y_OFFSET_TASK = 19;
-
- // create new task
- const newTaskElement = modeling.createShape({
- type: 'bpmn:Task',
- businessObject: processVariablesTaskBo,
- }, { x: startEventElement.x, y: startEventElement.y + Y_OFFSET_TASK }, parent, {});
-
- modeling.updateProperties(newTaskElement, processVariablesTaskBo);
-
- // move start event to the left to create space for the new task
- modeling.moveElements([startEventElement], { x: -120, y: 0 });
-
- // connect new Task with activities which were connected with the start event
- modeling.connect(startEventElement, newTaskElement, { type: 'bpmn:SequenceFlow' });
- for (let outgoingConnectionBo of outgoingFlowElements) {
- const outgoingConnectionElement = elementRegistry.get(outgoingConnectionBo.id);
- const target = outgoingConnectionElement.target;
-
- modeling.removeConnection(outgoingConnectionElement);
- modeling.connect(newTaskElement, target, {
- type: outgoingConnectionElement.type,
- waypoints: outgoingConnectionElement.waypoints
- });
- }
+function getProcessContextVariablesTask(
+ startEventElement,
+ parent,
+ bpmnFactory,
+ modeling,
+ elementRegistry
+) {
+ const startEventBo = startEventElement.businessObject;
+
+ let processVariablesTaskBo;
+
+ // check if ProcessContextVariables task already exists
+ if (
+ startEventElement.outgoing[0] &&
+ startEventElement.outgoing[0].target &&
+ startEventElement.outgoing[0].target.businessObject.name ===
+ "Create Process Variables [Generated]"
+ ) {
+ processVariablesTaskBo =
+ startEventElement.outgoing[0].target.businessObject;
+ } else {
+ processVariablesTaskBo = bpmnFactory.create("bpmn:Task");
+ processVariablesTaskBo.name = "Create Process Variables [Generated]";
+
+ const outgoingFlowElements = startEventBo.outgoing || [];
+
+ // height difference between the position of the center of a start event and a task
+ const Y_OFFSET_TASK = 19;
+
+ // create new task
+ const newTaskElement = modeling.createShape(
+ {
+ type: "bpmn:Task",
+ businessObject: processVariablesTaskBo,
+ },
+ { x: startEventElement.x, y: startEventElement.y + Y_OFFSET_TASK },
+ parent,
+ {}
+ );
+
+ modeling.updateProperties(newTaskElement, processVariablesTaskBo);
+
+ // move start event to the left to create space for the new task
+ modeling.moveElements([startEventElement], { x: -120, y: 0 });
+
+ // connect new Task with activities which were connected with the start event
+ modeling.connect(startEventElement, newTaskElement, {
+ type: "bpmn:SequenceFlow",
+ });
+ for (let outgoingConnectionBo of outgoingFlowElements) {
+ const outgoingConnectionElement = elementRegistry.get(
+ outgoingConnectionBo.id
+ );
+ const target = outgoingConnectionElement.target;
+
+ modeling.removeConnection(outgoingConnectionElement);
+ modeling.connect(newTaskElement, target, {
+ type: outgoingConnectionElement.type,
+ waypoints: outgoingConnectionElement.waypoints,
+ });
}
- return processVariablesTaskBo;
+ }
+ return processVariablesTaskBo;
}
/**
@@ -488,34 +683,41 @@ function getProcessContextVariablesTask(startEventElement, parent, bpmnFactory,
* @param elementRegistry The elementRegistry containing all elements of the current workflow
* @return {boolean}
*/
-function isDataMapObjectUsedBeforeInitialized(dataMapObjectElement, elementRegistry) {
-
- // return false if the element does not have incoming and outgoing connections
- if (!dataMapObjectElement.incoming
- || dataMapObjectElement.incoming.length === 0
- || !dataMapObjectElement.outgoing
- || dataMapObjectElement.outgoing.length === 0) {
- return false;
+function isDataMapObjectUsedBeforeInitialized(
+ dataMapObjectElement,
+ elementRegistry
+) {
+ // return false if the element does not have incoming and outgoing connections
+ if (
+ !dataMapObjectElement.incoming ||
+ dataMapObjectElement.incoming.length === 0 ||
+ !dataMapObjectElement.outgoing ||
+ dataMapObjectElement.outgoing.length === 0
+ ) {
+ return false;
+ }
+
+ // if there is one outgoing that connection with a target located before the first outgoing connection, return false
+ for (let incomingConnection of dataMapObjectElement.incoming) {
+ // check if there exists at least one outgoing connection to an element that is located in the sequence flow before
+ // the target of the incomingConnection
+ for (let outgoingConnection of dataMapObjectElement.outgoing) {
+ const found = findSequenceFlowConnection(
+ outgoingConnection.target,
+ incomingConnection.source,
+ new Set(),
+ elementRegistry
+ );
+ if (found) {
+ // there is an outgoing connection with a target before the incoming connection
+ break;
+ }
+
+ // found one incoming connection that is located before all outgoing connections
+ return false;
}
-
- // if there is one outgoing that connection with a target located before the first outgoing connection, return false
- for (let incomingConnection of dataMapObjectElement.incoming) {
-
- // check if there exists at least one outgoing connection to an element that is located in the sequence flow before
- // the target of the incomingConnection
- for (let outgoingConnection of dataMapObjectElement.outgoing) {
- const found = findSequenceFlowConnection(outgoingConnection.target, incomingConnection.source, new Set(), elementRegistry);
- if (found) {
-
- // there is an outgoing connection with a target before the incoming connection
- break;
- }
-
- // found one incoming connection that is located before all outgoing connections
- return false;
- }
- }
- return true;
+ }
+ return true;
}
/**
@@ -525,14 +727,14 @@ function isDataMapObjectUsedBeforeInitialized(dataMapObjectElement, elementRegis
* @return {string} The documentation as a string.
*/
function createDataMapObjectDocs(dataMapObjectBo) {
- let doc = '\n \n Replaced DataMapObject, represents the following data: \n';
+ let doc = "\n \n Replaced DataMapObject, represents the following data: \n";
- const contentMap = {};
- for (let contentEntry of dataMapObjectBo.get(consts.CONTENT)) {
- contentMap[contentEntry.name] = contentEntry.value;
- }
+ const contentMap = {};
+ for (let contentEntry of dataMapObjectBo.get(consts.CONTENT)) {
+ contentMap[contentEntry.name] = contentEntry.value;
+ }
- return doc.concat(JSON.stringify(contentMap));
+ return doc.concat(JSON.stringify(contentMap));
}
/**
@@ -542,14 +744,14 @@ function createDataMapObjectDocs(dataMapObjectBo) {
* @return {string} The documentation as a string.
*/
function createDataStoreMapDocs(dataStoreMapBo) {
- let doc = '\n \n Replaced DataStoreMap, represents the following data: \n';
+ let doc = "\n \n Replaced DataStoreMap, represents the following data: \n";
- const detailsMap = {};
- for (let detailsEntry of dataStoreMapBo.get(consts.DETAILS)) {
- detailsMap[detailsEntry.name] = detailsEntry.value;
- }
+ const detailsMap = {};
+ for (let detailsEntry of dataStoreMapBo.get(consts.DETAILS)) {
+ detailsMap[detailsEntry.name] = detailsEntry.value;
+ }
- return doc.concat(JSON.stringify(detailsMap));
+ return doc.concat(JSON.stringify(detailsMap));
}
/**
@@ -560,16 +762,20 @@ function createDataStoreMapDocs(dataStoreMapBo) {
* @return {string} The documentation string
*/
function createTransformationSourceDocs(transformationAssociationElement) {
- const target = transformationAssociationElement.target;
+ const target = transformationAssociationElement.target;
- const doc = `\n \n This object was transformed into ${target.name || target.id}. The transformation was defined by the following expressions: \n`;
+ const doc = `\n \n This object was transformed into ${
+ target.name || target.id
+ }. The transformation was defined by the following expressions: \n`;
- const expressionsMap = {};
- for (let expression of transformationAssociationElement.businessObject.get(consts.EXPRESSIONS)) {
- expressionsMap[expression.name] = expression.value;
- }
+ const expressionsMap = {};
+ for (let expression of transformationAssociationElement.businessObject.get(
+ consts.EXPRESSIONS
+ )) {
+ expressionsMap[expression.name] = expression.value;
+ }
- return doc.concat(JSON.stringify(expressionsMap));
+ return doc.concat(JSON.stringify(expressionsMap));
}
/**
@@ -580,14 +786,18 @@ function createTransformationSourceDocs(transformationAssociationElement) {
* @return {string} The documentation string
*/
function createTransformationTargetDocs(transformationAssociationElement) {
- const source = transformationAssociationElement.source;
+ const source = transformationAssociationElement.source;
- const doc = `\n \n This object was created through a transformation of ${source.name || source.id}. The transformation was defined by the following expressions: \n`;
+ const doc = `\n \n This object was created through a transformation of ${
+ source.name || source.id
+ }. The transformation was defined by the following expressions: \n`;
- const expressionsMap = {};
- for (let expression of transformationAssociationElement.businessObject.get(consts.EXPRESSIONS)) {
- expressionsMap[expression.name] = expression.value;
- }
+ const expressionsMap = {};
+ for (let expression of transformationAssociationElement.businessObject.get(
+ consts.EXPRESSIONS
+ )) {
+ expressionsMap[expression.name] = expression.value;
+ }
- return doc.concat(JSON.stringify(expressionsMap));
-}
\ No newline at end of file
+ return doc.concat(JSON.stringify(expressionsMap));
+}
diff --git a/components/bpmn-q/modeler-component/extensions/data-extension/ui/UpdateTransformationConfigurations.js b/components/bpmn-q/modeler-component/extensions/data-extension/ui/UpdateTransformationConfigurations.js
index f0acc97b..86e8ef51 100644
--- a/components/bpmn-q/modeler-component/extensions/data-extension/ui/UpdateTransformationConfigurations.js
+++ b/components/bpmn-q/modeler-component/extensions/data-extension/ui/UpdateTransformationConfigurations.js
@@ -1,5 +1,5 @@
-import React from 'react';
-import {updateTransformationTaskConfigurations} from "../transf-task-configs/TransformationTaskConfigurations";
+import React from "react";
+import { updateTransformationTaskConfigurations } from "../transf-task-configs/TransformationTaskConfigurations";
/**
* React button component which updates the transformation task configurations when clicked.
@@ -8,12 +8,18 @@ import {updateTransformationTaskConfigurations} from "../transf-task-configs/Tra
* @constructor
*/
export default function UpdateTransformationTaskConfigurationsButton() {
-
- return
- updateTransformationTaskConfigurations()}>
- Update Task Configurations
-
;
+ return (
+
+ updateTransformationTaskConfigurations()}
+ >
+
+ Update Task Configurations
+
+
+
+ );
}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/OpenTOSCAPlugin.js b/components/bpmn-q/modeler-component/extensions/opentosca/OpenTOSCAPlugin.js
index 63c1d74d..02c17fc5 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/OpenTOSCAPlugin.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/OpenTOSCAPlugin.js
@@ -2,26 +2,25 @@ import React from "react";
import OpenTOSCATab from "./configTabs/OpenTOSCATab";
-import OpenTOSCAStyles from './styling/opentosca.css';
+import OpenTOSCAStyles from "./styling/opentosca.css";
import DeploymentPlugin from "./ui/deployment/services/DeploymentPlugin";
import OpenTOSCAExtensionModule from "./modeling";
-let OpenTOSCAModdleExtension = require('./resources/opentosca4bpmn.json');
-
+let OpenTOSCAModdleExtension = require("./resources/opentosca4bpmn.json");
/**
* Plugin Object of the OpenTOSCA extension. Used to register the plugin in the plugin handler of the modeler.
*/
export default {
- buttons: [OpenTOSCA
-
- ;
+ return (
+ <>
+ OpenTOSCA
+
+
+ );
}
OpenTOSCATab.prototype.config = () => {
- const modeler = getModeler();
+ const modeler = getModeler();
- modeler.config.opentoscaEndpoint = config.getOpenTOSCAEndpoint();
- modeler.config.wineryEndpoint = config.getWineryEndpoint();
-};
\ No newline at end of file
+ modeler.config.opentoscaEndpoint = config.getOpenTOSCAEndpoint();
+ modeler.config.wineryEndpoint = config.getWineryEndpoint();
+};
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/BindingUtils.js b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/BindingUtils.js
index 0cd9737e..38b40e9d 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/BindingUtils.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/BindingUtils.js
@@ -10,8 +10,12 @@
*/
import * as config from "../framework-config/config-manager";
-const QUANTME_NAMESPACE_PULL_ENCODED = encodeURIComponent(encodeURIComponent('http://quantil.org/quantme/pull'));
-const QUANTME_NAMESPACE_PUSH_ENCODED = encodeURIComponent(encodeURIComponent('http://quantil.org/quantme/push'));
+const QUANTME_NAMESPACE_PULL_ENCODED = encodeURIComponent(
+ encodeURIComponent("http://quantil.org/quantme/pull")
+);
+const QUANTME_NAMESPACE_PUSH_ENCODED = encodeURIComponent(
+ encodeURIComponent("http://quantil.org/quantme/push")
+);
/**
* Check whether the given ServiceTask has an attached deployment model that should be bound using pull or push mode
@@ -22,22 +26,25 @@ const QUANTME_NAMESPACE_PUSH_ENCODED = encodeURIComponent(encodeURIComponent('ht
* or undefined if unable to determine pull or push
*/
export function getBindingType(serviceTask) {
- let urlSplit = serviceTask.deploymentModelUrl.split('servicetemplates/');
- if (urlSplit.length !== 2) {
- console.warn('Deployment model url is invalid: %s', serviceTask.deploymentModelUrl);
- return undefined;
- }
- let namespace = urlSplit[1];
+ let urlSplit = serviceTask.deploymentModelUrl.split("servicetemplates/");
+ if (urlSplit.length !== 2) {
+ console.warn(
+ "Deployment model url is invalid: %s",
+ serviceTask.deploymentModelUrl
+ );
+ return undefined;
+ }
+ let namespace = urlSplit[1];
- if (namespace.startsWith(QUANTME_NAMESPACE_PUSH_ENCODED)) {
- return 'push';
- }
+ if (namespace.startsWith(QUANTME_NAMESPACE_PUSH_ENCODED)) {
+ return "push";
+ }
- if (namespace.startsWith(QUANTME_NAMESPACE_PULL_ENCODED)) {
- return 'pull';
- }
+ if (namespace.startsWith(QUANTME_NAMESPACE_PULL_ENCODED)) {
+ return "pull";
+ }
- return undefined;
+ return undefined;
}
/**
@@ -50,33 +57,47 @@ export function getBindingType(serviceTask) {
* @return {{success: boolean}} true if binding is successful, false otherwise
*/
export function bindUsingPull(csar, serviceTaskId, elementRegistry, modeling) {
-
- if (csar.topicName === undefined || serviceTaskId === undefined || elementRegistry === undefined || modeling === undefined) {
- console.error('Topic name, service task id, element registry, and modeling required for binding using pull!');
- return { success: false };
- }
-
- // retrieve service task to bind
- let serviceTask = elementRegistry.get(serviceTaskId);
- if (serviceTask === undefined) {
- console.error('Unable to retrieve corresponding task for id: %s', serviceTaskId);
- return { success: false };
- }
-
- let deploymentModelUrl = serviceTask.businessObject.get('opentosca:deploymentModelUrl');
- if (deploymentModelUrl.startsWith('{{ wineryEndpoint }}')) {
- deploymentModelUrl = deploymentModelUrl.replace('{{ wineryEndpoint }}', config.getWineryEndpoint());
- }
-
- // remove deployment model URL and set topic
-
- modeling.updateProperties(serviceTask, {
- 'opentosca:deploymentModelUrl': deploymentModelUrl,
- 'opentosca:deploymentBuildPlanInstanceUrl': csar.buildPlanUrl,
- type: 'external',
- topic: csar.topicName
- });
- return {success: true};
+ if (
+ csar.topicName === undefined ||
+ serviceTaskId === undefined ||
+ elementRegistry === undefined ||
+ modeling === undefined
+ ) {
+ console.error(
+ "Topic name, service task id, element registry, and modeling required for binding using pull!"
+ );
+ return { success: false };
+ }
+
+ // retrieve service task to bind
+ let serviceTask = elementRegistry.get(serviceTaskId);
+ if (serviceTask === undefined) {
+ console.error(
+ "Unable to retrieve corresponding task for id: %s",
+ serviceTaskId
+ );
+ return { success: false };
+ }
+
+ let deploymentModelUrl = serviceTask.businessObject.get(
+ "opentosca:deploymentModelUrl"
+ );
+ if (deploymentModelUrl.startsWith("{{ wineryEndpoint }}")) {
+ deploymentModelUrl = deploymentModelUrl.replace(
+ "{{ wineryEndpoint }}",
+ config.getWineryEndpoint()
+ );
+ }
+
+ // remove deployment model URL and set topic
+
+ modeling.updateProperties(serviceTask, {
+ "opentosca:deploymentModelUrl": deploymentModelUrl,
+ "opentosca:deploymentBuildPlanInstanceUrl": csar.buildPlanUrl,
+ type: "external",
+ topic: csar.topicName,
+ });
+ return { success: true };
}
/**
@@ -87,54 +108,61 @@ export function bindUsingPull(csar, serviceTaskId, elementRegistry, modeling) {
* @param elementRegistry the element registry of the modeler to find workflow elements
* @return {{success: boolean}} true if binding is successful, false otherwise
*/
-export async function bindUsingPush(csar, serviceTaskId, elementRegistry, modeling) {
- let url = await extractSelfserviceApplicationUrl(csar.properties);
- let success = false;
-
- if (csar === undefined || serviceTaskId === undefined || elementRegistry === undefined) {
- console.error('CSAR details, service task id, and element registry required for binding using push!');
- return { success: false };
- }
-
- // retrieve service task to bind
- let serviceTask = elementRegistry.get(serviceTaskId);
- if (serviceTask === undefined) {
- console.error('Unable to retrieve corresponding task for id: %s', serviceTaskId);
- return { success: false };
- }
-
- let extensionElements = serviceTask.businessObject.extensionElements.values;
- for (let i = 0; i < extensionElements.length; i++) {
- let extensionElement = extensionElements[i];
- if (extensionElement.$type === 'camunda:Connector') {
- let inputParameters = extensionElement.inputOutput.inputParameters;
- for (let j = 0; j < inputParameters.length; j++) {
- let inputParameter = inputParameters[j];
- if (inputParameter.name === 'url') {
- let connectorUrl = serviceTask.businessObject.connectorUrl;
- inputParameter.value = url + connectorUrl;
- success = true;
- }
- }
+export async function bindUsingPush(csar, serviceTaskId, elementRegistry) {
+ let url = await extractSelfserviceApplicationUrl(csar.properties);
+ let success = false;
+
+ if (
+ csar === undefined ||
+ serviceTaskId === undefined ||
+ elementRegistry === undefined
+ ) {
+ console.error(
+ "CSAR details, service task id, and element registry required for binding using push!"
+ );
+ return { success: false };
+ }
+
+ // retrieve service task to bind
+ let serviceTask = elementRegistry.get(serviceTaskId);
+ if (serviceTask === undefined) {
+ console.error(
+ "Unable to retrieve corresponding task for id: %s",
+ serviceTaskId
+ );
+ return { success: false };
+ }
+
+ let extensionElements = serviceTask.businessObject.extensionElements.values;
+ for (let i = 0; i < extensionElements.length; i++) {
+ let extensionElement = extensionElements[i];
+ if (extensionElement.$type === "camunda:Connector") {
+ let inputParameters = extensionElement.inputOutput.inputParameters;
+ for (let j = 0; j < inputParameters.length; j++) {
+ let inputParameter = inputParameters[j];
+ if (inputParameter.name === "url") {
+ let connectorUrl = serviceTask.businessObject.connectorUrl;
+ inputParameter.value = url + connectorUrl;
+ success = true;
}
+ }
}
- return { success: success };
+ }
+ return { success: success };
}
-async function extractSelfserviceApplicationUrl(propertiesUrl, csar) {
-
- let properties = await fetchProperties(propertiesUrl);
- let json = JSON.parse(properties);
- const value = json.selfserviceApplicationUrl;
- return value;
+async function extractSelfserviceApplicationUrl(propertiesUrl) {
+ let properties = await fetchProperties(propertiesUrl);
+ let json = JSON.parse(properties);
+ return json.selfserviceApplicationUrl;
}
async function fetchProperties(url) {
- const response = await fetch(url, {
- headers: {
- Accept: "application/json"
- }
- });
- const json = await response.text();
- return json;
+ const response = await fetch(url, {
+ headers: {
+ Accept: "application/json",
+ },
+ });
+ const json = await response.text();
+ return json;
}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/DeploymentUtils.js b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/DeploymentUtils.js
index 018e2670..cbb527ce 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/DeploymentUtils.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/DeploymentUtils.js
@@ -9,8 +9,8 @@
* SPDX-License-Identifier: Apache-2.0
*/
-import {getBindingType} from './BindingUtils';
-import {getFlowElementsRecursively} from '../../../editor/util/ModellingUtilities';
+import { getBindingType } from "./BindingUtils";
+import { getFlowElementsRecursively } from "../../../editor/util/ModellingUtilities";
/**
* Get the ServiceTasks of the current workflow that have an attached deployment model to deploy the corresponding service starting from the given root element
@@ -19,39 +19,40 @@ import {getFlowElementsRecursively} from '../../../editor/util/ModellingUtilitie
* @return the list of ServiceTasks with attached deployment models to deploy the required services
*/
export function getServiceTasksToDeploy(startElement) {
- let csarsToDeploy = [];
+ let csarsToDeploy = [];
- if (startElement === undefined) {
- console.warn('Element to start is undefined!');
- return csarsToDeploy;
- }
+ if (startElement === undefined) {
+ console.warn("Element to start is undefined!");
+ return csarsToDeploy;
+ }
- // search for service tasks with assigned deployment model
- let flowElements = getFlowElementsRecursively(startElement);
- for (let i = 0; i < flowElements.length; i++) {
- let flowElement = flowElements[i];
+ // search for service tasks with assigned deployment model
+ let flowElements = getFlowElementsRecursively(startElement);
+ for (let i = 0; i < flowElements.length; i++) {
+ let flowElement = flowElements[i];
- if (isDeployableServiceTask(flowElement)) {
- console.log('Found deployable service task: ', flowElement);
+ if (isDeployableServiceTask(flowElement)) {
+ console.log("Found deployable service task: ", flowElement);
- // check if CSAR was already added for another service task
- let csarEntry = csarsToDeploy.find(serviceTask => flowElement.deploymentModelUrl === serviceTask.url);
- if (csarEntry !== undefined) {
- console.log('Adding to existing CSAR entry...');
- csarEntry.serviceTaskIds.push(flowElement.id);
- } else {
- csarsToDeploy.push(
- {
- serviceTaskIds: [flowElement.id],
- url: flowElement.deploymentModelUrl,
- type: getBindingType(flowElement),
- csarName: getCSARName(flowElement)
- });
- }
- }
+ // check if CSAR was already added for another service task
+ let csarEntry = csarsToDeploy.find(
+ (serviceTask) => flowElement.deploymentModelUrl === serviceTask.url
+ );
+ if (csarEntry !== undefined) {
+ console.log("Adding to existing CSAR entry...");
+ csarEntry.serviceTaskIds.push(flowElement.id);
+ } else {
+ csarsToDeploy.push({
+ serviceTaskIds: [flowElement.id],
+ url: flowElement.deploymentModelUrl,
+ type: getBindingType(flowElement),
+ csarName: getCSARName(flowElement),
+ });
+ }
}
+ }
- return csarsToDeploy;
+ return csarsToDeploy;
}
/**
@@ -61,9 +62,9 @@ export function getServiceTasksToDeploy(startElement) {
* @return {*} the CSAR name
*/
function getCSARName(serviceTask) {
- let url = serviceTask.deploymentModelUrl.split('/?csar')[0];
- let urlSplit = url.split('/');
- return urlSplit[urlSplit.length - 1] + '.csar';
+ let url = serviceTask.deploymentModelUrl.split("/?csar")[0];
+ let urlSplit = url.split("/");
+ return urlSplit[urlSplit.length - 1] + ".csar";
}
/**
@@ -73,5 +74,10 @@ function getCSARName(serviceTask) {
* @return {*|boolean} true if the element is a ServiceTask and has an assigned deployment model, false otherwise
*/
export function isDeployableServiceTask(element) {
- return element.$type && element.$type === 'bpmn:ServiceTask' && element.deploymentModelUrl && getBindingType(element) !== undefined;
+ return (
+ element.$type &&
+ element.$type === "bpmn:ServiceTask" &&
+ element.deploymentModelUrl &&
+ getBindingType(element) !== undefined
+ );
}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/OpenTOSCAUtils.js b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/OpenTOSCAUtils.js
index 1804914e..be7e0136 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/OpenTOSCAUtils.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/OpenTOSCAUtils.js
@@ -9,7 +9,7 @@
* SPDX-License-Identifier: Apache-2.0
*/
-import {fetch} from 'whatwg-fetch';
+import { fetch } from "whatwg-fetch";
/**
* Upload the CSAR located at the given URL to the connected OpenTOSCA Container and return the corresponding URL and required input parameters
@@ -19,56 +19,67 @@ import {fetch} from 'whatwg-fetch';
* @param url the URL pointing to the CSAR
* @param wineryEndpoint the endpoint of the Winery containing the CSAR to upload
*/
-export async function uploadCSARToContainer(opentoscaEndpoint, csarName, url, wineryEndpoint) {
-
- if (opentoscaEndpoint === undefined) {
- console.error('OpenTOSCA endpoint is undefined. Unable to upload CSARs...');
- return {success: false};
+export async function uploadCSARToContainer(
+ opentoscaEndpoint,
+ csarName,
+ url,
+ wineryEndpoint
+) {
+ if (opentoscaEndpoint === undefined) {
+ console.error("OpenTOSCA endpoint is undefined. Unable to upload CSARs...");
+ return { success: false };
+ }
+
+ try {
+ if (url.startsWith("{{ wineryEndpoint }}")) {
+ url = url.replace("{{ wineryEndpoint }}", wineryEndpoint);
+ }
+ console.log(
+ "Checking if CSAR at following URL is already uploaded to the OpenTOSCA Container: ",
+ url
+ );
+
+ // check if CSAR is already uploaded
+ let getCSARResult = await getBuildPlanForCSAR(opentoscaEndpoint, csarName);
+
+ if (!getCSARResult.success) {
+ console.log("CSAR is not yet uploaded. Uploading...");
+
+ let body = {
+ enrich: "false",
+ name: csarName,
+ url: url,
+ };
+
+ // upload the CSAR
+ await fetch(opentoscaEndpoint, {
+ method: "POST",
+ body: JSON.stringify(body),
+ headers: { "Content-Type": "application/json" },
+ });
+
+ // check successful upload and retrieve corresponding url
+ getCSARResult = await getBuildPlanForCSAR(opentoscaEndpoint, csarName);
}
- try {
- if (url.startsWith('{{ wineryEndpoint }}')) {
- url = url.replace('{{ wineryEndpoint }}', wineryEndpoint);
- }
- console.log('Checking if CSAR at following URL is already uploaded to the OpenTOSCA Container: ', url);
-
- // check if CSAR is already uploaded
- let getCSARResult = await getBuildPlanForCSAR(opentoscaEndpoint, csarName);
-
- if (!getCSARResult.success) {
- console.log('CSAR is not yet uploaded. Uploading...');
-
- let body = {
- enrich: 'false',
- name: csarName,
- url: url
- };
-
- // upload the CSAR
- await fetch(opentoscaEndpoint, {
- method: 'POST',
- body: JSON.stringify(body),
- headers: {'Content-Type': 'application/json'}
- });
-
- // check successful upload and retrieve corresponding url
- getCSARResult = await getBuildPlanForCSAR(opentoscaEndpoint, csarName);
- }
-
- if (!getCSARResult.success) {
- console.error('Uploading CSAR failed!');
- return {success: false};
- }
-
- // retrieve input parameters for the build plan
- let buildPlanResult = await fetch(getCSARResult.url);
- let buildPlanResultJson = await buildPlanResult.json();
-
- return {success: true, url: getCSARResult.url, inputParameters: buildPlanResultJson.input_parameters};
- } catch (e) {
- console.error('Error while uploading CSAR: ' + e);
- return {success: false};
+ if (!getCSARResult.success) {
+ console.error("Uploading CSAR failed!");
+ return { success: false };
}
+
+ // retrieve input parameters for the build plan
+ let buildPlanResult = await fetch(getCSARResult.url);
+ let buildPlanResultJson = await buildPlanResult.json();
+
+ return {
+ success: true,
+ url: getCSARResult.url,
+ inputParameters: buildPlanResultJson.input_parameters,
+ };
+ } catch (e) {
+ console.error("Error while uploading CSAR: " + e);
+ return { success: false };
+ }
}
/**
@@ -79,31 +90,29 @@ export async function uploadCSARToContainer(opentoscaEndpoint, csarName, url, wi
* @return the status whether the given CSAR is uploaded and the corresponding build plan link if available
*/
async function getBuildPlanForCSAR(opentoscaEndpoint, csarName) {
-
- // get all currently deployed CSARs
- let response = await fetch(opentoscaEndpoint);
- let responseJson = await response.json();
-
- let deployedCSARs = responseJson.csars;
- if (deployedCSARs === undefined) {
-
- // no CSARs available
- return {success: false};
- }
-
- for (let i = 0; i < deployedCSARs.length; i++) {
- let deployedCSAR = deployedCSARs[i];
- if (deployedCSAR.id === csarName) {
- console.log('Found uploaded CSAR with id: %s', csarName);
- let url = deployedCSAR._links.self.href;
-
- // retrieve the URl to the build plan required to get the input parameters and to instantiate the CSAR
- return getBuildPlanUrl(url);
- }
+ // get all currently deployed CSARs
+ let response = await fetch(opentoscaEndpoint);
+ let responseJson = await response.json();
+
+ let deployedCSARs = responseJson.csars;
+ if (deployedCSARs === undefined) {
+ // no CSARs available
+ return { success: false };
+ }
+
+ for (let i = 0; i < deployedCSARs.length; i++) {
+ let deployedCSAR = deployedCSARs[i];
+ if (deployedCSAR.id === csarName) {
+ console.log("Found uploaded CSAR with id: %s", csarName);
+ let url = deployedCSAR._links.self.href;
+
+ // retrieve the URl to the build plan required to get the input parameters and to instantiate the CSAR
+ return getBuildPlanUrl(url);
}
+ }
- // unable to find CSAR
- return {success: false};
+ // unable to find CSAR
+ return { success: false };
}
/**
@@ -113,25 +122,31 @@ async function getBuildPlanForCSAR(opentoscaEndpoint, csarName) {
* @return the URL to the build plan for the given CSAR
*/
async function getBuildPlanUrl(csarUrl) {
-
- let response = await fetch(csarUrl + '/servicetemplates');
- let responseJson = await response.json();
-
- if (!responseJson.service_templates || responseJson.service_templates.length !== 1) {
- console.error('Unable to find service template in CSAR at URL: %s', csarUrl);
- return {success: false};
- }
-
- let buildPlansUrl = responseJson.service_templates[0]._links.self.href + '/buildplans';
- response = await fetch(buildPlansUrl);
- responseJson = await response.json();
-
- if (!responseJson.plans || responseJson.plans.length !== 1) {
- console.error('Unable to find build plan at URL: %s', buildPlansUrl);
- return {success: false};
- }
-
- return {success: true, url: responseJson.plans[0]._links.self.href};
+ let response = await fetch(csarUrl + "/servicetemplates");
+ let responseJson = await response.json();
+
+ if (
+ !responseJson.service_templates ||
+ responseJson.service_templates.length !== 1
+ ) {
+ console.error(
+ "Unable to find service template in CSAR at URL: %s",
+ csarUrl
+ );
+ return { success: false };
+ }
+
+ let buildPlansUrl =
+ responseJson.service_templates[0]._links.self.href + "/buildplans";
+ response = await fetch(buildPlansUrl);
+ responseJson = await response.json();
+
+ if (!responseJson.plans || responseJson.plans.length !== 1) {
+ console.error("Unable to find build plan at URL: %s", buildPlansUrl);
+ return { success: false };
+ }
+
+ return { success: true, url: responseJson.plans[0]._links.self.href };
}
/**
@@ -142,97 +157,108 @@ async function getBuildPlanUrl(csarUrl) {
* @return the result of the instance creation (success, endpoint, topic on which the service listens, ...)
*/
export async function createServiceInstance(csar, camundaEngineEndpoint) {
-
- let result = {success: false};
-
- let inputParameters = csar.inputParameters;
- if (csar.type === 'pull') {
-
- // get special parameters that are required to bind services using external tasks / the pulling pattern
- let camundaTopicParam = inputParameters.find((param) => param.name === 'camundaTopic');
- let camundaEndpointParam = inputParameters.find((param) => param.name === 'camundaEndpoint');
-
- // abort if parameters are not available
- if (camundaTopicParam === undefined || camundaEndpointParam === undefined) {
- console.error('Unable to pass topic to poll to service instance creation. Service binding will fail!');
- return result;
- }
-
- // generate topic for the binding
- let topicName = makeId(12);
-
- camundaTopicParam.value = topicName;
- camundaEndpointParam.value = camundaEngineEndpoint;
- result.topicName = topicName;
- }
-
- // trigger instance creation
- let instanceCreationResponse = await fetch(csar.buildPlanUrl + '/instances', {
- method: 'POST',
- body: JSON.stringify(inputParameters),
- headers: {'Content-Type': 'application/json'}
- });
- let instanceCreationResponseJson = await instanceCreationResponse.json();
-
- // wait for the service instance to be created
- await new Promise(r => setTimeout(r, 5000));
-
- // get service template instance to poll for completness
- let buildPlanResponse = await fetch(csar.buildPlanUrl + '/instances/' + instanceCreationResponseJson);
- let buildPlanResponseJson = await buildPlanResponse.json();
-
- // retry polling 10 times, creation of the build time takes some time
- for (let retry = 0; retry < 10; retry++) {
-
- // stop retries in case of correct response
- if (buildPlanResponseJson._links) {
- break;
- }
-
- await new Promise(r => setTimeout(r, 5000));
-
- console.log('Retry fetching build plan');
-
- buildPlanResponse = await fetch(csar.buildPlanUrl + '/instances/' + instanceCreationResponseJson);
- buildPlanResponseJson = await buildPlanResponse.json();
+ let result = { success: false };
+
+ let inputParameters = csar.inputParameters;
+ if (csar.type === "pull") {
+ // get special parameters that are required to bind services using external tasks / the pulling pattern
+ let camundaTopicParam = inputParameters.find(
+ (param) => param.name === "camundaTopic"
+ );
+ let camundaEndpointParam = inputParameters.find(
+ (param) => param.name === "camundaEndpoint"
+ );
+
+ // abort if parameters are not available
+ if (camundaTopicParam === undefined || camundaEndpointParam === undefined) {
+ console.error(
+ "Unable to pass topic to poll to service instance creation. Service binding will fail!"
+ );
+ return result;
}
- if (!buildPlanResponseJson._links) {
- console.log('Unable to fetch build plans for ' + csar.buildPlanUrl + '/instances/' + instanceCreationResponseJson);
- result.success = false;
- return result;
+ // generate topic for the binding
+ let topicName = makeId(12);
+
+ camundaTopicParam.value = topicName;
+ camundaEndpointParam.value = camundaEngineEndpoint;
+ result.topicName = topicName;
+ }
+
+ // trigger instance creation
+ let instanceCreationResponse = await fetch(csar.buildPlanUrl + "/instances", {
+ method: "POST",
+ body: JSON.stringify(inputParameters),
+ headers: { "Content-Type": "application/json" },
+ });
+ let instanceCreationResponseJson = await instanceCreationResponse.json();
+
+ // wait for the service instance to be created
+ await new Promise((r) => setTimeout(r, 5000));
+
+ // get service template instance to poll for completness
+ let buildPlanResponse = await fetch(
+ csar.buildPlanUrl + "/instances/" + instanceCreationResponseJson
+ );
+ let buildPlanResponseJson = await buildPlanResponse.json();
+
+ // retry polling 10 times, creation of the build time takes some time
+ for (let retry = 0; retry < 10; retry++) {
+ // stop retries in case of correct response
+ if (buildPlanResponseJson._links) {
+ break;
}
- let pollingUrl = buildPlanResponseJson._links.service_template_instance.href;
+ await new Promise((r) => setTimeout(r, 5000));
- let state = 'CREATING';
- console.log('Polling for finished service instance at URL: %s', pollingUrl);
- let properties = '';
- while (!(state === 'CREATED' || state === 'FAILED')) {
+ console.log("Retry fetching build plan");
- // wait 5 seconds for next poll
- await new Promise(r => setTimeout(r, 5000));
- // poll for current state
- let pollingResponse = await fetch(pollingUrl);
- let pollingResponseJson = await pollingResponse.json();
- console.log('Polling response: ', pollingResponseJson);
- properties = pollingResponseJson._links.properties.href;
+ buildPlanResponse = await fetch(
+ csar.buildPlanUrl + "/instances/" + instanceCreationResponseJson
+ );
+ buildPlanResponseJson = await buildPlanResponse.json();
+ }
- state = pollingResponseJson.state;
- }
-
- result.success = true;
- result.properties = properties;
+ if (!buildPlanResponseJson._links) {
+ console.log(
+ "Unable to fetch build plans for " +
+ csar.buildPlanUrl +
+ "/instances/" +
+ instanceCreationResponseJson
+ );
+ result.success = false;
return result;
+ }
+
+ let pollingUrl = buildPlanResponseJson._links.service_template_instance.href;
+
+ let state = "CREATING";
+ console.log("Polling for finished service instance at URL: %s", pollingUrl);
+ let properties = "";
+ while (!(state === "CREATED" || state === "FAILED")) {
+ // wait 5 seconds for next poll
+ await new Promise((r) => setTimeout(r, 5000));
+ // poll for current state
+ let pollingResponse = await fetch(pollingUrl);
+ let pollingResponseJson = await pollingResponse.json();
+ console.log("Polling response: ", pollingResponseJson);
+ properties = pollingResponseJson._links.properties.href;
+
+ state = pollingResponseJson.state;
+ }
+
+ result.success = true;
+ result.properties = properties;
+ return result;
}
-
export function makeId(length) {
- let result = '';
- let characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
- let charactersLength = characters.length;
- for (let i = 0; i < length; i++) {
- result += characters.charAt(Math.floor(Math.random() * charactersLength));
- }
- return result;
+ let result = "";
+ let characters =
+ "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+ let charactersLength = characters.length;
+ for (let i = 0; i < length; i++) {
+ result += characters.charAt(Math.floor(Math.random() * charactersLength));
+ }
+ return result;
}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/WineryUtils.js b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/WineryUtils.js
index 0072e717..3dbd3b1e 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/deployment/WineryUtils.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/deployment/WineryUtils.js
@@ -10,290 +10,391 @@
*/
import * as config from "../framework-config/config-manager";
-import {getWineryEndpoint} from "../framework-config/config-manager";
-import {fetch} from "whatwg-fetch";
+import { getWineryEndpoint } from "../framework-config/config-manager";
+import { fetch } from "whatwg-fetch";
-const QUANTME_NAMESPACE_PUSH = 'http://quantil.org/quantme/push';
+const QUANTME_NAMESPACE_PUSH = "http://quantil.org/quantme/push";
export async function createArtifactTemplate(name, artifactTypeQName) {
- const artifactTemplate = {
- localname: name,
- namespace: QUANTME_NAMESPACE_PUSH + '/artifacttemplates',
- type: artifactTypeQName,
- };
- const response = await fetch(`${getWineryEndpoint()}/artifacttemplates`, {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json',
- 'Accept': 'text/plain'
- },
- body: JSON.stringify(artifactTemplate)
- });
- return response.text();
+ const artifactTemplate = {
+ localname: name,
+ namespace: QUANTME_NAMESPACE_PUSH + "/artifacttemplates",
+ type: artifactTypeQName,
+ };
+ const response = await fetch(`${getWineryEndpoint()}/artifacttemplates`, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "text/plain",
+ },
+ body: JSON.stringify(artifactTemplate),
+ });
+ return response.text();
}
export async function addFileToArtifactTemplate(artifactTemplateAddress, file) {
- const formData = new FormData();
- formData.append('file', file);
- const response = await fetch(`${getWineryEndpoint()}/artifacttemplates/${artifactTemplateAddress}files`, {
- method: 'POST',
- body: formData,
- headers: {
- 'Accept': '*/*'
- },
- });
- return response.json();
+ const formData = new FormData();
+ formData.append("file", file);
+ const response = await fetch(
+ `${getWineryEndpoint()}/artifacttemplates/${artifactTemplateAddress}files`,
+ {
+ method: "POST",
+ body: formData,
+ headers: {
+ Accept: "*/*",
+ },
+ }
+ );
+ return response.json();
}
export async function createArtifactTemplateWithFile(name, artifactType, file) {
- const artifactTemplateAddress = await createArtifactTemplate(name, artifactType);
- await addFileToArtifactTemplate(artifactTemplateAddress, file);
- return artifactTemplateAddress;
+ const artifactTemplateAddress = await createArtifactTemplate(
+ name,
+ artifactType
+ );
+ await addFileToArtifactTemplate(artifactTemplateAddress, file);
+ return artifactTemplateAddress;
}
export async function createServiceTemplate(name) {
- const serviceTemplate = {
- localname: name,
- namespace: QUANTME_NAMESPACE_PUSH,
- };
- const response = await fetch(getWineryEndpoint() + '/servicetemplates', {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json',
- 'Accept': 'text/plain'
- },
- body: JSON.stringify(serviceTemplate)
- });
- return response.text();
+ const serviceTemplate = {
+ localname: name,
+ namespace: QUANTME_NAMESPACE_PUSH,
+ };
+ const response = await fetch(getWineryEndpoint() + "/servicetemplates", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "text/plain",
+ },
+ body: JSON.stringify(serviceTemplate),
+ });
+ return response.text();
}
export async function deleteArtifactTemplate(artifactTemplateName) {
- // /artifacttemplates/http%253A%252F%252Fquantil.org%252Fquantme%252Fpush%252Fartifacttemplates/ArtifactTemplate-Activity_01b3qkz/
- const response = await fetch(`${getWineryEndpoint()}/artifacttemplates/${encodeURIComponent(encodeURIComponent(QUANTME_NAMESPACE_PUSH + '/'))}artifacttemplates/${encodeURIComponent(encodeURIComponent(artifactTemplateName))}`, {
- method: 'DELETE',
- headers: {
- 'Accept': 'application/json'
- },
- });
- return response.status === 204;
+ // /artifacttemplates/http%253A%252F%252Fquantil.org%252Fquantme%252Fpush%252Fartifacttemplates/ArtifactTemplate-Activity_01b3qkz/
+ const response = await fetch(
+ `${getWineryEndpoint()}/artifacttemplates/${encodeURIComponent(
+ encodeURIComponent(QUANTME_NAMESPACE_PUSH + "/")
+ )}artifacttemplates/${encodeURIComponent(
+ encodeURIComponent(artifactTemplateName)
+ )}`,
+ {
+ method: "DELETE",
+ headers: {
+ Accept: "application/json",
+ },
+ }
+ );
+ return response.status === 204;
}
export async function serviceTemplateExists(serviceTemplateName) {
- const response = await fetch(`${getWineryEndpoint()}/servicetemplates/${encodeURIComponent(encodeURIComponent(QUANTME_NAMESPACE_PUSH))}/${encodeURIComponent(encodeURIComponent(serviceTemplateName))}`, {
- method: 'GET',
- });
- return response.status === 200;
+ const response = await fetch(
+ `${getWineryEndpoint()}/servicetemplates/${encodeURIComponent(
+ encodeURIComponent(QUANTME_NAMESPACE_PUSH)
+ )}/${encodeURIComponent(encodeURIComponent(serviceTemplateName))}`,
+ {
+ method: "GET",
+ }
+ );
+ return response.status === 200;
}
-export async function addNodeWithArtifactToServiceTemplateByName(serviceTemplateName, nodeTypeQName, name, artifactTemplateQName, artifactName, artifactTypeQName) {
- const serviceTemplateAddress = encodeURIComponent(encodeURIComponent(QUANTME_NAMESPACE_PUSH)) + '/' + encodeURIComponent(encodeURIComponent(serviceTemplateName)) + '/';
- await addNodeWithArtifactToServiceTemplate(serviceTemplateAddress, nodeTypeQName, name, artifactTemplateQName, artifactName, artifactTypeQName);
- return serviceTemplateAddress;
+export async function addNodeWithArtifactToServiceTemplateByName(
+ serviceTemplateName,
+ nodeTypeQName,
+ name,
+ artifactTemplateQName,
+ artifactName,
+ artifactTypeQName
+) {
+ const serviceTemplateAddress =
+ encodeURIComponent(encodeURIComponent(QUANTME_NAMESPACE_PUSH)) +
+ "/" +
+ encodeURIComponent(encodeURIComponent(serviceTemplateName)) +
+ "/";
+ await addNodeWithArtifactToServiceTemplate(
+ serviceTemplateAddress,
+ nodeTypeQName,
+ name,
+ artifactTemplateQName,
+ artifactName,
+ artifactTypeQName
+ );
+ return serviceTemplateAddress;
}
-export async function addNodeToServiceTemplate(serviceTemplateAddress, nodeTypeQName, name) {
- const nodeTemplate = {
- "documentation": [],
- "any": [],
- "otherAttributes": {},
- "relationshipTemplates": [],
- "nodeTemplates": [
- {
- "documentation": [],
- "any": [],
- "otherAttributes": {
- "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}x": 1245,
- "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}y": 350
- },
- "properties": {
- "propertyType": "KV",
- "kvproperties": {
- "Port": "",
- "Name": ""
- },
- "elementName": "properties",
- "namespace": "http://opentosca.org/nodetypes/propertiesdefinition/winery"
- },
- "id": nodeTypeQName.split(/}(.*)/s)[1],
- "type": nodeTypeQName,
- "name": name,
- "minInstances": 1,
- "maxInstances": 1,
- "x": 1245,
- "y": 350,
- "capabilities": [],
- "requirements": [],
- "deploymentArtifacts": null,
- "policies": null
- }
- ]
- };
- const response = await fetch(`${getWineryEndpoint()}/servicetemplates/${serviceTemplateAddress}topologytemplate`, {
- method: 'PUT',
- headers: {
- 'Content-Type': 'application/json',
- 'Accept': '*/*'
+export async function addNodeToServiceTemplate(
+ serviceTemplateAddress,
+ nodeTypeQName,
+ name
+) {
+ const nodeTemplate = {
+ documentation: [],
+ any: [],
+ otherAttributes: {},
+ relationshipTemplates: [],
+ nodeTemplates: [
+ {
+ documentation: [],
+ any: [],
+ otherAttributes: {
+ "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}x": 1245,
+ "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}y": 350,
},
- body: JSON.stringify(nodeTemplate)
- });
- return response.status === 204;
-}
-
-export async function addNodeWithArtifactToServiceTemplate(serviceTemplateAddress, nodeTypeQName, name, artifactTemplateQName, artifactName, artifactTypeQName) {
- const nodeTemplate = {
- "documentation": [],
- "any": [],
- "otherAttributes": {},
- "relationshipTemplates": [],
- "nodeTemplates": [{
- "documentation": [],
- "any": [],
- "otherAttributes": {
- "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}x": 1245,
- "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}y": 350
- },
- "properties": {
- "propertyType": "KV",
- "kvproperties": {
- "Port": "",
- "Name": ""
- },
- "elementName": "properties",
- "namespace": "http://opentosca.org/nodetypes/propertiesdefinition/winery"
- },
- "id": nodeTypeQName.split(/}(.*)/s)[1],
- "type": nodeTypeQName,
- "name": name,
- "minInstances": 1,
- "maxInstances": 1,
- "x": 1245,
- "y": 350,
- "capabilities": [],
- "requirements": [],
- "deploymentArtifacts": [{
- "documentation": [],
- "any": [],
- "otherAttributes": {},
- "name": artifactName,
- "artifactType": artifactTypeQName,
- "artifactRef": artifactTemplateQName
- }],
- "policies": null
- }
- ]
- };
- const response = await fetch(`${getWineryEndpoint()}/servicetemplates/${serviceTemplateAddress}topologytemplate`, {
- method: 'PUT',
- headers: {
- 'Content-Type': 'application/json',
- 'Accept': '*/*'
+ properties: {
+ propertyType: "KV",
+ kvproperties: {
+ Port: "",
+ Name: "",
+ },
+ elementName: "properties",
+ namespace:
+ "http://opentosca.org/nodetypes/propertiesdefinition/winery",
},
- body: JSON.stringify(nodeTemplate)
- });
- return response.status === 204;
+ id: nodeTypeQName.split(/}(.*)/s)[1],
+ type: nodeTypeQName,
+ name: name,
+ minInstances: 1,
+ maxInstances: 1,
+ x: 1245,
+ y: 350,
+ capabilities: [],
+ requirements: [],
+ deploymentArtifacts: null,
+ policies: null,
+ },
+ ],
+ };
+ const response = await fetch(
+ `${getWineryEndpoint()}/servicetemplates/${serviceTemplateAddress}topologytemplate`,
+ {
+ method: "PUT",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "*/*",
+ },
+ body: JSON.stringify(nodeTemplate),
+ }
+ );
+ return response.status === 204;
}
-export async function getServiceTemplateXML(serviceTemplateAddress) {
- const response = await fetch(`${getWineryEndpoint()}/servicetemplates/${serviceTemplateAddress}xml`, {
- method: 'GET',
- headers: {
- 'Accept': 'application/xml'
+export async function addNodeWithArtifactToServiceTemplate(
+ serviceTemplateAddress,
+ nodeTypeQName,
+ name,
+ artifactTemplateQName,
+ artifactName,
+ artifactTypeQName
+) {
+ const nodeTemplate = {
+ documentation: [],
+ any: [],
+ otherAttributes: {},
+ relationshipTemplates: [],
+ nodeTemplates: [
+ {
+ documentation: [],
+ any: [],
+ otherAttributes: {
+ "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}x": 1245,
+ "{http://www.opentosca.org/winery/extensions/tosca/2013/02/12}y": 350,
+ },
+ properties: {
+ propertyType: "KV",
+ kvproperties: {
+ Port: "",
+ Name: "",
+ },
+ elementName: "properties",
+ namespace:
+ "http://opentosca.org/nodetypes/propertiesdefinition/winery",
},
- });
- return response.json();
+ id: nodeTypeQName.split(/}(.*)/s)[1],
+ type: nodeTypeQName,
+ name: name,
+ minInstances: 1,
+ maxInstances: 1,
+ x: 1245,
+ y: 350,
+ capabilities: [],
+ requirements: [],
+ deploymentArtifacts: [
+ {
+ documentation: [],
+ any: [],
+ otherAttributes: {},
+ name: artifactName,
+ artifactType: artifactTypeQName,
+ artifactRef: artifactTemplateQName,
+ },
+ ],
+ policies: null,
+ },
+ ],
+ };
+ const response = await fetch(
+ `${getWineryEndpoint()}/servicetemplates/${serviceTemplateAddress}topologytemplate`,
+ {
+ method: "PUT",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "*/*",
+ },
+ body: JSON.stringify(nodeTemplate),
+ }
+ );
+ return response.status === 204;
}
-export async function setServiceTemplateXML(serviceTemplateAddress, newXml) {
- const response = await fetch(getWineryEndpoint() + '/servicetemplates/' + serviceTemplateAddress + 'xml', {
- method: 'PUT',
- body: newXml,
- headers: {'Content-Type': 'application/xml'}
- });
+export async function getServiceTemplateXML(serviceTemplateAddress) {
+ const response = await fetch(
+ `${getWineryEndpoint()}/servicetemplates/${serviceTemplateAddress}xml`,
+ {
+ method: "GET",
+ headers: {
+ Accept: "application/xml",
+ },
+ }
+ );
+ return response.json();
}
export async function insertTopNodeTag(serviceTemplateAddress, nodeTypeQName) {
- const tag = {
- name: "top-node",
- value: nodeTypeQName.split(/}(.*)/s)[1],
- };
- const response = await fetch(getWineryEndpoint() + '/servicetemplates/' + serviceTemplateAddress + "tags/", {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json',
- 'Accept': '*/*'
- },
- body: JSON.stringify(tag)
- });
- return response.text();
+ const tag = {
+ name: "top-node",
+ value: nodeTypeQName.split(/}(.*)/s)[1],
+ };
+ const response = await fetch(
+ getWineryEndpoint() +
+ "/servicetemplates/" +
+ serviceTemplateAddress +
+ "tags/",
+ {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "*/*",
+ },
+ body: JSON.stringify(tag),
+ }
+ );
+ return response.text();
}
-export async function createServiceTemplateWithNodeAndArtifact(name, nodeTypeQName, nodeName, artifactTemplateQName, artifactName, artifactTypeQName) {
- const serviceTemplateAddress = await createServiceTemplate(name);
- await addNodeWithArtifactToServiceTemplate(serviceTemplateAddress, nodeTypeQName, nodeName, artifactTemplateQName, artifactName, artifactTypeQName);
- return serviceTemplateAddress;
+export async function createServiceTemplateWithNodeAndArtifact(
+ name,
+ nodeTypeQName,
+ nodeName,
+ artifactTemplateQName,
+ artifactName,
+ artifactTypeQName
+) {
+ const serviceTemplateAddress = await createServiceTemplate(name);
+ await addNodeWithArtifactToServiceTemplate(
+ serviceTemplateAddress,
+ nodeTypeQName,
+ nodeName,
+ artifactTemplateQName,
+ artifactName,
+ artifactTypeQName
+ );
+ return serviceTemplateAddress;
}
export async function getArtifactTemplateInfo(artifactTemplateAddress) {
- const response = await fetch(`${getWineryEndpoint()}/artifacttemplates/${artifactTemplateAddress}`, {
- method: 'GET',
- headers: {
- 'Accept': 'application/json'
- }
- });
- return response.json();
+ const response = await fetch(
+ `${getWineryEndpoint()}/artifacttemplates/${artifactTemplateAddress}`,
+ {
+ method: "GET",
+ headers: {
+ Accept: "application/json",
+ },
+ }
+ );
+ return response.json();
}
const nodeTypeQNameMapping = new Map([
- ['{http://opentosca.org/artifacttypes}WAR', '{http://opentosca.org/nodetypes}TomcatApplication_WAR-w1'],
- ['{http://opentosca.org/artifacttypes}WAR17', '{http://opentosca.org/nodetypes}TomcatApplication_WAR-w1'],
- ['{http://opentosca.org/artifacttypes}WAR8', '{http://opentosca.org/nodetypes}TomcatApplication_WAR-w1'],
- ['{http://opentosca.org/artifacttypes}PythonArchiveArtifact', '{http://opentosca.org/nodetypes}PythonApp_3-w1'],
+ [
+ "{http://opentosca.org/artifacttypes}WAR",
+ "{http://opentosca.org/nodetypes}TomcatApplication_WAR-w1",
+ ],
+ [
+ "{http://opentosca.org/artifacttypes}WAR17",
+ "{http://opentosca.org/nodetypes}TomcatApplication_WAR-w1",
+ ],
+ [
+ "{http://opentosca.org/artifacttypes}WAR8",
+ "{http://opentosca.org/nodetypes}TomcatApplication_WAR-w1",
+ ],
+ [
+ "{http://opentosca.org/artifacttypes}PythonArchiveArtifact",
+ "{http://opentosca.org/nodetypes}PythonApp_3-w1",
+ ],
]);
export function getNodeTypeQName(artifactTypeQName) {
- return nodeTypeQNameMapping.get(artifactTypeQName);
+ return nodeTypeQNameMapping.get(artifactTypeQName);
}
export async function loadTopology(deploymentModelUrl) {
- if (deploymentModelUrl.startsWith('{{ wineryEndpoint }}')) {
- deploymentModelUrl = deploymentModelUrl.replace('{{ wineryEndpoint }}', config.getWineryEndpoint());
+ if (deploymentModelUrl.startsWith("{{ wineryEndpoint }}")) {
+ deploymentModelUrl = deploymentModelUrl.replace(
+ "{{ wineryEndpoint }}",
+ config.getWineryEndpoint()
+ );
+ }
+ let topology;
+ let tags;
+ try {
+ topology = await fetch(
+ deploymentModelUrl.replace("?csar", "topologytemplate")
+ ).then((res) => res.json());
+ tags = await fetch(deploymentModelUrl.replace("?csar", "tags")).then(
+ (res) => res.json()
+ );
+ } catch (e) {
+ throw new Error(
+ "An unexpected error occurred during loading the deployments models topology."
+ );
+ }
+ let topNode;
+ const topNodeTag = tags.find((tag) => tag.name === "top-node");
+ if (topNodeTag) {
+ const topNodeId = topNodeTag.value;
+ topNode = topology.nodeTemplates.find(
+ (nodeTemplate) => nodeTemplate.id === topNodeId
+ );
+ if (!topNode) {
+ throw new Error(`Top level node "${topNodeId}" not found.`);
}
- let topology;
- let tags;
- try {
- topology = await fetch(deploymentModelUrl.replace('?csar', 'topologytemplate'))
- .then(res => res.json());
- tags = await fetch(deploymentModelUrl.replace('?csar', 'tags'))
- .then(res => res.json());
-
- } catch (e) {
- throw new Error('An unexpected error occurred during loading the deployments models topology.');
+ } else {
+ let nodes = new Map(
+ topology.nodeTemplates.map((nodeTemplate) => [
+ nodeTemplate.id,
+ nodeTemplate,
+ ])
+ );
+ for (let relationship of topology.relationshipTemplates) {
+ if (relationship.name === "HostedOn") {
+ nodes.delete(relationship.targetElement.ref);
+ }
}
- let topNode;
- const topNodeTag = tags.find(tag => tag.name === "top-node");
- if (topNodeTag) {
- const topNodeId = topNodeTag.value;
- topNode = topology.nodeTemplates.find(nodeTemplate => nodeTemplate.id === topNodeId);
- if (!topNode) {
- throw new Error(`Top level node "${topNodeId}" not found.`);
- }
- } else {
- let nodes = new Map(topology.nodeTemplates.map(nodeTemplate => [nodeTemplate.id, nodeTemplate]));
- for (let relationship of topology.relationshipTemplates) {
- if (relationship.name === "HostedOn") {
- nodes.delete(relationship.targetElement.ref);
- }
- }
- if (nodes.size === 1) {
- topNode = nodes.values().next().value;
- }
- }
- if (!topNode) {
- throw new Error("No top level node found.");
+ if (nodes.size === 1) {
+ topNode = nodes.values().next().value;
}
+ }
+ if (!topNode) {
+ throw new Error("No top level node found.");
+ }
- return {
- topNode,
- nodeTemplates: topology.nodeTemplates,
- relationshipTemplates: topology.relationshipTemplates
- };
-}
\ No newline at end of file
+ return {
+ topNode,
+ nodeTemplates: topology.nodeTemplates,
+ relationshipTemplates: topology.relationshipTemplates,
+ };
+}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config-manager.js b/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config-manager.js
index e9614967..0e11761f 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config-manager.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config-manager.js
@@ -10,7 +10,7 @@
*/
import defaultConfig from "./config";
-import {getPluginConfig} from '../../../editor/plugin/PluginConfigHandler';
+import { getPluginConfig } from "../../../editor/plugin/PluginConfigHandler";
let config = {};
@@ -20,12 +20,13 @@ let config = {};
* @return {string} the currently specified endpoint of the OpenTOSCA container
*/
export function getOpenTOSCAEndpoint() {
- if (config.opentoscaEndpoint === undefined) {
- setOpenTOSCAEndpoint(
- getPluginConfig('opentosca').opentoscaEndpoint
- || defaultConfig.opentoscaEndpoint);
- }
- return config.opentoscaEndpoint;
+ if (config.opentoscaEndpoint === undefined) {
+ setOpenTOSCAEndpoint(
+ getPluginConfig("opentosca").opentoscaEndpoint ||
+ defaultConfig.opentoscaEndpoint
+ );
+ }
+ return config.opentoscaEndpoint;
}
/**
@@ -34,9 +35,9 @@ export function getOpenTOSCAEndpoint() {
* @param opentoscaEndpoint the endpoint of the OpenTOSCA container
*/
export function setOpenTOSCAEndpoint(opentoscaEndpoint) {
- if (opentoscaEndpoint !== null && opentoscaEndpoint !== undefined) {
- config.opentoscaEndpoint = opentoscaEndpoint.replace(/\/$/, '');
- }
+ if (opentoscaEndpoint !== null && opentoscaEndpoint !== undefined) {
+ config.opentoscaEndpoint = opentoscaEndpoint.replace(/\/$/, "");
+ }
}
/**
@@ -45,12 +46,13 @@ export function setOpenTOSCAEndpoint(opentoscaEndpoint) {
* @return {string} the currently specified endpoint of the Winery
*/
export function getWineryEndpoint() {
- if (config.wineryEndpoint === undefined) {
- setWineryEndpoint(
- getPluginConfig('opentosca').wineryEndpoint
- || defaultConfig.wineryEndpoint);
- }
- return config.wineryEndpoint;
+ if (config.wineryEndpoint === undefined) {
+ setWineryEndpoint(
+ getPluginConfig("opentosca").wineryEndpoint ||
+ defaultConfig.wineryEndpoint
+ );
+ }
+ return config.wineryEndpoint;
}
/**
@@ -59,9 +61,9 @@ export function getWineryEndpoint() {
* @param wineryEndpoint the endpoint of the Winery
*/
export function setWineryEndpoint(wineryEndpoint) {
- if (wineryEndpoint !== null && wineryEndpoint !== undefined) {
- config.wineryEndpoint = wineryEndpoint.replace(/\/$/, '');
- }
+ if (wineryEndpoint !== null && wineryEndpoint !== undefined) {
+ config.wineryEndpoint = wineryEndpoint.replace(/\/$/, "");
+ }
}
/**
@@ -69,5 +71,5 @@ export function setWineryEndpoint(wineryEndpoint) {
* by setting this.comfig to an empty js object.
*/
export function resetConfig() {
- config = {};
-}
\ No newline at end of file
+ config = {};
+}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config.js b/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config.js
index 144ee909..9583a281 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/config.js
@@ -11,7 +11,7 @@
// takes either the environment variables or the default values definded in webpack.config
const defaultConfig = {
- opentoscaEndpoint: process.env.OPENTOSCA_ENDPOINT,
- wineryEndpoint: process.env.WINERY_ENDPOINT,
+ opentoscaEndpoint: process.env.OPENTOSCA_ENDPOINT,
+ wineryEndpoint: process.env.WINERY_ENDPOINT,
};
-export default defaultConfig;
\ No newline at end of file
+export default defaultConfig;
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/index.js b/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/index.js
index 3acdba7f..fc12b5a2 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/index.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/framework-config/index.js
@@ -8,7 +8,7 @@
*
* SPDX-License-Identifier: Apache-2.0
*/
-import * as configManager from './config-manager';
+import * as configManager from "./config-manager";
const config = configManager;
export default config;
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/OpenTOSCARenderer.js b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/OpenTOSCARenderer.js
index 40299fda..28861efa 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/OpenTOSCARenderer.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/OpenTOSCARenderer.js
@@ -1,380 +1,462 @@
-import {
- connectRectangles
-} from 'diagram-js/lib/layout/ManhattanLayout';
-
-import {
- createLine,
-} from 'diagram-js/lib/util/RenderUtil';
+import { connectRectangles } from "diagram-js/lib/layout/ManhattanLayout";
-import BpmnRenderer from 'bpmn-js/lib/draw/BpmnRenderer';
-import { getOrientation } from 'diagram-js/lib/layout/LayoutUtil';
+import { createLine } from "diagram-js/lib/util/RenderUtil";
+import BpmnRenderer from "bpmn-js/lib/draw/BpmnRenderer";
+import { getOrientation } from "diagram-js/lib/layout/LayoutUtil";
-import buttonIcon from '../resources/show-deployment-button.svg?raw';
-import {drawTaskSVG} from '../../../editor/util/RenderUtilities';
-import NotificationHandler from '../../../editor/ui/notifications/NotificationHandler';
-import {append as svgAppend, attr as svgAttr, create as svgCreate, select, prepend as svgPrepend} from 'tiny-svg';
-import {query as domQuery} from 'min-dom';
+import buttonIcon from "../resources/show-deployment-button.svg?raw";
+import { drawTaskSVG } from "../../../editor/util/RenderUtilities";
+import NotificationHandler from "../../../editor/ui/notifications/NotificationHandler";
import {
- isSnapped,
- setSnapped,
- topLeft,
- bottomRight
-} from 'diagram-js/lib/features/snapping/SnapUtil';
+ append as svgAppend,
+ attr as svgAttr,
+ create as svgCreate,
+ select,
+ prepend as svgPrepend,
+} from "tiny-svg";
+import { query as domQuery } from "min-dom";
-import {loadTopology} from "../deployment/WineryUtils";
+import { loadTopology } from "../deployment/WineryUtils";
const HIGH_PRIORITY = 14001;
-const SERVICE_TASK_TYPE = 'bpmn:ServiceTask';
-const DEPLOYMENT_GROUP_ID = 'deployment';
-const DEPLOYMENT_REL_MARKER_ID = 'deployment-rel';
+const SERVICE_TASK_TYPE = "bpmn:ServiceTask";
+const DEPLOYMENT_GROUP_ID = "deployment";
+const DEPLOYMENT_REL_MARKER_ID = "deployment-rel";
const NODE_WIDTH = 100;
const NODE_HEIGHT = 60;
const NODE_SHIFT_MARGIN = 10;
const STROKE_STYLE = {
- strokeLinecap: 'round',
- strokeLinejoin: 'round',
- stroke: '#777777',
- strokeWidth: 2,
- strokeDasharray: 4,
+ strokeLinecap: "round",
+ strokeLinejoin: "round",
+ stroke: "#777777",
+ strokeWidth: 2,
+ strokeDasharray: 4,
};
export default class OpenTOSCARenderer extends BpmnRenderer {
- constructor(config, eventBus, styles, pathMap, canvas, textRenderer, commandStack, elementRegistry) {
- super(config, eventBus, styles, pathMap, canvas, textRenderer, HIGH_PRIORITY);
- this.commandStack = commandStack;
- this.elementRegistry = elementRegistry;
- this.styles = styles;
- this.textRenderer = textRenderer;
-
- // snap boundary events
- eventBus.on([
- 'create.move',
- 'create.end',
- 'shape.move.move',
- 'shape.move.end'
- ], 140000, function(event) {
- var context = event.context,
- canExecute = context.canExecute,
- target = context.target;
-
- var canAttach = canExecute && (canExecute === 'attach' || canExecute.attach);
- const isRelevantEvent = context.shape.type === "bpmn:IntermediateThrowEvent" || context.shape.type === "bpmn:BoundaryEvent";
-
- if (canAttach && isRelevantEvent && context.target.businessObject.get('opentosca:deploymentModelUrl') && getOrientation(event, target, -30) === "bottom-right") {
- // Prevent snapping on deployment visualisation toggle button
- event.stopPropagation();
- }
- });
-
- this.openToscaHandlers = {
- [SERVICE_TASK_TYPE]: function (self, parentGfx, element) {
- const task = self.renderer('bpmn:ServiceTask')(parentGfx, element);
- self.maybeAddShowDeploymentModelButton(parentGfx, element);
- return task;
- }
- };
- this.addMarkerDefinition(canvas);
- this.registerShowDeploymentModelHandler();
- this.currentlyShownDeploymentsModels = new Map();
- }
-
- registerShowDeploymentModelHandler() {
- this.commandStack.register("deploymentModel.showAll", {
- execute: ({showDeploymentModel}) => {
- const elementsWithDeploymentModel = this.elementRegistry
- .filter(element => element.businessObject.get('opentosca:deploymentModelUrl'));
- const changed = [];
- for (const element of elementsWithDeploymentModel) {
- const wasShownDeploymentModel = !!element.showDeploymentModel;
- element.showDeploymentModel = showDeploymentModel;
- element.wasShownDeploymentModel = wasShownDeploymentModel;
- if (wasShownDeploymentModel !== showDeploymentModel) {
- changed.push(element);
- }
- }
- return changed;
- },
-
- revert({showDeploymentModel}) {
- return this.execute({showDeploymentModel: !showDeploymentModel});
- }
- });
+ constructor(
+ config,
+ eventBus,
+ styles,
+ pathMap,
+ canvas,
+ textRenderer,
+ commandStack,
+ elementRegistry
+ ) {
+ super(
+ config,
+ eventBus,
+ styles,
+ pathMap,
+ canvas,
+ textRenderer,
+ HIGH_PRIORITY
+ );
+ this.commandStack = commandStack;
+ this.elementRegistry = elementRegistry;
+ this.styles = styles;
+ this.textRenderer = textRenderer;
+
+ // snap boundary events
+ eventBus.on(
+ ["create.move", "create.end", "shape.move.move", "shape.move.end"],
+ 140000,
+ function (event) {
+ var context = event.context,
+ canExecute = context.canExecute,
+ target = context.target;
+
+ var canAttach =
+ canExecute && (canExecute === "attach" || canExecute.attach);
+ const isRelevantEvent =
+ context.shape.type === "bpmn:IntermediateThrowEvent" ||
+ context.shape.type === "bpmn:BoundaryEvent";
+
+ if (
+ canAttach &&
+ isRelevantEvent &&
+ context.target.businessObject.get("opentosca:deploymentModelUrl") &&
+ getOrientation(event, target, -30) === "bottom-right"
+ ) {
+ // Prevent snapping on deployment visualisation toggle button
+ event.stopPropagation();
+ }
+ }
+ );
+
+ this.openToscaHandlers = {
+ [SERVICE_TASK_TYPE]: function (self, parentGfx, element) {
+ const task = self.renderer("bpmn:ServiceTask")(parentGfx, element);
+ self.maybeAddShowDeploymentModelButton(parentGfx, element);
+ return task;
+ },
+ };
+ this.addMarkerDefinition(canvas);
+ this.registerShowDeploymentModelHandler();
+ this.currentlyShownDeploymentsModels = new Map();
+ }
+
+ registerShowDeploymentModelHandler() {
+ this.commandStack.register("deploymentModel.showAll", {
+ execute: ({ showDeploymentModel }) => {
+ const elementsWithDeploymentModel = this.elementRegistry.filter(
+ (element) =>
+ element.businessObject.get("opentosca:deploymentModelUrl")
+ );
+ const changed = [];
+ for (const element of elementsWithDeploymentModel) {
+ const wasShownDeploymentModel = !!element.showDeploymentModel;
+ element.showDeploymentModel = showDeploymentModel;
+ element.wasShownDeploymentModel = wasShownDeploymentModel;
+ if (wasShownDeploymentModel !== showDeploymentModel) {
+ changed.push(element);
+ }
+ }
+ return changed;
+ },
+
+ revert({ showDeploymentModel }) {
+ return this.execute({ showDeploymentModel: !showDeploymentModel });
+ },
+ });
+
+ this.commandStack.register("deploymentModel.show", {
+ execute: ({ element, showDeploymentModel }) => {
+ const wasShownDeploymentModel = !!element.showDeploymentModel;
+ element.showDeploymentModel = showDeploymentModel;
+ element.wasShownDeploymentModel = wasShownDeploymentModel;
+ if (wasShownDeploymentModel !== showDeploymentModel) {
+ return [element];
+ }
+ return [];
+ },
- this.commandStack.register("deploymentModel.show", {
- execute: ({element, showDeploymentModel}) => {
- const wasShownDeploymentModel = !!element.showDeploymentModel;
- element.showDeploymentModel = showDeploymentModel;
- element.wasShownDeploymentModel = wasShownDeploymentModel;
- if (wasShownDeploymentModel !== showDeploymentModel) {
- return [element];
- }
- return [];
- },
-
- revert({element, showDeploymentModel}) {
- return this.execute({element, showDeploymentModel: !showDeploymentModel});
- }
+ revert({ element, showDeploymentModel }) {
+ return this.execute({
+ element,
+ showDeploymentModel: !showDeploymentModel,
});
+ },
+ });
+ }
+
+ addMarkerDefinition(canvas) {
+ const marker = svgCreate("marker", {
+ id: DEPLOYMENT_REL_MARKER_ID,
+ viewBox: "0 0 8 8",
+ refX: 8,
+ refY: 4,
+ markerWidth: 8,
+ markerHeight: 8,
+ orient: "auto",
+ });
+ svgAppend(
+ marker,
+ svgCreate("path", {
+ d: "M 0 0 L 8 4 L 0 8",
+ ...this.styles.computeStyle({}, ["no-fill"], {
+ ...STROKE_STYLE,
+ strokeWidth: 1,
+ strokeDasharray: 2,
+ }),
+ })
+ );
+
+ let defs = domQuery("defs", canvas._svg);
+ if (!defs) {
+ defs = svgCreate("defs");
+
+ svgPrepend(canvas._svg, defs);
}
-
- addMarkerDefinition(canvas) {
- const marker = svgCreate('marker', {
- id: DEPLOYMENT_REL_MARKER_ID,
- viewBox: '0 0 8 8',
- refX: 8,
- refY: 4,
- markerWidth: 8,
- markerHeight: 8,
- orient: 'auto'
- });
- svgAppend(marker, svgCreate('path', {
- d: 'M 0 0 L 8 4 L 0 8',
- ...this.styles.computeStyle({}, ['no-fill'], {
- ...STROKE_STYLE,
- strokeWidth: 1,
- strokeDasharray: 2
- })
- }));
-
- let defs = domQuery('defs', canvas._svg);
- if (!defs) {
- defs = svgCreate('defs');
-
- svgPrepend(canvas._svg, defs);
- }
- svgAppend(defs, marker);
+ svgAppend(defs, marker);
+ }
+
+ maybeAddShowDeploymentModelButton(parentGfx, element) {
+ let deploymentModelUrl = element.businessObject.get(
+ "opentosca:deploymentModelUrl"
+ );
+ if (!deploymentModelUrl) return;
+
+ const button = drawTaskSVG(
+ parentGfx,
+ {
+ transform: "matrix(0.3, 0, 0, 0.3, 85, 65)",
+ svg: buttonIcon,
+ },
+ null,
+ true
+ );
+ button.style["pointer-events"] = "all";
+ button.style["cursor"] = "pointer";
+ button.addEventListener("click", (e) => {
+ e.preventDefault();
+ element.deploymentModelTopology = undefined;
+ this.commandStack.execute("deploymentModel.show", {
+ element: element,
+ showDeploymentModel: !element.showDeploymentModel,
+ });
+ });
+ if (element.showDeploymentModel) {
+ this.showDeploymentModel(parentGfx, element, deploymentModelUrl);
+ } else {
+ this.removeDeploymentModel(parentGfx, element);
}
-
- maybeAddShowDeploymentModelButton(parentGfx, element) {
- let deploymentModelUrl = element.businessObject.get('opentosca:deploymentModelUrl');
- if (!deploymentModelUrl) return;
-
- const button = drawTaskSVG(parentGfx, {
- transform: 'matrix(0.3, 0, 0, 0.3, 85, 65)',
- svg: buttonIcon
- }, null, true);
- button.style['pointer-events'] = 'all';
- button.style['cursor'] = 'pointer';
- button.addEventListener('click', (e) => {
- e.preventDefault();
- element.deploymentModelTopology = undefined;
- this.commandStack.execute("deploymentModel.show", {
- element: element,
- showDeploymentModel: !element.showDeploymentModel
- });
+ }
+
+ async showDeploymentModel(parentGfx, element, deploymentModelUrl) {
+ if (
+ !element.deploymentModelTopology ||
+ element.loadedDeploymentModelUrl !== deploymentModelUrl
+ ) {
+ try {
+ const topology = await loadTopology(deploymentModelUrl);
+ element.loadedDeploymentModelUrl = deploymentModelUrl;
+ element.deploymentModelTopology = topology;
+ } catch (e) {
+ element.showDeploymentModel = false;
+ element.loadedDeploymentModelUrl = null;
+ element.deploymentModelTopology = null;
+ this.removeDeploymentModel(parentGfx, element);
+ console.error(e);
+ NotificationHandler.getInstance().displayNotification({
+ type: "warning",
+ title: "Could not load topology",
+ content: e.message,
+ duration: 2000,
});
- if (element.showDeploymentModel) {
- this.showDeploymentModel(parentGfx, element, deploymentModelUrl);
- } else {
- this.removeDeploymentModel(parentGfx, element);
- }
+ return;
+ }
}
-
- async showDeploymentModel(parentGfx, element, deploymentModelUrl) {
- if (!element.deploymentModelTopology || element.loadedDeploymentModelUrl !== deploymentModelUrl) {
- try {
- const topology = await loadTopology(deploymentModelUrl);
- element.loadedDeploymentModelUrl = deploymentModelUrl;
- element.deploymentModelTopology = topology;
- } catch (e) {
- element.showDeploymentModel = false;
- element.loadedDeploymentModelUrl = null;
- element.deploymentModelTopology = null;
- this.removeDeploymentModel(parentGfx, element);
- console.error(e);
- NotificationHandler.getInstance().displayNotification({
- type: 'warning',
- title: 'Could not load topology',
- content: e.message,
- duration: 2000
- });
- return;
- }
- }
- const groupDef = svgCreate('g', {id: DEPLOYMENT_GROUP_ID});
- parentGfx.append(groupDef);
-
- const {nodeTemplates, relationshipTemplates, topNode} = element.deploymentModelTopology;
-
- let ySubtract = parseInt(topNode.y);
- let xSubtract = parseInt(topNode.x);
-
- const positions = new Map();
- for (let nodeTemplate of nodeTemplates) {
- const position = {
- x: (parseInt(nodeTemplate.x) - xSubtract) / 1.4,
- y: (parseInt(nodeTemplate.y) - ySubtract) / 1.4,
- };
-
- positions.set(nodeTemplate.id, position);
- if (nodeTemplate.id !== topNode.id) {
- this.drawNodeTemplate(groupDef, nodeTemplate, position);
- }
- }
- const boundingBox = {
- left: Math.min(...[...positions.values()].map(p => p.x)) + element.x,
- top: Math.min(...[...positions.values()].map(p => p.y)) + element.y,
- right: Math.max(...[...positions.values()].map(p => p.x)) + NODE_WIDTH + element.x,
- bottom: Math.max(...[...positions.values()].map(p => p.y)) + NODE_HEIGHT + element.y
- };
-
- const previousBoundingBox = this.currentlyShownDeploymentsModels.get(element.id)?.boundingBox;
- if (JSON.stringify(previousBoundingBox) !== JSON.stringify(boundingBox)) {
- this.mayBeMoveNeighborNodes(boundingBox, element);
- }
-
- this.currentlyShownDeploymentsModels.set(element.id, {
- boundingBox
- });
-
- for (let relationshipTemplate of relationshipTemplates) {
- const start = positions.get(relationshipTemplate.sourceElement.ref);
- const end = positions.get(relationshipTemplate.targetElement.ref);
- this.drawRelationship(groupDef,
- start, relationshipTemplate.sourceElement.ref === topNode.id,
- end, relationshipTemplate.targetElement.ref === topNode.id);
- }
+ const groupDef = svgCreate("g", { id: DEPLOYMENT_GROUP_ID });
+ parentGfx.append(groupDef);
+
+ const { nodeTemplates, relationshipTemplates, topNode } =
+ element.deploymentModelTopology;
+
+ let ySubtract = parseInt(topNode.y);
+ let xSubtract = parseInt(topNode.x);
+
+ const positions = new Map();
+ for (let nodeTemplate of nodeTemplates) {
+ const position = {
+ x: (parseInt(nodeTemplate.x) - xSubtract) / 1.4,
+ y: (parseInt(nodeTemplate.y) - ySubtract) / 1.4,
+ };
+
+ positions.set(nodeTemplate.id, position);
+ if (nodeTemplate.id !== topNode.id) {
+ this.drawNodeTemplate(groupDef, nodeTemplate, position);
+ }
}
-
- mayBeMoveNeighborNodes(newBoundingBox, element) {
- let shifts = {
- right: 0,
- left: 0,
- };
- for (const [otherElementId, otherDeploymentModel] of this.currentlyShownDeploymentsModels.entries()) {
- if (otherElementId === element.id) continue;
- const otherBoundingBox = otherDeploymentModel.boundingBox;
- if (newBoundingBox.left < otherBoundingBox.right && newBoundingBox.right > otherBoundingBox.left &&
- newBoundingBox.top < otherBoundingBox.bottom && newBoundingBox.bottom > otherBoundingBox.top) {
- const distRightShift = newBoundingBox.right - otherBoundingBox.left - shifts.right;
- const distLeftShift = otherBoundingBox.right - newBoundingBox.left - shifts.left;
-
- if (distRightShift < distLeftShift && distRightShift > 0) {
- shifts.right += distRightShift;
- } else if (distLeftShift < distRightShift && distLeftShift > 0) {
- shifts.left += distLeftShift;
- }
- }
- }
-
- const allElements = this.elementRegistry.getAll();
- const commands = [];
-
- if (shifts.right || shifts.left) {
- const xPosition = (newBoundingBox.left + newBoundingBox.right) / 2;
- for (const otherElement of allElements) {
- let otherXPosition = element.x + NODE_WIDTH / 2;
- const otherElementBoundingBox = this.currentlyShownDeploymentsModels.get(otherElement.id)?.boundingBox;
- if (otherElementBoundingBox) {
- otherXPosition = (otherElementBoundingBox.left + otherElementBoundingBox.right) / 2;
- }
- let xShift;
- if (shifts.right && otherXPosition >= xPosition && otherElement.id !== element.id) {
- xShift = shifts.right + NODE_SHIFT_MARGIN;
- } else if (shifts.left && otherXPosition <= xPosition && otherElement.id !== element.id) {
- xShift = -shifts.left - NODE_SHIFT_MARGIN;
- } else {
- continue;
- }
- // Can not move elements without parent
- if(!otherElement.parent) continue;
- commands.push({
- cmd: 'shape.move',
- context: {
- shape: otherElement,
- hints: {},
- delta: {x: xShift, y: 0}
- }
- });
- if (otherElementBoundingBox) {
- otherElementBoundingBox.left += xShift;
- otherElementBoundingBox.right += xShift;
- }
- }
- }
-
- if (commands.length > 0) {
- this.commandStack.execute('properties-panel.multi-command-executor', commands);
- }
+ const boundingBox = {
+ left: Math.min(...[...positions.values()].map((p) => p.x)) + element.x,
+ top: Math.min(...[...positions.values()].map((p) => p.y)) + element.y,
+ right:
+ Math.max(...[...positions.values()].map((p) => p.x)) +
+ NODE_WIDTH +
+ element.x,
+ bottom:
+ Math.max(...[...positions.values()].map((p) => p.y)) +
+ NODE_HEIGHT +
+ element.y,
+ };
+
+ const previousBoundingBox = this.currentlyShownDeploymentsModels.get(
+ element.id
+ )?.boundingBox;
+ if (JSON.stringify(previousBoundingBox) !== JSON.stringify(boundingBox)) {
+ this.mayBeMoveNeighborNodes(boundingBox, element);
}
- removeDeploymentModel(parentGfx, element) {
- this.currentlyShownDeploymentsModels.delete(element.id);
- const group = select(parentGfx, '#' + DEPLOYMENT_GROUP_ID);
- if (group) {
- group.remove();
- }
+ this.currentlyShownDeploymentsModels.set(element.id, {
+ boundingBox,
+ });
+
+ for (let relationshipTemplate of relationshipTemplates) {
+ const start = positions.get(relationshipTemplate.sourceElement.ref);
+ const end = positions.get(relationshipTemplate.targetElement.ref);
+ this.drawRelationship(
+ groupDef,
+ start,
+ relationshipTemplate.sourceElement.ref === topNode.id,
+ end,
+ relationshipTemplate.targetElement.ref === topNode.id
+ );
}
-
- drawRelationship(parentGfx, start, startIsToplevel, end, endIsToplevel) {
- const line = createLine(connectRectangles({
- width: NODE_WIDTH,
- height: startIsToplevel ? 80 : NODE_HEIGHT,
- ...start
- }, {
- width: NODE_WIDTH,
- height: endIsToplevel ? 80 : NODE_HEIGHT,
- ...end
- }), this.styles.computeStyle({}, ['no-fill'], {
- ...STROKE_STYLE,
- markerEnd: `url(#${DEPLOYMENT_REL_MARKER_ID})`
- }), 5);
- parentGfx.prepend(line);
+ }
+
+ mayBeMoveNeighborNodes(newBoundingBox, element) {
+ let shifts = {
+ right: 0,
+ left: 0,
+ };
+ for (const [
+ otherElementId,
+ otherDeploymentModel,
+ ] of this.currentlyShownDeploymentsModels.entries()) {
+ if (otherElementId === element.id) continue;
+ const otherBoundingBox = otherDeploymentModel.boundingBox;
+ if (
+ newBoundingBox.left < otherBoundingBox.right &&
+ newBoundingBox.right > otherBoundingBox.left &&
+ newBoundingBox.top < otherBoundingBox.bottom &&
+ newBoundingBox.bottom > otherBoundingBox.top
+ ) {
+ const distRightShift =
+ newBoundingBox.right - otherBoundingBox.left - shifts.right;
+ const distLeftShift =
+ otherBoundingBox.right - newBoundingBox.left - shifts.left;
+
+ if (distRightShift < distLeftShift && distRightShift > 0) {
+ shifts.right += distRightShift;
+ } else if (distLeftShift < distRightShift && distLeftShift > 0) {
+ shifts.left += distLeftShift;
+ }
+ }
}
- drawNodeTemplate(parentGfx, nodeTemplate, position) {
- const groupDef = svgCreate('g');
- svgAttr(groupDef, {transform: `matrix(1, 0, 0, 1, ${position.x.toFixed(2)}, ${position.y.toFixed(2)})`});
- const rect = svgCreate('rect', {
- width: NODE_WIDTH,
- height: NODE_HEIGHT,
- fill: '#DDDDDD',
- ...STROKE_STYLE
- });
-
- svgAppend(groupDef, rect);
-
- const text = this.textRenderer.createText(nodeTemplate.name, {
- box: {
- width: NODE_WIDTH,
- height: NODE_HEIGHT,
- },
- align: 'center-middle'
+ const allElements = this.elementRegistry.getAll();
+ const commands = [];
+
+ if (shifts.right || shifts.left) {
+ const xPosition = (newBoundingBox.left + newBoundingBox.right) / 2;
+ for (const otherElement of allElements) {
+ let otherXPosition = element.x + NODE_WIDTH / 2;
+ const otherElementBoundingBox =
+ this.currentlyShownDeploymentsModels.get(
+ otherElement.id
+ )?.boundingBox;
+ if (otherElementBoundingBox) {
+ otherXPosition =
+ (otherElementBoundingBox.left + otherElementBoundingBox.right) / 2;
+ }
+ let xShift;
+ if (
+ shifts.right &&
+ otherXPosition >= xPosition &&
+ otherElement.id !== element.id
+ ) {
+ xShift = shifts.right + NODE_SHIFT_MARGIN;
+ } else if (
+ shifts.left &&
+ otherXPosition <= xPosition &&
+ otherElement.id !== element.id
+ ) {
+ xShift = -shifts.left - NODE_SHIFT_MARGIN;
+ } else {
+ continue;
+ }
+ // Can not move elements without parent
+ if (!otherElement.parent) continue;
+ commands.push({
+ cmd: "shape.move",
+ context: {
+ shape: otherElement,
+ hints: {},
+ delta: { x: xShift, y: 0 },
+ },
});
- svgAppend(groupDef, text);
- parentGfx.append(groupDef);
+ if (otherElementBoundingBox) {
+ otherElementBoundingBox.left += xShift;
+ otherElementBoundingBox.right += xShift;
+ }
+ }
}
- renderer(type) {
- return this.handlers[type];
+ if (commands.length > 0) {
+ this.commandStack.execute(
+ "properties-panel.multi-command-executor",
+ commands
+ );
}
+ }
- canRender(element) {
- // only return true if handler for rendering is registered
- return this.openToscaHandlers[element.type];
+ removeDeploymentModel(parentGfx, element) {
+ this.currentlyShownDeploymentsModels.delete(element.id);
+ const group = select(parentGfx, "#" + DEPLOYMENT_GROUP_ID);
+ if (group) {
+ group.remove();
}
-
- drawShape(parentNode, element) {
- if (element.type in this.openToscaHandlers) {
- const h = this.openToscaHandlers[element.type];
- return h(this, parentNode, element);
+ }
+
+ drawRelationship(parentGfx, start, startIsToplevel, end, endIsToplevel) {
+ const line = createLine(
+ connectRectangles(
+ {
+ width: NODE_WIDTH,
+ height: startIsToplevel ? 80 : NODE_HEIGHT,
+ ...start,
+ },
+ {
+ width: NODE_WIDTH,
+ height: endIsToplevel ? 80 : NODE_HEIGHT,
+ ...end,
}
- return super.drawShape(parentNode, element);
+ ),
+ this.styles.computeStyle({}, ["no-fill"], {
+ ...STROKE_STYLE,
+ markerEnd: `url(#${DEPLOYMENT_REL_MARKER_ID})`,
+ }),
+ 5
+ );
+ parentGfx.prepend(line);
+ }
+
+ drawNodeTemplate(parentGfx, nodeTemplate, position) {
+ const groupDef = svgCreate("g");
+ svgAttr(groupDef, {
+ transform: `matrix(1, 0, 0, 1, ${position.x.toFixed(
+ 2
+ )}, ${position.y.toFixed(2)})`,
+ });
+ const rect = svgCreate("rect", {
+ width: NODE_WIDTH,
+ height: NODE_HEIGHT,
+ fill: "#DDDDDD",
+ ...STROKE_STYLE,
+ });
+
+ svgAppend(groupDef, rect);
+
+ const text = this.textRenderer.createText(nodeTemplate.name, {
+ box: {
+ width: NODE_WIDTH,
+ height: NODE_HEIGHT,
+ },
+ align: "center-middle",
+ });
+ svgAppend(groupDef, text);
+ parentGfx.append(groupDef);
+ }
+
+ renderer(type) {
+ return this.handlers[type];
+ }
+
+ canRender(element) {
+ // only return true if handler for rendering is registered
+ return this.openToscaHandlers[element.type];
+ }
+
+ drawShape(parentNode, element) {
+ if (element.type in this.openToscaHandlers) {
+ const h = this.openToscaHandlers[element.type];
+ return h(this, parentNode, element);
}
+ return super.drawShape(parentNode, element);
+ }
}
OpenTOSCARenderer.$inject = [
- 'config',
- 'eventBus',
- 'styles',
- 'pathMap',
- 'canvas',
- 'textRenderer',
- 'commandStack',
- 'elementRegistry'
+ "config",
+ "eventBus",
+ "styles",
+ "pathMap",
+ "canvas",
+ "textRenderer",
+ "commandStack",
+ "elementRegistry",
];
-
-
-
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/index.js b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/index.js
index 814c71ca..bc61a866 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/index.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/index.js
@@ -8,11 +8,11 @@
*
* SPDX-License-Identifier: Apache-2.0
*/
-import ServiceTaskPropertiesProvider from './properties-provider/ServiceTaskPropertiesProvider'
-import OpenTOSCARenderer from './OpenTOSCARenderer';
+import ServiceTaskPropertiesProvider from "./properties-provider/ServiceTaskPropertiesProvider";
+import OpenTOSCARenderer from "./OpenTOSCARenderer";
export default {
- __init__: ['openToscaRenderer', 'serviceTaskPropertyProvider'],
- openToscaRenderer: ['type', OpenTOSCARenderer],
- serviceTaskPropertyProvider: ['type', ServiceTaskPropertiesProvider],
+ __init__: ["openToscaRenderer", "serviceTaskPropertyProvider"],
+ openToscaRenderer: ["type", OpenTOSCARenderer],
+ serviceTaskPropertyProvider: ["type", ServiceTaskPropertiesProvider],
};
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUpload.js b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUpload.js
index df10dcb5..49b30800 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUpload.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUpload.js
@@ -1,29 +1,34 @@
-import {HeaderButton} from '@bpmn-io/properties-panel';
-import React from 'react';
-import ArtifactModal from './ArtifactUploadModal';
-import {createRoot} from 'react-dom/client';
-import './artifact-modal.css';
-import {useService} from "bpmn-js-properties-panel";
+import { HeaderButton } from "@bpmn-io/properties-panel";
+import React from "react";
+import ArtifactModal from "./ArtifactUploadModal";
+import { createRoot } from "react-dom/client";
+import "./artifact-modal.css";
+import { useService } from "bpmn-js-properties-panel";
/**
* Entry to display the button which opens the Artifact Upload modal
*/
export function ArtifactUpload(props) {
- const {translate, element} = props;
- const commandStack = useService('commandStack');
+ const { translate, element } = props;
+ const commandStack = useService("commandStack");
+ const onClick = () => {
+ const root = createRoot(document.getElementById("modal-container"));
+ root.render(
+ root.unmount()}
+ element={element}
+ commandStack={commandStack}
+ />
+ );
+ };
- const onClick = () => {
- const root = createRoot(document.getElementById("modal-container"));
- root.render( root.unmount()} element={element} commandStack={commandStack}/>);
- };
-
- return HeaderButton({
- id: 'artifact-upload-button',
- description: translate('Upload Artifact'),
- className: "qwm-artifact-upload-btn",
- children: translate('Upload Artifact'),
- title: translate('Upload Artifact'),
- onClick,
- });
+ return HeaderButton({
+ id: "artifact-upload-button",
+ description: translate("Upload Artifact"),
+ className: "qwm-artifact-upload-btn",
+ children: translate("Upload Artifact"),
+ title: translate("Upload Artifact"),
+ onClick,
+ });
}
diff --git a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUploadModal.js b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUploadModal.js
index 2a818167..62ed7067 100644
--- a/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUploadModal.js
+++ b/components/bpmn-q/modeler-component/extensions/opentosca/modeling/properties-provider/ArtifactUploadModal.js
@@ -10,23 +10,22 @@
*/
/* eslint-disable no-unused-vars */
-import React, {useState} from 'react';
-import Modal from '../../../../editor/ui/modal/Modal';
-import './artifact-modal.css';
-import '../../../../editor/config/config-modal.css';
+import React, { useState } from "react";
+import Modal from "../../../../editor/ui/modal/Modal";
+import "./artifact-modal.css";
+import "../../../../editor/config/config-modal.css";
import {
- createArtifactTemplateWithFile,
- createServiceTemplateWithNodeAndArtifact,
- getNodeTypeQName,
- getArtifactTemplateInfo,
- insertTopNodeTag,
- serviceTemplateExists,
- addNodeWithArtifactToServiceTemplateByName,
- deleteArtifactTemplate
-} from '../../deployment/WineryUtils';
-import NotificationHandler from '../../../../editor/ui/notifications/NotificationHandler';
-import {getWineryEndpoint} from "../../framework-config/config-manager";
-
+ createArtifactTemplateWithFile,
+ createServiceTemplateWithNodeAndArtifact,
+ getNodeTypeQName,
+ getArtifactTemplateInfo,
+ insertTopNodeTag,
+ serviceTemplateExists,
+ addNodeWithArtifactToServiceTemplateByName,
+ deleteArtifactTemplate,
+} from "../../deployment/WineryUtils";
+import NotificationHandler from "../../../../editor/ui/notifications/NotificationHandler";
+import { getWineryEndpoint } from "../../framework-config/config-manager";
// polyfill upcoming structural components
const Title = Modal.Title;
@@ -43,208 +42,270 @@ const Footer = Modal.Footer;
* @returns {JSX.Element} The modal as React component
* @constructor
*/
-export default function ArtifactUploadModal({onClose, element, commandStack}) {
- const [uploadFile, setUploadFile] = useState(null);
- const [textInputDockerImage, setTextInputDockerImage] = useState('');
- const [selectedTab, setSelectedTab] = useState("artifact");
- const [selectedOption, setSelectedOption] = useState("");
- const [selectedOptionName, setSelectedOptionName] = useState("");
- const [artifactTypes, setArtifactTypes] = useState([]);
- const [acceptTypes, setAcceptTypes] = useState('');
-
+export default function ArtifactUploadModal({
+ onClose,
+ element,
+ commandStack,
+}) {
+ const [uploadFile, setUploadFile] = useState(null);
+ const [textInputDockerImage, setTextInputDockerImage] = useState("");
+ const [selectedTab, setSelectedTab] = useState("artifact");
+ const [selectedOption, setSelectedOption] = useState("");
+ const [selectedOptionName, setSelectedOptionName] = useState("");
+ const [artifactTypes, setArtifactTypes] = useState([]);
+ const [acceptTypes, setAcceptTypes] = useState("");
- async function updateArtifactSelect() {
- const response = await fetch(`${getWineryEndpoint()}/artifacttypes/?includeVersions=true`, {
- headers: {
- 'Accept': 'application/json',
- },
- }).then(res => res.json());
+ async function updateArtifactSelect() {
+ const response = await fetch(
+ `${getWineryEndpoint()}/artifacttypes/?includeVersions=true`,
+ {
+ headers: {
+ Accept: "application/json",
+ },
+ }
+ ).then((res) => res.json());
- const artifactTypes = response
- .filter(option => option.name.includes("WAR") || option.name.includes("PythonArchive"));
- setArtifactTypes(artifactTypes);
- }
+ const artifactTypes = response.filter(
+ (option) =>
+ option.name.includes("WAR") || option.name.includes("PythonArchive")
+ );
+ setArtifactTypes(artifactTypes);
+ }
- const allowedFileTypes = {
- zip: '.tar.gz',
- war: '.war',
- };
+ const allowedFileTypes = {
+ zip: ".tar.gz",
+ war: ".war",
+ };
- async function createServiceTemplate() {
- const {close: closeNotification} = NotificationHandler.getInstance().displayNotification({
- type: 'info',
- title: 'Uploading Artifact...',
- content: 'Uploading artifact for ' + element.id,
- duration: 1000 * 60 * 60 // very long time out because this notification gets closed after the API calls are finished
- });
- let serviceTemplateAddress;
- let doesExist = false;
- try {
- const namePrefix = element.businessObject.name ?? "";
- const artifactTemplateName = `${namePrefix}ArtifactTemplate-${element.id}`;
- await deleteArtifactTemplate(artifactTemplateName);
- const artifactTemplateAddress = await createArtifactTemplateWithFile(artifactTemplateName, selectedOption, uploadFile);
- const artifactTemplateInfo = await getArtifactTemplateInfo(artifactTemplateAddress);
- const artifactTemplateQName = artifactTemplateInfo.serviceTemplateOrNodeTypeOrNodeTypeImplementation[0].type;
- const nodeTypeQName = getNodeTypeQName(selectedOption);
- const serviceTemplateName = `${namePrefix}ServiceTemplate-${element.id}`;
- const doesExist = await serviceTemplateExists(serviceTemplateName);
- if(doesExist) {
- serviceTemplateAddress = await addNodeWithArtifactToServiceTemplateByName(serviceTemplateName, nodeTypeQName,
- `${namePrefix}Node-${element.id}`, artifactTemplateQName,
- `${namePrefix}Artifact-${element.id}`, selectedOption);
- } else {
- serviceTemplateAddress = await createServiceTemplateWithNodeAndArtifact(serviceTemplateName, nodeTypeQName,
- `${namePrefix}Node-${element.id}`, artifactTemplateQName,
- `${namePrefix}Artifact-${element.id}`, selectedOption);
- }
- await insertTopNodeTag(serviceTemplateAddress, nodeTypeQName);
- } catch (e) {
- setTimeout(closeNotification, 1);
- NotificationHandler.getInstance().displayNotification({
- type: 'error',
- title: 'Service Template Creation failed',
- content: 'Service Template could not be created due to an internal error.',
- duration: 2000
- });
- return;
- }
- const deploymentModelUrl = `{{ wineryEndpoint }}/servicetemplates/${serviceTemplateAddress}?csar`;
- commandStack.execute('element.updateModdleProperties', {
- element,
- moddleElement: element.businessObject,
- properties: {
- 'opentosca:deploymentModelUrl': deploymentModelUrl
- }
- });
- setTimeout(closeNotification, 1);
- const content = doesExist ? 'updated' : 'created';
- NotificationHandler.getInstance().displayNotification({
- type: 'info',
- title: 'Service Template ' + content.charAt(0).toUpperCase() + content.slice(1),
- content: 'Service Template including Nodetype with attached Deployment Artifact of chosen type was successfully ' + content + '.',
- duration: 4000
- });
+ async function createServiceTemplate() {
+ const { close: closeNotification } =
+ NotificationHandler.getInstance().displayNotification({
+ type: "info",
+ title: "Uploading Artifact...",
+ content: "Uploading artifact for " + element.id,
+ duration: 1000 * 60 * 60, // very long time out because this notification gets closed after the API calls are finished
+ });
+ let serviceTemplateAddress;
+ let doesExist = false;
+ try {
+ const namePrefix = element.businessObject.name ?? "";
+ const artifactTemplateName = `${namePrefix}ArtifactTemplate-${element.id}`;
+ await deleteArtifactTemplate(artifactTemplateName);
+ const artifactTemplateAddress = await createArtifactTemplateWithFile(
+ artifactTemplateName,
+ selectedOption,
+ uploadFile
+ );
+ const artifactTemplateInfo = await getArtifactTemplateInfo(
+ artifactTemplateAddress
+ );
+ const artifactTemplateQName =
+ artifactTemplateInfo
+ .serviceTemplateOrNodeTypeOrNodeTypeImplementation[0].type;
+ const nodeTypeQName = getNodeTypeQName(selectedOption);
+ const serviceTemplateName = `${namePrefix}ServiceTemplate-${element.id}`;
+ const doesExist = await serviceTemplateExists(serviceTemplateName);
+ if (doesExist) {
+ serviceTemplateAddress =
+ await addNodeWithArtifactToServiceTemplateByName(
+ serviceTemplateName,
+ nodeTypeQName,
+ `${namePrefix}Node-${element.id}`,
+ artifactTemplateQName,
+ `${namePrefix}Artifact-${element.id}`,
+ selectedOption
+ );
+ } else {
+ serviceTemplateAddress = await createServiceTemplateWithNodeAndArtifact(
+ serviceTemplateName,
+ nodeTypeQName,
+ `${namePrefix}Node-${element.id}`,
+ artifactTemplateQName,
+ `${namePrefix}Artifact-${element.id}`,
+ selectedOption
+ );
+ }
+ await insertTopNodeTag(serviceTemplateAddress, nodeTypeQName);
+ } catch (e) {
+ setTimeout(closeNotification, 1);
+ NotificationHandler.getInstance().displayNotification({
+ type: "error",
+ title: "Service Template Creation failed",
+ content:
+ "Service Template could not be created due to an internal error.",
+ duration: 2000,
+ });
+ return;
}
+ const deploymentModelUrl = `{{ wineryEndpoint }}/servicetemplates/${serviceTemplateAddress}?csar`;
+ commandStack.execute("element.updateModdleProperties", {
+ element,
+ moddleElement: element.businessObject,
+ properties: {
+ "opentosca:deploymentModelUrl": deploymentModelUrl,
+ },
+ });
+ setTimeout(closeNotification, 1);
+ const content = doesExist ? "updated" : "created";
+ NotificationHandler.getInstance().displayNotification({
+ type: "info",
+ title:
+ "Service Template " +
+ content.charAt(0).toUpperCase() +
+ content.slice(1),
+ content:
+ "Service Template including Nodetype with attached Deployment Artifact of chosen type was successfully " +
+ content +
+ ".",
+ duration: 4000,
+ });
+ }
+ const onSubmit = async () => {
+ // Process the uploaded file or text input here
+ console.log("Uploaded file:", uploadFile);
+ console.log("Text input:", textInputDockerImage);
+ if (selectedTab === "artifact") {
+ if (uploadFile !== null && selectedOption !== "") {
+ onClose();
+ await createServiceTemplate();
+ } else {
+ onClose();
+ setTimeout(function () {
+ NotificationHandler.getInstance().displayNotification({
+ type: "error",
+ title: "No file selected!",
+ content: "Please select a file to create an artifact!",
+ duration: 4000,
+ });
+ }, 300);
+ }
+ }
+ };
- const onSubmit = async () => {
- // Process the uploaded file or text input here
- console.log('Uploaded file:', uploadFile);
- console.log('Text input:', textInputDockerImage);
- if (selectedTab === "artifact") {
- if (uploadFile !== null && selectedOption !== "") {
- onClose();
- await createServiceTemplate();
- } else {
- onClose();
- setTimeout(function () {
- NotificationHandler.getInstance().displayNotification({
- type: 'error',
- title: 'No file selected!',
- content: 'Please select a file to create an artifact!',
- duration: 4000
- });
- }, 300);
-
- }
- }
- };
-
- const handleOptionChange = (e) => {
- const {value} = e.target;
- setSelectedOption(value);
- setSelectedOptionName(artifactTypes.find(x => x.qName === value).name);
- if (value.includes("WAR")) {
- setAcceptTypes(allowedFileTypes.war);
- } else if (value.includes("PythonArchive")) {
- setAcceptTypes(allowedFileTypes.zip);
- }
- };
-
- const isOptionSelected = selectedOption !== "";
-
- if (artifactTypes.length === 0) {
- updateArtifactSelect();
+ const handleOptionChange = (e) => {
+ const { value } = e.target;
+ setSelectedOption(value);
+ setSelectedOptionName(artifactTypes.find((x) => x.qName === value).name);
+ if (value.includes("WAR")) {
+ setAcceptTypes(allowedFileTypes.war);
+ } else if (value.includes("PythonArchive")) {
+ setAcceptTypes(allowedFileTypes.zip);
}
+ };
+ const isOptionSelected = selectedOption !== "";
- return (
-
- Artifact Upload
+ if (artifactTypes.length === 0) {
+ updateArtifactSelect();
+ }
-
-
-
-
setSelectedTab("artifact")}
- >
- Local File
-
-
setSelectedTab("docker")}
- style={{display: "none"}}
- >
- Docker Image
-
-
+ return (
+
+ Artifact Upload
- {selectedTab === "artifact" && (
-
-
-
- Select an Option:
-
- -- Select --
- {artifactTypes.map(option => {option.name} )}
-
-
- {isOptionSelected && (
-
-
- {`Upload ${selectedOptionName.charAt(0).toUpperCase() + selectedOptionName.slice(1)}:`}
-
-
- )}
-
-
- Image ID:
-
- )}
-
+
+
setSelectedTab("artifact")}
+ >
+ Local File
+
+
setSelectedTab("docker")}
+ style={{ display: "none" }}
+ >
+ Docker Image
+
+
-