Mastodon
/
Sengi-Windows-MacOS-Linux
mirror of https://github.com/NicolasConstant/sengi
1
0
Fork 0
Code Issues Releases Wiki Activity

added context-menu buttons

This commit is contained in:
Nicolas Constant 2019-07-03 17:53:53 -04:00
parent 145b8617b1
commit 7bdcc6277f
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 78 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/app/components/stream/status/action-bar/action-bar.component.html
View File

@ -4,16 +4,16 @@
</a>
<fa-icon *ngIf="isLocked" class="action-bar__lock" title="Account can't access this post" [icon]="faLock"></fa-icon>
<a *ngIf="!(isBoostLocked || isLocked)" href class="action-bar__link action-bar__link--boost" title="Boost" [class.boosted]="isBoosted"
[class.boosting]="boostIsLoading" (click)="boost()">
<a *ngIf="!(isBoostLocked || isLocked)" href class="action-bar__link action-bar__link--boost" title="Boost"
[class.boosted]="isBoosted" [class.boosting]="boostIsLoading" (click)="boost()">
<fa-icon [icon]="faRetweet"></fa-icon>
</a>
<fa-icon *ngIf="isBoostLocked && !isLocked" class="action-bar__lock" title="This post cannot be boosted"
[icon]="faLock"></fa-icon>
<fa-icon *ngIf="isLocked" class="action-bar__lock" title="Account can't access this post" [icon]="faLock"></fa-icon>
<a *ngIf="!isLocked" href class="action-bar__link action-bar__link--fav" title="Favourite" [class.favorited]="isFavorited"
[class.favoriting]="favoriteIsLoading" (click)="favorite()">
<a *ngIf="!isLocked" href class="action-bar__link action-bar__link--fav" title="Favourite"
[class.favorited]="isFavorited" [class.favoriting]="favoriteIsLoading" (click)="favorite()">
<fa-icon [icon]="faStar"></fa-icon>
</a>
<fa-icon *ngIf="isLocked" class="action-bar__lock" title="Account can't access this post" [icon]="faLock"></fa-icon>
@ -27,19 +27,33 @@
<fa-icon [icon]="faWindowCloseRegular"></fa-icon>
</a>
<a href class="action-bar__link action-bar__link--more" (click)="onContextMenu($event, item)" title="More" [contextMenu]="basicMenu" [contextMenuSubject]="item">
<fa-icon [icon]="faEllipsisH" [contextMenu]="basicMenu" [contextMenuSubject]="item" ></fa-icon>
<a href class="action-bar__link action-bar__link--more" (click)="onContextMenu($event, item)" title="More"
[contextMenu]="basicMenu" [contextMenuSubject]="item">
<fa-icon [icon]="faEllipsisH" [contextMenu]="basicMenu" [contextMenuSubject]="item"></fa-icon>
</a>
<context-menu #basicMenu>
<ng-template contextMenuItem (execute)="showMessage('Hi, ' + $event.item.name)">
Say hi!
<ng-template contextMenuItem (execute)="expandStatus()">
Expand status
</ng-template>
<!-- <ng-template contextMenuItem divider="true"></ng-template> -->
<ng-template contextMenuItem let-item (execute)="showMessage($event.item.name + ' said: ' + $event.item.otherProperty)">
Bye, {{item?.name}}
<ng-template contextMenuItem (execute)="copyStatusLink()">
Copy link to status
</ng-template>
<!-- <ng-template contextMenuItem passive="true">
Input something: <input type="text">
<ng-template contextMenuItem divider="true"></ng-template>
<ng-template contextMenuItem (execute)="mentionAccount()">
Mention @account
</ng-template>
<ng-template contextMenuItem (execute)="dmAccount()">
Direct message @account
</ng-template>
<ng-template contextMenuItem divider="true"></ng-template>
<ng-template contextMenuItem (execute)="muteAccount()">
Mute @account
</ng-template>
<ng-template contextMenuItem (execute)="blockAccount()">
Block @account
</ng-template>
<!-- <ng-template contextMenuItem (execute)="showMessage('Hi, ' + $event.item.name)">
Mute @account
</ng-template> -->
</context-menu>
</div>

39
src/app/components/stream/status/action-bar/action-bar.component.ts
View File

@ -72,7 +72,7 @@ export class ActionBarComponent implements OnInit, OnDestroy {
const status = this.statusWrapper.status;
const account = this.statusWrapper.provider;
if(status.reblog){
if (status.reblog) {
this.favoriteStatePerAccountId[account.id] = status.reblog.favourited;
this.bootedStatePerAccountId[account.id] = status.reblog.reblogged;
} else {
@ -133,7 +133,7 @@ export class ActionBarComponent implements OnInit, OnDestroy {
}
boost(): boolean {
if(this.boostIsLoading) return;
if (this.boostIsLoading) return;
this.boostIsLoading = true;
const account = this.toolsService.getSelectedAccounts()[0];
@ -149,7 +149,7 @@ export class ActionBarComponent implements OnInit, OnDestroy {
}
})
.then((boostedStatus: Status) => {
if(boostedStatus.pleroma){
if (boostedStatus.pleroma) {
this.bootedStatePerAccountId[account.id] = boostedStatus.reblog !== null; //FIXME: when Pleroma will return the good status
} else {
this.bootedStatePerAccountId[account.id] = boostedStatus.reblogged;
@ -168,7 +168,7 @@ export class ActionBarComponent implements OnInit, OnDestroy {
}
favorite(): boolean {
if(this.favoriteIsLoading) return;
if (this.favoriteIsLoading) return;
this.favoriteIsLoading = true;
const account = this.toolsService.getSelectedAccounts()[0];
@ -232,4 +232,35 @@ export class ActionBarComponent implements OnInit, OnDestroy {
$event.preventDefault();
$event.stopPropagation();
}
expandStatus(): boolean {
return false;
}
copyStatusLink(): boolean {
return false;
}
mentionAccount(): boolean {
return false;
}
dmAccount(): boolean {
return false;
}
muteAccount(): boolean {
return false;
}
blockAccount(): boolean {
return false;
}
}

10
src/sass/_context-menu.scss
View File

@ -3,8 +3,8 @@
& .dropdown-menu {
border: solid 1px $context-menu-border-color;
background-color: $context-menu-background;
padding: 3px 0;
border-radius: 3px;
padding: 2px 0;
border-radius: 2px;
//border: solid 2px $context-menu-border-color;
}
@ -23,7 +23,7 @@
color: $context-menu-font-color;
display: block;
padding: 0.5em 1em;
padding: 5px 10px;
padding: 3px 10px;
text-decoration: none;
transition: all .2s;
@ -33,4 +33,8 @@
text-decoration: none;
}
}
& .divider {
border-top: solid 2px $context-menu-border-color;
}
}