Commit a1f133a0 authored by Romain DELEAU's avatar Romain DELEAU

sider complete: characters - occurences - repeat - interrupt

parent b13496c1
......@@ -105,10 +105,10 @@
<div class="container-sider">
<app-rules class="container-sider-element" [scenario]="scenario"></app-rules>
<app-role-occurence class="container-sider-element" [role]="pieceDetailsService.pieceAsRole()" *ngIf="pieceDetailsService.pieceIsRole()"></app-role-occurence>
<app-supplementary-task class="container-sider-element" [task]="pieceDetailsService.pieceAsTask()" *ngIf="pieceDetailsService.pieceIsTask()"></app-supplementary-task>
<app-supplementary-task class="container-sider-element" [task]="pieceDetailsService.pieceAsTask()" [role]="pieceDetailsService.parentAsRole()" *ngIf="pieceDetailsService.pieceIsTask()"></app-supplementary-task>
<app-repeat class="container-sider-element" [task]="pieceDetailsService.pieceAsTask()" *ngIf="pieceDetailsService.pieceIsTask()"></app-repeat>
<app-interupt class="container-sider-element" [task]="pieceDetailsService.pieceAsTask()" *ngIf="pieceDetailsService.pieceIsTask()"></app-interupt>
<app-characters class="container-sider-element" [task]="pieceDetailsService.pieceAsTask()" *ngIf="pieceDetailsService.pieceIsTask()"></app-characters>
<app-characters class="container-sider-element" [scenario]="scenario" [task]="pieceDetailsService.pieceAsTask()" *ngIf="pieceDetailsService.pieceIsTask()"></app-characters>
<app-comments class="container-sider-element" [piece]="pieceDetailsService.piece"></app-comments>
</div>
......
......@@ -111,6 +111,19 @@ export class AppComponent {
if (task instanceof Task) {
task.comments = task.comments.map((commentData: any) => Object.assign(new Comment(), commentData));
task.symbol = Object.assign(new Symbol(), task.symbol);
task.characters = task.characters.map((characterData: any) => Object.assign(new Character(), characterData));
task.characters.forEach((character, index) => {
console.log(character instanceof Character);
let i: number | undefined = scenario.characters.findIndex(element => element.name == character.name && element.description == character.description && element.color == character.color);
if (typeof i !== 'undefined' && i !== -1) {
task.characters[i] = scenario.characters[index];
}
});
let supplementaryRoleIndex: number | undefined = role.supplementaryRoles.findIndex(element =>
element.name == task.supplementaryRole.name
&& element.color == task.supplementaryRole.color
);
task.supplementaryRole = role.supplementaryRoles[supplementaryRoleIndex];
}
});
});
......
......@@ -2,5 +2,5 @@ export class Character {
name: string = '';
description: string = '';
color: string = '';
}
export class RoleOccurrence {
iteration: number = 1;
min!: number;
max!:number;
min: number = 0;
max:number = 0;
}
......@@ -14,7 +14,7 @@ export class Task {
duration: number = 1;
durationUnit: string = 'UT';
comments: Comment[] = [];
character!: Character;
characters: Character[] = [];
repeat: Repeat = new Repeat();
supplementaryRole!: SupplementaryRole;
......
......@@ -3,13 +3,13 @@
<mat-icon fontIcon="person"></mat-icon>
<div class="character-top-name">
<label for="name">Nom</label>
<input name="name" type="text"/>
<input name="name" type="text" [(ngModel)]="character.name"/>
</div>
</div>
<div class="character-infos">
<div class="character-infos-description">
<label for="description">Description</label>
<textarea name="description"></textarea>
<textarea name="description" [(ngModel)]="character.description"></textarea>
</div>
<!--
......@@ -27,8 +27,8 @@
<div class="character-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color"/>
<input name="color" type="color" [(ngModel)]="character.color"/>
</div>
</div>
<button mat-button>Retirer de ma tâche</button>
<button mat-button (click)="unassignCharacter(index)">Retirer de ma tâche</button>
</div>
\ No newline at end of file
import { Component, OnInit } from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
import { Character } from 'src/app/class/character/character';
import { Task } from 'src/app/class/task/task';
@Component({
selector: 'app-character',
......@@ -7,9 +9,17 @@ import { Component, OnInit } from '@angular/core';
})
export class CharacterComponent implements OnInit {
@Input() task: Task = new Task('normal');
@Input() character: Character = new Character();
@Input() index: number = 0;
constructor() { }
ngOnInit(): void {
}
unassignCharacter(index: number): void {
this.task.characters.splice(index, 1);
}
}
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'">
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'"
[style.background]="task.supplementaryRole ?
'linear-gradient(140deg, var(--piece-background-color) 0%, var(--piece-background-color) 55%,'+task.supplementaryRole.color+' 55%,'+task.supplementaryRole.color+' 100%)'
: 'var(--piece-background-color)'">
<div class="piece-attach piece-attach-left"></div>
<div class="piece-attach piece-attach-right"></div>
<div class="piece-attach piece-attach-right" [style.background]="task.supplementaryRole ? task.supplementaryRole.color : 'var(--piece-background-color)'"></div>
<div class="piece-menu" [class]="displayMenu">
<mat-icon fontIcon="arrow_back_ios" (click)="moveTask('left')" *ngIf="canMoveTo('left')"></mat-icon>
......@@ -76,12 +79,15 @@
<input class="piece-form-top-identifier" name="identifier" type="text" [(ngModel)]="task.identifier" placeholder="A" min="1" maxlength="5"/>
<div class="piece-form-top-title">Tâche annexe</div>
<mat-icon class="piece-form-top-comment" fontIcon="comment" *ngIf="task.comments.length > 0"></mat-icon>
<mat-icon class="piece-form-top-repeat" fontIcon="refresh" *ngIf="task.repeat.iteration > 0 || task.repeat.while != ''"></mat-icon>
</div>
<textarea class="piece-form-content" [(ngModel)]="task.objective" placeholder="Vérifier ses connaissances sur les formulaires PHP"></textarea>
<div class="piece-form-bottom">
<button mat-button class="piece-form-bottom-prerequires" (click)="changeDisplayPrerequires()">
Prérequis
</button>
<mat-icon class="piece-form-bottom-character" fontIcon="person" *ngIf="task.characters.length > 0"></mat-icon>
<mat-icon class="piece-form-bottom-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
<div class="piece-form-bottom-duration">
<input name="value" type="number" [(ngModel)]="task.duration" (input)="durationChange()"/>
<select name="unite" [(ngModel)]="task.durationUnit" (change)="durationChange()">
......
......@@ -4,7 +4,6 @@
width: 400px;
height: 400px;
position: relative;
background-color: var(--piece-background-color);
transition: all 0.5s ease;
&-menu {
......@@ -157,7 +156,6 @@
border-right: solid black 1px;
width: 40px;
height: 40px;
background-color: var(--piece-background-color);
transform: translateY(-50%) rotate(45deg);
position: absolute;
right: -20px;
......@@ -234,7 +232,14 @@
&-comment {
transform: scale(1.2);
position: absolute;
top: 25px;
top: 20px;
right: 5%;
}
&-repeat {
transform: scale(1.2);
position: absolute;
top: 45px;
right: 5%;
}
......@@ -293,6 +298,20 @@
align-items: center;
justify-content: center;
}
&-interrupt {
transform: scale(1.2);
position: absolute;
right: 41%;
bottom: 25px;
}
&-character {
transform: scale(1.2);
position: absolute;
left: 40%;
bottom: 25px;
}
}
}
}
......
......@@ -54,6 +54,7 @@ export class AnnexeTaskComponent implements OnInit {
onClickDots(): void {
this.pieceDetailsService.piece = this.task;
this.pieceDetailsService.parent = this.role;
}
onClickDelete(): void {
......
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'">
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'"
[style.background]="task.supplementaryRole ?
'linear-gradient(140deg, var(--piece-background-color) 0%, var(--piece-background-color) 55%,'+task.supplementaryRole.color+' 55%,'+task.supplementaryRole.color+' 100%)'
: 'var(--piece-background-color)'">
<div class="piece-attach piece-attach-left"></div>
<div class="piece-menu" [class]="displayMenu">
......@@ -104,6 +107,7 @@
<input class="piece-form-top-identifier" name="identifier" type="text" [(ngModel)]="task.identifier" placeholder="A" min="1" maxlength="5"/>
<div class="piece-form-top-title">Tâche finale</div>
<mat-icon class="piece-form-top-comment" fontIcon="comment" *ngIf="task.comments.length > 0"></mat-icon>
<mat-icon class="piece-form-top-repeat" fontIcon="refresh" *ngIf="task.repeat.iteration > 0 || task.repeat.while != ''"></mat-icon>
<button mat-button class="piece-form-top-symbol" (click)="changeDisplaySymbolChoice()">
<mat-icon *ngIf="task.symbol.symbol" [style.color]="task.symbol.color" [fontIcon]="task.symbol.symbol"></mat-icon>
</button>
......@@ -113,6 +117,8 @@
<button mat-button class="piece-form-bottom-prerequires" (click)="changeDisplayPrerequires()">
Prérequis
</button>
<mat-icon class="piece-form-bottom-character" fontIcon="person" *ngIf="task.characters.length > 0"></mat-icon>
<mat-icon class="piece-form-bottom-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
<div class="piece-form-bottom-duration">
<input name="value" type="number" [(ngModel)]="task.duration" (input)="durationChange()"/>
<select name="unite" [(ngModel)]="task.durationUnit" (change)="durationChange()">
......
......@@ -4,7 +4,6 @@
width: 400px;
height: 400px;
position: relative;
background-color: var(--piece-background-color);
transition: all 0.5s ease;
&-menu {
......@@ -203,7 +202,6 @@
border-right: solid black 1px;
width: 40px;
height: 40px;
background-color: var(--background-color);
transform: translateY(-50%) rotate(45deg);
position: absolute;
left: -20px;
......@@ -269,7 +267,14 @@
&-comment {
transform: scale(1.2);
position: absolute;
top: 25px;
top: 20px;
right: 25%;
}
&-repeat {
transform: scale(1.2);
position: absolute;
top: 45px;
right: 25%;
}
......@@ -330,6 +335,20 @@
align-items: center;
justify-content: center;
}
&-interrupt {
transform: scale(1.2);
position: absolute;
right: 41%;
bottom: 25px;
}
&-character {
transform: scale(1.2);
position: absolute;
left: 40%;
bottom: 25px;
}
}
}
}
......
......@@ -56,6 +56,7 @@ export class FinalTaskComponent implements OnInit {
onClickDots(): void {
this.pieceDetailsService.piece = this.task;
this.pieceDetailsService.parent = this.role;
}
onClickChange(type: string): void {
......
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'">
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'"
[style.background]="task.supplementaryRole ?
'linear-gradient(140deg, var(--piece-background-color) 0%, var(--piece-background-color) 55%,'+task.supplementaryRole.color+' 55%,'+task.supplementaryRole.color+' 100%)'
: 'var(--piece-background-color)'">
<div class="piece-attach piece-attach-left"></div>
<div class="piece-attach piece-attach-right"></div>
<div class="piece-attach piece-attach-right" [style.background]="task.supplementaryRole ? task.supplementaryRole.color : 'var(--piece-background-color)'"></div>
<div class="piece-menu" [class]="displayMenu">
<mat-icon fontIcon="arrow_back_ios" (click)="moveTask('left')" *ngIf="canMoveTo('left')"></mat-icon>
......@@ -105,6 +108,7 @@
<input class="piece-form-top-identifier" name="identifier" type="text" [(ngModel)]="task.identifier" placeholder="A" min="1" maxlength="5"/>
<div class="piece-form-top-title">Tâche<br>optionnelle</div>
<mat-icon class="piece-form-top-comment" fontIcon="comment" *ngIf="task.comments.length > 0"></mat-icon>
<mat-icon class="piece-form-top-repeat" fontIcon="refresh" *ngIf="task.repeat.iteration > 0 || task.repeat.while != ''"></mat-icon>
<button mat-button class="piece-form-top-symbol" (click)="changeDisplaySymbolChoice()">
<mat-icon *ngIf="task.symbol.symbol" [style.color]="task.symbol.color" [fontIcon]="task.symbol.symbol"></mat-icon>
</button>
......@@ -114,6 +118,8 @@
<button mat-button class="piece-form-bottom-prerequires" (click)="changeDisplayPrerequires()">
Prérequis
</button>
<mat-icon class="piece-form-bottom-character" fontIcon="person" *ngIf="task.characters.length > 0"></mat-icon>
<mat-icon class="piece-form-bottom-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
<div class="piece-form-bottom-duration">
<input name="value" type="number" [(ngModel)]="task.duration" (input)="durationChange()"/>
<select name="unite" [(ngModel)]="task.durationUnit" (change)="durationChange()">
......
......@@ -4,7 +4,6 @@
width: 400px;
height: 400px;
position: relative;
background-color: var(--piece-background-color);
transition: all 0.5s ease;
&-menu {
......@@ -203,7 +202,6 @@
border-right: solid black 1px;
width: 40px;
height: 40px;
background-color: var(--piece-background-color);
transform: translateY(-50%) rotate(45deg);
position: absolute;
right: -20px;
......@@ -277,7 +275,14 @@
&-comment {
transform: scale(1.2);
position: absolute;
top: 25px;
top: 20px;
right: 25%;
}
&-repeat {
transform: scale(1.2);
position: absolute;
top: 45px;
right: 25%;
}
......@@ -338,6 +343,20 @@
align-items: center;
justify-content: center;
}
&-interrupt {
transform: scale(1.2);
position: absolute;
right: 41%;
bottom: 25px;
}
&-character {
transform: scale(1.2);
position: absolute;
left: 40%;
bottom: 25px;
}
}
}
}
......
......@@ -56,6 +56,7 @@ export class OptionnalTaskComponent implements OnInit {
onClickDots(): void {
this.pieceDetailsService.piece = this.task;
this.pieceDetailsService.parent = this.role;
}
onClickChange(type: string): void {
......
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'">
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'"
[style.background]="task.supplementaryRole ?
'linear-gradient(140deg, var(--piece-background-color) 0%, var(--piece-background-color) 55%,'+task.supplementaryRole.color+' 55%,'+task.supplementaryRole.color+' 100%)'
: 'var(--piece-background-color)'">
<div class="piece-attach piece-attach-left"></div>
<div class="piece-attach piece-attach-right"></div>
<div class="piece-attach piece-attach-right" [style.background]="task.supplementaryRole ? task.supplementaryRole.color : 'var(--piece-background-color)'"></div>
<div class="piece-menu" [class]="displayMenu">
<mat-icon fontIcon="arrow_back_ios" (click)="moveTask('left')" *ngIf="canMoveTo('left')"></mat-icon>
......@@ -97,6 +100,7 @@
<input class="piece-form-top-identifier" name="identifier" type="text" [(ngModel)]="task.identifier" placeholder="A" min="1" maxlength="5"/>
<div class="piece-form-top-title">Événement<br>aléatoire</div>
<mat-icon class="piece-form-top-comment" fontIcon="comment" *ngIf="task.comments.length > 0"></mat-icon>
<mat-icon class="piece-form-top-repeat" fontIcon="refresh" *ngIf="task.repeat.iteration > 0 || task.repeat.while != ''"></mat-icon>
<button mat-button class="piece-form-top-symbol" (click)="changeDisplaySymbolChoice()">
<mat-icon *ngIf="task.symbol.symbol" [style.color]="task.symbol.color" [fontIcon]="task.symbol.symbol"></mat-icon>
</button>
......@@ -106,6 +110,8 @@
<button mat-button class="piece-form-bottom-prerequires" (click)="changeDisplayPrerequires()">
Prérequis
</button>
<mat-icon class="piece-form-bottom-character" fontIcon="person" *ngIf="task.characters.length > 0"></mat-icon>
<mat-icon class="piece-form-bottom-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
<div class="piece-form-bottom-duration">
<input name="value" type="number" [(ngModel)]="task.duration" (input)="durationChange()"/>
<select name="unite" [(ngModel)]="task.durationUnit" (change)="durationChange()">
......
......@@ -4,7 +4,6 @@
width: 400px;
height: 400px;
position: relative;
background-color: var(--piece-background-color);
transition: all 0.5s ease;
&-menu {
......@@ -194,7 +193,6 @@
border-right: solid black 1px;
width: 40px;
height: 40px;
background-color: var(--piece-background-color);
transform: translateY(-50%) rotate(45deg);
position: absolute;
right: -20px;
......@@ -272,7 +270,14 @@
&-comment {
transform: scale(1.2);
position: absolute;
top: 25px;
top: 20px;
right: 25%;
}
&-repeat {
transform: scale(1.2);
position: absolute;
top: 45px;
right: 25%;
}
......@@ -333,6 +338,20 @@
align-items: center;
justify-content: center;
}
&-interrupt {
transform: scale(1.2);
position: absolute;
right: 41%;
bottom: 25px;
}
&-character {
transform: scale(1.2);
position: absolute;
left: 40%;
bottom: 25px;
}
}
}
}
......
......@@ -56,6 +56,7 @@ export class RandomEventComponent implements OnInit {
onClickDots(): void {
this.pieceDetailsService.piece = this.task;
this.pieceDetailsService.parent = this.role;
}
onClickDelete(): void {
......
......@@ -14,4 +14,7 @@
<textarea [(ngModel)]="task.objective" placeholder="Faire valider au commanditaire"></textarea>
</div>
<mat-icon class="piece-form-comment" fontIcon="comment" *ngIf="task.comments.length > 0"></mat-icon>
<mat-icon class="piece-form-repeat" fontIcon="refresh" *ngIf="task.repeat.iteration > 0 || task.repeat.while != ''"></mat-icon>
<mat-icon class="piece-form-character" fontIcon="person" *ngIf="task.characters.length > 0"></mat-icon>
<mat-icon class="piece-form-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
</div>
......@@ -91,7 +91,28 @@
transform: scale(1.2);
position: absolute;
bottom: 50px;
left: 35px;
left: 50px;
}
&-repeat {
transform: scale(1.2);
position: absolute;
bottom: 50px;
left: 100px;
}
&-character {
transform: scale(1.2);
position: absolute;
bottom: 50px;
left: 150px;
}
&-interrupt {
transform: scale(1.2);
position: absolute;
bottom: 50px;
left: 200px;
}
}
}
......
......@@ -30,6 +30,7 @@ export class RepeatTaskComponent implements OnInit {
onClickDots(): void {
this.pieceDetailsService.piece = this.task;
this.pieceDetailsService.parent = this.role;
}
onClickDelete(): void {
......
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'">
<div class="piece" [ngStyle]="{'width': pieceWidth}" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'; displayPrequires='hide'; displaySymbolChoice='hide'"
[style.background]="task.supplementaryRole ?
'linear-gradient(140deg, var(--piece-background-color) 0%, var(--piece-background-color) 55%,'+task.supplementaryRole.color+' 55%,'+task.supplementaryRole.color+' 100%)'
: 'var(--piece-background-color)'">
<div class="piece-attach piece-attach-left"></div>
<div class="piece-attach piece-attach-right"></div>
<div class="piece-attach piece-attach-right" [style.background]="task.supplementaryRole ? task.supplementaryRole.color : 'var(--piece-background-color)'"></div>
<div class="piece-menu" [class]="displayMenu">
<mat-icon fontIcon="arrow_back_ios" (click)="moveTask('left')" *ngIf="canMoveTo('left')"></mat-icon>
......@@ -105,6 +108,7 @@
<input class="piece-form-top-identifier" name="identifier" type="text" [(ngModel)]="task.identifier" placeholder="A" min="1" maxlength="5"/>
<div class="piece-form-top-title">Tâche</div>
<mat-icon class="piece-form-top-comment" fontIcon="comment" *ngIf="task.comments.length > 0"></mat-icon>
<mat-icon class="piece-form-top-repeat" fontIcon="refresh" *ngIf="task.repeat.iteration > 0 || task.repeat.while != ''"></mat-icon>
<button mat-button class="piece-form-top-symbol" (click)="changeDisplaySymbolChoice()">
<mat-icon *ngIf="task.symbol.symbol" [style.color]="task.symbol.color" [fontIcon]="task.symbol.symbol"></mat-icon>
</button>
......@@ -114,6 +118,8 @@
<button mat-button class="piece-form-bottom-prerequires" (click)="changeDisplayPrerequires()">
Prérequis
</button>
<mat-icon class="piece-form-bottom-character" fontIcon="person" *ngIf="task.characters.length > 0"></mat-icon>
<mat-icon class="piece-form-bottom-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
<div class="piece-form-bottom-duration">
<input name="value" type="number" [(ngModel)]="task.duration" (input)="durationChange()"/>
<select name="unite" [(ngModel)]="task.durationUnit" (change)="durationChange()">
......
......@@ -4,7 +4,6 @@
width: 400px;
height: 400px;
position: relative;
background-color: var(--piece-background-color);
transition: all 0.5s ease;
&-menu {
......@@ -203,7 +202,6 @@
border-right: solid black 1px;
width: 40px;
height: 40px;
background-color: var(--piece-background-color);
transform: translateY(-50%) rotate(45deg);
position: absolute;
right: -20px;
......@@ -281,7 +279,14 @@
&-comment {
transform: scale(1.2);
position: absolute;
top: 25px;
top: 20px;
right: 25%;
}
&-repeat {
transform: scale(1.2);
position: absolute;
top: 45px;
right: 25%;
}
......@@ -342,6 +347,20 @@
align-items: center;
justify-content: center;
}
&-interrupt {
transform: scale(1.2);
position: absolute;
right: 41%;
bottom: 25px;
}
&-character {
transform: scale(1.2);
position: absolute;
left: 40%;
bottom: 25px;
}
}
}
}
......
......@@ -56,6 +56,7 @@ export class TaskComponent implements OnInit {
onClickDots(): void {
this.pieceDetailsService.piece = this.task;
this.pieceDetailsService.parent = this.role;
}
onClickChange(type: string): void {
......
......@@ -11,6 +11,7 @@ import { Scenario } from 'src/app/class/scenario/scenario';
export class PieceDetailsService {
piece!: (Task | Role | Mission | Step | Scenario);
parent!: (Role | Mission | Scenario);
constructor() { }
......@@ -53,4 +54,8 @@ export class PieceDetailsService {
pieceAsScenario(): Scenario {
return this.piece as Scenario;
}
parentAsRole(): Role {
return this.parent as Role;
}
}
......@@ -7,13 +7,13 @@
<mat-icon fontIcon="person_add"></mat-icon>
<div class="piece-form-create-top-name">
<label for="name">Nom</label>
<input name="name" type="text" />
<input name="name" type="text" [(ngModel)]="newCharacter.name"/>
</div>
</div>
<div class="piece-form-create-infos">
<div class="piece-form-create-infos-description">
<label for="description">Description</label>
<textarea name="description"></textarea>
<textarea name="description" [(ngModel)]="newCharacter.description"></textarea>
</div>
<!--
......@@ -31,10 +31,10 @@
<div class="piece-form-create-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color" />
<input name="color" type="color" [(ngModel)]="newCharacter.color"/>
</div>
</div>
<button mat-button>Créer</button>
<button mat-button (click)="createCharacter()">Créer</button>
</div>
<div class="piece-form-select">
......@@ -43,12 +43,14 @@
<mat-icon fontIcon="person"></mat-icon>
<div class="piece-form-select-container-select">
<label for="name">Nom</label>
<select name="name">
<option>test</option>
<select name="name" [(ngModel)]="selectedAssignCharacter">
<ng-container *ngFor="let character of scenario.characters">
<option [ngValue]="character" *ngIf="notAlreadyAssigned(character)">{{character.name}}</option>
</ng-container>
</select>
</div>
</div>
<button mat-button>Sélectionner</button>
<button mat-button (click)="assignCharacter()">Sélectionner</button>
</div>
<div class="piece-form-delete">
......@@ -57,18 +59,17 @@
<mat-icon fontIcon="person_off"></mat-icon>
<div class="piece-form-delete-container-select">
<label for="name">Nom</label>
<select name="name">
<option>test</option>
<select name="name" [(ngModel)]="selectedDeleteCharacterIndex">
<option [ngValue]="i" *ngFor="let character of scenario.characters, let i = index">{{character.name}}</option>
</select>
</div>
</div>
<button mat-button>Supprimer</button>
<button mat-button (click)="deleteCharacter()">Supprimer</button>
</div>
<div>
<div class="piece-form-title">Personnage(s) utilisé(s)</div>
<app-character></app-character>
<app-character></app-character>
<app-character [task]="task" [character]="character" [index]="i" *ngFor="let character of task.characters, let i = index"></app-character>
</div>
</div>
......
import { Component, Input, OnInit } from '@angular/core';
import { Character } from 'src/app/class/character/character';
import { Scenario } from 'src/app/class/scenario/scenario';
import { Task } from 'src/app/class/task/task';
@Component({
......@@ -8,11 +10,50 @@ import { Task } from 'src/app/class/task/task';
})
export class CharactersComponent implements OnInit {
@Input() scenario: Scenario = new Scenario();
@Input() task: Task = new Task('normal');
newCharacter: Character = new Character();
selectedAssignCharacter!: Character | undefined;
selectedDeleteCharacterIndex!: number;
constructor() { }
ngOnInit(): void {
}
createCharacter(): void {
if (this.newCharacter.name != '') {
this.scenario.characters.push(this.newCharacter);
this.newCharacter = new Character();
}
}
deleteCharacter(): void {
if (this.selectedDeleteCharacterIndex != undefined) {
this.scenario.missions.forEach(mission => {
mission.roles.forEach(role => {
role.tasks.forEach(inlineTask => {
inlineTask.forEach(task => {
let index: number | undefined = task?.characters.findIndex(character => character == this.scenario.characters[this.selectedDeleteCharacterIndex]);
if (typeof index !== 'undefined' && index !== -1) {
task?.characters.splice(index, 1);
}
});
});
});
});
this.scenario.characters.splice(this.selectedDeleteCharacterIndex, 1);
}
}
assignCharacter(): void {
if (this.selectedAssignCharacter != undefined) {
this.task.characters.push(this.selectedAssignCharacter);
this.selectedAssignCharacter = undefined;
}
}
notAlreadyAssigned(character: Character): boolean {
return !this.task.characters.includes(character);
}
}
......@@ -7,7 +7,7 @@
</div>
</div>
<div class="piece-form-textarea">
<textarea></textarea>
<textarea [(ngModel)]="task.interrupt"></textarea>
</div>
</div>
</div>
\ No newline at end of file
......@@ -4,13 +4,13 @@
<mat-icon fontIcon="refresh"></mat-icon>
<div class="piece-form-header-for">
<label>Répéter</label>
<input type="text"/>
<input type="text" [(ngModel)]="task.repeat.iteration"/>
<label>fois</label>
</div>
</div>
<div class="piece-form-while">
<label>ou jusqu'à ce que :</label>
<textarea></textarea>
<textarea [(ngModel)]="task.repeat.while"></textarea>
</div>
</div>
</div>
\ No newline at end of file
<div class="piece">
<div class="piece-form">
<div class="piece-title">Occurrence du rôle</div>
<div class="piece-form-occurrence">
<div class="piece-form-occurrence" *ngFor="let occurence of role.occurences, let i = index">
<div class="piece-form-occurrence-text">
<input type="text"/>
<input type="text" [(ngModel)]="occurence.iteration"/>
<label> entre </label>
<input type="text"/>
<input type="text" [(ngModel)]="occurence.min"/>
<label> et </label>
<input type="text"/>
<input type="text" [(ngModel)]="occurence.max"/>
<label> joueurs</label>
</div>
<button mat-button><mat-icon fontIcon="remove"></mat-icon></button>
<button mat-button (click)="removeOccurrence(i)"><mat-icon fontIcon="remove"></mat-icon></button>
</div>
<div class="piece-form-occurrence">
<div class="piece-form-occurrence-text">
<input type="text"/>
<label> entre </label>
<input type="text"/>
<label> et </label>
<input type="text"/>
<label> joueurs</label>
</div>
<button mat-button><mat-icon fontIcon="remove"></mat-icon></button>
</div>
<button mat-button class="piece-form-add"><mat-icon fontIcon="add"></mat-icon></button>
<button mat-button class="piece-form-add" (click)="addOccurrence()"><mat-icon fontIcon="add"></mat-icon></button>
</div>
</div>
\ No newline at end of file
import { Component, Input, OnInit } from '@angular/core';
import { RoleOccurrence } from 'src/app/class/role-occurrence/role-occurrence';
import { Role } from 'src/app/class/role/role';
@Component({
......@@ -15,4 +16,12 @@ export class RoleOccurenceComponent implements OnInit {
ngOnInit(): void {
}
addOccurrence(): void {
this.role.occurences.push(new RoleOccurrence());
}
removeOccurrence(index: number): void {
this.role.occurences.splice(index, 1);
}
}
<div class="piece">
<div class="piece" [style.background]="task.supplementaryRole ?
'linear-gradient(165deg, rgba(154,213,236,1) 0%, rgba(154,213,236,1) 55%,'+task.supplementaryRole.color+' 55%,'+task.supplementaryRole.color+' 100%)'
: 'linear-gradient(165deg, rgba(154,213,236,1) 0%, rgba(154,213,236,1) 55%, rgba(0,0,0,1) 55%, rgba(0,0,0,1) 100%)'">
<div class="piece-form">
<div class="piece-title">Tâche liée au rôle supplémentaire</div>
<!--
<div class="piece-form-checkbox">
<input type="checkbox" [(ngModel)]="checkbox"/>
<label>Oui</label>
</div>
<div class="piece-form-select" *ngIf="checkbox">
œ-->
<div class="piece-form-select">
<label>Rôle</label>
<select>
<option>Rôle 1</option>
<select [(ngModel)]="task.supplementaryRole">
<option selected [ngValue]="undefined">Aucun</option>
<ng-container *ngFor="let supplementaryRole of role.supplementaryRoles">
<option [ngValue]="supplementaryRole">{{supplementaryRole.name}}</option>
</ng-container>
</select>
</div>
</div>
......
......@@ -4,7 +4,7 @@
width: 300px;
height: 100px;
position: relative;
background: linear-gradient(165deg, rgba(154,213,236,1) 0%, rgba(154,213,236,1) 55%, rgba(0,0,0,1) 55%, rgba(0,0,0,1) 100%);
//background: linear-gradient(165deg, rgba(154,213,236,1) 0%, rgba(154,213,236,1) 55%, rgba(0,0,0,1) 55%, rgba(0,0,0,1) 100%);
border: solid black 1px;
border-radius: 10px;
......@@ -23,7 +23,7 @@
}
&-select {
margin-top: 5px;
margin-top: 15px;
margin-left: 10px;
width: 100%;
......
import { Component, Input, OnInit } from '@angular/core';
import { Task } from 'src/app/class/task/task';
import { Role } from 'src/app/class/role/role';
@Component({
selector: 'app-supplementary-task',
......@@ -9,12 +10,10 @@ import { Task } from 'src/app/class/task/task';
export class SupplementaryTaskComponent implements OnInit {
@Input() task: Task = new Task('normal');
@Input() role: Role = new Role();
constructor() { }
ngOnInit(): void {
}
checkbox: boolean = false;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment