changed structure.

Author: b4rtaz

designer/src/behaviors/placeholder-finder.ts

@@ -14,6 +14,7 @@ export class PlaceholderFinder {
 		placeholder: Placeholder;
 		lt: Vector; // left top
 		br: Vector; // bottom right
+		diagSq: number; // left top diagonal squared
 	}[];
 
 	private constructor(
@@ -27,15 +28,17 @@ export class PlaceholderFinder {
 
 			this.cache = this.placeholders.map(placeholder => {
 				const rect = placeholder.getClientRect();
+				const lt = new Vector(rect.x, rect.y).add(scroll);
+				const br = new Vector(rect.x + rect.width, rect.y + rect.height).add(scroll);
 				return {
 					placeholder,
-					lt: new Vector(rect.x, rect.y).add(scroll),
-					br: new Vector(rect.x + rect.width, rect.y + rect.height).add(scroll)
+					lt,
+					br,
+					diagSq: lt.x * lt.x + lt.y * lt.y
 				};
 			});
-			this.cache.sort((a, b) => a.lt.y - b.lt.y);
+			this.cache.sort((a, b) => a.diagSq - b.diagSq);
 		}
-
 		const vR = vLt.x + vWidth;
 		const vB = vLt.y + vHeight;
 		return this.cache.find(p => {

designer/src/workspace/component.ts

@@ -25,7 +25,7 @@ export interface ComponentView {
 }
 
 export interface StepComponentView extends ComponentView {
-	sequenceComponents: SequenceComponent[] | null;
+	components: Component[] | null;
 	placeholders: Placeholder[] | null;
 
 	hasOutput: boolean;

designer/src/workspace/container-step/container-step-component-view.ts

@@ -47,7 +47,7 @@ export const createContainerStepComponentViewFactory =
 				height,
 				joinX,
 				placeholders: null,
-				sequenceComponents: [sequenceComponent],
+				components: [sequenceComponent],
 				hasOutput: sequenceComponent.hasOutput,
 
 				getClientPosition(): Vector {

designer/src/workspace/launch-pad-step/launch-pad-step-component-view.ts

@@ -142,7 +142,7 @@ function createView(
 		width,
 		height,
 		joinX,
-		sequenceComponents: components,
+		components,
 		placeholders,
 		hasOutput,
 

designer/src/workspace/sequence/default-sequence-component.ts

@@ -33,22 +33,20 @@ export class DefaultSequenceComponent implements SequenceComponent {
 
 	public findById(stepId: string): StepComponent | null {
 		for (const component of this.view.components) {
-			const sc = component.findById(stepId);
-			if (sc) {
-				return sc;
+			const result = component.findById(stepId);
+			if (result) {
+				return result;
 			}
 		}
 		return null;
 	}
 
 	public resolvePlaceholders(skipComponent: StepComponent | undefined, result: FoundPlaceholders) {
+		this.view.components.forEach(component => component.resolvePlaceholders(skipComponent, result));
 		this.view.placeholders.forEach(placeholder => result.placeholders.push(placeholder));
-		this.view.components.forEach(c => c.resolvePlaceholders(skipComponent, result));
 	}
 
 	public updateBadges(result: BadgesResult) {
-		for (const component of this.view.components) {
-			component.updateBadges(result);
-		}
+		this.view.components.forEach(component => component.updateBadges(result));
 	}
 }

designer/src/workspace/step-component.ts

@@ -22,8 +22,8 @@ export class StepComponent implements Component {
 		if (this.step.id === stepId) {
 			return this;
 		}
-		if (this.view.sequenceComponents) {
-			for (const component of this.view.sequenceComponents) {
+		if (this.view.components) {
+			for (const component of this.view.components) {
 				const result = component.findById(stepId);
 				if (result) {
 					return result;
@@ -34,14 +34,22 @@ export class StepComponent implements Component {
 	}
 
 	public resolveClick(click: ClickDetails): ClickCommand | null {
-		if (this.view.sequenceComponents) {
-			for (const component of this.view.sequenceComponents) {
+		if (this.view.components) {
+			for (const component of this.view.components) {
 				const result = component.resolveClick(click);
 				if (result) {
 					return result;
 				}
 			}
 		}
+		if (this.view.placeholders) {
+			for (const placeholder of this.view.placeholders) {
+				const result = placeholder.resolveClick(click);
+				if (result) {
+					return result;
+				}
+			}
+		}
 		const badgeResult = this.badges.resolveClick(click);
 		if (badgeResult) {
 			return badgeResult;
@@ -60,8 +68,8 @@ export class StepComponent implements Component {
 
 	public resolvePlaceholders(skipComponent: StepComponent | undefined, result: FoundPlaceholders) {
 		if (skipComponent !== this) {
-			if (this.view.sequenceComponents) {
-				this.view.sequenceComponents.forEach(component => component.resolvePlaceholders(skipComponent, result));
+			if (this.view.components) {
+				this.view.components.forEach(component => component.resolvePlaceholders(skipComponent, result));
 			}
 			if (this.view.placeholders) {
 				this.view.placeholders.forEach(ph => result.placeholders.push(ph));
@@ -83,8 +91,8 @@ export class StepComponent implements Component {
 	}
 
 	public updateBadges(result: BadgesResult) {
-		if (this.view.sequenceComponents) {
-			this.view.sequenceComponents.forEach(component => component.updateBadges(result));
+		if (this.view.components) {
+			this.view.components.forEach(component => component.updateBadges(result));
 		}
 		this.badges.update(result);
 	}

designer/src/workspace/switch-step/switch-step-component-view.ts

@@ -32,7 +32,7 @@ function createView(
 		height,
 		joinX,
 		placeholders: null,
-		sequenceComponents,
+		components: sequenceComponents,
 		hasOutput: sequenceComponents ? sequenceComponents.some(c => c.hasOutput) : true,
 
 		getClientPosition(): Vector {

designer/src/workspace/task-step/task-step-component-view.ts

@@ -71,7 +71,7 @@ export const createTaskStepComponentViewFactory =
 			width: boxWidth,
 			height: boxHeight,
 			joinX: boxWidth / 2,
-			sequenceComponents: null,
+			components: null,
 			placeholders: null,
 			hasOutput: !!outputView,