diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 9a9cb35..5009811 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -54,6 +54,14 @@ import {MatOption, MatSelect} from "@angular/material/select";
import {
ProductGamesystemEditorComponent
} from "./editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component";
+import {
+ ProductTransitionEditorComponent
+} from "./editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component";
+import {
+ ProductStateEditorComponent
+} from "./editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component";
+import {MatTooltip} from "@angular/material/tooltip";
+import {MatCard, MatCardContent} from "@angular/material/card";
// AoT requires an exported function for factories
const httpLoaderFactory = (http: HttpClient): TranslateHttpLoader => new TranslateHttpLoader(http, './assets/i18n/', '.json');
@@ -70,7 +78,10 @@ const httpLoaderFactory = (http: HttpClient): TranslateHttpLoader => new Transl
GamesystemEditorComponent,
SimpleGamesystemEditorComponent,
SimpleStateEditorComponent,
- SimpleTransitionEditorComponent
+ SimpleTransitionEditorComponent,
+ ProductTransitionEditorComponent,
+ ProductStateEditorComponent,
+ ProductGamesystemEditorComponent
],
imports: [
BrowserModule,
@@ -125,7 +136,9 @@ const httpLoaderFactory = (http: HttpClient): TranslateHttpLoader => new Transl
MatSelect,
MatOption,
MatHint,
- ProductGamesystemEditorComponent
+ MatTooltip,
+ MatCard,
+ MatCardContent
],
providers: [],
bootstrap: [AppComponent]
diff --git a/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.html b/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.html
index 038300d..b2d1a1f 100644
--- a/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.html
+++ b/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.html
@@ -1,2 +1,4 @@
-
+
diff --git a/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.scss b/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.scss
index e69de29..2739e15 100644
--- a/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.scss
+++ b/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.scss
@@ -0,0 +1,3 @@
+#productStateEditor {
+ margin-top: 20px;
+}
diff --git a/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.ts b/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.ts
index 1a90798..eebcefd 100644
--- a/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.ts
+++ b/src/app/editor/gamesystem-editor/product-gamesystem-editor/product-gamesystem-editor.component.ts
@@ -10,11 +10,6 @@ import {
@Component({
selector: 'app-product-gamesystem-editor',
- standalone: true,
- imports: [
- ProductStateEditorComponent,
- ProductTransitionEditorComponent
- ],
templateUrl: './product-gamesystem-editor.component.html',
styleUrl: './product-gamesystem-editor.component.scss'
})
diff --git a/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.html b/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.html
index 5ad3526..4b24edd 100644
--- a/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.html
+++ b/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.html
@@ -1,2 +1,4 @@
-
+
diff --git a/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.scss b/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.scss
index 7112fce..bfc528d 100644
--- a/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.scss
+++ b/src/app/editor/gamesystem-editor/simple-gamesystem-editor/simple-gamesystem-editor.component.scss
@@ -1,3 +1,4 @@
-.transition-editor {
- margin-top: 15px;
+#transition-editor {
+ margin-top: 20px !important;
+
}
diff --git a/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.html b/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.html
index 2d7eda7..7ca4627 100644
--- a/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.html
+++ b/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.html
@@ -1,14 +1,22 @@
-
+
+
diff --git a/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.scss b/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.scss
index d53103d..f2c3344 100644
--- a/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.scss
+++ b/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.scss
@@ -5,3 +5,7 @@ table {
.mat-column-Initial {
width: 32px;
}
+
+.long-form {
+ width: 100%;
+}
diff --git a/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.ts b/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.ts
index 8e4b02b..79a5880 100644
--- a/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.ts
+++ b/src/app/editor/gamesystem-editor/state-editor/product-state-editor/product-state-editor.component.ts
@@ -2,43 +2,16 @@ import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {ProductGamesystem} from "../../../../game-model/gamesystems/ProductGamesystem";
import {SimpleGamesystem} from "../../../../game-model/gamesystems/SimpleGamesystem";
import {
- MatCell, MatCellDef,
- MatColumnDef, MatHeaderCell, MatHeaderCellDef,
- MatHeaderRow,
- MatHeaderRowDef,
- MatRow,
- MatRowDef,
- MatTable,
MatTableDataSource
} from "@angular/material/table";
import {SimpleState} from "../../../../game-model/gamesystems/SimpleState";
import {State} from "../../../../game-model/gamesystems/State";
-import {NgForOf, NgIf} from "@angular/common";
-import {ProductState} from "../../../../game-model/gamesystems/ProductState";
-import {MatIcon} from "@angular/material/icon";
-import {Gamesystem} from "../../../../game-model/gamesystems/Gamesystem";
import {LeafGamesystemCalculator} from "../../product-gamesystem-editor/LeafGamesystemCalculator";
-import {MatTooltip} from "@angular/material/tooltip";
+import {ProductTransition} from "../../../../game-model/gamesystems/ProductTransition";
+import {ProductState} from "../../../../game-model/gamesystems/ProductState";
@Component({
selector: 'app-product-state-editor',
- standalone: true,
- imports: [
- MatTable,
- MatRow,
- MatRowDef,
- MatHeaderRow,
- MatHeaderRowDef,
- MatColumnDef,
- MatHeaderCell,
- MatHeaderCellDef,
- MatCell,
- MatCellDef,
- NgForOf,
- NgIf,
- MatIcon,
- MatTooltip
- ],
templateUrl: './product-state-editor.component.html',
styleUrl: './product-state-editor.component.scss'
})
@@ -47,7 +20,7 @@ export class ProductStateEditorComponent implements OnInit{
@Input() gamesystem: ProductGamesystem | undefined
@Output('onOpenGamesystemEditor') openGamesystemEditorEmitter = new EventEmitter();
displayedColumns: string[] = [];
- datasource = new MatTableDataSource();
+ datasource = new MatTableDataSource();
ngOnInit() {
@@ -55,6 +28,10 @@ export class ProductStateEditorComponent implements OnInit{
this.generateColumnNamesRecursively(this.gamesystem!, "");
this.displayedColumns.push('Initial');
this.datasource.data = this.gamesystem!.states;
+ this.datasource.filterPredicate = (data: ProductState, filter: string) => {
+ const leaf_states = LeafGamesystemCalculator.calcLeafStates(data);
+ return leaf_states.some((state) => state.stateLabel.toLowerCase().includes(filter))
+ }
}
generateColumnNamesRecursively(gamesystem: ProductGamesystem, nestedColumnName: string) {
@@ -79,4 +56,9 @@ export class ProductStateEditorComponent implements OnInit{
this.openGamesystemEditorEmitter.emit(clicked_gamesystem);
}
+ applyFilter(event: KeyboardEvent) {
+ const filterValue = (event.target as HTMLInputElement).value;
+ this.datasource.filter = filterValue.trim().toLowerCase();
+ }
+
}
diff --git a/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.html b/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.html
index f723e19..1100328 100644
--- a/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.html
+++ b/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.html
@@ -1,77 +1,86 @@
-
-
- Label |
-
- {{state.stateLabel}}
-
-
- warningMissing State-Label Information
-
- |
-
+
+
+
+ Filter
+
+
+
+
+ Label |
+
+ {{state.stateLabel}}
+
+
+ warningMissing State-Label Information
+
+ |
+
-
-
-
-
- {{element.stateDescription}}
-
- Description
-
-
-
- |
-
+
+
+
+
+ {{element.stateDescription}}
+
+ Description
+
+
+
+ |
+
-
- Initial |
-
-
- done
- close
-
-
+
+ Initial |
+
+
+ done
+ close
+
+
- |
-
+ |
+
-
- |
-
-
-
- |
-
+
+ |
+
+
+
+ |
+
-
- |
-
-
- |
-
+
+ |
+
+
+ |
+
-
-
-
- |
-
-
- |
-
+
+
+
+ |
+
+
+ |
+
-
-
-
-
-
+
+
+
+
+
+
+
+
diff --git a/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.ts b/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.ts
index 76c5bef..3d4d1ed 100644
--- a/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.ts
+++ b/src/app/editor/gamesystem-editor/state-editor/simple-state-editor/simple-state-editor.component.ts
@@ -4,6 +4,8 @@ import {MatTableDataSource} from "@angular/material/table";
import {animate, state, style, transition, trigger} from "@angular/animations";
import {MatSnackBar} from "@angular/material/snack-bar";
import {SimpleGamesystem} from "../../../../game-model/gamesystems/SimpleGamesystem";
+import {ProductState} from "../../../../game-model/gamesystems/ProductState";
+import {LeafGamesystemCalculator} from "../../product-gamesystem-editor/LeafGamesystemCalculator";
@Component({
selector: 'app-simple-state-editor',
@@ -21,7 +23,7 @@ export class SimpleStateEditorComponent implements OnInit{
@Input() states: SimpleState[] = [];
@Input() gamesystem: SimpleGamesystem | undefined
- dataSource = new MatTableDataSource();
+ dataSource = new MatTableDataSource();
displayedColumns = ["name", "initial", "edit", "delete"];
columnsToDisplayWithExpand = [...this.displayedColumns, 'expand'];
expandedElement: SimpleState | null = null;
@@ -34,6 +36,9 @@ export class SimpleStateEditorComponent implements OnInit{
ngOnInit() {
this.dataSource.data = this.states;
+ this.dataSource.filterPredicate = (data: SimpleState, filter: string) => {
+ return data.stateLabel.toLowerCase().includes(filter);
+ }
}
editState(state: SimpleState) {
@@ -83,4 +88,9 @@ export class SimpleStateEditorComponent implements OnInit{
onStateChange() {
this.gamesystem!.onModifyContent();
}
+
+ applyFilter(event: KeyboardEvent) {
+ const filterValue = (event.target as HTMLInputElement).value;
+ this.dataSource.filter = filterValue.trim().toLowerCase();
+ }
}
diff --git a/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.html b/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.html
index cbe907a..e2da5c2 100644
--- a/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.html
+++ b/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.html
@@ -1,42 +1,54 @@
-
+
+
+
diff --git a/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.scss b/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.scss
index e69de29..432fb10 100644
--- a/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.scss
+++ b/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.scss
@@ -0,0 +1,4 @@
+.long-form {
+ width: 100%;
+}
+
diff --git a/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.ts b/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.ts
index c823260..8a22044 100644
--- a/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.ts
+++ b/src/app/editor/gamesystem-editor/transition-editor/product-transition-editor/product-transition-editor.component.ts
@@ -2,19 +2,11 @@ import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {ProductGamesystem} from "../../../../game-model/gamesystems/ProductGamesystem";
import {SimpleGamesystem} from "../../../../game-model/gamesystems/SimpleGamesystem";
import {
- MatCell, MatCellDef,
- MatColumnDef,
- MatHeaderCell,
- MatHeaderCellDef, MatHeaderRow, MatHeaderRowDef, MatRow, MatRowDef,
- MatTable,
MatTableDataSource
} from "@angular/material/table";
import {LeafGamesystemCalculator} from "../../product-gamesystem-editor/LeafGamesystemCalculator";
-import {NgForOf, NgIf} from "@angular/common";
import {ProductTransition} from "../../../../game-model/gamesystems/ProductTransition";
import {ProductState} from "../../../../game-model/gamesystems/ProductState";
-import {MatTooltip} from "@angular/material/tooltip";
-
class DisplayedColumnName {
displayedName: string
internalName: string
@@ -27,22 +19,6 @@ class DisplayedColumnName {
}
@Component({
selector: 'app-product-transition-editor',
- standalone: true,
- imports: [
- MatTable,
- NgForOf,
- MatColumnDef,
- MatHeaderCell,
- MatHeaderCellDef,
- MatCell,
- MatCellDef,
- NgIf,
- MatHeaderRow,
- MatRow,
- MatHeaderRowDef,
- MatRowDef,
- MatTooltip
- ],
templateUrl: './product-transition-editor.component.html',
styleUrl: './product-transition-editor.component.scss'
})
@@ -51,7 +27,7 @@ export class ProductTransitionEditorComponent implements OnInit{
@Input() gamesystem: ProductGamesystem | undefined
@Output() onOpenGamesystem = new EventEmitter();
- dataSource = new MatTableDataSource();
+ dataSource = new MatTableDataSource();
displayedColumns: DisplayedColumnName[] = [];
columns: string[] = [];
numberLeafSystems: number = -1;
@@ -66,6 +42,14 @@ export class ProductTransitionEditorComponent implements OnInit{
this.columns = this.displayedColumns.map(column => column.internalName)
this.dataSource.data = this.gamesystem.transitions;
+ this.dataSource.filterPredicate = (data: ProductTransition, filter: string) => {
+ const leaf_starting_states = LeafGamesystemCalculator.calcLeafStates(data.startingState);
+ const leaf_ending_states = LeafGamesystemCalculator.calcLeafStates(data.endingState);
+
+ const combined_leaf_states = leaf_starting_states.concat(leaf_ending_states);
+
+ return combined_leaf_states.some((state) => state.stateLabel.toLowerCase().includes(filter))
+ }
}
}
@@ -79,8 +63,6 @@ export class ProductTransitionEditorComponent implements OnInit{
index = leafIndex - this.numberLeafSystems;
}
-
-
const leafStates = LeafGamesystemCalculator.calcLeafStates(state);
console.log(leafStates)
return leafStates[index];
@@ -94,4 +76,9 @@ export class ProductTransitionEditorComponent implements OnInit{
this.onOpenGamesystem.emit(leafGamesystems[leafIndex - this.numberLeafSystems])
}
}
+
+ applyFilter(event: KeyboardEvent) {
+ const filterValue = (event.target as HTMLInputElement).value;
+ this.dataSource.filter = filterValue.trim().toLowerCase();
+ }
}
diff --git a/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.html b/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.html
index 1ad5505..0834eb0 100644
--- a/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.html
+++ b/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.html
@@ -1,81 +1,91 @@
-
+
+
+
diff --git a/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.ts b/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.ts
index c1f64ee..b159e13 100644
--- a/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.ts
+++ b/src/app/editor/gamesystem-editor/transition-editor/simple-transition-editor/simple-transition-editor.component.ts
@@ -13,6 +13,8 @@ import {
import {SimpleTransition} from "../../../../game-model/gamesystems/SimpleTransition";
import {animate, state, style, transition, trigger} from "@angular/animations";
import {SimpleState} from "../../../../game-model/gamesystems/SimpleState";
+import {ProductTransition} from "../../../../game-model/gamesystems/ProductTransition";
+import {LeafGamesystemCalculator} from "../../product-gamesystem-editor/LeafGamesystemCalculator";
@Component({
selector: 'app-simple-transition-editor',
@@ -44,6 +46,9 @@ export class SimpleTransitionEditorComponent implements OnInit {
transitionEndingStateError = true;
ngOnInit() {
this.dataSource.data = this.gamesystem!.transitions;
+ this.dataSource.filterPredicate = (data: SimpleTransition, filter: string) => {
+ return [data.startingState, data.endingState].some((state) => state.stateLabel.toLowerCase().includes(filter))
+ }
}
addTransition() {
@@ -83,4 +88,9 @@ export class SimpleTransitionEditorComponent implements OnInit {
this.dataSource.data = this.gamesystem!.transitions;
}
}
+
+ applyFilter(event: KeyboardEvent) {
+ const filterValue = (event.target as HTMLInputElement).value;
+ this.dataSource.filter = filterValue.trim().toLowerCase();
+ }
}
diff --git a/src/app/game-model/gamesystems/ProductState.ts b/src/app/game-model/gamesystems/ProductState.ts
index f499f35..4831c3d 100644
--- a/src/app/game-model/gamesystems/ProductState.ts
+++ b/src/app/game-model/gamesystems/ProductState.ts
@@ -38,5 +38,16 @@ export class ProductState extends State {
return true;
}
+ existsInnerStateByLowerCaseLabel(label: string): boolean {
+ this.innerStates.forEach(innerState => {
+ if(innerState instanceof SimpleState && innerState.stateLabel.toLowerCase() === label) {
+ return true;
+ } else if(innerState instanceof ProductState) {
+ return innerState.existsInnerStateByLowerCaseLabel(label);
+ }
+ })
+
+ return false;
+ }
}
diff --git a/src/app/game-model/gamesystems/ProductTransition.ts b/src/app/game-model/gamesystems/ProductTransition.ts
index 3e862ea..ebd0be5 100644
--- a/src/app/game-model/gamesystems/ProductTransition.ts
+++ b/src/app/game-model/gamesystems/ProductTransition.ts
@@ -3,4 +3,7 @@ import {ProductState} from "./ProductState";
export class ProductTransition extends Transition {
+ containsInnerStateByLabel(label: string) {
+ return this.startingState.existsInnerStateByLowerCaseLabel(label) || this.endingState.existsInnerStateByLowerCaseLabel(label);
+ }
}