From 6d9c4d285d3c47bd42ca90287d04c30b586ed3ef Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:03:29 +0200 Subject: [PATCH 01/33] START move bpmn-rendering.js --- dev/public/bpmn-rendering.html | 2 +- dev/{public/static/js => ts/pages}/bpmn-rendering.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename dev/{public/static/js => ts/pages}/bpmn-rendering.js (96%) diff --git a/dev/public/bpmn-rendering.html b/dev/public/bpmn-rendering.html index 59aa39bfe9..d7e5c83b31 100644 --- a/dev/public/bpmn-rendering.html +++ b/dev/public/bpmn-rendering.html @@ -18,7 +18,7 @@ font-weight: bold; } - +
diff --git a/dev/public/static/js/bpmn-rendering.js b/dev/ts/pages/bpmn-rendering.js similarity index 96% rename from dev/public/static/js/bpmn-rendering.js rename to dev/ts/pages/bpmn-rendering.js index 01f491ce65..46adaa19b0 100644 --- a/dev/public/static/js/bpmn-rendering.js +++ b/dev/ts/pages/bpmn-rendering.js @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { documentReady, log, logError, startBpmnVisualization } from '../../../ts/dev-bundle-index'; +import { documentReady, log, logError, startBpmnVisualization } from '../dev-bundle-index'; function statusFetchKO(errorMsg) { logError(errorMsg); From 3ee7b24fb3c89010680aad4af61a67237b3db51f Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:04:13 +0200 Subject: [PATCH 02/33] move main.ts --- dev/ts/dev-bundle-index.ts | 2 +- dev/ts/{ => utils}/main.ts | 16 ++++++++-------- 2 files changed, 9 insertions(+), 9 deletions(-) rename dev/ts/{ => utils}/main.ts (96%) diff --git a/dev/ts/dev-bundle-index.ts b/dev/ts/dev-bundle-index.ts index 4e21372fd2..38749610d5 100644 --- a/dev/ts/dev-bundle-index.ts +++ b/dev/ts/dev-bundle-index.ts @@ -14,6 +14,6 @@ See the License for the specific language governing permissions and limitations under the License. */ -export * from './main'; +export * from './utils/main'; export * from './utils/shared-helpers'; export * from '../../src/bpmn-visualization'; diff --git a/dev/ts/main.ts b/dev/ts/utils/main.ts similarity index 96% rename from dev/ts/main.ts rename to dev/ts/utils/main.ts index cc0ada21a2..87416201de 100644 --- a/dev/ts/main.ts +++ b/dev/ts/utils/main.ts @@ -30,14 +30,14 @@ import type { ZoomType, FillColorGradient, GradientDirection, -} from '../../src/bpmn-visualization'; -import { FlowKind, ShapeBpmnElementKind } from '../../src/bpmn-visualization'; -import { fetchBpmnContent, logDownload, logError, logErrorAndOpenAlert, logStartup } from './utils/internal-helpers'; -import { log } from './utils/shared-helpers'; -import { DropFileUserInterface } from './component/DropFileUserInterface'; -import { SvgExporter } from './component/SvgExporter'; -import { downloadAsPng, downloadAsSvg } from './component/download'; -import { ThemedBpmnVisualization } from './component/ThemedBpmnVisualization'; +} from '../../../src/bpmn-visualization'; +import { FlowKind, ShapeBpmnElementKind } from '../../../src/bpmn-visualization'; +import { fetchBpmnContent, logDownload, logError, logErrorAndOpenAlert, logStartup } from './internal-helpers'; +import { log } from './shared-helpers'; +import { DropFileUserInterface } from '../component/DropFileUserInterface'; +import { SvgExporter } from '../component/SvgExporter'; +import { downloadAsPng, downloadAsSvg } from '../component/download'; +import { ThemedBpmnVisualization } from '../component/ThemedBpmnVisualization'; let bpmnVisualization: ThemedBpmnVisualization; let loadOptions: LoadOptions = {}; From bf3760b08c00dc3daab69f9df4b699f9eeaa9b54 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:04:54 +0200 Subject: [PATCH 03/33] move internal-helpers.ts --- dev/ts/component/DropFileUserInterface.ts | 2 +- dev/ts/component/ThemedBpmnVisualization.ts | 2 +- dev/ts/component/download.ts | 2 +- dev/ts/{utils => internal}/internal-helpers.ts | 2 +- dev/ts/utils/main.ts | 2 +- dev/ts/utils/shared-helpers.ts | 4 ++-- 6 files changed, 7 insertions(+), 7 deletions(-) rename dev/ts/{utils => internal}/internal-helpers.ts (97%) diff --git a/dev/ts/component/DropFileUserInterface.ts b/dev/ts/component/DropFileUserInterface.ts index 1d1d5a2555..7cfe23a60d 100644 --- a/dev/ts/component/DropFileUserInterface.ts +++ b/dev/ts/component/DropFileUserInterface.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { logErrorAndOpenAlert } from '../utils/internal-helpers'; +import { logErrorAndOpenAlert } from '../internal/internal-helpers'; export class DropFileUserInterface { private document: Document; diff --git a/dev/ts/component/ThemedBpmnVisualization.ts b/dev/ts/component/ThemedBpmnVisualization.ts index be2fbb743a..141454af14 100644 --- a/dev/ts/component/ThemedBpmnVisualization.ts +++ b/dev/ts/component/ThemedBpmnVisualization.ts @@ -15,7 +15,7 @@ limitations under the License. */ import { BpmnVisualization, FlowKind, ShapeBpmnElementKind, ShapeUtil, StyleConfigurator, StyleDefault } from '../../../src/bpmn-visualization'; -import { logStartup } from '../utils/internal-helpers'; +import { logStartup } from '../internal/internal-helpers'; import { mxConstants } from '../../../src/component/mxgraph/initializer'; interface Theme { diff --git a/dev/ts/component/download.ts b/dev/ts/component/download.ts index 9a81497525..2ce27ba4a9 100644 --- a/dev/ts/component/download.ts +++ b/dev/ts/component/download.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { logDownload } from '../utils/internal-helpers'; +import { logDownload } from '../internal/internal-helpers'; // inspired from https://ourcodeworld.com/articles/read/189/how-to-create-a-file-and-generate-a-download-with-javascript-in-the-browser-without-a-server function download(filename: string, contentType: string, text: string): void { diff --git a/dev/ts/utils/internal-helpers.ts b/dev/ts/internal/internal-helpers.ts similarity index 97% rename from dev/ts/utils/internal-helpers.ts rename to dev/ts/internal/internal-helpers.ts index 9023ba4945..b65bdd08f9 100644 --- a/dev/ts/utils/internal-helpers.ts +++ b/dev/ts/internal/internal-helpers.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { log } from './shared-helpers'; +import { log } from '../utils/shared-helpers'; export function _log(header: string, message: unknown, ...optionalParams: unknown[]): void { // eslint-disable-next-line no-console diff --git a/dev/ts/utils/main.ts b/dev/ts/utils/main.ts index 87416201de..017d9239c9 100644 --- a/dev/ts/utils/main.ts +++ b/dev/ts/utils/main.ts @@ -32,7 +32,7 @@ import type { GradientDirection, } from '../../../src/bpmn-visualization'; import { FlowKind, ShapeBpmnElementKind } from '../../../src/bpmn-visualization'; -import { fetchBpmnContent, logDownload, logError, logErrorAndOpenAlert, logStartup } from './internal-helpers'; +import { fetchBpmnContent, logDownload, logError, logErrorAndOpenAlert, logStartup } from '../internal/internal-helpers'; import { log } from './shared-helpers'; import { DropFileUserInterface } from '../component/DropFileUserInterface'; import { SvgExporter } from '../component/SvgExporter'; diff --git a/dev/ts/utils/shared-helpers.ts b/dev/ts/utils/shared-helpers.ts index fb3cd49070..b1a16851ba 100644 --- a/dev/ts/utils/shared-helpers.ts +++ b/dev/ts/utils/shared-helpers.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { _log } from './internal-helpers'; +import { _log } from '../internal/internal-helpers'; export function documentReady(callbackFunction: () => void): void { // see if DOM is already available @@ -30,4 +30,4 @@ export function log(message?: string, ...optionalParams: unknown[]): void { _log('[DEMO]', message, ...optionalParams); } -export { logError } from './internal-helpers'; +export { logError } from '../internal/internal-helpers'; From 12e857faf85072ba2c2371fc111abd490580af92 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:06:24 +0200 Subject: [PATCH 04/33] Revert "move internal-helpers.ts" This reverts commit bd7ab504cf75036dd0976974d2cfb8c92a402ab9. --- dev/ts/component/DropFileUserInterface.ts | 2 +- dev/ts/component/ThemedBpmnVisualization.ts | 2 +- dev/ts/component/download.ts | 2 +- dev/ts/{internal => utils}/internal-helpers.ts | 2 +- dev/ts/utils/main.ts | 2 +- dev/ts/utils/shared-helpers.ts | 4 ++-- 6 files changed, 7 insertions(+), 7 deletions(-) rename dev/ts/{internal => utils}/internal-helpers.ts (97%) diff --git a/dev/ts/component/DropFileUserInterface.ts b/dev/ts/component/DropFileUserInterface.ts index 7cfe23a60d..1d1d5a2555 100644 --- a/dev/ts/component/DropFileUserInterface.ts +++ b/dev/ts/component/DropFileUserInterface.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { logErrorAndOpenAlert } from '../internal/internal-helpers'; +import { logErrorAndOpenAlert } from '../utils/internal-helpers'; export class DropFileUserInterface { private document: Document; diff --git a/dev/ts/component/ThemedBpmnVisualization.ts b/dev/ts/component/ThemedBpmnVisualization.ts index 141454af14..be2fbb743a 100644 --- a/dev/ts/component/ThemedBpmnVisualization.ts +++ b/dev/ts/component/ThemedBpmnVisualization.ts @@ -15,7 +15,7 @@ limitations under the License. */ import { BpmnVisualization, FlowKind, ShapeBpmnElementKind, ShapeUtil, StyleConfigurator, StyleDefault } from '../../../src/bpmn-visualization'; -import { logStartup } from '../internal/internal-helpers'; +import { logStartup } from '../utils/internal-helpers'; import { mxConstants } from '../../../src/component/mxgraph/initializer'; interface Theme { diff --git a/dev/ts/component/download.ts b/dev/ts/component/download.ts index 2ce27ba4a9..9a81497525 100644 --- a/dev/ts/component/download.ts +++ b/dev/ts/component/download.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { logDownload } from '../internal/internal-helpers'; +import { logDownload } from '../utils/internal-helpers'; // inspired from https://ourcodeworld.com/articles/read/189/how-to-create-a-file-and-generate-a-download-with-javascript-in-the-browser-without-a-server function download(filename: string, contentType: string, text: string): void { diff --git a/dev/ts/internal/internal-helpers.ts b/dev/ts/utils/internal-helpers.ts similarity index 97% rename from dev/ts/internal/internal-helpers.ts rename to dev/ts/utils/internal-helpers.ts index b65bdd08f9..9023ba4945 100644 --- a/dev/ts/internal/internal-helpers.ts +++ b/dev/ts/utils/internal-helpers.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { log } from '../utils/shared-helpers'; +import { log } from './shared-helpers'; export function _log(header: string, message: unknown, ...optionalParams: unknown[]): void { // eslint-disable-next-line no-console diff --git a/dev/ts/utils/main.ts b/dev/ts/utils/main.ts index 017d9239c9..87416201de 100644 --- a/dev/ts/utils/main.ts +++ b/dev/ts/utils/main.ts @@ -32,7 +32,7 @@ import type { GradientDirection, } from '../../../src/bpmn-visualization'; import { FlowKind, ShapeBpmnElementKind } from '../../../src/bpmn-visualization'; -import { fetchBpmnContent, logDownload, logError, logErrorAndOpenAlert, logStartup } from '../internal/internal-helpers'; +import { fetchBpmnContent, logDownload, logError, logErrorAndOpenAlert, logStartup } from './internal-helpers'; import { log } from './shared-helpers'; import { DropFileUserInterface } from '../component/DropFileUserInterface'; import { SvgExporter } from '../component/SvgExporter'; diff --git a/dev/ts/utils/shared-helpers.ts b/dev/ts/utils/shared-helpers.ts index b1a16851ba..fb3cd49070 100644 --- a/dev/ts/utils/shared-helpers.ts +++ b/dev/ts/utils/shared-helpers.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { _log } from '../internal/internal-helpers'; +import { _log } from './internal-helpers'; export function documentReady(callbackFunction: () => void): void { // see if DOM is already available @@ -30,4 +30,4 @@ export function log(message?: string, ...optionalParams: unknown[]): void { _log('[DEMO]', message, ...optionalParams); } -export { logError } from '../internal/internal-helpers'; +export { logError } from './internal-helpers'; From 48906a4ac3c49026dffc6decaa8f9f6d33293a62 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:07:10 +0200 Subject: [PATCH 05/33] rename utils into shared --- dev/ts/component/DropFileUserInterface.ts | 2 +- dev/ts/component/ThemedBpmnVisualization.ts | 2 +- dev/ts/component/download.ts | 2 +- dev/ts/dev-bundle-index.ts | 4 ++-- dev/ts/{utils => shared}/internal-helpers.ts | 0 dev/ts/{utils => shared}/main.ts | 0 dev/ts/{utils => shared}/shared-helpers.ts | 0 7 files changed, 5 insertions(+), 5 deletions(-) rename dev/ts/{utils => shared}/internal-helpers.ts (100%) rename dev/ts/{utils => shared}/main.ts (100%) rename dev/ts/{utils => shared}/shared-helpers.ts (100%) diff --git a/dev/ts/component/DropFileUserInterface.ts b/dev/ts/component/DropFileUserInterface.ts index 1d1d5a2555..0376fde591 100644 --- a/dev/ts/component/DropFileUserInterface.ts +++ b/dev/ts/component/DropFileUserInterface.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { logErrorAndOpenAlert } from '../utils/internal-helpers'; +import { logErrorAndOpenAlert } from '../shared/internal-helpers'; export class DropFileUserInterface { private document: Document; diff --git a/dev/ts/component/ThemedBpmnVisualization.ts b/dev/ts/component/ThemedBpmnVisualization.ts index be2fbb743a..680ba84f50 100644 --- a/dev/ts/component/ThemedBpmnVisualization.ts +++ b/dev/ts/component/ThemedBpmnVisualization.ts @@ -15,7 +15,7 @@ limitations under the License. */ import { BpmnVisualization, FlowKind, ShapeBpmnElementKind, ShapeUtil, StyleConfigurator, StyleDefault } from '../../../src/bpmn-visualization'; -import { logStartup } from '../utils/internal-helpers'; +import { logStartup } from '../shared/internal-helpers'; import { mxConstants } from '../../../src/component/mxgraph/initializer'; interface Theme { diff --git a/dev/ts/component/download.ts b/dev/ts/component/download.ts index 9a81497525..2f31c0b170 100644 --- a/dev/ts/component/download.ts +++ b/dev/ts/component/download.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { logDownload } from '../utils/internal-helpers'; +import { logDownload } from '../shared/internal-helpers'; // inspired from https://ourcodeworld.com/articles/read/189/how-to-create-a-file-and-generate-a-download-with-javascript-in-the-browser-without-a-server function download(filename: string, contentType: string, text: string): void { diff --git a/dev/ts/dev-bundle-index.ts b/dev/ts/dev-bundle-index.ts index 38749610d5..a34058b8f7 100644 --- a/dev/ts/dev-bundle-index.ts +++ b/dev/ts/dev-bundle-index.ts @@ -14,6 +14,6 @@ See the License for the specific language governing permissions and limitations under the License. */ -export * from './utils/main'; -export * from './utils/shared-helpers'; +export * from './shared/main'; +export * from './shared/shared-helpers'; export * from '../../src/bpmn-visualization'; diff --git a/dev/ts/utils/internal-helpers.ts b/dev/ts/shared/internal-helpers.ts similarity index 100% rename from dev/ts/utils/internal-helpers.ts rename to dev/ts/shared/internal-helpers.ts diff --git a/dev/ts/utils/main.ts b/dev/ts/shared/main.ts similarity index 100% rename from dev/ts/utils/main.ts rename to dev/ts/shared/main.ts diff --git a/dev/ts/utils/shared-helpers.ts b/dev/ts/shared/shared-helpers.ts similarity index 100% rename from dev/ts/utils/shared-helpers.ts rename to dev/ts/shared/shared-helpers.ts From bd9c0318ecb1602607aa2845048d842a5def37f7 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:08:48 +0200 Subject: [PATCH 06/33] convert bpmn-rendering.js to TS --- dev/public/bpmn-rendering.html | 2 +- dev/ts/pages/{bpmn-rendering.js => bpmn-rendering.ts} | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) rename dev/ts/pages/{bpmn-rendering.js => bpmn-rendering.ts} (94%) diff --git a/dev/public/bpmn-rendering.html b/dev/public/bpmn-rendering.html index d7e5c83b31..5be6b7974f 100644 --- a/dev/public/bpmn-rendering.html +++ b/dev/public/bpmn-rendering.html @@ -18,7 +18,7 @@ font-weight: bold; } - +
diff --git a/dev/ts/pages/bpmn-rendering.js b/dev/ts/pages/bpmn-rendering.ts similarity index 94% rename from dev/ts/pages/bpmn-rendering.js rename to dev/ts/pages/bpmn-rendering.ts index 46adaa19b0..7cc1dabe71 100644 --- a/dev/ts/pages/bpmn-rendering.js +++ b/dev/ts/pages/bpmn-rendering.ts @@ -16,12 +16,12 @@ limitations under the License. import { documentReady, log, logError, startBpmnVisualization } from '../dev-bundle-index'; -function statusFetchKO(errorMsg) { +const statusFetchKO = (errorMsg: string): void => { logError(errorMsg); const statusElt = document.getElementById('status-zone'); statusElt.innerText = errorMsg; statusElt.className = 'status-ko'; log('Status zone set with error:', errorMsg); -} +}; documentReady(() => startBpmnVisualization({ globalOptions: { container: 'bpmn-container' }, statusKoNotifier: statusFetchKO })); From d2a286faf3f5e59509e998c7892314461298c4ea Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:10:41 +0200 Subject: [PATCH 07/33] move index.js --- dev/public/index.html | 2 +- dev/{public/static/js => ts/pages}/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename dev/{public/static/js => ts/pages}/index.js (99%) diff --git a/dev/public/index.html b/dev/public/index.html index 0795abb326..fb54f6ce23 100644 --- a/dev/public/index.html +++ b/dev/public/index.html @@ -7,7 +7,7 @@ - + diff --git a/dev/public/static/js/index.js b/dev/ts/pages/index.js similarity index 99% rename from dev/public/static/js/index.js rename to dev/ts/pages/index.js index a3d884d851..367ee127f3 100644 --- a/dev/public/static/js/index.js +++ b/dev/ts/pages/index.js @@ -28,7 +28,7 @@ import { zoom, ZoomType, windowAlertStatusKoNotifier, -} from '../../../ts/dev-bundle-index'; +} from 'dev/ts/dev-bundle-index'; let fitOnLoad = true; let fitOptions = {}; From beaa1165f9e43ff7a529d82420b02fd3bdf58797 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:15:19 +0200 Subject: [PATCH 08/33] index.js: fix import --- dev/ts/pages/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev/ts/pages/index.js b/dev/ts/pages/index.js index 367ee127f3..6c575c3418 100644 --- a/dev/ts/pages/index.js +++ b/dev/ts/pages/index.js @@ -28,7 +28,7 @@ import { zoom, ZoomType, windowAlertStatusKoNotifier, -} from 'dev/ts/dev-bundle-index'; +} from '../dev-bundle-index'; let fitOnLoad = true; let fitOptions = {}; From 3acfdac2e4b71cf282454b958bcae65d5fe7665c Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:16:16 +0200 Subject: [PATCH 09/33] vite config: mxgraph warning limit increase --- vite.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/vite.config.js b/vite.config.js index 100d8171e7..b3c78a8935 100644 --- a/vite.config.js +++ b/vite.config.js @@ -48,7 +48,7 @@ export default defineConfig(({ mode }) => { }, }, }, - chunkSizeWarningLimit: 820, // mxgraph + chunkSizeWarningLimit: 838, // mxgraph }, preview: { port: 10002, From 8f46394fdb0ffad584cfb09c1cbaf9a647b10752 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:31:02 +0200 Subject: [PATCH 10/33] move elements-identification.js --- dev/public/elements-identification.html | 2 +- dev/{public/static/js => ts/pages}/elements-identification.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename dev/{public/static/js => ts/pages}/elements-identification.js (99%) diff --git a/dev/public/elements-identification.html b/dev/public/elements-identification.html index c43cf04756..05fcce5278 100644 --- a/dev/public/elements-identification.html +++ b/dev/public/elements-identification.html @@ -132,7 +132,7 @@ color: var(--color-flow) !important; } - +
diff --git a/dev/public/static/js/elements-identification.js b/dev/ts/pages/elements-identification.js similarity index 99% rename from dev/public/static/js/elements-identification.js rename to dev/ts/pages/elements-identification.js index 0fa20b4259..26b649a51d 100644 --- a/dev/public/static/js/elements-identification.js +++ b/dev/ts/pages/elements-identification.js @@ -34,7 +34,7 @@ import { getParentElementIds, ShapeBpmnElementKind, isChildOfSubProcess, -} from '../../../ts/dev-bundle-index'; +} from '../dev-bundle-index'; let lastIdentifiedBpmnIds = []; let lastIdentifiedParentBpmnIds = []; From 663e658f06c8e0cae75ad185aa3c5977691aa334 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:33:04 +0200 Subject: [PATCH 11/33] move lib-integration.js --- dev/public/lib-integration.html | 2 +- dev/{public/static/js => ts/pages}/lib-integration.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) rename dev/{public/static/js => ts/pages}/lib-integration.js (94%) diff --git a/dev/public/lib-integration.html b/dev/public/lib-integration.html index d0c22a552e..6b93d76952 100644 --- a/dev/public/lib-integration.html +++ b/dev/public/lib-integration.html @@ -4,7 +4,7 @@ bpmn-visualization - Library Integration - +
diff --git a/dev/public/static/js/lib-integration.js b/dev/ts/pages/lib-integration.js similarity index 94% rename from dev/public/static/js/lib-integration.js rename to dev/ts/pages/lib-integration.js index 629f118cba..d3d78713e4 100644 --- a/dev/public/static/js/lib-integration.js +++ b/dev/ts/pages/lib-integration.js @@ -14,6 +14,8 @@ See the License for the specific language governing permissions and limitations under the License. */ +// IMPORTANT: here we want to test only the integration of the lib. +// So we must NOT use any demo code. import { BpmnVisualization } from '../../../../src/bpmn-visualization'; const bpmnVisualizationIntegration = new BpmnVisualization({ container: 'bpmn-container-custom' }); From 424063f2b612aeed4b8499be1e9352a04c038cb7 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:34:01 +0200 Subject: [PATCH 12/33] lib-integration.js: fix import --- dev/ts/pages/lib-integration.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev/ts/pages/lib-integration.js b/dev/ts/pages/lib-integration.js index d3d78713e4..ce85842bfb 100644 --- a/dev/ts/pages/lib-integration.js +++ b/dev/ts/pages/lib-integration.js @@ -16,7 +16,7 @@ limitations under the License. // IMPORTANT: here we want to test only the integration of the lib. // So we must NOT use any demo code. -import { BpmnVisualization } from '../../../../src/bpmn-visualization'; +import { BpmnVisualization } from '../../../src/bpmn-visualization'; const bpmnVisualizationIntegration = new BpmnVisualization({ container: 'bpmn-container-custom' }); bpmnVisualizationIntegration.load(bpmnDefaultContent()); From 014afa5c0a780674c8891623d390baf701ad7187 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:35:12 +0200 Subject: [PATCH 13/33] lib-integration.js: move to TS --- dev/public/lib-integration.html | 2 +- dev/ts/pages/{lib-integration.js => lib-integration.ts} | 8 ++------ 2 files changed, 3 insertions(+), 7 deletions(-) rename dev/ts/pages/{lib-integration.js => lib-integration.ts} (74%) diff --git a/dev/public/lib-integration.html b/dev/public/lib-integration.html index 6b93d76952..95b3f52750 100644 --- a/dev/public/lib-integration.html +++ b/dev/public/lib-integration.html @@ -4,7 +4,7 @@ bpmn-visualization - Library Integration - +
diff --git a/dev/ts/pages/lib-integration.js b/dev/ts/pages/lib-integration.ts similarity index 74% rename from dev/ts/pages/lib-integration.js rename to dev/ts/pages/lib-integration.ts index ce85842bfb..190eca0582 100644 --- a/dev/ts/pages/lib-integration.js +++ b/dev/ts/pages/lib-integration.ts @@ -19,10 +19,7 @@ limitations under the License. import { BpmnVisualization } from '../../../src/bpmn-visualization'; const bpmnVisualizationIntegration = new BpmnVisualization({ container: 'bpmn-container-custom' }); -bpmnVisualizationIntegration.load(bpmnDefaultContent()); - -function bpmnDefaultContent() { - return ` +bpmnVisualizationIntegration.load(` @@ -37,5 +34,4 @@ function bpmnDefaultContent() { -`; -} +`); From 43f38e8ce1e033217a131cd42a7442c79d396a6b Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:39:52 +0200 Subject: [PATCH 14/33] move overlays.js --- dev/public/overlays.html | 2 +- dev/{public/static/js => ts/pages}/overlays.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) rename dev/{public/static/js => ts/pages}/overlays.js (96%) diff --git a/dev/public/overlays.html b/dev/public/overlays.html index dc4a09435e..ce5cc1be9d 100644 --- a/dev/public/overlays.html +++ b/dev/public/overlays.html @@ -13,7 +13,7 @@ background-color: MintCream; } - +
diff --git a/dev/public/static/js/overlays.js b/dev/ts/pages/overlays.js similarity index 96% rename from dev/public/static/js/overlays.js rename to dev/ts/pages/overlays.js index 967151cb69..f532b4f06c 100644 --- a/dev/public/static/js/overlays.js +++ b/dev/ts/pages/overlays.js @@ -14,8 +14,8 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { addOverlays, documentReady, getElementsByIds, removeAllOverlays, startBpmnVisualization } from '../../../ts/dev-bundle-index'; -import { configureControlsPanel, configureMousePointer } from './helpers/controls.js'; +import { addOverlays, documentReady, getElementsByIds, removeAllOverlays, startBpmnVisualization } from '../dev-bundle-index'; +import { configureControlsPanel, configureMousePointer } from '../../public/static/js/helpers/controls.js'; function addOverlay(overlay) { const bpmnId = document.getElementById('bpmn-id-input').value; From 4b3fa1b3474b73097ab37ff10090607424ef5a56 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:41:01 +0200 Subject: [PATCH 15/33] move diagram-navigation.js --- dev/public/diagram-navigation.html | 2 +- dev/{public/static/js => ts/pages}/diagram-navigation.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) rename dev/{public/static/js => ts/pages}/diagram-navigation.js (96%) diff --git a/dev/public/diagram-navigation.html b/dev/public/diagram-navigation.html index 88e549dc73..46abffe502 100644 --- a/dev/public/diagram-navigation.html +++ b/dev/public/diagram-navigation.html @@ -18,7 +18,7 @@ width: 35px; } - +
diff --git a/dev/public/static/js/diagram-navigation.js b/dev/ts/pages/diagram-navigation.js similarity index 96% rename from dev/public/static/js/diagram-navigation.js rename to dev/ts/pages/diagram-navigation.js index 425ce54b2f..2e688aadd6 100644 --- a/dev/public/static/js/diagram-navigation.js +++ b/dev/ts/pages/diagram-navigation.js @@ -14,8 +14,8 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { documentReady, fit, FitType, startBpmnVisualization, zoom, ZoomType } from '../../../ts/dev-bundle-index'; -import { configureControlsPanel, configureMousePointer } from './helpers/controls.js'; +import { documentReady, fit, FitType, startBpmnVisualization, zoom, ZoomType } from '../dev-bundle-index'; +import { configureControlsPanel, configureMousePointer } from '../../public/static/js/helpers/controls.js'; function configureFitAndZoomButtons() { Object.values(FitType).forEach(fitType => { From 192497fc4e3776f85c784c35686dad147487a075 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:42:07 +0200 Subject: [PATCH 16/33] WIP move controls.js --- dev/ts/dev-bundle-index.ts | 1 + dev/ts/pages/diagram-navigation.js | 2 +- dev/ts/pages/overlays.js | 2 +- dev/{public/static/js/helpers => ts/shared}/controls.js | 0 4 files changed, 3 insertions(+), 2 deletions(-) rename dev/{public/static/js/helpers => ts/shared}/controls.js (100%) diff --git a/dev/ts/dev-bundle-index.ts b/dev/ts/dev-bundle-index.ts index a34058b8f7..adc298fd3f 100644 --- a/dev/ts/dev-bundle-index.ts +++ b/dev/ts/dev-bundle-index.ts @@ -16,4 +16,5 @@ limitations under the License. export * from './shared/main'; export * from './shared/shared-helpers'; +export * from './shared/controls'; export * from '../../src/bpmn-visualization'; diff --git a/dev/ts/pages/diagram-navigation.js b/dev/ts/pages/diagram-navigation.js index 2e688aadd6..b8670f8d2e 100644 --- a/dev/ts/pages/diagram-navigation.js +++ b/dev/ts/pages/diagram-navigation.js @@ -15,7 +15,7 @@ limitations under the License. */ import { documentReady, fit, FitType, startBpmnVisualization, zoom, ZoomType } from '../dev-bundle-index'; -import { configureControlsPanel, configureMousePointer } from '../../public/static/js/helpers/controls.js'; +// import { configureControlsPanel, configureMousePointer } from 'dev/ts/shared/controls.js'; function configureFitAndZoomButtons() { Object.values(FitType).forEach(fitType => { diff --git a/dev/ts/pages/overlays.js b/dev/ts/pages/overlays.js index f532b4f06c..dc1e69063a 100644 --- a/dev/ts/pages/overlays.js +++ b/dev/ts/pages/overlays.js @@ -15,7 +15,7 @@ limitations under the License. */ import { addOverlays, documentReady, getElementsByIds, removeAllOverlays, startBpmnVisualization } from '../dev-bundle-index'; -import { configureControlsPanel, configureMousePointer } from '../../public/static/js/helpers/controls.js'; +// import { configureControlsPanel, configureMousePointer } from 'dev/ts/shared/controls.js'; function addOverlay(overlay) { const bpmnId = document.getElementById('bpmn-id-input').value; diff --git a/dev/public/static/js/helpers/controls.js b/dev/ts/shared/controls.js similarity index 100% rename from dev/public/static/js/helpers/controls.js rename to dev/ts/shared/controls.js From c09d25575384333f39d9cc5399efdf25a32de834 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:48:22 +0200 Subject: [PATCH 17/33] WIP move controls.js to TS --- dev/ts/pages/diagram-navigation.js | 3 +-- dev/ts/pages/overlays.js | 3 +-- dev/ts/shared/{controls.js => controls.ts} | 14 +++++++++----- 3 files changed, 11 insertions(+), 9 deletions(-) rename dev/ts/shared/{controls.js => controls.ts} (85%) diff --git a/dev/ts/pages/diagram-navigation.js b/dev/ts/pages/diagram-navigation.js index b8670f8d2e..f84b886594 100644 --- a/dev/ts/pages/diagram-navigation.js +++ b/dev/ts/pages/diagram-navigation.js @@ -14,8 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { documentReady, fit, FitType, startBpmnVisualization, zoom, ZoomType } from '../dev-bundle-index'; -// import { configureControlsPanel, configureMousePointer } from 'dev/ts/shared/controls.js'; +import { configureControlsPanel, configureMousePointer, documentReady, fit, FitType, startBpmnVisualization, zoom, ZoomType } from '../dev-bundle-index'; function configureFitAndZoomButtons() { Object.values(FitType).forEach(fitType => { diff --git a/dev/ts/pages/overlays.js b/dev/ts/pages/overlays.js index dc1e69063a..a45037844b 100644 --- a/dev/ts/pages/overlays.js +++ b/dev/ts/pages/overlays.js @@ -14,8 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { addOverlays, documentReady, getElementsByIds, removeAllOverlays, startBpmnVisualization } from '../dev-bundle-index'; -// import { configureControlsPanel, configureMousePointer } from 'dev/ts/shared/controls.js'; +import { addOverlays, configureControlsPanel, configureMousePointer, documentReady, getElementsByIds, removeAllOverlays, startBpmnVisualization } from '../dev-bundle-index'; function addOverlay(overlay) { const bpmnId = document.getElementById('bpmn-id-input').value; diff --git a/dev/ts/shared/controls.js b/dev/ts/shared/controls.ts similarity index 85% rename from dev/ts/shared/controls.js rename to dev/ts/shared/controls.ts index 64cabd9f66..7bcea6813d 100644 --- a/dev/ts/shared/controls.js +++ b/dev/ts/shared/controls.ts @@ -16,7 +16,7 @@ limitations under the License. // @see https://github.com/puppeteer/puppeteer/issues/374 // @see https://github.com/puppeteer/puppeteer/blob/4fdb1e3cab34310b4a1012c3024a94bc422b3b92/test/assets/input/mouse-helper.js -function showMousePointer() { +function showMousePointer(): void { const box = document.createElement('div'); box.classList.add('mouse-helper'); const styleElement = document.createElement('style'); @@ -83,18 +83,22 @@ function showMousePointer() { }, true, ); - function updateButtons(buttons) { - for (let i = 0; i < 5; i++) box.classList.toggle('button-' + i, buttons & (1 << i)); + function updateButtons(buttons: number): void { + for (let i = 0; i < 5; i++) { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + box.classList.toggle('button-' + i, buttons & (1 << i)); + } } } -export function configureMousePointer(parameters) { +export function configureMousePointer(parameters: URLSearchParams): void { if (parameters.get('showMousePointer') === 'true') { showMousePointer(); } } -export function configureControlsPanel(parameters) { +export function configureControlsPanel(parameters: URLSearchParams): void { const elControlsPanel = document.getElementById('controls-panel'); if (parameters.get('showControlsPanel') === 'true') { elControlsPanel.classList.remove('hidden'); From f2cb503f1eca3a646dfce0a1b899dd4a49f6ab6b Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:51:26 +0200 Subject: [PATCH 18/33] WIP move controls.js to TS --- dev/ts/dev-bundle-index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev/ts/dev-bundle-index.ts b/dev/ts/dev-bundle-index.ts index adc298fd3f..9c6dcead67 100644 --- a/dev/ts/dev-bundle-index.ts +++ b/dev/ts/dev-bundle-index.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ +export * from './shared/controls'; export * from './shared/main'; export * from './shared/shared-helpers'; -export * from './shared/controls'; export * from '../../src/bpmn-visualization'; From e12b7d8f1bf570f4fd1bfb7333e47c174fdb1982 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 15:52:44 +0200 Subject: [PATCH 19/33] bpmn-rendering.html: fix TS file loading --- dev/public/bpmn-rendering.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev/public/bpmn-rendering.html b/dev/public/bpmn-rendering.html index 5be6b7974f..dd516e347b 100644 --- a/dev/public/bpmn-rendering.html +++ b/dev/public/bpmn-rendering.html @@ -18,7 +18,7 @@ font-weight: bold; } - +
From dfaf0c2d21ba2ef7c6383eaf581168a69926c180 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 16:00:42 +0200 Subject: [PATCH 20/33] migrate overlays.js to TS --- dev/public/overlays.html | 2 +- dev/ts/pages/{overlays.js => overlays.ts} | 25 +++++++++++++---------- 2 files changed, 15 insertions(+), 12 deletions(-) rename dev/ts/pages/{overlays.js => overlays.ts} (80%) diff --git a/dev/public/overlays.html b/dev/public/overlays.html index ce5cc1be9d..29cca479ad 100644 --- a/dev/public/overlays.html +++ b/dev/public/overlays.html @@ -13,7 +13,7 @@ background-color: MintCream; } - +
diff --git a/dev/ts/pages/overlays.js b/dev/ts/pages/overlays.ts similarity index 80% rename from dev/ts/pages/overlays.js rename to dev/ts/pages/overlays.ts index a45037844b..b97314e925 100644 --- a/dev/ts/pages/overlays.js +++ b/dev/ts/pages/overlays.ts @@ -14,17 +14,20 @@ See the License for the specific language governing permissions and limitations under the License. */ +import type { Overlay, OverlayPosition } from '../dev-bundle-index'; import { addOverlays, configureControlsPanel, configureMousePointer, documentReady, getElementsByIds, removeAllOverlays, startBpmnVisualization } from '../dev-bundle-index'; -function addOverlay(overlay) { - const bpmnId = document.getElementById('bpmn-id-input').value; +const bpmnIdInputElt = document.getElementById('bpmn-id-input'); + +function addOverlay(overlay: Overlay): void { + const bpmnId = bpmnIdInputElt.value; if (bpmnId) { addOverlays(bpmnId, overlay); } } -function getPosition() { - const bpmnId = document.getElementById('bpmn-id-input').value; +function getPosition(): OverlayPosition { + const bpmnId = bpmnIdInputElt.value; if (bpmnId) { const elementsByIds = getElementsByIds(bpmnId); if (elementsByIds) { @@ -36,27 +39,27 @@ function getPosition() { } } -function configureAddDefaultOverlay(position) { +function configureAddDefaultOverlay(position: OverlayPosition): void { document.getElementById(position).onclick = () => addOverlay({ position, label: '123' }); } -function configureAddOverlayWithCustomFont() { +function configureAddOverlayWithCustomFont(): void { document.getElementById('font').onclick = () => addOverlay({ position: getPosition(), label: '7896', style: { font: { color: 'LightSeaGreen', size: 30 } } }); } -function configureAddOverlayWithCustomFill() { +function configureAddOverlayWithCustomFill(): void { document.getElementById('fill').onclick = () => addOverlay({ position: getPosition(), label: '3', style: { fill: { color: 'LightSalmon', opacity: 50 } } }); } -function configureAddOverlayWithCustomStroke() { +function configureAddOverlayWithCustomStroke(): void { document.getElementById('stroke').onclick = () => addOverlay({ position: getPosition(), label: '41', style: { stroke: { color: 'Aquamarine', width: 5 } } }); } -function configureRemoveAllOverlays() { - document.getElementById('clear').onclick = () => removeAllOverlays(document.getElementById('bpmn-id-input').value); +function configureRemoveAllOverlays(): void { + document.getElementById('clear').onclick = () => removeAllOverlays(bpmnIdInputElt.value); } -function start() { +function start(): void { const parameters = new URLSearchParams(window.location.search); configureMousePointer(parameters); configureControlsPanel(parameters); From 973e7c63ad5cc6f1e10e9a4e98d3555f98b43867 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 16:03:46 +0200 Subject: [PATCH 21/33] diagram-navigation.ts to TS --- dev/public/diagram-navigation.html | 2 +- ...agram-navigation.js => diagram-navigation.ts} | 16 ++++++++-------- 2 files changed, 9 insertions(+), 9 deletions(-) rename dev/ts/pages/{diagram-navigation.js => diagram-navigation.ts} (77%) diff --git a/dev/public/diagram-navigation.html b/dev/public/diagram-navigation.html index 46abffe502..e549431bb3 100644 --- a/dev/public/diagram-navigation.html +++ b/dev/public/diagram-navigation.html @@ -18,7 +18,7 @@ width: 35px; } - +
diff --git a/dev/ts/pages/diagram-navigation.js b/dev/ts/pages/diagram-navigation.ts similarity index 77% rename from dev/ts/pages/diagram-navigation.js rename to dev/ts/pages/diagram-navigation.ts index f84b886594..0d7d9d27f9 100644 --- a/dev/ts/pages/diagram-navigation.js +++ b/dev/ts/pages/diagram-navigation.ts @@ -16,7 +16,7 @@ limitations under the License. import { configureControlsPanel, configureMousePointer, documentReady, fit, FitType, startBpmnVisualization, zoom, ZoomType } from '../dev-bundle-index'; -function configureFitAndZoomButtons() { +function configureFitAndZoomButtons(): void { Object.values(FitType).forEach(fitType => { document.getElementById(fitType).onclick = () => fit({ type: fitType }); }); @@ -25,23 +25,23 @@ function configureFitAndZoomButtons() { }); } -function configureZoomThrottleInput(parameters) { - const elZoomThrottle = document.getElementById('zoom-throttle'); +function configureZoomThrottleInput(parameters: URLSearchParams): HTMLInputElement { + const elZoomThrottle = document.getElementById('zoom-throttle'); if (parameters.get('zoomThrottle')) { elZoomThrottle.value = parameters.get('zoomThrottle'); } return elZoomThrottle; } -function configureZoomDebounceInput(parameters) { - const elZoomDebounce = document.getElementById('zoom-debounce'); +function configureZoomDebounceInput(parameters: URLSearchParams): HTMLInputElement { + const elZoomDebounce = document.getElementById('zoom-debounce'); if (parameters.get('zoomDebounce')) { elZoomDebounce.value = parameters.get('zoomDebounce'); } return elZoomDebounce; } -function start() { +function start(): void { const parameters = new URLSearchParams(window.location.search); configureMousePointer(parameters); configureControlsPanel(parameters); @@ -55,8 +55,8 @@ function start() { navigation: { enabled: true, zoom: { - throttleDelay: elZoomThrottle.value, - debounceDelay: elZoomDebounce.value, + throttleDelay: Number(elZoomThrottle.value), + debounceDelay: Number(elZoomDebounce.value), }, }, }, From 30b5f2436c9e93b4d76ba474f57ea30a4ebc1a89 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 16:28:31 +0200 Subject: [PATCH 22/33] WIP migrate elements-identification.js to TS --- dev/public/elements-identification.html | 2 +- ...fication.js => elements-identification.ts} | 46 ++++++++++--------- 2 files changed, 25 insertions(+), 23 deletions(-) rename dev/ts/pages/{elements-identification.js => elements-identification.ts} (83%) diff --git a/dev/public/elements-identification.html b/dev/public/elements-identification.html index 05fcce5278..f026719496 100644 --- a/dev/public/elements-identification.html +++ b/dev/public/elements-identification.html @@ -132,7 +132,7 @@ color: var(--color-flow) !important; } - +
diff --git a/dev/ts/pages/elements-identification.js b/dev/ts/pages/elements-identification.ts similarity index 83% rename from dev/ts/pages/elements-identification.js rename to dev/ts/pages/elements-identification.ts index 26b649a51d..47ddabccbe 100644 --- a/dev/ts/pages/elements-identification.js +++ b/dev/ts/pages/elements-identification.ts @@ -14,6 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ +import type { BpmnElement, BpmnElementKind, Overlay, ShapeStyleUpdate } from '../dev-bundle-index'; import { addCssClasses, addOverlays, @@ -36,15 +37,16 @@ import { isChildOfSubProcess, } from '../dev-bundle-index'; -let lastIdentifiedBpmnIds = []; -let lastIdentifiedParentBpmnIds = []; -let styledPoolAndLaneIds = []; +let lastIdentifiedBpmnIds: string[] = []; +let lastIdentifiedParentBpmnIds: string[] = []; +let styledPoolAndLaneIds: string[] = []; const cssClassName = 'detection'; let isOverlaysDisplayed = true; let useCSS = true; -function computeStyleUpdateByKind(bpmnKind) { - const style = { font: {}, fill: {}, stroke: {} }; +// TODO should be BpmnElementKind +function computeStyleUpdateByKind(bpmnKind: ShapeBpmnElementKind): ShapeStyleUpdate { + const style: ShapeStyleUpdate = { font: {}, fill: {}, stroke: {} }; if (ShapeUtil.isTask(bpmnKind)) { style.font.color = 'Indigo'; style.fill.color = 'gold'; @@ -111,7 +113,7 @@ function computeStyleUpdateByKind(bpmnKind) { return style; } -function updateStyleByAPI(bpmnIds, bpmnKind) { +function updateStyleByAPI(bpmnIds: string[], bpmnKind: ShapeBpmnElementKind): void { const subProcessChildrenIds = bpmnIds.filter(isChildOfSubProcess); const otherIds = bpmnIds.filter(bpmnId => !subProcessChildrenIds.includes(bpmnId)); @@ -130,17 +132,17 @@ function updateStyleByAPI(bpmnIds, bpmnKind) { updateStyle(otherIds, style); } -function styleByCSS(idsToStyle) { +function styleByCSS(idsToStyle: string[]): void { removeCssClasses(lastIdentifiedBpmnIds, cssClassName); addCssClasses(idsToStyle, cssClassName); } -function styleByAPI(idsToStyle, bpmnKind) { +function styleByAPI(idsToStyle: string[], bpmnKind: ShapeBpmnElementKind): void { resetStyleByAPI(); updateStyleByAPI(idsToStyle, bpmnKind); } -function resetStyleByAPI() { +function resetStyleByAPI(): void { resetStyle(lastIdentifiedBpmnIds); resetStyle(lastIdentifiedParentBpmnIds); lastIdentifiedParentBpmnIds = []; @@ -148,7 +150,7 @@ function resetStyleByAPI() { styledPoolAndLaneIds = []; } -function manageOverlays(idsToAddOverlay, bpmnKind) { +function manageOverlays(idsToAddOverlay: string[], bpmnKind: ShapeBpmnElementKind): void { lastIdentifiedBpmnIds.forEach(id => removeAllOverlays(id)); if (isOverlaysDisplayed) { idsToAddOverlay.forEach(id => addOverlays(id, getOverlay(bpmnKind))); @@ -157,7 +159,7 @@ function manageOverlays(idsToAddOverlay, bpmnKind) { } } -function updateSelectedBPMNElements(bpmnKind) { +function updateSelectedBPMNElements(bpmnKind: ShapeBpmnElementKind): void { log(`Searching for Bpmn elements of '${bpmnKind}' kind`); const elementsByKinds = getElementsByKinds(bpmnKind); @@ -172,8 +174,8 @@ function updateSelectedBPMNElements(bpmnKind) { lastIdentifiedBpmnIds = newlyIdentifiedBpmnIds; } -function updateTextArea(elementsByKinds, bpmnKind) { - const textArea = document.getElementById('elements-result'); +function updateTextArea(elementsByKinds: BpmnElement[], bpmnKind: string): void { + const textArea = document.getElementById('elements-result'); const textHeader = `Found ${elementsByKinds.length} ${bpmnKind}(s)`; log(textHeader); @@ -183,13 +185,13 @@ function updateTextArea(elementsByKinds, bpmnKind) { textArea.scrollTop = textArea.scrollHeight; } -function resetTextArea() { - const textArea = document.getElementById('elements-result'); +function resetTextArea(): void { + const textArea = document.getElementById('elements-result'); textArea.value = ''; } -function configureControls() { - const selectedKindElt = document.getElementById('bpmn-kinds-select'); +function configureControls(): void { + const selectedKindElt = document.getElementById('bpmn-kinds-select'); selectedKindElt.onchange = event => updateSelectedBPMNElements(event.target.value); document.addEventListener('diagramLoaded', () => updateSelectedBPMNElements(selectedKindElt.value), false); @@ -204,7 +206,7 @@ function configureControls() { }; // display overlay option - const checkboxDisplayOverlaysElt = document.getElementById('checkbox-display-overlays'); + const checkboxDisplayOverlaysElt = document.getElementById('checkbox-display-overlays'); checkboxDisplayOverlaysElt.addEventListener('change', function () { isOverlaysDisplayed = this.checked; log('Request overlays display:', isOverlaysDisplayed); @@ -213,7 +215,7 @@ function configureControls() { checkboxDisplayOverlaysElt.checked = isOverlaysDisplayed; // use CSS or API to style the BPMN elements - const checkboxUseCSSElt = document.getElementById('checkbox-css-style'); + const checkboxUseCSSElt = document.getElementById('checkbox-css-style'); checkboxUseCSSElt.addEventListener('change', function () { useCSS = this.checked; log('Request CSS style feature:', useCSS); @@ -229,7 +231,7 @@ function configureControls() { checkboxUseCSSElt.checked = useCSS; } -function getOverlay(bpmnKind) { +function getOverlay(bpmnKind: BpmnElementKind): Overlay { if (ShapeUtil.isActivity(bpmnKind)) { return { position: 'top-right', @@ -274,7 +276,7 @@ function getOverlay(bpmnKind) { return { position: 'top-left', label: '40' }; } -function configureDownloadButtons() { +function configureDownloadButtons(): void { document.getElementById('btn-dl-svg').addEventListener('click', downloadSvg, false); document.getElementById('btn-dl-png').addEventListener('click', downloadPng, false); } @@ -283,7 +285,7 @@ documentReady(() => { startBpmnVisualization({ globalOptions: { // Use a DOM element without id to test the fix for https://github.com/process-analytics/bpmn-visualization-js/issues/2270 - container: document.querySelector('.bpmn-container'), + container: document.querySelector('.bpmn-container'), navigation: { enabled: true, }, From 3f04ecccb9f9082c4ef10cc5f0c5d465ae295a4c Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 16:34:57 +0200 Subject: [PATCH 23/33] WIP migrate index.js to TS --- dev/public/index.html | 2 +- dev/ts/pages/{index.js => index.ts} | 33 +++++++++++++++-------------- 2 files changed, 18 insertions(+), 17 deletions(-) rename dev/ts/pages/{index.js => index.ts} (79%) diff --git a/dev/public/index.html b/dev/public/index.html index fb54f6ce23..404c1c2429 100644 --- a/dev/public/index.html +++ b/dev/public/index.html @@ -7,7 +7,7 @@ - + diff --git a/dev/ts/pages/index.js b/dev/ts/pages/index.ts similarity index 79% rename from dev/ts/pages/index.js rename to dev/ts/pages/index.ts index 6c575c3418..ded15fa2ee 100644 --- a/dev/ts/pages/index.js +++ b/dev/ts/pages/index.ts @@ -14,6 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ +import type { FitOptions } from '../dev-bundle-index'; import { documentReady, handleFileSelect, @@ -31,10 +32,10 @@ import { } from '../dev-bundle-index'; let fitOnLoad = true; -let fitOptions = {}; +let fitOptions: FitOptions = {}; -function configureFitOnLoadCheckBox() { - const fitOnLoadElt = document.getElementById('fitOnLoad'); +function configureFitOnLoadCheckBox(): void { + const fitOnLoadElt = document.getElementById('fitOnLoad'); fitOnLoadElt.onchange = event => { fitOnLoad = event.target.checked; log('Fit on load updated!', fitOnLoad); @@ -43,7 +44,7 @@ function configureFitOnLoadCheckBox() { fitOnLoadElt.checked = fitOnLoad; } -function updateFitConfig(config) { +function updateFitConfig(config: FitOptions): void { log('Updating fit config', config); fitOptions.margin = config.margin || fitOptions.margin; @@ -57,8 +58,8 @@ function updateFitConfig(config) { } } -function configureFitTypeSelect() { - const fitTypeSelectedElt = document.getElementById('fitType-selected'); +function configureFitTypeSelect(): void { + const fitTypeSelectedElt = document.getElementById('fitType-selected'); fitTypeSelectedElt.onchange = event => { updateFitConfig({ type: event.target.value }); fit(fitOptions); @@ -71,29 +72,29 @@ function configureFitTypeSelect() { } } -function configureFitMarginInput() { - const fitMarginElt = document.getElementById('fit-margin'); +function configureFitMarginInput(): void { + const fitMarginElt = document.getElementById('fit-margin'); fitMarginElt.onchange = event => { updateFitConfig({ margin: event.target.value }); fit(fitOptions); }; if (fitOptions.margin) { - fitMarginElt.value = fitOptions.margin; + fitMarginElt.value = String(fitOptions.margin); } else { - updateFitConfig({ margin: fitMarginElt.value }); + updateFitConfig({ margin: Number(fitMarginElt.value) }); } } -function configureZoomButtons() { +function configureZoomButtons(): void { Object.values(ZoomType).forEach(zoomType => { document.getElementById(`zoom-${zoomType}`).onclick = () => zoom(zoomType); }); document.getElementById(`zoom-reset`).onclick = () => fit(fitOptions); } -function configureThemeSelect() { - const themeSelectedElt = document.getElementById('theme-selected'); +function configureThemeSelect(): void { + const themeSelectedElt = document.getElementById('theme-selected'); themeSelectedElt.onchange = event => { switchTheme(event.target.value); }; @@ -104,7 +105,7 @@ function configureThemeSelect() { } } -function configureDisplayedFooterContent() { +function configureDisplayedFooterContent(): void { const version = getVersion(); const versionAsString = `bpmn-visualization@${version.lib}`; const dependenciesAsString = [...version.dependencies].map(([name, version]) => `${name}@${version}`).join('/'); @@ -115,7 +116,7 @@ function configureDisplayedFooterContent() { // The following function `preventZoomingPage` serves to block the page content zoom. // It is to make zooming of the actual diagram area more convenient for the user. // Without that function, the zooming performed out of the diagram area can mess up the page layout. -function preventZoomingPage() { +function preventZoomingPage(): void { document.addEventListener( 'wheel', e => { @@ -125,7 +126,7 @@ function preventZoomingPage() { ); } -function startDemo() { +function startDemo(): void { preventZoomingPage(); const bpmnContainerId = 'bpmn-container'; From 9624d282fc44a051d00f29d4eae2160dda5e96e4 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 16:38:09 +0200 Subject: [PATCH 24/33] bpmn-rendering.ts: restore function declaration --- dev/ts/pages/bpmn-rendering.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/dev/ts/pages/bpmn-rendering.ts b/dev/ts/pages/bpmn-rendering.ts index 7cc1dabe71..0fc783ef5a 100644 --- a/dev/ts/pages/bpmn-rendering.ts +++ b/dev/ts/pages/bpmn-rendering.ts @@ -16,12 +16,12 @@ limitations under the License. import { documentReady, log, logError, startBpmnVisualization } from '../dev-bundle-index'; -const statusFetchKO = (errorMsg: string): void => { +function statusFetchKO(errorMsg: string): void { logError(errorMsg); const statusElt = document.getElementById('status-zone'); statusElt.innerText = errorMsg; statusElt.className = 'status-ko'; log('Status zone set with error:', errorMsg); -}; +} documentReady(() => startBpmnVisualization({ globalOptions: { container: 'bpmn-container' }, statusKoNotifier: statusFetchKO })); From cb8afbe1f196124bdc7e8ca22d5eeeb6c8c59668 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:08:14 +0200 Subject: [PATCH 25/33] WIP fix TS error --- dev/ts/dev-bundle-index.ts | 1 + dev/ts/pages/elements-identification.ts | 34 ++++++++++++++--------- dev/ts/shared/temp.ts | 37 +++++++++++++++++++++++++ 3 files changed, 59 insertions(+), 13 deletions(-) create mode 100644 dev/ts/shared/temp.ts diff --git a/dev/ts/dev-bundle-index.ts b/dev/ts/dev-bundle-index.ts index 9c6dcead67..b29ec87026 100644 --- a/dev/ts/dev-bundle-index.ts +++ b/dev/ts/dev-bundle-index.ts @@ -17,4 +17,5 @@ limitations under the License. export * from './shared/controls'; export * from './shared/main'; export * from './shared/shared-helpers'; +export * from './shared/temp'; export * from '../../src/bpmn-visualization'; diff --git a/dev/ts/pages/elements-identification.ts b/dev/ts/pages/elements-identification.ts index 47ddabccbe..b18f5da27c 100644 --- a/dev/ts/pages/elements-identification.ts +++ b/dev/ts/pages/elements-identification.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import type { BpmnElement, BpmnElementKind, Overlay, ShapeStyleUpdate } from '../dev-bundle-index'; +import type { BpmnElement, BpmnElementKind, Overlay, ShapeStyleUpdate, StyleUpdate, FlowKind } from '../dev-bundle-index'; import { addCssClasses, addOverlays, @@ -35,6 +35,8 @@ import { getParentElementIds, ShapeBpmnElementKind, isChildOfSubProcess, + isFlowKind, + toShapeBpmnElementKind, } from '../dev-bundle-index'; let lastIdentifiedBpmnIds: string[] = []; @@ -44,9 +46,22 @@ const cssClassName = 'detection'; let isOverlaysDisplayed = true; let useCSS = true; -// TODO should be BpmnElementKind -function computeStyleUpdateByKind(bpmnKind: ShapeBpmnElementKind): ShapeStyleUpdate { +function computeStyleUpdateByKind(bpmnKind: BpmnElementKind): StyleUpdate { const style: ShapeStyleUpdate = { font: {}, fill: {}, stroke: {} }; + + if (isFlowKind(bpmnKind)) { + switch (bpmnKind as FlowKind) { + case 'messageFlow': + case 'sequenceFlow': + case 'association': + style.font.color = 'Chocolate'; + style.stroke.color = 'Chocolate'; + style.stroke.width = 4; + break; + } + return style; + } + if (ShapeUtil.isTask(bpmnKind)) { style.font.color = 'Indigo'; style.fill.color = 'gold'; @@ -101,13 +116,6 @@ function computeStyleUpdateByKind(bpmnKind: ShapeBpmnElementKind): ShapeStyleUpd style.stroke.color = 'Chartreuse'; style.stroke.width = 6; break; - case 'messageFlow': - case 'sequenceFlow': - case 'association': - style.font.color = 'Chocolate'; - style.stroke.color = 'Chocolate'; - style.stroke.width = 4; - break; } } return style; @@ -193,7 +201,7 @@ function resetTextArea(): void { function configureControls(): void { const selectedKindElt = document.getElementById('bpmn-kinds-select'); selectedKindElt.onchange = event => updateSelectedBPMNElements(event.target.value); - document.addEventListener('diagramLoaded', () => updateSelectedBPMNElements(selectedKindElt.value), false); + document.addEventListener('diagramLoaded', () => updateSelectedBPMNElements(toShapeBpmnElementKind(selectedKindElt.value)), false); document.getElementById('clear-btn').onclick = function () { resetTextArea(); @@ -210,7 +218,7 @@ function configureControls(): void { checkboxDisplayOverlaysElt.addEventListener('change', function () { isOverlaysDisplayed = this.checked; log('Request overlays display:', isOverlaysDisplayed); - updateSelectedBPMNElements(selectedKindElt.value); + updateSelectedBPMNElements(toShapeBpmnElementKind(selectedKindElt.value)); }); checkboxDisplayOverlaysElt.checked = isOverlaysDisplayed; @@ -225,7 +233,7 @@ function configureControls(): void { addCssClasses(lastIdentifiedBpmnIds, cssClassName); } else { removeCssClasses(lastIdentifiedBpmnIds, cssClassName); - updateStyleByAPI(lastIdentifiedBpmnIds, selectedKindElt.value); + updateStyleByAPI(lastIdentifiedBpmnIds, toShapeBpmnElementKind(selectedKindElt.value)); } }); checkboxUseCSSElt.checked = useCSS; diff --git a/dev/ts/shared/temp.ts b/dev/ts/shared/temp.ts new file mode 100644 index 0000000000..15407f0af9 --- /dev/null +++ b/dev/ts/shared/temp.ts @@ -0,0 +1,37 @@ +/* +Copyright 2023 Bonitasoft S.A. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + +http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { FlowKind, ShapeBpmnElementKind } from '../../../src/model/bpmn/internal'; + +// TODO duplicated with mxgraph/renderer function +export function isFlowKind(kind: string): kind is FlowKind { + return Object.values(FlowKind) + .map(value => value as string) + .includes(kind); +} + +function isShapeBpmnElementKind(kind: string): kind is ShapeBpmnElementKind { + return Object.values(ShapeBpmnElementKind) + .map(value => value as string) + .includes(kind); +} + +export function toShapeBpmnElementKind(value: string): ShapeBpmnElementKind | null { + if (isShapeBpmnElementKind(value)) { + return value; + } + return null; +} From 45e3615499caee45613f8e1720166eef148cf007 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:13:52 +0200 Subject: [PATCH 26/33] WIP fix TS error --- dev/ts/pages/index.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/dev/ts/pages/index.ts b/dev/ts/pages/index.ts index ded15fa2ee..2ceef1366c 100644 --- a/dev/ts/pages/index.ts +++ b/dev/ts/pages/index.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import type { FitOptions } from '../dev-bundle-index'; +import type { FitOptions, FitType } from '../dev-bundle-index'; import { documentReady, handleFileSelect, @@ -68,7 +68,7 @@ function configureFitTypeSelect(): void { if (fitOptions.type) { fitTypeSelectedElt.value = fitOptions.type; } else { - updateFitConfig({ type: fitTypeSelectedElt.value }); + updateFitConfig({ type: fitTypeSelectedElt.value as FitType }); } } From f34787f46f4af1c970cf4d51f94cc1785a2fb71e Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:17:18 +0200 Subject: [PATCH 27/33] WIP fix TS error --- dev/ts/pages/elements-identification.ts | 9 ++++----- dev/ts/shared/temp.ts | 15 +-------------- 2 files changed, 5 insertions(+), 19 deletions(-) diff --git a/dev/ts/pages/elements-identification.ts b/dev/ts/pages/elements-identification.ts index b18f5da27c..e5f8cd7fd4 100644 --- a/dev/ts/pages/elements-identification.ts +++ b/dev/ts/pages/elements-identification.ts @@ -36,7 +36,6 @@ import { ShapeBpmnElementKind, isChildOfSubProcess, isFlowKind, - toShapeBpmnElementKind, } from '../dev-bundle-index'; let lastIdentifiedBpmnIds: string[] = []; @@ -200,8 +199,8 @@ function resetTextArea(): void { function configureControls(): void { const selectedKindElt = document.getElementById('bpmn-kinds-select'); - selectedKindElt.onchange = event => updateSelectedBPMNElements(event.target.value); - document.addEventListener('diagramLoaded', () => updateSelectedBPMNElements(toShapeBpmnElementKind(selectedKindElt.value)), false); + selectedKindElt.onchange = event => updateSelectedBPMNElements((event.target).value as ShapeBpmnElementKind); + document.addEventListener('diagramLoaded', () => updateSelectedBPMNElements(selectedKindElt.value as ShapeBpmnElementKind), false); document.getElementById('clear-btn').onclick = function () { resetTextArea(); @@ -218,7 +217,7 @@ function configureControls(): void { checkboxDisplayOverlaysElt.addEventListener('change', function () { isOverlaysDisplayed = this.checked; log('Request overlays display:', isOverlaysDisplayed); - updateSelectedBPMNElements(toShapeBpmnElementKind(selectedKindElt.value)); + updateSelectedBPMNElements(selectedKindElt.value as ShapeBpmnElementKind); }); checkboxDisplayOverlaysElt.checked = isOverlaysDisplayed; @@ -233,7 +232,7 @@ function configureControls(): void { addCssClasses(lastIdentifiedBpmnIds, cssClassName); } else { removeCssClasses(lastIdentifiedBpmnIds, cssClassName); - updateStyleByAPI(lastIdentifiedBpmnIds, toShapeBpmnElementKind(selectedKindElt.value)); + updateStyleByAPI(lastIdentifiedBpmnIds, selectedKindElt.value as ShapeBpmnElementKind); } }); checkboxUseCSSElt.checked = useCSS; diff --git a/dev/ts/shared/temp.ts b/dev/ts/shared/temp.ts index 15407f0af9..37fddd91b2 100644 --- a/dev/ts/shared/temp.ts +++ b/dev/ts/shared/temp.ts @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { FlowKind, ShapeBpmnElementKind } from '../../../src/model/bpmn/internal'; +import { FlowKind } from '../../../src/model/bpmn/internal'; // TODO duplicated with mxgraph/renderer function export function isFlowKind(kind: string): kind is FlowKind { @@ -22,16 +22,3 @@ export function isFlowKind(kind: string): kind is FlowKind { .map(value => value as string) .includes(kind); } - -function isShapeBpmnElementKind(kind: string): kind is ShapeBpmnElementKind { - return Object.values(ShapeBpmnElementKind) - .map(value => value as string) - .includes(kind); -} - -export function toShapeBpmnElementKind(value: string): ShapeBpmnElementKind | null { - if (isShapeBpmnElementKind(value)) { - return value; - } - return null; -} From 07e3a96f3b59166cd36b5853df2dd9a09b393648 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:19:27 +0200 Subject: [PATCH 28/33] WIP fix TS error --- dev/ts/pages/index.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/dev/ts/pages/index.ts b/dev/ts/pages/index.ts index 2ceef1366c..f3985d9979 100644 --- a/dev/ts/pages/index.ts +++ b/dev/ts/pages/index.ts @@ -37,7 +37,7 @@ let fitOptions: FitOptions = {}; function configureFitOnLoadCheckBox(): void { const fitOnLoadElt = document.getElementById('fitOnLoad'); fitOnLoadElt.onchange = event => { - fitOnLoad = event.target.checked; + fitOnLoad = (event.target).checked; log('Fit on load updated!', fitOnLoad); updateLoadOptions(fitOnLoad ? fitOptions : {}); }; @@ -61,7 +61,7 @@ function updateFitConfig(config: FitOptions): void { function configureFitTypeSelect(): void { const fitTypeSelectedElt = document.getElementById('fitType-selected'); fitTypeSelectedElt.onchange = event => { - updateFitConfig({ type: event.target.value }); + updateFitConfig({ type: (event.target).value as FitType }); fit(fitOptions); }; @@ -75,7 +75,7 @@ function configureFitTypeSelect(): void { function configureFitMarginInput(): void { const fitMarginElt = document.getElementById('fit-margin'); fitMarginElt.onchange = event => { - updateFitConfig({ margin: event.target.value }); + updateFitConfig({ margin: Number((event.target).value) }); fit(fitOptions); }; @@ -96,7 +96,7 @@ function configureZoomButtons(): void { function configureThemeSelect(): void { const themeSelectedElt = document.getElementById('theme-selected'); themeSelectedElt.onchange = event => { - switchTheme(event.target.value); + switchTheme((event.target).value); }; const currentTheme = getCurrentTheme(); From 12ccd26a4df19cb4505347f53b001bdaee49497d Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:26:12 +0200 Subject: [PATCH 29/33] WIP fix TS error --- dev/ts/pages/index.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/dev/ts/pages/index.ts b/dev/ts/pages/index.ts index f3985d9979..d9e1ee105c 100644 --- a/dev/ts/pages/index.ts +++ b/dev/ts/pages/index.ts @@ -119,10 +119,10 @@ function configureDisplayedFooterContent(): void { function preventZoomingPage(): void { document.addEventListener( 'wheel', - e => { - if (e.ctrlKey) e.preventDefault(); // prevent whole page zoom + (ev: WheelEvent): void => { + if (ev.ctrlKey) ev.preventDefault(); // prevent whole page zoom }, - { passive: false, capture: 'bubble' }, + { passive: false, capture: true }, ); } From d06c0c622967b07eddad2de17d16215d87e7a9e7 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:32:38 +0200 Subject: [PATCH 30/33] extra utils code from mxgraph/renderer to reuse in the demo --- dev/ts/dev-bundle-index.ts | 3 ++- src/component/mxgraph/renderer/style-utils.ts | 11 +++-------- .../temp.ts => src/model/bpmn/internal/edge/utils.ts | 4 ++-- 3 files changed, 7 insertions(+), 11 deletions(-) rename dev/ts/shared/temp.ts => src/model/bpmn/internal/edge/utils.ts (86%) diff --git a/dev/ts/dev-bundle-index.ts b/dev/ts/dev-bundle-index.ts index b29ec87026..1262e04132 100644 --- a/dev/ts/dev-bundle-index.ts +++ b/dev/ts/dev-bundle-index.ts @@ -17,5 +17,6 @@ limitations under the License. export * from './shared/controls'; export * from './shared/main'; export * from './shared/shared-helpers'; -export * from './shared/temp'; export * from '../../src/bpmn-visualization'; +// extra code not exported by bpmn-visualization +export * from '../../src/model/bpmn/internal/edge/utils'; diff --git a/src/component/mxgraph/renderer/style-utils.ts b/src/component/mxgraph/renderer/style-utils.ts index 43ea496a38..d183006f72 100644 --- a/src/component/mxgraph/renderer/style-utils.ts +++ b/src/component/mxgraph/renderer/style-utils.ts @@ -15,8 +15,9 @@ limitations under the License. */ import type { mxCell } from 'mxgraph'; -import { FlowKind, ShapeUtil } from '../../../model/bpmn/internal'; -import { BpmnStyleIdentifier } from '../style/identifiers'; +import { ShapeUtil } from '../../../model/bpmn/internal'; +import { isFlowKind } from '../../../model/bpmn/internal/edge/utils'; +import { BpmnStyleIdentifier } from '../style'; /** * Compute the all class names associated to a cell in a hyphen case form. @@ -86,12 +87,6 @@ export function computeAllBpmnClassNames(style: string, isLabel: boolean): strin return classes; } -function isFlowKind(kind: string): boolean { - return Object.values(FlowKind) - .map(value => value as string) - .includes(kind); -} - /** * Compute the class name in a hyphen case form. * For instance, `userTask` returns `bpmn-user-task` diff --git a/dev/ts/shared/temp.ts b/src/model/bpmn/internal/edge/utils.ts similarity index 86% rename from dev/ts/shared/temp.ts rename to src/model/bpmn/internal/edge/utils.ts index 37fddd91b2..5ec6632003 100644 --- a/dev/ts/shared/temp.ts +++ b/src/model/bpmn/internal/edge/utils.ts @@ -14,9 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { FlowKind } from '../../../src/model/bpmn/internal'; +import { FlowKind } from './kinds'; -// TODO duplicated with mxgraph/renderer function +/** @internal */ export function isFlowKind(kind: string): kind is FlowKind { return Object.values(FlowKind) .map(value => value as string) From 077dbe0c5f04100dabd2bfee3c4ef1bd33fd2233 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:40:23 +0200 Subject: [PATCH 31/33] style-utils.ts: restore original style/identifiers import make some unit tests fail --- src/component/mxgraph/renderer/style-utils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/component/mxgraph/renderer/style-utils.ts b/src/component/mxgraph/renderer/style-utils.ts index d183006f72..c78a9e64dc 100644 --- a/src/component/mxgraph/renderer/style-utils.ts +++ b/src/component/mxgraph/renderer/style-utils.ts @@ -17,7 +17,7 @@ limitations under the License. import type { mxCell } from 'mxgraph'; import { ShapeUtil } from '../../../model/bpmn/internal'; import { isFlowKind } from '../../../model/bpmn/internal/edge/utils'; -import { BpmnStyleIdentifier } from '../style'; +import { BpmnStyleIdentifier } from '../style/identifiers'; /** * Compute the all class names associated to a cell in a hyphen case form. From 84d028a7b37c505db65df04ede4708e26e8631e5 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:41:05 +0200 Subject: [PATCH 32/33] index.ts: restore function parameter name --- dev/ts/pages/index.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/dev/ts/pages/index.ts b/dev/ts/pages/index.ts index d9e1ee105c..4920abf07e 100644 --- a/dev/ts/pages/index.ts +++ b/dev/ts/pages/index.ts @@ -119,8 +119,8 @@ function configureDisplayedFooterContent(): void { function preventZoomingPage(): void { document.addEventListener( 'wheel', - (ev: WheelEvent): void => { - if (ev.ctrlKey) ev.preventDefault(); // prevent whole page zoom + (e: WheelEvent): void => { + if (e.ctrlKey) e.preventDefault(); // prevent whole page zoom }, { passive: false, capture: true }, ); From 78095e45149ca0ba83d053f2d6a9fbeb95619fa2 Mon Sep 17 00:00:00 2001 From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com> Date: Thu, 17 Aug 2023 17:47:32 +0200 Subject: [PATCH 33/33] controls.ts: remove usage of ts-ignore --- dev/ts/shared/controls.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/dev/ts/shared/controls.ts b/dev/ts/shared/controls.ts index 7bcea6813d..55fd3df5bd 100644 --- a/dev/ts/shared/controls.ts +++ b/dev/ts/shared/controls.ts @@ -85,9 +85,7 @@ function showMousePointer(): void { ); function updateButtons(buttons: number): void { for (let i = 0; i < 5; i++) { - // eslint-disable-next-line @typescript-eslint/ban-ts-comment - // @ts-ignore - box.classList.toggle('button-' + i, buttons & (1 << i)); + box.classList.toggle('button-' + i, (buttons & (1 << i)) > 0); } } }