add command and basic testing setup

Author: Kr0nox

src/features/labels/commands.ts

@@ -4,6 +4,8 @@ import {
     CommandExecutionContext,
     CommandReturn,
     ISnapper,
+    isSelected,
+    SChildElementImpl,
     SModelElementImpl,
     SNodeImpl,
     SParentElementImpl,
@@ -314,3 +316,171 @@ export class DeleteLabelTypeCommand extends Command {
         return this.execute(context);
     }
 }
+
+interface LabelToAllOrSelectionAction extends Action {
+    labelAssignment: LabelAssignment;
+}
+
+abstract class LabelToAllOrSelectionCommand extends Command {
+    @inject(EditorModeController)
+    @optional()
+    protected readonly editorModeController?: EditorModeController;
+
+    protected elements?: SModelElementImpl[];
+
+    constructor(
+        @inject(TYPES.Action) protected action: LabelToAllOrSelectionAction,
+        @inject(TYPES.ISnapper) protected snapper: ISnapper,
+    ) {
+        super();
+    }
+
+    protected fetchElements(context: CommandExecutionContext): SModelElementImpl[] {
+        if (this.editorModeController?.isReadOnly()) {
+            return [];
+        }
+
+        const allElements = getAllElements(context.root.children);
+        const selectedElements = allElements.filter((element) => isSelected(element));
+        return selectedElements.length === 0 ? allElements : selectedElements;
+    }
+
+    protected addLabel(context: CommandExecutionContext) {
+        if (this.editorModeController?.isReadOnly()) {
+            return context.root;
+        }
+
+        if (this.elements === undefined) {
+            this.elements = this.fetchElements(context);
+        }
+
+        this.elements.forEach((element) => {
+            if (containsDfdLabels(element)) {
+                const hasBeenAdded =
+                    element.labels.find((as) => {
+                        return (
+                            as.labelTypeId === this.action.labelAssignment.labelTypeId &&
+                            as.labelTypeValueId === this.action.labelAssignment.labelTypeValueId
+                        );
+                    }) !== undefined;
+                if (!hasBeenAdded) {
+                    element.labels.push(this.action.labelAssignment);
+                    if (element instanceof SNodeImpl) {
+                        snapPortsOfNode(element, this.snapper);
+                    }
+                }
+            }
+        });
+
+        return context.root;
+    }
+
+    protected removeLabel(context: CommandExecutionContext) {
+        if (this.editorModeController?.isReadOnly()) {
+            return context.root;
+        }
+
+        if (this.elements === undefined) {
+            this.elements = this.fetchElements(context);
+        }
+
+        this.elements.forEach((element) => {
+            if (containsDfdLabels(element)) {
+                const labels = element.labels;
+                const idx = labels.findIndex(
+                    (l) =>
+                        l.labelTypeId == this.action.labelAssignment.labelTypeId &&
+                        l.labelTypeValueId == this.action.labelAssignment.labelTypeValueId,
+                );
+                if (idx >= 0) {
+                    labels.splice(idx, 1);
+                    if (element instanceof SNodeImpl) {
+                        snapPortsOfNode(element, this.snapper);
+                    }
+                }
+            }
+        });
+
+        return context.root;
+    }
+}
+
+export interface AddLabelToAllOrSelectionAction extends LabelToAllOrSelectionAction {
+    kind: typeof AddLabelToAllOrSelectionAction.TYPE;
+}
+export namespace AddLabelToAllOrSelectionAction {
+    export const TYPE = "add-label-to-all-or-selection";
+    export function create(labelAssignment: LabelAssignment): AddLabelToAllOrSelectionAction {
+        return {
+            kind: TYPE,
+            labelAssignment,
+        };
+    }
+}
+@injectable()
+export class AddLabelToAllOrSelectionCommand extends LabelToAllOrSelectionCommand {
+    public static readonly KIND = AddLabelToAllOrSelectionAction.TYPE;
+
+    constructor(@inject(TYPES.Action) action: AddLabelAssignmentAction, @inject(TYPES.ISnapper) snapper: ISnapper) {
+        super(action, snapper);
+    }
+
+    execute(context: CommandExecutionContext): CommandReturn {
+        return this.addLabel(context);
+    }
+
+    undo(context: CommandExecutionContext): CommandReturn {
+        return this.removeLabel(context);
+    }
+
+    redo(context: CommandExecutionContext): CommandReturn {
+        return this.execute(context);
+    }
+}
+
+export interface DeleteLabelFromAllOrSelectionAction extends LabelToAllOrSelectionAction {
+    kind: typeof DeleteLabelFromAllOrSelectionAction.TYPE;
+}
+export namespace DeleteLabelFromAllOrSelectionAction {
+    export const TYPE = "delete-label-from-all-or-selection";
+    export function create(labelAssignment: LabelAssignment): DeleteLabelFromAllOrSelectionAction {
+        return {
+            kind: TYPE,
+            labelAssignment,
+        };
+    }
+}
+@injectable()
+export class DeleteLabelFromAllOrSelectionCommand extends LabelToAllOrSelectionCommand {
+    public static readonly KIND = DeleteLabelFromAllOrSelectionAction.TYPE;
+
+    constructor(
+        @inject(TYPES.Action) action: DeleteLabelFromAllOrSelectionAction,
+        @inject(TYPES.ISnapper) snapper: ISnapper,
+    ) {
+        super(action, snapper);
+    }
+
+    execute(context: CommandExecutionContext): CommandReturn {
+        return this.removeLabel(context);
+    }
+
+    undo(context: CommandExecutionContext): CommandReturn {
+        return this.addLabel(context);
+    }
+
+    redo(context: CommandExecutionContext): CommandReturn {
+        return this.execute(context);
+    }
+}
+
+function getAllElements(elements: readonly SChildElementImpl[]): SModelElementImpl[] {
+    const elementsList: SModelElementImpl[] = [];
+    for (const element of elements) {
+        elementsList.push(element);
+        if ("children" in element) {
+            elementsList.push(...getAllElements(element.children));
+        }
+    }
+    return elementsList;
+}

