diff --git a/src/main/angular/src/app/editor/Point.ts b/src/main/angular/src/app/editor/Point.ts
index 423d151..bdc7bce 100644
--- a/src/main/angular/src/app/editor/Point.ts
+++ b/src/main/angular/src/app/editor/Point.ts
@@ -13,8 +13,8 @@ export class Point {
     return new Point(event.offsetX, event.offsetY);
   }
 
-  static fromJunction(j: Junction) {
-    return new Point(j.pixelX, j.pixelY);
+  static fromJunction(junction: Junction) {
+    return new Point(junction.pixelX, junction.pixelY);
   }
 
 }
diff --git a/src/main/angular/src/app/editor/breadboard/Wires.ts b/src/main/angular/src/app/editor/breadboard/Wires.ts
new file mode 100644
index 0000000..e3cdebc
--- /dev/null
+++ b/src/main/angular/src/app/editor/breadboard/Wires.ts
@@ -0,0 +1,113 @@
+import {Point} from '../Point';
+import {Junction} from '../junction/Junction';
+import {Wire} from '../wire/Wire';
+import {MessageService} from '../message/message.service';
+
+export class Wires {
+
+  readonly list: Wire[] = [];
+
+  dragStart: Point | null = null;
+
+  dragStartJunction: Junction | null = null;
+
+  dragCursor: Point | null = null;
+
+  dragEnd: Point | null = null;
+
+  dragEndJunction: Junction | null = null;
+
+  dragEndDuplicate: boolean = false;
+
+  constructor(
+    protected messageService: MessageService,
+  ) {
+    //
+  }
+
+  breadboardMouseUp($event: MouseEvent) {
+    if ($event.button === 0) {
+      this.dragReset();
+    }
+  }
+
+  mouseDown(junction: Junction, $event: MouseEvent) {
+    if ($event.button === 0) {
+      this.updateDragCursor($event);
+      this.dragStart = Point.fromJunction(junction);
+      this.dragStartJunction = junction;
+    }
+  }
+
+  mouseEnter(junction: Junction, $event: MouseEvent) {
+    if ($event.button === 0 && this.dragStartJunction !== null) {
+      if (this.dragStartJunction === junction) {
+        this.dragEndReset();
+      } else {
+        this.dragEnd = Point.fromJunction(junction);
+        this.dragEndJunction = junction;
+        this.dragEndDuplicate = this.list.some(w => (w.start === this.dragStartJunction && w.end === this.dragEndJunction) || (w.start === this.dragEndJunction && w.end === this.dragStartJunction));
+      }
+    }
+  }
+
+  mouseMove($event: MouseEvent) {
+    this.updateDragCursor($event);
+  }
+
+  mouseLeave(junction: Junction, $event: MouseEvent) {
+    if ($event.button === 0 && this.dragStartJunction !== null && this.dragEndJunction === junction) {
+      this.dragEndReset();
+    }
+  }
+
+  mouseUp($event: MouseEvent) {
+    this.updateDragCursor($event);
+    if ($event.button === 0) {
+      if (this.dragStartJunction !== null && this.dragEndJunction !== null) {
+        this.connect(this.dragStartJunction, this.dragEndJunction);
+      }
+      this.dragReset();
+    }
+  }
+
+  private updateDragCursor($event: MouseEvent) {
+    this.dragCursor = Point.fromEvent($event);
+  }
+
+  dragReset() {
+    this.dragStart = null;
+    this.dragStartJunction = null;
+    this.dragEndReset();
+  }
+
+  private dragEndReset() {
+    this.dragEnd = null;
+    this.dragEndJunction = null;
+    this.dragEndDuplicate = false;
+  }
+
+  connect(start: Junction, end: Junction) {
+    if (start === end) {
+      console.log("Not connecting junction with itself.");
+      return;
+    }
+    if (this.dragEndDuplicate) {
+      this.messageService.warn("Diese Verbindung existiert bereits.");
+      return;
+    }
+    const wire = new Wire(start, end);
+    wire.start.wires.push(wire);
+    wire.end.wires.push(wire);
+    this.list.push(wire);
+    console.log("Wire connected: ", wire);
+  }
+
+  disconnect(wire: Wire) {
+    this.list.splice(this.list.indexOf(wire), 1);
+    wire.start.wires.splice(wire.start.wires.indexOf(wire), 1);
+    wire.end.wires.splice(wire.end.wires.indexOf(wire), 1);
+    console.log("Wire disconnected: ", wire);
+  }
+
+}
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 60f69bf..91889ed 100644
--- a/src/main/angular/src/app/editor/breadboard/breadboard.component.html
+++ b/src/main/angular/src/app/editor/breadboard/breadboard.component.html
@@ -31,26 +31,26 @@
       [attr.height]="junction.percentH + '%'"
       [attr.width]="junction.percentW + '%'"
       (mousemove)="mouseMove($event)"
