educational-objective.component.html

<div class="piece" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'" (click)="onClickPiece()"
[ngClass]="{'isActive': (pieceDetailsService.piece == scenario.missions[i] ? true : false)}">
    <div class="piece-attach piece-attach-right"></div>
    <div class="piece-attach piece-attach-left-top"></div>
    <div class="piece-attach piece-attach-left-bottom"></div>
    
    <div class="piece-menu" [class]="displayMenu">
        <mat-icon fontIcon="add" (click)="onClickAdd()"
        matTooltip="Ajouter une mission."
        matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
        <mat-icon fontIcon="backspace" (click)="onClickErase()"
        matTooltip="Effacer le contenu de cette tuile."
        matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
        <mat-icon fontIcon="delete" (click)="onClickDelete()" *ngIf="canDelete()"
        matTooltip="Supprimer la mission."
        matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
    </div>
   
    <div class="piece-form">
        <div class="piece-form-title">Objectif pédagogique</div>
        <mat-icon class="piece-form-comment" fontIcon="comment" *ngIf="scenario.missions[i].comments.length > 0"></mat-icon>
        <div class="piece-form-objective">
            <label for="objective">Commun pour la mission {{i+1}}</label>
            <textarea name="objective" [(ngModel)]="educationnalObjective.objective" placeholder="Comprendre les rôles impliqués dans la conception d'un site web"
            matTooltip="Ce que l’on veut atteindre en situation de formation. Commencer chaque objectif par un verbe. Si votre jeu est composé de plusieurs missions, distinguez les objectifs globaux du jeu et les objectifs de chaque mission"
            matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></textarea>
        </div>
            
    </div>
    
</div>