diff --git a/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/LogicBuilderWorkspaceType.ts b/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/LogicBuilderWorkspaceType.ts new file mode 100644 index 0000000..0e9f313 --- /dev/null +++ b/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/LogicBuilderWorkspaceType.ts @@ -0,0 +1,112 @@ +import { EventDispatcher } from '../../../../../../shared/utils/EventDispatcher'; +import { TypeView } from '../TypeView'; +import { getEditType } from '../utils'; + +/** + * Custom editor for Logic Builder workspace parameter + * Shows an "Edit Blocks" button that opens the Blockly editor in a tab + */ +export class LogicBuilderWorkspaceType extends TypeView { + el: TSFixme; + editButton: JQuery; + + static fromPort(args) { + const view = new LogicBuilderWorkspaceType(); + + const p = args.port; + const parent = args.parent; + + view.port = p; + view.displayName = p.displayName ? p.displayName : p.name; + view.name = p.name; + view.type = getEditType(p); + view.group = p.group; + view.tooltip = p.tooltip; + view.value = parent.model.getParameter(p.name); + view.parent = parent; + view.isConnected = parent.model.isPortConnected(p.name, 'target'); + view.isDefault = parent.model.parameters[p.name] === undefined; + + return view; + } + + render() { + // Create a simple container with a button + const html = ` +
+
+ +
${this.displayName}
+
+ +
+ `; + + this.el = this.bindView($(html), this); + + // Get reference to button + this.editButton = this.el.find('.edit-blocks-button'); + + // Handle button click + this.editButton.on('click', () => { + this.onEditBlocksClicked(); + }); + + // Call parent render for common functionality (tooltips, etc.) + TypeView.prototype.render.call(this); + + // Show/hide the "changed" dot based on whether value is default + this.updateChangedDot(); + + return this.el; + } + + onEditBlocksClicked() { + const nodeId = this.parent.model.id; + const nodeName = this.parent.model.label || this.parent.model.getDisplayName() || 'Logic Builder'; + const workspace = this.parent.model.getParameter('workspace') || ''; + + console.log('[LogicBuilderWorkspaceType] Opening tab for node:', nodeId); + + // Emit event to open Logic Builder tab + EventDispatcher.instance.emit('LogicBuilder.OpenTab', { + nodeId, + nodeName, + workspace + }); + } + + updateChangedDot() { + const dot = this.el.find('.property-changed-dot'); + if (this.isDefault) { + dot.hide(); + } else { + dot.show(); + } + } + + resetToDefault() { + // Reset workspace to empty + this.parent.model.setParameter(this.name, undefined, { + undo: true, + label: 'reset workspace' + }); + this.isDefault = true; + this.updateChangedDot(); + } +} diff --git a/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/Ports.ts b/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/Ports.ts index e998749..623a2c9 100644 --- a/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/Ports.ts +++ b/packages/noodl-editor/src/editor/src/views/panels/propertyeditor/DataTypes/Ports.ts @@ -21,6 +21,7 @@ import { FontType } from './FontType'; import { IconType } from './IconType'; import { IdentifierType } from './IdentifierType'; import { ImageType } from './ImageType'; +import { LogicBuilderWorkspaceType } from './LogicBuilderWorkspaceType'; import { MarginPaddingType } from './MarginPaddingType'; import { NumberWithUnits } from './NumberWithUnits'; import { PopoutGroup } from './PopoutGroup'; @@ -220,6 +221,11 @@ export class Ports extends View { viewClassForPort(p) { const type = getEditType(p); + // Check for custom editorType + if (typeof type === 'object' && type.editorType === 'logic-builder-workspace') { + return LogicBuilderWorkspaceType; + } + // Align tools types function isOfAlignToolsType() { return NodeLibrary.nameForPortType(type) === 'enum' && typeof type === 'object' && type.alignComp !== undefined; diff --git a/packages/noodl-runtime/src/nodes/std-library/logic-builder.js b/packages/noodl-runtime/src/nodes/std-library/logic-builder.js index b70ffaa..fdfb8b1 100644 --- a/packages/noodl-runtime/src/nodes/std-library/logic-builder.js +++ b/packages/noodl-runtime/src/nodes/std-library/logic-builder.js @@ -203,7 +203,8 @@ const LogicBuilderNode = { group: 'General', type: { name: 'string', - allowEditOnly: true + allowEditOnly: true, + editorType: 'logic-builder-workspace' }, displayName: 'Workspace', set: function (value) {