scripts/ordre-du-jour/odj/src/app/app.component.html

69 lines
2.0 KiB
HTML

<style>
</style>
<main class="main">
<div class="content columns">
<div class="left-side column is-4">
<strong>
Sujets:
</strong>
<ul>
<li class="subject" *ngFor="let s of subjects; index as i"
[ngClass]="{ active: (currentSubjectId +1) == (i+1) }">
<strong>{{ i + 1 }}) {{ s.title }}</strong>
<p>{{ s.duration }} min, par {{ s.author }}. Reste: {{ resteTopicMinutes }}. Passé: {{s.spentSeconds}}. </p>
<p *ngIf="s.finished">🎉</p>
</li>
</ul>
<textarea class="textarea mx-2 is-full" [(ngModel)]="pasteLand" id="pasteland" (ngModelChange)="parseTheListOfTopicsInPasteLand()"></textarea>
<p>
{{ (hints) }}
</p>
</div>
<div class="right-side column is-8">
<div class="pill-group"
[ngClass]="{
'topic-is-finished': subjects[currentSubjectId].finished || ! isTopicRunning(subjects[currentSubjectId])
}">
<h1 class="subject active">
{{ subjects[currentSubjectId].title }}
</h1>
<p>{{ subjects[currentSubjectId].duration }} min, par {{ subjects[currentSubjectId].author }}</p>
<p>Reste: {{ countRemainingMinutes(subjects[currentSubjectId]) }} min</p>
<p>avancement: {{ getPercentProgressTimeForTopic(subjects[currentSubjectId]) }} %</p>
<p>Début: {{ startTime }}</p>
<p>Fin: {{ endTime }}</p>
<button class="btn btn-primary" (click)="previousSubject()">
précédent
</button>
<button class="btn is-primary" (click)="nextSubject()">
suivant
</button>
<button class="btn is-success" (click)="finishTopic(currentSubjectId)">
fini
</button>
<button class="btn btn-primary" (click)="updateProgressEveryPeriod()">
up temps
</button>
</div>
</div>
</div>
<div class="debug" *ngIf="showDebug">
debug:
<pre>
{{ subjects|json }}
</pre>
</div>
</main>
<router-outlet></router-outlet>