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

open status from image galery, fix #627

This commit is contained in:
Nicolas Constant 2024-03-07 00:59:00 -05:00
parent 1830212a91
commit c0f84ddc11
4 changed files with 39 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/components/stream/status/attachements/attachement-image/attachement-image.component.html
View File

@ -1,5 +1,8 @@
<div class="image">
<div class="image__alt" *ngIf="displayAltLabel">ALT</div>
<a *ngIf="status" href class="image__status" (click)="openStatus()" (auxclick)="openStatus()" title="open status">
<fa-icon class="image__status--icon" [icon]="faExternalLinkAlt"></fa-icon>
</a>
<a href class="image__link" (click)="openExternal()" (auxclick)="openExternal()" title="open image">
<fa-icon class="image__link--icon" [icon]="faLink"></fa-icon>
</a>

20
src/app/components/stream/status/attachements/attachement-image/attachement-image.component.scss
View File

@ -25,11 +25,31 @@
// }
}
&__status {
z-index: 10;
position: absolute;
top: 0;
right: 25px;
padding: 5px 5px 8px 8px;
transition: all .2s;
opacity: 0;
color: white;
&--icon {
filter: drop-shadow(0 0 3px rgb(78, 78, 78));
}
}
&:hover &__link {
opacity: 1;
cursor: pointer;
}
&:hover &__status {
opacity: 1;
cursor: pointer;
}
&__alt {
display: inline;
color: white;

16
src/app/components/stream/status/attachements/attachement-image/attachement-image.component.ts
View File

@ -1,8 +1,10 @@
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { faLink } from "@fortawesome/free-solid-svg-icons";
import { faLink, faExternalLinkAlt } from "@fortawesome/free-solid-svg-icons";
import { SettingsService } from '../../../../../services/settings.service';
import { Attachment } from '../../../../../services/models/mastodon.interfaces';
import { StatusWrapper } from '../../../../../models/common.model';
import { OpenThreadEvent } from '../../../../../services/tools.service';
@Component({
selector: 'app-attachement-image',
@ -11,10 +13,13 @@ import { Attachment } from '../../../../../services/models/mastodon.interfaces';
})
export class AttachementImageComponent implements OnInit {
faLink = faLink;
faExternalLinkAlt = faExternalLinkAlt;
displayAltLabel: boolean;
@Input() attachment: Attachment;
@Input() status: StatusWrapper;
@Output() openEvent = new EventEmitter();
@Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
constructor(
private readonly settingsService: SettingsService
@ -34,4 +39,13 @@ export class AttachementImageComponent implements OnInit {
window.open(this.attachment.url, '_blank');
return false;
}
openStatus(): boolean {
if(!this.status) return false;
const openThreadEvent = new OpenThreadEvent(this.status.status, this.status.provider);
this.browseThreadEvent.next(openThreadEvent);
return false;
}
}

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

@ -210,7 +210,7 @@
</div>
<div *ngIf="statusSection === 'media'" class="status-media">
<div *ngFor="let media of statusWrapper.status.media_attachments">
<app-attachement-image *ngIf="media.type === 'image' || media.type === 'gifv'" class="status-media__image" [attachment]="media" (openEvent)="openAttachment(media)"></app-attachement-image>
<app-attachement-image *ngIf="media.type === 'image' || media.type === 'gifv'" class="status-media__image" [attachment]="media" [status]="statusWrapper" (openEvent)="openAttachment(media)" (browseThreadEvent)="browseThread($event)"></app-attachement-image>
</div>
</div>
</div>