@node-projects/web-component-designer-visualization-addons 0.1.14 → 0.1.15

package/dist/components/EventAssignment.d.ts

@@ -6,7 +6,7 @@ type scriptType = 'jsdirect' | 'js' | 'script' | 'blockly' | 'none';
 export declare class EventAssignment extends BaseCustomWebComponentConstructorAppend {
     static style: CSSStyleSheet;
     static template: HTMLTemplateElement;
-    static evtEdit: HTMLTemplateElement;
+    static editRowTemplate: HTMLTemplateElement;
     static scriptTypeColors: {
         js: string;
         blockly: string;
@@ -25,7 +25,8 @@ export declare class EventAssignment extends BaseCustomWebComponentConstructorAp
     events: IEvent[];
     initialize(visualizationHandler: VisualizationHandler, visualizationShell: VisualizationShell, scriptCommandsTypeInfo: any, propertiesTypeInfo: any): void;
     set instanceServiceContainer(value: InstanceServiceContainer);
-    protected _createControlsForScript(eventItem: IEvent): Node | "";
+    protected _createControlsForScript(eventItem: IEvent): any;
+    protected _hasParameters(eventItem: IEvent): boolean;
     protected _getScriptTypeColor(eventItem: IEvent): any;
     protected _getScriptType(eventItem: IEvent): scriptType;
     protected _getEventMethodname(eventItem: IEvent): string;

package/dist/components/EventAssignment.js

@@ -25,6 +25,9 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
             width: 100%;
             box-sizing: border-box;
         }
+        input::placeholder {
+            font-size: 8px;
+        }
         a {
             cursor: pointer;
         }
@@ -43,11 +46,11 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
         </template>
         <span style="grid-column: 1 / span 3; margin-top: 8px; margin-left: 3px;">add event:</span>
         <input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress=[[this._addEvent(event)]] type="text">`;
-    static evtEdit = html `
+    static editRowTemplate = html `
             <div style="display: flex; justify-content: flex-end;">
-                <input title="name" style="min-width: 30px; flex-basis: 30px; flex-grow: 2;" class="mth" type="text">
-                <input title="relative signals path" style="min-width: 20px; flex-basis: 20px; flex-grow: 1;" class="mth" type="text">
-                <button style="display: flex; padding: 0; flex-grow: 0;" title="parameter" @click="[[this._editParameter(event, item)]]">p</button>
+                <input hidden="[[this._getScriptType(item) !== 'js']]" placeholder="name" title="name" style="min-width: 50px; flex-basis: 30px; flex-grow: 2;" class="mth" type="text">
+                <input placeholder="relative signals path" title="relative signals path" style="min-width: 50px; flex-basis: 20px; flex-grow: 1;" class="mth" type="text">
+                <button css:background="[[this._hasParameters(item) ? 'lime' : '']]" style="display: flex; padding: 0; flex-grow: 0;" title="parameter" @click="[[this._editParameter(event, item)]]">p</button>
             </div>`;
     static scriptTypeColors = {
         'js': 'purple',
@@ -90,9 +93,17 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
             case 'none':
                 return '';
         }
-        const ctl = EventAssignment.evtEdit.content.cloneNode(true);
+        //@ts-ignore
+        const ctl = this.constructor.editRowTemplate.content.cloneNode(true);
         return ctl;
     }
+    _hasParameters(eventItem) {
+        if (this.selectedItems[0].hasAttribute('@' + eventItem.name)) {
+            const val = this.selectedItems[0].getAttribute('@' + eventItem.name);
+            return val.includes('parameters');
+        }
+        return false;
+    }
     _getScriptTypeColor(eventItem) {
         const st = this._getScriptType(eventItem);
         const color = EventAssignment.scriptTypeColors[st];
@@ -215,8 +226,11 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
                 newObj = JSON.parse(data);
                 newObj.parameters = par;
             }
+            if (par == null)
+                delete newObj.parameters;
             const newData = JSON.stringify(newObj);
             this._selectedItems[0].setAttribute('@' + eventItem.name, newData);
+            this._bindingsRefresh();
         }
     }
     async _editBlockly(e, eventItem) {

package/dist/index.d.ts

@@ -7,6 +7,7 @@ export * from './components/BindingsEditorHistoric.js';
 export * from './components/SimpleScriptEditor.js';
 export * from './components/VisualizationPropertyGrid.js';
 export * from './components/ParameterEditor.js';
+export * from './components/EventAssignment.js';
 export * from './helpers/BindingsHelper.js';
 export * from './interfaces/IScriptMultiplexValue.js';
 export * from './interfaces/VisualisationElementScript.js';

package/dist/index.js

@@ -7,6 +7,7 @@ export * from './components/BindingsEditorHistoric.js';
 export * from './components/SimpleScriptEditor.js';
 export * from './components/VisualizationPropertyGrid.js';
 export * from './components/ParameterEditor.js';
+export * from './components/EventAssignment.js';
 export * from './helpers/BindingsHelper.js';
 export * from './interfaces/IScriptMultiplexValue.js';
 export * from './interfaces/VisualisationElementScript.js';

package/dist/services/ScriptRefactorService.js

@@ -65,6 +65,13 @@ export class ScriptRefactorService {
                         }
                         else if ('blocks' in script) {
                         }
+                        if ('parameters' in script) {
+                            for (let p in script.parameters) {
+                                if (typeof script.parameters[p] === 'string') {
+                                    refactorings.push({ name: script.parameters[p], itemType: 'parameter', target: BindingTarget.event, targetName: a[0], service: this, designItem: d, type: 'script', sourceObject: script, display: 'parameters/' + p, refactor: newValue => script.parameters[p] = newValue });
+                                }
+                            }
+                        }
                     }
                 }
             }

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "web-component-designer addon for visualizations",
   "name": "@node-projects/web-component-designer-visualization-addons",
-  "version": "0.1.14",
+  "version": "0.1.15",
   "type": "module",
   "main": "./dist/index.js",
   "author": "jochen.kuehner@gmx.de",