-      (mousedown)="junctionMouseDown(junction, $event)"
-      (mouseenter)="junctionMouseEnter(junction, $event)"
-      (mouseleave)="junctionMouseLeave(junction, $event)"
-      (mouseup)="junctionMouseUp($event)"
+      (mousedown)="wires.mouseDown(junction, $event)"
+      (mouseenter)="wires.mouseEnter(junction, $event)"
+      (mouseleave)="wires.mouseLeave(junction, $event)"
+      (mouseup)="wires.mouseUp($event)"
     >
       <circle [attr.id]="junction.id" cx="50%" cy="50%" fill="gray" r="35%"></circle>
     </svg>
 
   </svg>
 
-  <ng-container *ngFor="let wire of wires">
+  <ng-container *ngFor="let wire of wires.list">
     <line class="wire" [attr.x1]="wire.start.pixelX + 'px'" [attr.y1]="wire.start.pixelY + 'px'" [attr.x2]="wire.end.pixelX + 'px'" [attr.y2]="wire.end.pixelY + 'px'"></line>
   </ng-container>
 
-  <ng-container *ngIf="wireStart && wireCursor && wireStartJunction">
-    <ng-container *ngIf="wireEnd && wireEndJunction">
-      <line class="wire" [class.wireDuplicate]="wireEndDuplicate" [class.wireEnd]="!wireEndDuplicate" [attr.x1]="wireStart.x + 'px'" [attr.y1]="wireStart.y + 'px'" [attr.x2]="wireEnd.x + 'px'" [attr.y2]="wireEnd.y + 'px'"></line>
+  <ng-container *ngIf="wires.dragStart && wires.dragCursor && wires.dragStartJunction">
+    <ng-container *ngIf="wires.dragEnd && wires.dragEndJunction">
+      <line class="wire" [class.wireDuplicate]="wires.dragEndDuplicate" [class.wireEnd]="!wires.dragEndDuplicate" [attr.x1]="wires.dragStart.x + 'px'" [attr.y1]="wires.dragStart.y + 'px'" [attr.x2]="wires.dragEnd.x + 'px'" [attr.y2]="wires.dragEnd.y + 'px'"></line>
     </ng-container>
-    <ng-container *ngIf="!wireEnd">
-      <line class="wire wireOpen" [attr.x1]="wireStart.x + 'px'" [attr.y1]="wireStart.y + 'px'" [attr.x2]="wireCursor.x + 'px'" [attr.y2]="wireCursor.y + 'px'"></line>
+    <ng-container *ngIf="!wires.dragEnd">
+      <line class="wire wireOpen" [attr.x1]="wires.dragStart.x + 'px'" [attr.y1]="wires.dragStart.y + 'px'" [attr.x2]="wires.dragCursor.x + 'px'" [attr.y2]="wires.dragCursor.y + 'px'"></line>
     </ng-container>
   </ng-container>
 
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 93386b8..012b659 100644
--- a/src/main/angular/src/app/editor/breadboard/breadboard.component.ts
+++ b/src/main/angular/src/app/editor/breadboard/breadboard.component.ts
@@ -3,10 +3,9 @@ import {NgClass, NgForOf, NgIf} from '@angular/common';
 import {Part} from '../parts/Part';
 import {Battery} from '../parts/battery/Battery';
 import {Light} from '../parts/light/Light';
-import {Junction} from '../junction/Junction';
-import {Wire} from '../wire/Wire';
-import {Point} from '../Point';
 import {MessageService} from '../message/message.service';
