repeat-task.component.html

<div class="piece" (mouseover)="displayMenu='show'" (mouseleave)="displayMenu='hide'" (click)="onClickPiece()" 
[ngClass]="{'isActive': (pieceDetailsService.piece == task ? true : false)}">
    <div class="piece-attach piece-attach-left"></div>

    <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>
        <mat-icon fontIcon="delete" (click)="onClickDelete()"
        matTooltip="Supprimer la tuile."
        matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
        <div class="piece-menu-directioncross">
            <div class="piece-menu-directioncross-left">
                <mat-icon style="transform: rotate(0turn) scale(0.6);" fontIcon="arrow_back_ios" (click)="moveTask('left')"
                matTooltip="Décaler la tuile vers la gauche."
                matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>                
            </div>
            <div class="piece-menu-directioncross-updownarrows">
                <div class="piece-menu-updownarrows-up">
                    <mat-icon style="transform: rotate(0.25turn) scale(0.6);" fontIcon="arrow_back_ios" (click)="moveTask('top')"
                    matTooltip="Décaler la tuile vers le haut (ceci placera la tuile à la fin de la ligne)."
                    matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>                
                </div>
                <div class="piece-menu-directioncross-updownarrows-down">
                    <mat-icon style="transform: rotate(0.75turn) scale(0.6);" fontIcon="arrow_back_ios" (click)="moveTask('bottom')"
                    matTooltip="Décaler la tuile vers le bas (ceci placera la tuile à la fin de la ligne)."
                    matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
                </div>
            </div>
            <div class="piece-menu-directioncross-right">
                <mat-icon style="transform: rotate(0.5turn) scale(0.6);" fontIcon="arrow_back_ios" (click)="moveTask('right')"
                matTooltip="Décaler la tuile vers la droite."
                matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></mat-icon>
            </div>
        </div>
    </div>

    <div class="piece-form">
        <label>Recommencer<br>le tour jusqu'à ce que :</label>
        <textarea [(ngModel)]="task.objective" [(ngModel)]="task.objective" [style.background-image]="(i == findFirstIndexOfTaskType('repeat')[0] && j == findFirstIndexOfTaskType('repeat')[1]) ? urlIcon : ''"
            placeholder="Faire valider au commanditaire"
            matTooltip="Action à effectuer (interagir avec un objet, parler avec quelqu'un, …)"
            matTooltipPosition="above" [matTooltipDisabled]="!tooltipService.activatedTooltips"></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"
    [style.color]="task.characters.length == 1 ? task.characters[0].color : 'black'"
    [style.background]="task.characters.length > 1 ? 'linear-gradient('+ task.characters[0].color +','+ task.characters[task.characters.length-1].color +')' : 'white'"></mat-icon>
    <mat-icon class="piece-form-interrupt" fontIcon="front_hand" *ngIf="task.interrupt != ''"></mat-icon>
</div>