migrate attachments when changing account #56
This commit is contained in:
parent
0ec97cbf4f
commit
1a1f4dccf6
|
@ -1,9 +1,12 @@
|
||||||
<div *ngFor="let m of media" class="media">
|
<div *ngFor="let m of media" class="media">
|
||||||
<div *ngIf="m.attachment === null" class="media__loading" title="{{m.file.name}}">
|
<div *ngIf="m.attachment === null" class="media__loading" title="{{m.file.name}}">
|
||||||
<app-waiting-animation class="waiting-icon status-form__sending--waiting"></app-waiting-animation>
|
<app-waiting-animation class="waiting-icon"></app-waiting-animation>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="m.attachment !== null" class="media__loaded" title="{{m.file.name}}"
|
<div *ngIf="m.attachment !== null" class="media__loaded" title="{{m.file.name}}"
|
||||||
(mouseleave) ="updateMedia(m)">
|
(mouseleave) ="updateMedia(m)">
|
||||||
|
<div class="media__loaded--migrating" *ngIf="m.isMigrating">
|
||||||
|
<app-waiting-animation class="waiting-icon"></app-waiting-animation>
|
||||||
|
</div>
|
||||||
<div class="media__loaded--hover">
|
<div class="media__loaded--hover">
|
||||||
<button class="media__loaded--button" title="remove" (click)="removeMedia(m)">
|
<button class="media__loaded--button" title="remove" (click)="removeMedia(m)">
|
||||||
<fa-icon [icon]="faTimes"></fa-icon>
|
<fa-icon [icon]="faTimes"></fa-icon>
|
||||||
|
|
|
@ -18,6 +18,7 @@
|
||||||
height: 75px;
|
height: 75px;
|
||||||
border: 1px solid $status-secondary-color;
|
border: 1px solid $status-secondary-color;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
transition: all .2s;
|
||||||
|
|
||||||
&--hover {
|
&--hover {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -26,10 +27,20 @@
|
||||||
left:0;
|
left:0;
|
||||||
right:0;
|
right:0;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
transition: all .2s;
|
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
background: rgba(black, .5);
|
background: rgba(black, .5);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&--migrating{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
bottom:0;
|
||||||
|
left:0;
|
||||||
|
right:0;
|
||||||
|
z-index: 20;
|
||||||
|
opacity: 100;
|
||||||
|
background: rgba(black, .7);
|
||||||
|
}
|
||||||
|
|
||||||
&:hover &--hover {
|
&:hover &--hover {
|
||||||
opacity: 100;
|
opacity: 100;
|
||||||
|
|
|
@ -1,9 +1,11 @@
|
||||||
import { Component, OnInit, OnDestroy } from '@angular/core';
|
import { Component, OnInit, OnDestroy } from '@angular/core';
|
||||||
import { faTimes } from "@fortawesome/free-solid-svg-icons";
|
import { faTimes } from "@fortawesome/free-solid-svg-icons";
|
||||||
import { Subscription } from 'rxjs';
|
import { Subscription, Observable } from 'rxjs';
|
||||||
|
import { Store } from '@ngxs/store';
|
||||||
|
|
||||||
import { MediaService, MediaWrapper } from '../../../services/media.service';
|
import { MediaService, MediaWrapper } from '../../../services/media.service';
|
||||||
import { ToolsService } from '../../../services/tools.service';
|
import { ToolsService } from '../../../services/tools.service';
|
||||||
|
import { AccountInfo } from '../../../states/accounts.state';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-media',
|
selector: 'app-media',
|
||||||
|
@ -15,18 +17,31 @@ export class MediaComponent implements OnInit, OnDestroy {
|
||||||
media: MediaWrapper[] = [];
|
media: MediaWrapper[] = [];
|
||||||
private mediaSub: Subscription;
|
private mediaSub: Subscription;
|
||||||
|
|
||||||
|
private accounts$: Observable<AccountInfo[]>;
|
||||||
|
private accountSub: Subscription;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
|
private readonly store: Store,
|
||||||
private readonly toolsService: ToolsService,
|
private readonly toolsService: ToolsService,
|
||||||
private readonly mediaService: MediaService) { }
|
private readonly mediaService: MediaService) {
|
||||||
|
|
||||||
|
this.accounts$ = this.store.select(state => state.registeredaccounts.accounts);
|
||||||
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.mediaSub = this.mediaService.mediaSubject.subscribe((media: MediaWrapper[]) => {
|
this.mediaSub = this.mediaService.mediaSubject.subscribe((media: MediaWrapper[]) => {
|
||||||
this.media = media;
|
this.media = media;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
this.accountSub = this.accounts$.subscribe((accounts: AccountInfo[]) => {
|
||||||
|
const selectedAccount = accounts.filter(x => x.isSelected)[0];
|
||||||
|
this.mediaService.migrateMedias(selectedAccount);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnDestroy(): void {
|
ngOnDestroy(): void {
|
||||||
this.mediaSub.unsubscribe();
|
this.mediaSub.unsubscribe();
|
||||||
|
this.accountSub.unsubscribe();
|
||||||
}
|
}
|
||||||
|
|
||||||
removeMedia(media: MediaWrapper): boolean {
|
removeMedia(media: MediaWrapper): boolean {
|
||||||
|
|
|
@ -186,8 +186,8 @@ export class ActionBarComponent implements OnInit, OnDestroy {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
private getSelectedAccounts(): AccountInfo[] {
|
// private getSelectedAccounts(): AccountInfo[] {
|
||||||
var regAccounts = <AccountInfo[]>this.store.snapshot().registeredaccounts.accounts;
|
// var regAccounts = <AccountInfo[]>this.store.snapshot().registeredaccounts.accounts;
|
||||||
return regAccounts;
|
// return regAccounts;
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,7 +46,7 @@ export class MediaService {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
update(account: AccountInfo, media: MediaWrapper): any {
|
update(account: AccountInfo, media: MediaWrapper) {
|
||||||
if (media.attachment.description === media.description) return;
|
if (media.attachment.description === media.description) return;
|
||||||
|
|
||||||
this.mastodonService.updateMediaAttachment(account, media.attachment.id, media.description)
|
this.mastodonService.updateMediaAttachment(account, media.attachment.id, media.description)
|
||||||
|
@ -61,7 +61,7 @@ export class MediaService {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
remove(media: MediaWrapper): any {
|
remove(media: MediaWrapper) {
|
||||||
let medias = this.mediaSubject.value;
|
let medias = this.mediaSubject.value;
|
||||||
let filteredMedias = medias.filter(x => x.id !== media.id);
|
let filteredMedias = medias.filter(x => x.id !== media.id);
|
||||||
this.mediaSubject.next(filteredMedias);
|
this.mediaSubject.next(filteredMedias);
|
||||||
|
@ -71,7 +71,30 @@ export class MediaService {
|
||||||
this.mediaSubject.next([]);
|
this.mediaSubject.next([]);
|
||||||
}
|
}
|
||||||
|
|
||||||
// migrate
|
migrateMedias(account: AccountInfo) {
|
||||||
|
let medias = this.mediaSubject.value;
|
||||||
|
medias.forEach(media => {
|
||||||
|
media.isMigrating = true;
|
||||||
|
});
|
||||||
|
this.mediaSubject.next(medias);
|
||||||
|
|
||||||
|
for (let media of medias) {
|
||||||
|
this.mastodonService.uploadMediaAttachment(account, media.file)
|
||||||
|
.then((attachment: Attachment) => {
|
||||||
|
let currentMedias = this.mediaSubject.value;
|
||||||
|
let currentMedia = currentMedias.filter(x => x.id === media.id)[0];
|
||||||
|
if (currentMedia) {
|
||||||
|
currentMedia.attachment = attachment;
|
||||||
|
currentMedia.isMigrating = false;
|
||||||
|
this.mediaSubject.next(currentMedias);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
this.remove(media);
|
||||||
|
this.notificationService.notifyHttpError(err);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export class MediaWrapper {
|
export class MediaWrapper {
|
||||||
|
|
Loading…
Reference in New Issue