+import {Wires} from './Wires';
+import {Parts} from './Parts';
 
 @Component({
   selector: 'app-board',
@@ -20,33 +19,28 @@ import {MessageService} from '../message/message.service';
 })
 export class BreadboardComponent {
 
+  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];
 
-  protected readonly wires: Wire[] = [
-    new Wire(this.battery.minus, this.light.a),
-    new Wire(this.battery.plus, this.light.b),
-  ];
-
-  protected wireCursor: Point | null = null;
-
-  protected wireStart: Point | null = null;
-
-  protected wireEnd: Point | null = null;
-
-  protected wireStartJunction: Junction | null = null;
-
-  protected wireEndJunction: Junction | null = null;
-
-  protected wireEndDuplicate: boolean = false;
-
   constructor(
     protected readonly messageService: MessageService,
   ) {
-    //
+    this.wires = new Wires(messageService);
+    this.wires.connect(this.battery.minus, this.light.a);
+    this.wires.connect(this.battery.plus, this.light.b);
+  }
+
+  mouseMove($event: MouseEvent) {
+    this.wires.mouseMove($event);
+  }
+
+  mouseUp($event: MouseEvent) {
+    this.wires.breadboardMouseUp($event);
   }
 
   asBattery(part: Part): Battery {
@@ -65,84 +59,4 @@ export class BreadboardComponent {
     return part instanceof Light;
   }
 
-  mouseMove($event: MouseEvent) {
-    this.wireCursor = Point.fromEvent($event);
-  }
-
-  mouseUp($event: MouseEvent) {
-    if ($event.button === 0) {
-      this.wireReset();
-    }
-  }
-
-  junctionMouseDown(j: Junction, $event: MouseEvent) {
-    if ($event.button === 0) {
-      this.wireCursor = Point.fromEvent($event);
-      this.wireStart = Point.fromJunction(j);
-      this.wireStartJunction = j;
-    }
-  }
-
-  junctionMouseEnter(j: Junction, $event: MouseEvent) {
-    if ($event.button === 0 && this.wireStartJunction !== null) {
-      if (this.wireStartJunction === j) {
-        this.wireEndReset();
-      } else {
-        this.wireEnd = Point.fromJunction(j);
-        this.wireEndJunction = j;
-        this.wireEndDuplicate = this.wires.some(w => (w.start === this.wireStartJunction && w.end === this.wireEndJunction) || (w.start === this.wireEndJunction && w.end === this.wireStartJunction));
-      }
-    }
-  }
-
-  junctionMouseLeave(j: Junction, $event: MouseEvent) {
-    if ($event.button === 0 && this.wireStartJunction !== null && this.wireEndJunction === j) {
-      this.wireEndReset();
-    }
-  }
-
-  junctionMouseUp($event: MouseEvent) {
-    if ($event.button === 0) {
-      if (this.wireStartJunction !== null && this.wireEndJunction !== null) {
-        this.wireConnect(this.wireStartJunction, this.wireEndJunction);
-      }
-      this.wireReset();
-    }
-  }
-
-  private wireConnect(start: Junction, end: Junction) {
-    if (start === end) {
-      console.log("Not connecting junction with itself.");
-      return;
-    }
-    if (this.wireEndDuplicate) {
-      this.messageService.warn("Diese Verbindung existiert bereits.");
-      return;
-    }
-    const wire = new Wire(start, end);
-    wire.start.wires.push(wire);
-    wire.end.wires.push(wire);
-    this.wires.push(wire);
-    console.log("Wire connected: ", wire);
-  }
-
-  private wireDisconnect(wire: Wire) {
-    this.wires.splice(this.wires.indexOf(wire), 1);
-    wire.start.wires.splice(wire.start.wires.indexOf(wire), 1);
-    wire.end.wires.splice(wire.end.wires.indexOf(wire), 1);
-    console.log("Wire disconnected: ", wire);
-  }
-
-  private wireReset() {
-    this.wireStart = null;
-    this.wireStartJunction = null;
-    this.wireEndReset();
-  }
-
-  private wireEndReset() {
-    this.wireEnd = null;
-    this.wireEndJunction = null;
-    this.wireEndDuplicate = false;
-  }
-
 }