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

added context-menu to user profile

This commit is contained in:
Nicolas Constant 2019-08-10 00:36:18 -04:00
parent b5f543dac3
commit 5d61c44700
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
5 changed files with 54 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/app/components/stream/status/action-bar/status-user-context-menu/status-user-context-menu.component.html
View File

@ -1,26 +1,27 @@
<a href class="context-menu-link" (click)="onContextMenu($event)"
[class.context-menu-link__status]="statusWrapper"
[class.context-menu-link__profile]="displayedAccount"
title="More">
<fa-icon [icon]="faEllipsisH"></fa-icon>
</a>
<context-menu #contextMenu>
<ng-template contextMenuItem (execute)="expandStatus()">
<ng-template contextMenuItem (execute)="expandStatus()" *ngIf="statusWrapper">
Expand status
</ng-template>
<ng-template contextMenuItem (execute)="copyStatusLink()">
<ng-template contextMenuItem (execute)="copyStatusLink()" *ngIf="statusWrapper">
Copy link to status
</ng-template>
<ng-template contextMenuItem divider="true"></ng-template>
<ng-template contextMenuItem divider="true" *ngIf="statusWrapper"></ng-template>
<ng-template contextMenuItem (execute)="mentionAccount()" *ngIf="!isOwnerSelected">
Mention @{{ this.username }}
</ng-template>
<ng-template contextMenuItem (execute)="dmAccount()" *ngIf="!isOwnerSelected">
Direct message @{{ this.username }}
</ng-template>
<ng-template contextMenuItem (execute)="muteConversation()" *ngIf="isOwnerSelected && !displayedStatus.muted">
<ng-template contextMenuItem (execute)="muteConversation()" *ngIf="statusWrapper && isOwnerSelected && !displayedStatus.muted">
Mute conversation
</ng-template>
<ng-template contextMenuItem (execute)="unmuteConversation()" *ngIf="isOwnerSelected && displayedStatus.muted">
<ng-template contextMenuItem (execute)="unmuteConversation()" *ngIf="statusWrapper && isOwnerSelected && displayedStatus.muted">
Unmute conversation
</ng-template>
<ng-template contextMenuItem divider="true"></ng-template>
@ -30,16 +31,16 @@
<ng-template contextMenuItem (execute)="blockAccount()" *ngIf="!isOwnerSelected">
Block @{{ this.username }}
</ng-template>
<ng-template contextMenuItem (execute)="pinOnProfile()" *ngIf="isOwnerSelected && !displayedStatus.pinned && displayedStatus.visibility === 'public'">
<ng-template contextMenuItem (execute)="pinOnProfile()" *ngIf="statusWrapper && isOwnerSelected && !displayedStatus.pinned && displayedStatus.visibility === 'public'">
Pin on profile
</ng-template>
<ng-template contextMenuItem (execute)="unpinFromProfile()" *ngIf="isOwnerSelected && displayedStatus.pinned && displayedStatus.visibility === 'public'">
<ng-template contextMenuItem (execute)="unpinFromProfile()" *ngIf="statusWrapper && isOwnerSelected && displayedStatus.pinned && displayedStatus.visibility === 'public'">
Unpin from profile
</ng-template>
<ng-template contextMenuItem (execute)="delete(false)" *ngIf="isOwnerSelected">
<ng-template contextMenuItem (execute)="delete(false)" *ngIf="statusWrapper && isOwnerSelected">
Delete
</ng-template>
<ng-template contextMenuItem (execute)="delete(true)" *ngIf="isOwnerSelected">
<ng-template contextMenuItem (execute)="delete(true)" *ngIf="statusWrapper && isOwnerSelected">
Delete & re-draft
</ng-template>
</context-menu>

6
src/app/components/stream/status/action-bar/status-user-context-menu/status-user-context-menu.component.scss
View File

@ -2,6 +2,8 @@
@import "context-menu";
.context-menu-link {
font-size: 18px;
&__status {
color: $status-secondary-color;
@ -11,6 +13,10 @@
}
&__profile {
color: whitesmoke;
&:hover {
color: rgb(192, 192, 192);
}
}
}

49
src/app/components/stream/status/action-bar/status-user-context-menu/status-user-context-menu.component.ts
View File

@ -18,7 +18,7 @@ import { NotificationService } from '../../../../../services/notification.servic
templateUrl: './status-user-context-menu.component.html',
styleUrls: ['./status-user-context-menu.component.scss']
})
export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
faEllipsisH = faEllipsisH;
private fullHandle: string;
@ -28,6 +28,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
isOwnerSelected: boolean;
@Input() statusWrapper: StatusWrapper;
@Input() displayedAccount: Account;
@Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
@ -42,27 +43,35 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
private readonly notificationService: NotificationService,
private readonly navigationService: NavigationService,
private readonly toolsService: ToolsService,
private readonly contextMenuService: ContextMenuService) {
this.accounts$ = this.store.select(state => state.registeredaccounts.accounts);
}
ngOnInit() {
const status = this.statusWrapper.status;
private readonly contextMenuService: ContextMenuService) {
this.accounts$ = this.store.select(state => state.registeredaccounts.accounts);
}
if (status.reblog) {
this.displayedStatus = status.reblog;
ngOnInit() {
if (this.statusWrapper) {
const status = this.statusWrapper.status;
if (status.reblog) {
this.displayedStatus = status.reblog;
} else {
this.displayedStatus = status;
}
this.accountSub = this.accounts$.subscribe((accounts: AccountInfo[]) => {
this.loadedAccounts = accounts;
this.checkStatus(accounts);
});
}
let account: Account;
if(this.statusWrapper) {
account = this.displayedStatus.account;
} else {
this.displayedStatus = status;
account = this.displayedAccount;
}
this.username = this.displayedStatus.account.acct.split('@')[0];
this.fullHandle = this.toolsService.getAccountFullHandle(this.displayedStatus.account);
this.accountSub = this.accounts$.subscribe((accounts: AccountInfo[]) => {
this.loadedAccounts = accounts;
this.checkStatus(accounts);
});
this.username = account.acct.split('@')[0];
this.fullHandle = this.toolsService.getAccountFullHandle(account);
}
private checkStatus(accounts: AccountInfo[]): void {
@ -74,7 +83,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
ngOnDestroy(): void {
this.accountSub.unsubscribe();
if(this.accountSub) this.accountSub.unsubscribe();
}
public onContextMenu($event: MouseEvent): void {
@ -249,7 +258,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
private getStatus(account: AccountInfo): Promise<Status> {
let statusPromise: Promise<Status> = Promise.resolve(this.statusWrapper.status);
if (account.id !== this.statusWrapper.provider.id) {
statusPromise = this.mastodonService.search(account, this.statusWrapper.status.url, true)
.then((result: Results) => {

3
src/app/components/stream/user-profile/user-profile.component.html
View File

@ -91,6 +91,9 @@
</div>
</div>
</div>
<app-status-user-context-menu class="profile-header__more"
[displayedAccount]="displayedAccount"></app-status-user-context-menu>
</div>
<div class="profile-sub-header">

6
src/app/components/stream/user-profile/user-profile.component.scss
View File

@ -225,6 +225,12 @@ $full-alias-color-hover: white;
margin: 0 2px 2px 0;
}
}
&__more {
position: absolute;
bottom: 5px;
right: 16px;
}
}
&-sub-header {