2020-04-14 11:28:33 +02:00
|
|
|
<div class="choicebox selection-{{ choice.answer }}">
|
2020-04-21 10:50:26 +02:00
|
|
|
<!-- add .choicebox--active to most voted -->
|
|
|
|
<button
|
|
|
|
*ngIf="showChangeChoicebutton"
|
|
|
|
class="btn btn--primary manage"
|
|
|
|
(click)="choice.simpleAnswer = !choice.simpleAnswer"
|
|
|
|
>
|
2020-05-12 19:16:23 +02:00
|
|
|
<i class="fa fa-cogs" aria-hidden="true"></i>
|
2020-04-21 10:50:26 +02:00
|
|
|
</button>
|
2020-02-04 14:28:43 +01:00
|
|
|
|
2020-04-21 10:50:26 +02:00
|
|
|
<div class="choicebox__subject">
|
|
|
|
<div class="columns">
|
|
|
|
<div class="column">
|
|
|
|
<div class="text title clickable" (click)="setAnswserTo('yes')">
|
|
|
|
{{ choice.text }}
|
|
|
|
</div>
|
|
|
|
<!-- TEXT CASE --><!--
|
2020-02-04 14:28:43 +01:00
|
|
|
<p class="choicebox__txt">
|
|
|
|
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nulla nobis nam culpa !
|
|
|
|
</p>
|
|
|
|
--><!-- TEXT CASE -->
|
|
|
|
|
2020-04-21 10:50:26 +02:00
|
|
|
<!-- IMG CASE -->
|
|
|
|
<img *ngIf="choice.url" class="choicebox__img" [src]="choice.url" alt="{{ choice.url }}" />
|
|
|
|
<!-- IMG CASE -->
|
2020-02-04 14:28:43 +01:00
|
|
|
|
2020-04-21 10:50:26 +02:00
|
|
|
<!-- DATE CASE -->
|
|
|
|
<div class="dates" *ngIf="pollIsSpecialDate">
|
|
|
|
<div class="choicebox__date">
|
|
|
|
{{ choice.date.date | date: 'EEE' }}
|
|
|
|
<span class="choicebox__day">{{ choice.date.date | date: 'dd' }}</span>
|
|
|
|
{{ choice.date.date | date: 'LLL' }}
|
|
|
|
</div>
|
|
|
|
<div class="choicebox__hour">
|
|
|
|
{{ choice.date.date | date: 'H:m' }}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- DATE CASE -->
|
|
|
|
</div>
|
|
|
|
<div class="column">
|
|
|
|
<div class="choicebox__actions">
|
|
|
|
<!-- show only the yes check if the config is set to simpleAnswer -->
|
|
|
|
<!-- add .choicebox__btn--active to selected <button> -->
|
|
|
|
<span class="simple-answer">
|
|
|
|
<button
|
|
|
|
class="choicebox__btn choicebox__btn--yes"
|
|
|
|
type="button"
|
|
|
|
[ngClass]="{ 'choicebox__btn--active': choice.answer === 'yes' }"
|
|
|
|
(click)="setAnswserTo('yes')"
|
|
|
|
>
|
|
|
|
<img src="../../../assets/img/check.svg" alt="" />
|
|
|
|
</button>
|
|
|
|
</span>
|
|
|
|
<span class="complex-answers" *ngIf="!simpleAnswer">
|
|
|
|
<button
|
|
|
|
class="choicebox__btn choicebox__btn--maybe"
|
|
|
|
type="button"
|
|
|
|
[ngClass]="{ 'choicebox__btn--active': choice.answer === 'maybe' }"
|
|
|
|
(click)="setAnswserTo('maybe')"
|
|
|
|
>
|
|
|
|
<img src="../../../assets/img/check-2.svg" alt="" />
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="choicebox__btn choicebox__btn--no"
|
|
|
|
type="button"
|
|
|
|
[ngClass]="{ 'choicebox__btn--active': choice.answer === 'no' }"
|
|
|
|
(click)="setAnswserTo('no')"
|
|
|
|
>
|
|
|
|
<img src="../../../assets/img/croix.svg" alt="" />
|
|
|
|
</button>
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="column">
|
|
|
|
<div class="choicebox__count">
|
|
|
|
<div class="no-votes" *ngIf="!poll.choices_count.counts[choice.id]">
|
|
|
|
aucun vote
|
|
|
|
</div>
|
|
|
|
<button
|
|
|
|
type="button"
|
|
|
|
aria-describedby="choicebox-tooltip"
|
|
|
|
class="choicebox__votes"
|
|
|
|
*ngIf="poll.choices_count && choice && poll.choices_count.counts[choice.id]"
|
|
|
|
>
|
|
|
|
<div class="choicebox__vote">
|
|
|
|
{{ poll.choices_count.counts[choice.id].yes.count }}
|
2020-05-12 19:16:23 +02:00
|
|
|
<img width="20px" height="21px" src="../../../assets/img/icon_voter_YES.svg" alt="" />
|
2020-04-21 10:50:26 +02:00
|
|
|
</div>
|
|
|
|
<div class="choicebox__vote">
|
|
|
|
{{ poll.choices_count.counts[choice.id].maybe.count }}
|
2020-05-12 19:16:23 +02:00
|
|
|
<img width="22px" height="24px" src="../../../assets/img/icon_voter_MAYBE.svg" alt="" />
|
2020-04-21 10:50:26 +02:00
|
|
|
</div>
|
|
|
|
<div class="choicebox__tooltip" id="choicebox-tooltip">
|
|
|
|
<div class="choicebox__tooltiplist">
|
|
|
|
<div class="choicebox__tooltipttl">
|
2020-05-12 19:16:23 +02:00
|
|
|
<img
|
|
|
|
width="20px"
|
|
|
|
height="21px"
|
|
|
|
src="../../../assets/img/icon_voter_YES.svg"
|
|
|
|
alt=""
|
|
|
|
/>
|
2020-04-21 10:50:26 +02:00
|
|
|
{{ poll.choices_count.counts[choice.id].yes.count }} "Oui"
|
|
|
|
</div>
|
|
|
|
<!-- liste des gens qui ont répondu oui-->
|
|
|
|
<ul>
|
|
|
|
<li *ngFor="let pseudo of choices_count.counts[choice.id].yes.people">
|
|
|
|
{{ pseudo }}
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="choicebox__tooltiplist" *ngIf="!simpleAnswer">
|
|
|
|
<div class="choicebox__tooltipttl">
|
|
|
|
<img
|
|
|
|
width="22px"
|
|
|
|
height="24px"
|
2020-05-12 19:16:23 +02:00
|
|
|
src="../../../assets/img/icon_voter_MAYBE.svg"
|
2020-04-21 10:50:26 +02:00
|
|
|
alt=""
|
|
|
|
/>
|
|
|
|
{{ poll.choices_count.counts[choice.id].maybe.count }} "Peut-être"
|
|
|
|
</div>
|
|
|
|
<ul>
|
|
|
|
<li *ngFor="let pseudo of choices_count.counts[choice.id].maybe.people">
|
|
|
|
{{ pseudo }}
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="choicebox__tooltiplist" *ngIf="!simpleAnswer">
|
|
|
|
<div class="choicebox__tooltipttl">
|
2020-05-12 19:16:23 +02:00
|
|
|
<i class="fa fa-times" aria-hidden="true"></i>
|
2020-04-21 10:50:26 +02:00
|
|
|
{{ poll.choices_count.counts[choice.id].no.count }} "Non"
|
|
|
|
</div>
|
|
|
|
<ul>
|
|
|
|
<li *ngFor="let pseudo of choices_count.counts[choice.id].no.people">
|
|
|
|
{{ pseudo }}
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</button>
|
|
|
|
<div class="choicebox__countxt">
|
|
|
|
Choix ayant reçu le plus de votes
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
2020-04-14 11:28:33 +02:00
|
|
|
</div>
|