diff --git a/src/main/angular/src/app/editor/Point.ts b/src/main/angular/src/app/editor/Point.ts index bdc7bce..ba3b8ac 100644 --- a/src/main/angular/src/app/editor/Point.ts +++ b/src/main/angular/src/app/editor/Point.ts @@ -1,4 +1,5 @@ import {Junction} from "./junction/Junction"; +import {Part} from './parts/Part'; export class Point { @@ -17,4 +18,8 @@ export class Point { return new Point(junction.pixelX, junction.pixelY); } + static fromPart(part: Part) { + return new Point(part.x, part.y); + } + } diff --git a/src/main/angular/src/app/editor/breadboard/Parts.ts b/src/main/angular/src/app/editor/breadboard/Parts.ts new file mode 100644 index 0000000..437a57d --- /dev/null +++ b/src/main/angular/src/app/editor/breadboard/Parts.ts @@ -0,0 +1,47 @@ +import {Point} from '../Point'; +import {Part, RASTER} from '../parts/Part'; +import {MessageService} from '../message/message.service'; + +export class Parts { + + readonly list: Part[] = []; + + dragStart: Point | null = null; + + dragStartPart: Part | null = null; + + dragCursor: Point | null = null; + + constructor( + protected messageService: MessageService, + ) { + // + } + + mouseDown(part: Part, $event: MouseEvent) { + if ($event.button === 0) { + this.dragStartPart = part; + this.dragStart = Point.fromPart(part); + } + } + + mouseMove($event: MouseEvent) { + this.updateDragCursor($event); + if (this.dragStartPart !== null && this.dragCursor !== null) { + this.dragStartPart.rasterCenterX = Math.floor(this.dragCursor.x / RASTER); + this.dragStartPart.rasterCenterY = Math.floor(this.dragCursor.y / RASTER); + } + } + + mouseUp($event: MouseEvent) { + this.updateDragCursor($event); + if ($event.button === 0) { + this.dragStartPart = null; + } + } + + private updateDragCursor($event: MouseEvent) { + this.dragCursor = Point.fromEvent($event); + } + +} diff --git a/src/main/angular/src/app/editor/breadboard/breadboard.component.html b/src/main/angular/src/app/editor/breadboard/breadboard.component.html index 91889ed..03ac3a0 100644 --- a/src/main/angular/src/app/editor/breadboard/breadboard.component.html +++ b/src/main/angular/src/app/editor/breadboard/breadboard.component.html @@ -1,6 +1,6 @@ - + diff --git a/src/main/angular/src/app/editor/breadboard/breadboard.component.ts b/src/main/angular/src/app/editor/breadboard/breadboard.component.ts index 012b659..67ff0d4 100644 --- a/src/main/angular/src/app/editor/breadboard/breadboard.component.ts +++ b/src/main/angular/src/app/editor/breadboard/breadboard.component.ts @@ -19,17 +19,21 @@ import {Parts} from './Parts'; }) export class BreadboardComponent { + protected readonly parts: Parts; + protected readonly wires: Wires; private battery = new Battery(1, 1, 3, 0.5); private light = new Light(1, 5, 3, 1.5, 0.5); - protected readonly parts: Part[] = [this.battery, this.light]; - constructor( protected readonly messageService: MessageService, ) { + this.parts = new Parts(messageService); + this.parts.list.push(this.battery); + this.parts.list.push(this.light); + this.wires = new Wires(messageService); this.wires.connect(this.battery.minus, this.light.a); this.wires.connect(this.battery.plus, this.light.b); @@ -37,10 +41,12 @@ export class BreadboardComponent { mouseMove($event: MouseEvent) { this.wires.mouseMove($event); + this.parts.mouseMove($event); } mouseUp($event: MouseEvent) { this.wires.breadboardMouseUp($event); + this.parts.mouseUp($event); } asBattery(part: Part): Battery { diff --git a/src/main/angular/src/app/editor/parts/Part.ts b/src/main/angular/src/app/editor/parts/Part.ts index 5797b00..e5ba3bc 100644 --- a/src/main/angular/src/app/editor/parts/Part.ts +++ b/src/main/angular/src/app/editor/parts/Part.ts @@ -5,56 +5,43 @@ export const RASTER = 50; export abstract class Part { + x: number; + + y: number; + + w: number; + + h: number; + protected constructor( readonly type: PartType, - readonly rasterX: number, - readonly rasterY: number, - readonly rasterW: number = 3, - readonly rasterH: number = 3, + rasterX: number, + rasterY: number, + rasterW: number = 3, + rasterH: number = 3, ) { - // + this.x = rasterX * RASTER; + this.y = rasterY * RASTER; + this.w = rasterW * RASTER; + this.h = rasterH * RASTER; } abstract get junctions(): Junction[]; - get x(): number { - return this.rasterX * RASTER; + getClasses(): string[] { + return ['part', 'part' + this.type, ...this.getClasses2()]; } - get y(): number { - return this.rasterY * RASTER; - } - - get w(): number { - return this.rasterW * RASTER; - } - - get h(): number { - return this.rasterH * RASTER; - } - - get xP(): string { - return this.x + 'px'; - } - - get yP(): string { - return this.y + 'px'; - } - - get wP(): string { - return this.w + 'px'; - } - - get hP(): string { - return this.h + 'px'; - } - - ngClass(): string[] { - return ['part', 'part' + this.type, ...this.ngClass2()]; - } - - protected ngClass2(): string[] { + protected getClasses2(): string[] { return []; } + set rasterCenterX(rx: number) { + this.x = rx * RASTER - this.w / 2; + } + + set rasterCenterY(ry: number) { + this.y = ry * RASTER - this.h / 2; + } + }