issue-15 #21
@ -65,6 +65,9 @@ import {MatCard, MatCardContent} from "@angular/material/card";
 | 
			
		||||
import {
 | 
			
		||||
    ScriptaccountActionEditorComponent
 | 
			
		||||
} from "./editor/gamesystem-editor/transition-editor/scriptaccount-action-editor/scriptaccount-action-editor.component";
 | 
			
		||||
import {
 | 
			
		||||
    ScriptaccountConditionEditorComponent
 | 
			
		||||
} from "./editor/gamesystem-editor/scriptaccount-condition-editor/scriptaccount-condition-editor.component";
 | 
			
		||||
 | 
			
		||||
// AoT requires an exported function for factories
 | 
			
		||||
const httpLoaderFactory = (http: HttpClient): TranslateHttpLoader =>  new TranslateHttpLoader(http, './assets/i18n/', '.json');
 | 
			
		||||
@ -85,7 +88,8 @@ const httpLoaderFactory = (http: HttpClient): TranslateHttpLoader =>  new Transl
 | 
			
		||||
    ProductTransitionEditorComponent,
 | 
			
		||||
    ProductStateEditorComponent,
 | 
			
		||||
    ProductGamesystemEditorComponent,
 | 
			
		||||
    ScriptaccountActionEditorComponent
 | 
			
		||||
    ScriptaccountActionEditorComponent,
 | 
			
		||||
    ScriptaccountConditionEditorComponent
 | 
			
		||||
  ],
 | 
			
		||||
    imports: [
 | 
			
		||||
        BrowserModule,
 | 
			
		||||
 | 
			
		||||
@ -0,0 +1,56 @@
 | 
			
		||||
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
 | 
			
		||||
  <ng-container matColumnDef="scriptAccount">
 | 
			
		||||
    <th mat-header-cell *matHeaderCellDef>ScriptAccount</th>
 | 
			
		||||
    <td mat-cell *matCellDef="let condition; let i = index">
 | 
			
		||||
      <span *ngIf="condition !== addedCondition">{{condition.scriptAccount.componentName}}</span>
 | 
			
		||||
      <mat-form-field appearance="fill" class="long-form" *ngIf="condition === addedCondition">
 | 
			
		||||
        <mat-label>ScriptAccount</mat-label>
 | 
			
		||||
        <mat-select [(ngModel)]="addedCondition!.scriptAccount">
 | 
			
		||||
          <mat-option *ngFor="let scriptAccount of scriptAccounts" [value]="scriptAccount">{{scriptAccount.componentName}}</mat-option>
 | 
			
		||||
        </mat-select>
 | 
			
		||||
      </mat-form-field>
 | 
			
		||||
    </td>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
 | 
			
		||||
  <ng-container matColumnDef="minValue">
 | 
			
		||||
    <th mat-header-cell *matHeaderCellDef>Minimal Value</th>
 | 
			
		||||
    <td mat-cell *matCellDef="let condition">
 | 
			
		||||
      <span *ngIf="condition !== editedCondition && condition !== addedCondition">{{condition.minValue}}</span>
 | 
			
		||||
      <mat-form-field appearance="fill" class="long-form" *ngIf=" condition === editedCondition">
 | 
			
		||||
        <mat-label>Minimal Value</mat-label>
 | 
			
		||||
        <input matInput [(ngModel)]="editedCondition!.minValue">
 | 
			
		||||
      </mat-form-field>
 | 
			
		||||
    </td>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
 | 
			
		||||
  <ng-container matColumnDef="maxValue">
 | 
			
		||||
    <th mat-header-cell *matHeaderCellDef>Maximal Value</th>
 | 
			
		||||
    <td mat-cell *matCellDef="let condition">
 | 
			
		||||
      <span *ngIf="condition !== editedCondition && condition !== addedCondition">{{condition.minValue}}</span>
 | 
			
		||||
      <mat-form-field appearance="fill" class="long-form" *ngIf=" condition === editedCondition">
 | 
			
		||||
        <mat-label>Maximal Value</mat-label>
 | 
			
		||||
        <input matInput [(ngModel)]="editedCondition!.maxValue">
 | 
			
		||||
      </mat-form-field>
 | 
			
		||||
    </td>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
 | 
			
		||||
  <ng-container matColumnDef="edit">
 | 
			
		||||
    <th mat-header-cell *matHeaderCellDef></th>
 | 
			
		||||
    <td mat-cell *matCellDef="let condition;">
 | 
			
		||||
      <button mat-icon-button color="primary" *ngIf="editedCondition == undefined"><mat-icon>edit</mat-icon></button>
 | 
			
		||||
      <button mat-icon-button color="primary" *ngIf="editedCondition === condition" (click)="finishEditing()"><mat-icon>done</mat-icon></button>
 | 
			
		||||
    </td>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
 | 
			
		||||
  <ng-container matColumnDef="delete">
 | 
			
		||||
    <th mat-header-cell *matHeaderCellDef>
 | 
			
		||||
      <button mat-icon-button (click)="createCondition()"><mat-icon>add</mat-icon></button>
 | 
			
		||||
    </th>
 | 
			
		||||
    <td mat-cell *matCellDef="let condition">
 | 
			
		||||
      <button mat-icon-button color="warn"><mat-icon>delete</mat-icon></button>
 | 
			
		||||
    </td>
 | 
			
		||||
  </ng-container>
 | 
			
		||||
 | 
			
		||||
  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
 | 
			
		||||
  <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
 | 
			
		||||
</table>
 | 
			
		||||
@ -0,0 +1,23 @@
 | 
			
		||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
 | 
			
		||||
 | 
			
		||||
import { ScriptaccountConditionEditorComponent } from './scriptaccount-condition-editor.component';
 | 
			
		||||
 | 
			
		||||
describe('ScriptaccountConditionEditorComponent', () => {
 | 
			
		||||
  let component: ScriptaccountConditionEditorComponent;
 | 
			
		||||
  let fixture: ComponentFixture<ScriptaccountConditionEditorComponent>;
 | 
			
		||||
 | 
			
		||||
  beforeEach(async () => {
 | 
			
		||||
    await TestBed.configureTestingModule({
 | 
			
		||||
      imports: [ScriptaccountConditionEditorComponent]
 | 
			
		||||
    })
 | 
			
		||||
    .compileComponents();
 | 
			
		||||
    
 | 
			
		||||
    fixture = TestBed.createComponent(ScriptaccountConditionEditorComponent);
 | 
			
		||||
    component = fixture.componentInstance;
 | 
			
		||||
    fixture.detectChanges();
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  it('should create', () => {
 | 
			
		||||
    expect(component).toBeTruthy();
 | 
			
		||||
  });
 | 
			
		||||
});
 | 
			
		||||
@ -0,0 +1,49 @@
 | 
			
		||||
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
 | 
			
		||||
import {ScriptAccountCondition} from "../../../game-model/gamesystems/conditions/ScriptAccountCondition";
 | 
			
		||||
import {MatTableDataSource} from "@angular/material/table";
 | 
			
		||||
import {ScriptAccount} from "../../../game-model/scriptAccounts/ScriptAccount";
 | 
			
		||||
 | 
			
		||||
@Component({
 | 
			
		||||
  selector: 'app-scriptaccount-condition-editor',
 | 
			
		||||
  templateUrl: './scriptaccount-condition-editor.component.html',
 | 
			
		||||
  styleUrl: './scriptaccount-condition-editor.component.scss'
 | 
			
		||||
})
 | 
			
		||||
export class ScriptaccountConditionEditorComponent implements OnInit{
 | 
			
		||||
 | 
			
		||||
  @Input() conditions: ScriptAccountCondition[] = []
 | 
			
		||||
  @Input() scriptAccounts: ScriptAccount[] = []
 | 
			
		||||
  @Output() onCreateCondition: EventEmitter<ScriptAccountCondition> = new EventEmitter<ScriptAccountCondition>();
 | 
			
		||||
  @Output() onDeleteCondition: EventEmitter<ScriptAccountCondition> = new EventEmitter<ScriptAccountCondition>();
 | 
			
		||||
 | 
			
		||||
  dataSource: MatTableDataSource<ScriptAccountCondition> = new MatTableDataSource();
 | 
			
		||||
  displayedColumns = ['scriptAccount', 'minValue', 'maxValue', 'edit', 'delete']
 | 
			
		||||
 | 
			
		||||
  editedCondition: ScriptAccountCondition | undefined
 | 
			
		||||
  addedCondition: ScriptAccountCondition | undefined
 | 
			
		||||
 | 
			
		||||
  ngOnInit() {
 | 
			
		||||
    this.dataSource.data = this.conditions.concat();
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  createCondition() {
 | 
			
		||||
    this.addedCondition = ScriptAccountCondition.constructScriptAccountCondition(new ScriptAccount("", ""), 0,0);
 | 
			
		||||
    this.editedCondition = this.addedCondition;
 | 
			
		||||
    this.dataSource.data = this.dataSource.data.concat(this.addedCondition!);
 | 
			
		||||
    console.log(this.dataSource.data.length)
 | 
			
		||||
    console.log(this.conditions.length)
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  finishEditing() {
 | 
			
		||||
    if(this.addedCondition != undefined) {
 | 
			
		||||
      const createdCondition = ScriptAccountCondition.constructScriptAccountCondition(this.addedCondition.scriptAccount, this.addedCondition.minValue, this.addedCondition.maxValue);
 | 
			
		||||
      if(createdCondition != undefined) {
 | 
			
		||||
        this.onCreateCondition.emit(createdCondition);
 | 
			
		||||
        this.conditions.push(createdCondition);
 | 
			
		||||
        this.dataSource.data = this.conditions;
 | 
			
		||||
      }
 | 
			
		||||
      this.addedCondition = undefined;
 | 
			
		||||
    } else {
 | 
			
		||||
      this.editedCondition = undefined;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@ -41,6 +41,8 @@
 | 
			
		||||
          <div class="example-element-detail"
 | 
			
		||||
               [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'">
 | 
			
		||||
            <app-scriptaccount-action-editor [transition]="element" [scriptAccounts]="scriptAccounts"></app-scriptaccount-action-editor>
 | 
			
		||||
            <app-scriptaccount-condition-editor [conditions]="element.scriptAccountConditions" [scriptAccounts]="scriptAccounts"
 | 
			
		||||
                    (onCreateCondition)="onCreateCondition(element, $event)" (onDeleteCondition)="deleteCondition(element, $event)"></app-scriptaccount-condition-editor>
 | 
			
		||||
          </div>
 | 
			
		||||
        </td>
 | 
			
		||||
      </ng-container>
 | 
			
		||||
 | 
			
		||||
@ -7,6 +7,7 @@ import {SimpleTransition} from "../../../../game-model/gamesystems/transitions/S
 | 
			
		||||
import {animate, state, style, transition, trigger} from "@angular/animations";
 | 
			
		||||
import {SimpleState} from "../../../../game-model/gamesystems/states/SimpleState";
 | 
			
		||||
import {ScriptAccount} from "../../../../game-model/scriptAccounts/ScriptAccount";
 | 
			
		||||
import {ScriptAccountCondition} from "../../../../game-model/gamesystems/conditions/ScriptAccountCondition";
 | 
			
		||||
@Component({
 | 
			
		||||
  selector: 'app-simple-transition-editor',
 | 
			
		||||
  templateUrl: './simple-transition-editor.component.html',
 | 
			
		||||
@ -86,4 +87,14 @@ export class SimpleTransitionEditorComponent implements OnInit {
 | 
			
		||||
    const filterValue = (event.target as HTMLInputElement).value;
 | 
			
		||||
    this.dataSource.filter = filterValue.trim().toLowerCase();
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  protected readonly transition = transition;
 | 
			
		||||
 | 
			
		||||
  onCreateCondition(transition: SimpleTransition, condition: ScriptAccountCondition) {
 | 
			
		||||
    transition.addScriptAccountCondition(condition);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  deleteCondition(trasition: SimpleTransition, condition: ScriptAccountCondition) {
 | 
			
		||||
    trasition.removeScriptAccountCondition(condition.scriptAccount);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -1,4 +1,6 @@
 | 
			
		||||
import {Transition} from "../transitions/Transition";
 | 
			
		||||
import {ScriptAccountCondition} from "../conditions/ScriptAccountCondition";
 | 
			
		||||
import {ScriptAccount} from "../../scriptAccounts/ScriptAccount";
 | 
			
		||||
 | 
			
		||||
export abstract class State<T extends Transition<any>> {
 | 
			
		||||
 | 
			
		||||
@ -7,6 +9,8 @@ export abstract class State<T extends Transition<any>> {
 | 
			
		||||
 | 
			
		||||
  initial: boolean = false;
 | 
			
		||||
 | 
			
		||||
  conditions: ScriptAccountCondition[] = [];
 | 
			
		||||
 | 
			
		||||
  addIncomingTransition(transition: T) {
 | 
			
		||||
    this.incomingTransitions.push(transition);
 | 
			
		||||
  }
 | 
			
		||||
@ -23,5 +27,24 @@ export abstract class State<T extends Transition<any>> {
 | 
			
		||||
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  addScriptAccountCondition(scriptAccountCondition: ScriptAccountCondition) {
 | 
			
		||||
    const existingScriptAccountCondition = this.findScriptAccountConditionByScriptAccount(scriptAccountCondition.scriptAccount);
 | 
			
		||||
    if(existingScriptAccountCondition != undefined) {
 | 
			
		||||
      if(!existingScriptAccountCondition.isContradicting(scriptAccountCondition)) {
 | 
			
		||||
        existingScriptAccountCondition.extendCondition(scriptAccountCondition)
 | 
			
		||||
      }
 | 
			
		||||
    } else {
 | 
			
		||||
      this.conditions.push(scriptAccountCondition);
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  removeScriptAccountCondition(scriptAccount: ScriptAccount) {
 | 
			
		||||
    this.conditions = this.conditions.filter(condition => condition.scriptAccount !== scriptAccount);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  findScriptAccountConditionByScriptAccount(scriptAccount: ScriptAccount): ScriptAccountCondition | undefined {
 | 
			
		||||
    return this.conditions.find(condition => condition.scriptAccount === scriptAccount);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  abstract equals(state: State<Transition<any>>): boolean;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user