src/features/labels/di.config.ts

@@ -7,7 +7,9 @@ import { LabelTypeEditorUI } from "./labelTypeEditor";
 import { TYPES, configureCommand } from "sprotty";
 import {
     AddLabelAssignmentCommand,
+    AddLabelToAllOrSelectionCommand,
     DeleteLabelAssignmentCommand,
+    DeleteLabelFromAllOrSelectionCommand,
     DeleteLabelTypeCommand,
     DeleteLabelTypeValueCommand,
 } from "./commands";
@@ -32,4 +34,7 @@ export const dfdLabelModule = new ContainerModule((bind, unbind, isBound, rebind
     configureCommand(context, DeleteLabelAssignmentCommand);
     configureCommand(context, DeleteLabelTypeValueCommand);
     configureCommand(context, DeleteLabelTypeCommand);
+
+    configureCommand(context, AddLabelToAllOrSelectionCommand);
+    configureCommand(context, DeleteLabelFromAllOrSelectionCommand);
 });

src/features/labels/labelTypeEditor.css

@@ -67,3 +67,10 @@ div.label-type-editor-ui {
 #accordion-state-label-title {
     padding-right: 5px;
 }
+
+.label-all {
+    border: 1px solid var(--color-foreground);
+    border-radius: 20px;
+    padding: 3px 6px;
+    margin-top: 4px;
+}

src/features/labels/labelTypeEditor.ts

@@ -11,7 +11,12 @@ import {
     TYPES,
 } from "sprotty";
 import { LabelAssignment, LabelType, LabelTypeRegistry, LabelTypeValue } from "./labelTypeRegistry";
-import { DeleteLabelTypeAction, DeleteLabelTypeValueAction } from "./commands";
+import {
+    AddLabelToAllOrSelectionAction,
+    DeleteLabelFromAllOrSelectionAction,
+    DeleteLabelTypeAction,
+    DeleteLabelTypeValueAction,
+} from "./commands";
 import { LABEL_ASSIGNMENT_MIME_TYPE } from "./dropListener";
 import { Action } from "sprotty-protocol";
 import { snapPortsOfNode } from "../dfdElements/portSnapper";
@@ -133,6 +138,8 @@ export class LabelTypeEditorUI extends AbstractUIExtension implements KeyListene
             inputElement?.focus();
         };
         innerContainerElement.appendChild(addButton);
+        innerContainerElement.appendChild(this.buildAddToAllListener());
+        innerContainerElement.appendChild(this.buildDeleteFromAllListener());
     }
 
     private renderLabelType(labelType: LabelType): HTMLElement {
@@ -347,4 +354,40 @@ export class LabelTypeEditorUI extends AbstractUIExtension implements KeyListene
         const input = event.target as HTMLInputElement;
         input.value = input.value.replace(/[^a-zA-Z0-9_]/g, "");
     }
+
+    private buildAddToAllListener() {
+        const holder = document.createElement("div");
+        holder.classList.add("label-type-add-to-all", "label-all");
+        holder.innerHTML = "Add to all/selection";
+        holder.ondragover = (e: DragEvent) => {
+            e.preventDefault(); // Necessary to allow a drop
+        };
+        holder.ondrop = (e: DragEvent) => {
+            const labelAssignmentJson = e.dataTransfer?.getData(LABEL_ASSIGNMENT_MIME_TYPE);
+            if (!labelAssignmentJson) {
+                return;
+            }
+            const labelAssignment: LabelAssignment = JSON.parse(labelAssignmentJson);
+            this.actionDispatcher.dispatch(AddLabelToAllOrSelectionAction.create(labelAssignment));
+        };
+        return holder;
+    }
+
+    private buildDeleteFromAllListener() {
+        const holder = document.createElement("div");
+        holder.classList.add("label-type-delete-from-all", "label-all");
+        holder.innerHTML = "Delete from all/selection";
+        holder.ondragover = (e: DragEvent) => {
+            e.preventDefault(); // Necessary to allow a drop
+        };
+        holder.ondrop = (e: DragEvent) => {
+            const labelAssignmentJson = e.dataTransfer?.getData(LABEL_ASSIGNMENT_MIME_TYPE);
+            if (!labelAssignmentJson) {
+                return;
+            }
+            const labelAssignment: LabelAssignment = JSON.parse(labelAssignmentJson);
+            this.actionDispatcher.dispatch(DeleteLabelFromAllOrSelectionAction.create(labelAssignment));
+        };
+        return holder;
+    }
 }

src/features/serialize/defaultDiagram.json

@@ -209,7 +209,7 @@
                             "height": -1
                         },
                         "strokeWidth": 0,
-                        "selected": true,
+                        "selected": false,
                         "hoverFeedback": false,
                         "opacity": 1,
                         "behavior": "forward items",