diff --git a/src/main/angular/src/app/editor/breadboard/breadboard.component.less b/src/main/angular/src/app/editor/breadboard/breadboard.component.less index 33a3c51..6649a25 100644 --- a/src/main/angular/src/app/editor/breadboard/breadboard.component.less +++ b/src/main/angular/src/app/editor/breadboard/breadboard.component.less @@ -78,4 +78,3 @@ } } - 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 11d0333..4267424 100644 --- a/src/main/angular/src/app/editor/breadboard/breadboard.component.ts +++ b/src/main/angular/src/app/editor/breadboard/breadboard.component.ts @@ -6,6 +6,7 @@ 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'; @Component({ selector: 'app-board', @@ -42,6 +43,12 @@ export class BreadboardComponent { protected wireEndDuplicate: boolean = false; + constructor( + protected readonly messageService: MessageService, + ) { + // + } + asBattery(part: Part): Battery { return part as Battery; } @@ -109,7 +116,7 @@ export class BreadboardComponent { return; } if (this.wireEndDuplicate) { - console.log("Not connecting duplicate wire."); + this.messageService.warn("Diese Verbindung existiert bereits."); return; } const wire = new Wire(start, end); diff --git a/src/main/angular/src/app/editor/editor.component.html b/src/main/angular/src/app/editor/editor.component.html index a61326a..f70a408 100644 --- a/src/main/angular/src/app/editor/editor.component.html +++ b/src/main/angular/src/app/editor/editor.component.html @@ -1 +1,3 @@ + + diff --git a/src/main/angular/src/app/editor/editor.component.ts b/src/main/angular/src/app/editor/editor.component.ts index 7815b40..8b270d1 100644 --- a/src/main/angular/src/app/editor/editor.component.ts +++ b/src/main/angular/src/app/editor/editor.component.ts @@ -1,10 +1,12 @@ import {Component} from '@angular/core'; import {BreadboardComponent} from './breadboard/breadboard.component'; +import {MessagesComponent} from './message/messages/messages.component'; @Component({ selector: 'app-editor', imports: [ - BreadboardComponent + BreadboardComponent, + MessagesComponent ], templateUrl: './editor.component.html', styleUrl: './editor.component.less' diff --git a/src/main/angular/src/app/editor/message/Message.ts b/src/main/angular/src/app/editor/message/Message.ts new file mode 100644 index 0000000..e614507 --- /dev/null +++ b/src/main/angular/src/app/editor/message/Message.ts @@ -0,0 +1,12 @@ +import {MessageType} from './MessageType'; + +export class Message { + + constructor( + readonly type: MessageType, + readonly text: string, + ) { + // + } + +} diff --git a/src/main/angular/src/app/editor/message/MessageType.ts b/src/main/angular/src/app/editor/message/MessageType.ts new file mode 100644 index 0000000..6c671c5 --- /dev/null +++ b/src/main/angular/src/app/editor/message/MessageType.ts @@ -0,0 +1,5 @@ +export enum MessageType { + Error = "Error", + Warn = "Warn", + Info = "Info", +} diff --git a/src/main/angular/src/app/editor/message/message.service.ts b/src/main/angular/src/app/editor/message/message.service.ts new file mode 100644 index 0000000..2478892 --- /dev/null +++ b/src/main/angular/src/app/editor/message/message.service.ts @@ -0,0 +1,30 @@ +import {Injectable} from '@angular/core'; +import {Message} from './Message'; +import {MessageType} from './MessageType'; + +@Injectable({ + providedIn: 'root' +}) +export class MessageService { + + messages: Message[] = []; + + info(text: string, seconds: number = 10) { + this.add(MessageType.Info, text, seconds); + } + + warn(text: string, seconds: number = 10) { + this.add(MessageType.Warn, text, seconds); + } + + error(text: string, seconds: number = 10) { + this.add(MessageType.Error, text, seconds); + } + + add(type: MessageType, text: string, seconds: number = 10) { + const message = new Message(type, text); + this.messages.push(message); + setTimeout(() => this.messages.splice(this.messages.indexOf(message), 1), seconds * 1000); + } + +} diff --git a/src/main/angular/src/app/editor/message/messages/messages.component.html b/src/main/angular/src/app/editor/message/messages/messages.component.html new file mode 100644 index 0000000..8f30ec2 --- /dev/null +++ b/src/main/angular/src/app/editor/message/messages/messages.component.html @@ -0,0 +1,5 @@ +
+
+ {{ message.text }} +
+
diff --git a/src/main/angular/src/app/editor/message/messages/messages.component.less b/src/main/angular/src/app/editor/message/messages/messages.component.less new file mode 100644 index 0000000..14e7a65 --- /dev/null +++ b/src/main/angular/src/app/editor/message/messages/messages.component.less @@ -0,0 +1,25 @@ +.messages { + position: fixed; + left: 0; + bottom: 0; + right: 0; + + .message { + border-top: 1px solid gray; + background-color: lightgray; + padding: 0.5em; + } + + .messageError { + background-color: #ffcfcf; + } + + .messageWarn { + background-color: lightyellow; + } + + .messageInfo { + background-color: #d2ffd2; + } + +} diff --git a/src/main/angular/src/app/editor/message/messages/messages.component.ts b/src/main/angular/src/app/editor/message/messages/messages.component.ts new file mode 100644 index 0000000..40bb6b7 --- /dev/null +++ b/src/main/angular/src/app/editor/message/messages/messages.component.ts @@ -0,0 +1,21 @@ +import {Component} from '@angular/core'; +import {NgForOf} from '@angular/common'; +import {MessageService} from '../message.service'; + +@Component({ + selector: 'app-messages', + imports: [ + NgForOf + ], + templateUrl: './messages.component.html', + styleUrl: './messages.component.less' +}) +export class MessagesComponent { + + constructor( + readonly messageService: MessageService, + ) { + // + } + +}