Skip to content

R
RLG Maker
Commit fe81a337 authored by Romain DELEAU's avatar Romain DELEAU
Browse files
Options

move rules and character pieces below game-context

parent 83cb0050
Show whitespace changes
Inline Side-by-side
Showing with 451 additions and 299 deletions
src/app/app.component.html
View file @ fe81a337
......@@ -6,6 +6,8 @@
<div class="container-scenario-main-gamePieces" [style.z-index]="4">
<app-game-educationnal-objective [scenario]="scenario" [gameEducationnalObjective]="this.scenario.educationnalObjective"></app-game-educationnal-objective>
<app-game-context [style.z-index]="2" [scenario]="scenario" [gameContext]="this.scenario.context"></app-game-context>
<app-game-characters [style.z-index]="3" [scenario]="scenario"></app-game-characters>
<app-rules [style.z-index]="4" [scenario]="scenario"></app-rules>
</div>
<div class="container-scenario-main-missions">
......@@ -115,7 +117,6 @@
</div>
<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()" [role]="pieceDetailsService.parentAsRole()" *ngIf="pieceDetailsService.pieceIsTask()"></app-supplementary-task>
<app-repeat class="container-sider-element" [task]="pieceDetailsService.pieceAsTask()" *ngIf="pieceDetailsService.pieceIsTask()"></app-repeat>
......
src/app/app.module.ts
View file @ fe81a337
......@@ -22,8 +22,7 @@ import { RepeatComponent } from './sider-pieces/repeat/repeat.component';
import { CommentComponent } from './components/comment/comment.component';
import { RandomEventComponent } from './pieces/tasks/random-event/random-event.component';
import { CharactersComponent } from './sider-pieces/characters/characters.component';
import { CharacterComponent } from './components/character/character.component';
import { RulesComponent } from './sider-pieces/rules/rules.component';
import { RulesComponent } from './pieces/rules/rules.component';
import { StepComponent } from './pieces/step/step.component';
import { FinalTaskComponent } from './pieces/tasks/final-task/final-task.component';
import { RepeatTaskComponent } from './pieces/tasks/repeat-task/repeat-task.component';
......@@ -37,6 +36,7 @@ import { DragScrollDirective } from './directives/drag-scroll.directive';
import { MouseWheelZoomDirective } from './directives/mouse-wheel-zoom.directive';
import { CleanDialogComponent } from './components/dialogs/clean-dialog/clean-dialog.component';
import { CreateDialogComponent } from './components/dialogs/create-dialog/create-dialog.component';
import { GameCharactersComponent } from './pieces/game-characters/game-characters.component';
@NgModule({
declarations: [
......@@ -55,7 +55,6 @@ import { CreateDialogComponent } from './components/dialogs/create-dialog/create
CommentComponent,
RandomEventComponent,
CharactersComponent,
CharacterComponent,
RulesComponent,
StepComponent,
FinalTaskComponent,
......@@ -66,7 +65,8 @@ import { CreateDialogComponent } from './components/dialogs/create-dialog/create
SupplementaryTaskComponent,
SuppressDialogComponent,
CleanDialogComponent,
CreateDialogComponent
CreateDialogComponent,
GameCharactersComponent
],
imports: [
BrowserModule,
......
src/app/components/character/character.component.html deleted 100644 → 0
View file @ 83cb0050
<div class="character">
<div class="character-top">
<mat-icon fontIcon="person"></mat-icon>
<div class="character-top-name">
<label for="name">Nom</label>
<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" [(ngModel)]="character.description"></textarea>
</div>
<!--
<div>
<div class="character-infos-phone">
<label for="phonenumber">N° tél.</label>
<input name="phonenumber" type="tel"/>
</div>
<div class="character-infos-title">
<label for="title">Titre</label>
<input name="title" type="text"/>
</div>
</div>
-->
<div class="character-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color" [(ngModel)]="character.color"/>
</div>
</div>
<button mat-button (click)="unassignCharacter(index)">Retirer de ma tâche</button>
</div>
\ No newline at end of file
src/app/components/character/character.component.scss deleted 100644 → 0
View file @ 83cb0050
label {
margin-right: 10px;
}
input[type="text"],
input[type="tel"] {
border: none;
border-radius: 10px;
height: 20px;
padding: 5px 5px 5px 5px;
}
input[type="color"] {
border: none;
border-radius: 10px;
background-color: white;
}
textarea {
border: none;
border-radius: 10px;
min-height: 50px;
max-height: 100px;
resize: vertical;
padding: 5px 10px 5px 10px;
}
select {
border-radius: 10px;
background-color: white;
border: none;
padding: 5px 10px 5px 10px;
}
mat-icon {
transform: scale(2);
color: white;
margin-left: 10px;
margin-right: 20px;
}
button {
margin-top: 5px;
background-color: white;
border-radius: 10px;
position: relative;
left: 100%;
transform: translateX(-100%);
}
.character {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: solid black 1px;
&-top {
display: flex;
flex-direction: row;
width: 100%;
&-name {
display: flex;
justify-content: flex-end;
input {
width: 75%;
}
}
}
&-infos {
margin-top: 10px;
&-description {
display: flex;
flex-direction: column;
}
&-phone {
display: flex;
margin-top: 5px;
justify-content: space-between;
}
&-title {
display: flex;
margin-top: 5px;
justify-content: space-between;
}
&-color {
margin-top: 5px;
}
}
}
\ No newline at end of file
src/app/components/character/character.component.ts deleted 100644 → 0
View file @ 83cb0050
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',
templateUrl: './character.component.html',
styleUrls: ['./character.component.scss']
})
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);
}
}
src/app/pieces/game-characters/game-characters.component.html 0 → 100644
View file @ fe81a337
<div class="piece" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'" (click)="onClickPiece()">
<div class="piece-menu" [class]="displayMenu">
<mat-icon fontIcon="backspace" (click)="onClickErase()"
matTooltip="Effacer le contenu de cette tuile."
matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
</div>
<div class="piece-form">
<div class="piece-form-character-create">
<div class="piece-form-title">Créer un nouveau personnage</div>
<div class="piece-form-character-create-top">
<mat-icon fontIcon="person_add"></mat-icon>
<div class="piece-form-character-create-top-name">
<label for="name">Nom</label>
<input name="name" type="text" [(ngModel)]="newCharacter.name"/>
</div>
</div>
<div class="piece-form-create-infos">
<div class="piece-form-character-create-infos-description">
<label for="description">Description</label>
<textarea class="background" name="description" [(ngModel)]="newCharacter.description"></textarea>
</div>
<div class="piece-form-character-create-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color" [(ngModel)]="newCharacter.color"/>
</div>
</div>
<button mat-button (click)="createCharacter()">Créer</button>
</div>
<div class="piece-form-character-characters" *ngIf="scenario.characters.length > 0" >
<div class="piece-form-title">Personnages</div>
<div class="piece-form-character-characters-character" *ngFor="let character of scenario.characters; let index = index" [style]="index == 0? '' : 'border-top: solid black 1px;'">
<div class="piece-form-character-create-top">
<mat-icon fontIcon="person"></mat-icon>
<div class="piece-form-character-create-top-name">
<label for="name">Nom</label>
<input name="name" type="text" [(ngModel)]="character.name"/>
</div>
</div>
<div class="piece-form-create-infos">
<div class="piece-form-character-create-infos-description">
<label for="description">Description</label>
<textarea name="description" [(ngModel)]="character.description"></textarea>
</div>
<div class="piece-form-character-create-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color" [(ngModel)]="character.color"/>
</div>
</div>
<button mat-button (click)="deleteCharacter(index)">Supprimer</button>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/pieces/game-characters/game-characters.component.scss 0 → 100644
View file @ fe81a337
.piece {
--piece-background-color: #ce7b66;
width: 400px;
position: relative;
background-color: var(--piece-background-color);
&-menu {
position: absolute;
width: 150px;
height: 50px;
background-color: #f7f7f7;
z-index: -1;
top: -51px;
left: 50%;
transform: translateX(-50%);
transition: transform 0.5s ease;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border: solid black 1px;
display: flex;
padding: 15px 20px 15px 20px;
justify-content: space-around;
mat-icon {
cursor: pointer;
transform: scale(1.1);
}
mat-icon:hover {
opacity: 0.75;
}
}
&-menu.show {
transform: translateX(-50%) translateY(0);
}
&-menu.hide {
transform: translateX(-50%) translateY(100%);
}
&-form {
margin: 0px 10px 0px 10px;
display: flex;
flex-direction: column;
z-index: 2;
position: relative;
button {
margin-top: 5px;
background-color: white;
border-radius: 10px;
position: relative;
left: 100%;
transform: translateX(-100%);
}
label {
font-size: 20px;
font-weight: lighter;
margin-top: 10px;
margin-bottom: 5px;
}
input {
height: 40px;
border-radius: 10px;
border: none;
padding: 5px 10px 5px 10px;
background-color: white;
margin-left: 15px;
}
textarea {
border-radius: 20px;
padding: 10px;
border: none;
resize: none;
flex-grow: 1;
height: 100px;
}
mat-icon {
transform: scale(2);
color: white;
margin-left: 10px;
margin-right: 20px;
}
&-title {
margin-top: 20px;
font-family: "Glacial Indifference Bold";
margin-bottom: 10px;
font-size: 25px;
}
&-character {
margin-bottom: 25px;
&-create {
margin-bottom: 10px;
padding-bottom: 10px;
&-top {
display: flex;
flex-direction: row;
width: 100%;
margin-top: 20px;
&-name {
display: flex;
justify-content: flex-end;
input {
width: 75%;
}
}
}
&-infos {
margin-top: 10px;
&-description {
display: flex;
flex-direction: column;
}
&-phone {
display: flex;
margin-top: 5px;
justify-content: space-between;
}
&-title {
display: flex;
margin-top: 5px;
justify-content: space-between;
}
&-color {
margin-top: 5px;
}
}
}
&-characters {
&-character {
margin-top: 5px;
margin-bottom: 10px;
}
}
}
}
}
.piece::after {
content: "";
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border: 1px solid black;
}
.background {
background-image: url("../../../assets/background-images/perso.png");
background-position: center;
background-repeat: no-repeat;
background-size: 30%;
}
\ No newline at end of file
src/app/components/character/character.component.spec.ts → src/app/pieces/game-characters/game-characters.component.spec.ts
View file @ fe81a337
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { CharacterComponent } from './character.component';
import { GameCharactersComponent } from './game-characters.component';
describe('CharacterComponent', () => {
let component: CharacterComponent;
let fixture: ComponentFixture<CharacterComponent>;
describe('GameCharactersComponent', () => {
let component: GameCharactersComponent;
let fixture: ComponentFixture<GameCharactersComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ CharacterComponent ]
declarations: [ GameCharactersComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(CharacterComponent);
fixture = TestBed.createComponent(GameCharactersComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
......
src/app/pieces/game-characters/game-characters.component.ts 0 → 100644
View file @ fe81a337
import { Component, Input, OnInit } from '@angular/core';
import { TooltipService } from 'src/app/services/tooltip/tooltip.service';
import { MatDialog } from '@angular/material/dialog';
import { PieceDetailsService } from 'src/app/services/piece-details/piece-details.service';
import { Scenario } from 'src/app/class/scenario/scenario';
import { CreateDialogComponent } from 'src/app/components/dialogs/create-dialog/create-dialog.component';
import { SuppressDialogComponent } from 'src/app/components/dialogs/suppress-dialog/suppress-dialog.component';
import { Character } from 'src/app/class/character/character';
import { CleanDialogComponent } from 'src/app/components/dialogs/clean-dialog/clean-dialog.component';
import { Task } from 'src/app/class/task/task';
@Component({
selector: 'app-game-characters',
templateUrl: './game-characters.component.html',
styleUrls: ['./game-characters.component.scss']
})
export class GameCharactersComponent implements OnInit {
displayMenu: string = 'hide';
@Input() scenario = new Scenario()
newCharacter: Character = new Character();
constructor(protected tooltipService: TooltipService, public dialog: MatDialog, private pieceDetailsService: PieceDetailsService) { }
ngOnInit(): void {
}
onClickPiece(): void {
this.pieceDetailsService.piece = this.scenario;
}
onClickErase(): void {
const dialogRef = this.dialog.open(CleanDialogComponent, { data: 'Personnages (cela inclut la suppression de tous les personnages)' });
dialogRef.afterClosed().subscribe(result => {
if (result == true) {
this.newCharacter = new Character();
this.scenario.characters = [];
this.scenario.missions.forEach(mission => {
mission.roles.forEach(role => {
role.tasks.forEach(inlineTasks => {
inlineTasks.forEach(task => {
if (task instanceof Task) {
task.characters = [];
}
});
});
});
});
}
});
}
createCharacter(): void {
if (this.newCharacter.name != '') {
const dialogRef = this.dialog.open(CreateDialogComponent, { data: 'un nouveau Personnage <'+this.newCharacter.name+'>' });
dialogRef.afterClosed().subscribe(result => {
if (result == true) {
this.scenario.characters.push(this.newCharacter);
this.newCharacter = new Character();
}
});
}
}
deleteCharacter(index: number): void {
const dialogRef = this.dialog.open(SuppressDialogComponent, { data: 'ce Personnage <'+this.scenario.characters[index].name+'>' });
dialogRef.afterClosed().subscribe(result => {
if (result == true) {
this.scenario.missions.forEach(mission => {
mission.roles.forEach(role => {
role.tasks.forEach(inlineTask => {
inlineTask.forEach(task => {
let i: number | undefined = task?.characters.findIndex(character => character == this.scenario.characters[index]);
if (typeof i !== 'undefined' && i !== -1) {
task?.characters.splice(i, 1);
}
});
});
});
});
this.scenario.characters.splice(index, 1);
}
});
}
}
src/app/sider-pieces/rules/rules.component.html → src/app/pieces/rules/rules.component.html
View file @ fe81a337
<div class="piece">
<div class="piece" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'" (click)="onClickPiece()">
<div class="piece-menu" [class]="displayMenu">
<mat-icon fontIcon="backspace" (click)="onClickErase()"
matTooltip="Effacer le contenu de cette tuile."
matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
</div>
<div class="piece-form">
<div class="piece-form-rules">
<div class="piece-form-title">Règles du jeu</div>
<textarea [(ngModel)]="scenario.gameRules"
matTooltip="Éléments importants à prendre en compte dans les règles du jeu"
matTooltipPosition="before" [matTooltipDisabled]="!tooltipService.activatedTooltips"></textarea>
matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></textarea>
</div>
<div class="piece-form-ressources">
<div class="piece-form-title">Ressources / objets</div>
<div class="piece-form-ressources-object">
<div class="piece-form-ressources-object-infos" *ngFor="let ressource of scenario.ressources; let i = index"
matTooltip="Objets, ressources disponibles pour TOUS les rôles"
matTooltipPosition="before" [matTooltipDisabled]="!tooltipService.activatedTooltips">
matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips">
<div class="piece-form-ressources-object-infos-name">
<label for="name">Nom</label>
<input name="name" type="text" [(ngModel)]="ressource.name"/>
</div>
<div class="piece-form-ressources-object-infos-quantity">
<label for="quantity">Quantité</label>
<input name="quantity" type="text" [(ngModel)]="ressource.number"/>
<input name="quantity" type="number" min="1"[(ngModel)]="ressource.number"/>
</div>
<button mat-button (click)="removeRessource(i)"><mat-icon fontIcon="remove"></mat-icon></button>
</div>
......
src/app/sider-pieces/rules/rules.component.scss → src/app/pieces/rules/rules.component.scss
View file @ fe81a337
.piece {
--piece-background-color: #c6c2bd;
width: 300px;
width: 400px;
position: relative;
background-color: var(--piece-background-color);
&-menu {
position: absolute;
width: 150px;
height: 50px;
background-color: #f7f7f7;
z-index: -1;
top: -51px;
left: 50%;
transform: translateX(-50%);
transition: transform 0.5s ease;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border: solid black 1px;
border-radius: 10px;
display: flex;
padding: 15px 20px 15px 20px;
justify-content: space-around;
mat-icon {
cursor: pointer;
transform: scale(1.1);
}
mat-icon:hover {
opacity: 0.75;
}
}
&-menu.show {
transform: translateX(-50%) translateY(0);
}
&-menu.hide {
transform: translateX(-50%) translateY(100%);
}
&-form {
margin: 10px 5px 10px 5px;
margin: 0px 10px 0px 10px;
display: flex;
flex-direction: column;
z-index: 2;
position: relative;
button {
border-radius: 10px;
......@@ -18,8 +49,10 @@
}
&-title {
margin-top: 20px;
font-family: "Glacial Indifference Bold";
margin-bottom: 10px;
font-size: 25px;
}
&-rules {
......@@ -33,16 +66,16 @@
background-repeat: no-repeat;
background-size: 30%;
border-radius: 10px;
border-radius: 20px;
border: none;
resize: vertical;
min-height: 100px;
max-height: 200px;
height: 150px;
padding: 5px 5px 5px 5px;
resize: none;
}
}
&-ressources {
margin-bottom: 20px;
button {
position: relative;
......@@ -84,15 +117,15 @@
}
}
&-validate {
display: flex;
flex-direction: row;
justify-content: flex-end;
button {
margin-top: 10px;
}
}
}
}
.piece::after {
content: "";
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border: 1px solid black;
}
\ No newline at end of file
src/app/sider-pieces/rules/rules.component.ts → src/app/pieces/rules/rules.component.ts
View file @ fe81a337
......@@ -4,6 +4,9 @@ import { Scenario } from 'src/app/class/scenario/scenario';
import { TooltipService } from 'src/app/services/tooltip/tooltip.service';
import { MatDialog } from '@angular/material/dialog';
import { SuppressDialogComponent } from 'src/app/components/dialogs/suppress-dialog/suppress-dialog.component';
import { CleanDialogComponent } from 'src/app/components/dialogs/clean-dialog/clean-dialog.component';
import { PieceDetailsService } from 'src/app/services/piece-details/piece-details.service';
import { Task } from 'src/app/class/task/task';
@Component({
selector: 'app-rules',
......@@ -12,13 +15,46 @@ import { SuppressDialogComponent } from 'src/app/components/dialogs/suppress-dia
})
export class RulesComponent implements OnInit {
displayMenu: string = 'hide';
@Input() scenario: Scenario = new Scenario();
constructor(protected tooltipService: TooltipService, public dialog: MatDialog) { }
constructor(protected tooltipService: TooltipService, public dialog: MatDialog, private pieceDetailsService: PieceDetailsService) { }
ngOnInit(): void {
}
onClickPiece(): void {
this.pieceDetailsService.piece = this.scenario;
}
onClickErase(): void {
const dialogRef = this.dialog.open(CleanDialogComponent, { data: 'Règles du jeu (cela inclut la suppression de toutes les ressources)' });
dialogRef.afterClosed().subscribe(result => {
if (result == true) {
this.scenario.gameRules = '';
//this.scenario.ressources = [];
this.scenario.ressources.forEach((ressource, i) => {
this.scenario.missions.forEach(mission => {
mission.roles.forEach(role => {
role.tasks.forEach(inlineTasks => {
inlineTasks.forEach(task => {
if (task instanceof Task) {
task.prerequireRessources.forEach((taskRessource, j) => {
if (ressource == taskRessource.ressource) {
task.prerequireRessources.splice(j, 1);
}
});
}
});
});
});
});
});
this.scenario.ressources = [];
}
});
}
addRessource(): void {
this.scenario.ressources.push(new Ressource());
}
......
src/app/sider-pieces/characters/characters.component.html
View file @ fe81a337
......@@ -2,45 +2,8 @@
matTooltip="Si des personnages non joueurs (PNJ) doivent intervenir dans le scénario, ils doivent être décrits avec cette tuile. Chaque personnage a sa propre couleur et sont visibles sur les tâches où ils interviennent. L'enseignant peut être considéré comme un personnage s'il n'a pas un Rôle à part entière."
matTooltipPosition="before" [matTooltipDisabled]="!tooltipService.activatedTooltips">
<div class="piece-form">
<div class="piece-form-create">
<div class="piece-form-title">Créer un nouveau personnage</div>
<div class="piece-form-create-top">
<mat-icon fontIcon="person_add"></mat-icon>
<div class="piece-form-create-top-name">
<label for="name">Nom</label>
<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" [(ngModel)]="newCharacter.description"></textarea>
</div>
<!--
<div>
<div class="piece-form-create-infos-phone">
<label for="phonenumber">N° tél.</label>
<input name="phonenumber" type="tel"/>
</div>
<div class="piece-form-create-infos-title">
<label for="title">Titre</label>
<input name="title" type="text"/>
</div>
</div>
-->
<div class="piece-form-create-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color" [(ngModel)]="newCharacter.color"/>
</div>
</div>
<button mat-button (click)="createCharacter()">Créer</button>
</div>
<div class="piece-form-select">
<div class="piece-form-title">Sélectionner un personnage déjà créé</div>
<div class="piece-form-title">Affecter un personnage déjà créé</div>
<div class="piece-form-select-container">
<mat-icon fontIcon="person"></mat-icon>
<div class="piece-form-select-container-select">
......@@ -54,24 +17,28 @@ matTooltipPosition="before" [matTooltipDisabled]="!tooltipService.activatedToolt
</div>
<button mat-button (click)="assignCharacter()">Sélectionner</button>
</div>
<div class="piece-form-delete">
<div class="piece-form-title">Supprimer un personnage</div>
<div class="piece-form-delete-container">
<mat-icon fontIcon="person_off"></mat-icon>
<div class="piece-form-delete-container-select">
<div>
<div class="piece-form-title">Personnage(s) utilisé(s)</div>
<div class="piece-form-character-create" *ngFor="let character of task.characters, let index = index">
<div class="piece-form-character-create-top">
<mat-icon fontIcon="person"></mat-icon>
<div class="piece-form-character-create-top-name">
<label for="name">Nom</label>
<select name="name" [(ngModel)]="selectedDeleteCharacterIndex">
<option [ngValue]="i" *ngFor="let character of scenario.characters, let i = index">{{character.name}}</option>
</select>
<input name="name" type="text" [(ngModel)]="character.name" disabled/>
</div>
</div>
<button mat-button (click)="deleteCharacter()">Supprimer</button>
<div class="piece-form-character-infos">
<div class="piece-form-character-infos-description">
<label for="description">Description</label>
<textarea name="description" [(ngModel)]="character.description" disabled></textarea>
</div>
<div class="piece-form-character-infos-color">
<label for="color">Couleur</label>
<input name="color" type="color" [(ngModel)]="character.color" disabled/>
</div>
</div>
<button mat-button (click)="unassignCharacter(index)">Retirer de ma tâche</button>
</div>
<div>
<div class="piece-form-title">Personnage(s) utilisé(s)</div>
<app-character [task]="task" [character]="character" [index]="i" *ngFor="let character of task.characters, let i = index"></app-character>
</div>
</div>
......
src/app/sider-pieces/characters/characters.component.scss
View file @ fe81a337
......@@ -23,6 +23,7 @@
border: none;
border-radius: 10px;
background-color: white;
padding: 5px 10px 5px 10px;
}
textarea {
......@@ -67,7 +68,7 @@
margin-bottom: 10px;
}
&-create {
&-character {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: solid black 1px;
......@@ -135,26 +136,5 @@
}
}
&-delete {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: solid black 1px;
&-container {
display: flex;
flex-direction: row;
width: 100%;
&-select {
display: flex;
flex-direction: row;
select {
width: 200px;
}
}
}
}
}
}
\ No newline at end of file
src/app/sider-pieces/characters/characters.component.ts
View file @ fe81a337
......@@ -25,41 +25,6 @@ export class CharactersComponent implements OnInit {
ngOnInit(): void {
}
createCharacter(): void {
if (this.newCharacter.name != '') {
const dialogRef = this.dialog.open(CreateDialogComponent, { data: 'un nouveau Personnage <'+this.newCharacter.name+'>' });
dialogRef.afterClosed().subscribe(result => {
if (result == true) {
this.scenario.characters.push(this.newCharacter);
this.newCharacter = new Character();
}
});
}
}
deleteCharacter(): void {
if (this.selectedDeleteCharacterIndex != undefined) {
const dialogRef = this.dialog.open(SuppressDialogComponent, { data: 'ce Personnage <'+this.scenario.characters[this.selectedDeleteCharacterIndex].name+'>' });
dialogRef.afterClosed().subscribe(result => {
if (result == true) {
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);
......@@ -70,4 +35,8 @@ export class CharactersComponent implements OnInit {
notAlreadyAssigned(character: Character): boolean {
return !this.task.characters.includes(character);
}
unassignCharacter(index: number): void {
this.task.characters.splice(index, 1);
}
}
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