Custom element creation


#1

I tried to create my own properties panel with custom extensions
I have moddle file

const moddle = {
    name: 'company',
    uri: 'http://company',
    prefix: 'company',
    xml: {
        tagAlias: 'lowerCase'
    },
    types: [
        {
            name: 'ExecutionListener',
            superClass: [ 'Element' ],
            meta: {
                allowedIn: [
                    'bpmn:Task'
                ]
            },
            properties: [
                {
                    name: 'resource',
                    isAttr: true,
                    type: 'String'
                },
                {
                    name: 'event',
                    isAttr: true,
                    type: 'String'
                },
                {
                    name: 'scriptFormat',
                    isAttr: true,
                    type: 'String'
                },
                {
                    name: 'id',
                    isAttr: true,
                    type: 'String'
                }
            ]
        },
        {
            name: 'InputOutputParameterDefinition',
            isAbstract: true
        },
        {
            name: 'Script',
            superClass: [ 'InputOutputParameterDefinition' ],
            properties: [
                {
                    name: 'scriptFormat',
                    isAttr: true,
                    type: 'String'
                },
                {
                    name: 'value',
                    isBody: true,
                    type: 'String'
                }
            ]
        },
    ]
};

And my creation script looks like

const listener = moddle.create('company:ExecutionListener');
const extensionElements = businessObject.extensionElements || moddle.create('bpmn:ExtensionElements');
const scriptTag = moddle.create('company:Script');
scriptTag.scriptFormat = 'script format';
scriptTag.value = 'value';
listener.script = scriptTag;
extensionElements.get('values').push(listener);
modeler.modeling.updateProperties(this.element, {extensionElements: extensionElements});

When I save diagram to server, there is no company:script tag inside company:executionListener.

I think the problem with my moddle file, but I can’t figure it out.

Thank you!


#2

When I save diagram to server, there is no company:script tag inside company:executionListener.

You did not define a slot for company:Script inside the company:ExecutionListener element.

What about adding the script property to it?

...
    types: [
        {
            name: 'ExecutionListener',
            superClass: [ 'Element' ],
            meta: {
                allowedIn: [
                    'bpmn:Task'
                ]
            },
            properties: [
                {
                    name: 'script',
                    type: 'Script'
                },
                ...

#3

Thank you!

It works.

I forgot reference type definition.