README.md

Hacktoberfest custom themes

DISCLAIMER: this demo uses extension points that are very experimental and are subject to change.
In particular, the way of changing the defaults will be done via configuration in the future.

Javascript example

• ⏩ live environment
• to run locally, open the index.html directly in a Web Browser

♻️ Usage

Override the BPMN element styles using various ways. mxGraph knowledge is required to handle style changes. See the development documentation for more information.

⚠️ In order to avoid having to many content in the README, we simplify it. You can find all the content of the example in index.js.

Content:

• override the StyleConstant default values, like Custom fonts & Custom colors
• extend the lib class entry point, like Custom fonts & Custom colors
• override the default IconPainter, like Custom User Task icon
• update the label value of a cell :warning: If you try to reload each graph, all the style configuration is overridden (even if you try to save/restore the configuration)

inputProjectName.oninput = function(event) {
    let projectName = event.target.value;
    bpmn = bpmnDiagram(projectName);

    const cell = bpmnVisualization.graph.model.getCell("call_activity");
    bpmnVisualization.graph.model.setValue(cell, `Contribute to ${projectName} 🔧`);
};