added lock icon #93

This commit is contained in:
Nicolas Constant 2019-06-11 23:49:54 -04:00
parent 26bc0cf44b
commit 803913ccf0
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 15 additions and 6 deletions

View File

@ -4,8 +4,9 @@
<label class="poll__container">{{o.title}} <label class="poll__container">{{o.title}}
<input class="poll__container__input" type="{{choiceType}}" name="{{pollName}}" value="{{o.title}}" <input class="poll__container__input" type="{{choiceType}}" name="{{pollName}}" value="{{o.title}}"
(change)="onSelectionChange(o)"> (change)="onSelectionChange(o)">
<span class="poll__container__checkmark" <span class="poll__container__checkmark" *ngIf="!pollLocked"
[ngClass]="{'poll__container__checkmark--box' : choiceType=='checkbox', 'poll__container__checkmark--round': choiceType=='radio'}"></span> [ngClass]="{'poll__container__checkmark--box' : choiceType=='checkbox', 'poll__container__checkmark--round': choiceType=='radio'}"></span>
<fa-icon *ngIf="pollLocked" class="poll__container__lock" title="Account can't access this poll" [icon]="faLock"></fa-icon>
</label> </label>
</div> </div>
</div> </div>
@ -20,9 +21,9 @@
</div> </div>
</div> </div>
<div class="poll__voting"> <div class="poll__voting">
<button href *ngIf="!poll.voted && !poll.expired" class="btn btn-sm btn-custom-primary poll__btn-vote" <button href *ngIf="!poll.voted && !poll.expired && !pollLocked" class="btn btn-sm btn-custom-primary poll__btn-vote"
title="don't boo, vote!" (click)="vote()">Vote</button> title="don't boo, vote!" (click)="vote()">Vote</button>
<a href class="poll__refresh" *ngIf="poll.voted || poll.expired" title="refresh poll" (click)="refresh()">refresh</a> <a href class="poll__refresh" *ngIf="(poll.voted || poll.expired) && !pollLocked" title="refresh poll" (click)="refresh()">refresh</a>
<div class="poll__statistics"><span *ngIf="poll.voted || poll.expired" class="poll__separator">·</span>{{poll.votes_count}} votes<span *ngIf="!poll.expired" class="poll__separator" title="{{ poll.expires_at | timeLeft | async }}">· {{ poll.expires_at | timeLeft | async }}</span></div> <div class="poll__statistics"><span *ngIf="(poll.voted || poll.expired) && !pollLocked" class="poll__separator">·</span>{{poll.votes_count}} votes<span *ngIf="!poll.expired" class="poll__separator" title="{{ poll.expires_at | timeLeft | async }}">· {{ poll.expires_at | timeLeft | async }}</span></div>
</div> </div>
</div> </div>

View File

@ -60,6 +60,12 @@
width: 0; width: 0;
} }
&__lock {
position: absolute;
top: 0;
left: 0;
}
&__checkmark--box { &__checkmark--box {
position: absolute; position: absolute;
top: 0; top: 0;

View File

@ -1,6 +1,7 @@
import { Component, OnInit, Input } from '@angular/core'; import { Component, OnInit, Input } from '@angular/core';
import { Store } from '@ngxs/store'; import { Store } from '@ngxs/store';
import { Observable, Subscription } from 'rxjs'; import { Observable, Subscription } from 'rxjs';
import { faLock } from "@fortawesome/free-solid-svg-icons";
import { Poll, PollOption, Status } from '../../../../services/models/mastodon.interfaces'; import { Poll, PollOption, Status } from '../../../../services/models/mastodon.interfaces';
import { AccountInfo } from '../../../../states/accounts.state'; import { AccountInfo } from '../../../../states/accounts.state';
@ -15,6 +16,8 @@ import { StatusWrapper } from '../../../../models/common.model';
styleUrls: ['./poll.component.scss'] styleUrls: ['./poll.component.scss']
}) })
export class PollComponent implements OnInit { export class PollComponent implements OnInit {
faLock = faLock;
pollName: string; pollName: string;
choiceType: string; choiceType: string;
pollLocked: boolean; pollLocked: boolean;
@ -87,7 +90,6 @@ export class PollComponent implements OnInit {
this.pollPerAccountId[newSelectedAccount.id] = this.toolsService.getStatusUsableByAccount(newSelectedAccount, new StatusWrapper(this.status, this.provider)) this.pollPerAccountId[newSelectedAccount.id] = this.toolsService.getStatusUsableByAccount(newSelectedAccount, new StatusWrapper(this.status, this.provider))
.then((status: Status) => { .then((status: Status) => {
console.warn(status);
return this.mastodonService.getPoll(newSelectedAccount, status.poll.id); return this.mastodonService.getPoll(newSelectedAccount, status.poll.id);
}) })
.then((poll: Poll) => { .then((poll: Poll) => {
@ -98,7 +100,7 @@ export class PollComponent implements OnInit {
this.notificationService.notifyHttpError(err); this.notificationService.notifyHttpError(err);
return null; return null;
}); });
} else if (this.status.visibility !== 'public') { } else if (this.status.visibility !== 'public' && this.provider.id !== newSelectedAccount.id) {
this.pollLocked = true; this.pollLocked = true;
} else { } else {
this.pollPerAccountId[newSelectedAccount.id] this.pollPerAccountId[newSelectedAccount.id]