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

added media edition #56

This commit is contained in:
Nicolas Constant 2019-03-10 14:36:22 -04:00
parent 17bdd7db42
commit ab38f8fc05
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
8 changed files with 91 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/app.component.ts
View File

@ -110,7 +110,7 @@ export class AppComponent implements OnInit, OnDestroy {
let files = <File[]>event.dataTransfer.files;
const selectedAccount = this.toolsService.getSelectedAccounts()[0];
this.mediaService.uploadMedia(files, selectedAccount);
this.mediaService.uploadMedia(selectedAccount, files);
return false;
}
}

6
src/app/components/create-status/media/media.component.html
View File

@ -2,12 +2,14 @@
<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>
</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)">
<div class="media__loaded--hover">
<button class="media__loaded--button" title="remove" (click)="removeMedia(m)">
<fa-icon [icon]="faTimes"></fa-icon>
</button>
<input class="media__loaded--description" autocomplete="off" placeholder="Describe for the visually impaired"/>
<input class="media__loaded--description" [(ngModel)]="m.description"
autocomplete="off" placeholder="Describe for the visually impaired"/>
</div>
<img class="media__loaded--preview" src="{{m.attachment.preview_url}}" />
</div>

2
src/app/components/create-status/media/media.component.scss
View File

@ -41,7 +41,7 @@
height: 10px;
position: absolute;
top:5px;
right:7px;
right:8px;
color: white;
}

17
src/app/components/create-status/media/media.component.ts
View File

@ -1,8 +1,9 @@
import { Component, OnInit, OnDestroy } from '@angular/core';
import { faTimes } from "@fortawesome/free-solid-svg-icons";
import { Subscription } from 'rxjs';
import { MediaService, MediaWrapper } from '../../../services/media.service';
import { Subscription } from 'rxjs';
import { ToolsService } from '../../../services/tools.service';
@Component({
selector: 'app-media',
@ -14,7 +15,9 @@ export class MediaComponent implements OnInit, OnDestroy {
media: MediaWrapper[] = [];
private mediaSub: Subscription;
constructor(private readonly mediaService: MediaService) { }
constructor(
private readonly toolsService: ToolsService,
private readonly mediaService: MediaService) { }
ngOnInit() {
this.mediaSub = this.mediaService.mediaSubject.subscribe((media: MediaWrapper[]) => {
@ -26,10 +29,14 @@ export class MediaComponent implements OnInit, OnDestroy {
this.mediaSub.unsubscribe();
}
removeMedia(media: MediaWrapper): boolean{
console.warn('delete');
console.warn(media);
removeMedia(media: MediaWrapper): boolean {
this.mediaService.remove(media);
return false;
}
updateMedia(media: MediaWrapper): boolean {
const account = this.toolsService.getSelectedAccounts()[0];
this.mediaService.update(account, media);
return false;
}
}

52
src/app/services/mastodon.service.ts
View File

@ -2,18 +2,18 @@ import { Injectable } from '@angular/core';
import { HttpHeaders, HttpClient } from '@angular/common/http';
import { ApiRoutes } from './models/api.settings';
import { Account, Status, Results, Context, Relationship, Instance } from "./models/mastodon.interfaces";
import { Account, Status, Results, Context, Relationship, Instance, Attachment } from "./models/mastodon.interfaces";
import { AccountInfo } from '../states/accounts.state';
import { StreamTypeEnum } from '../states/streams.state';
@Injectable()
export class MastodonService {
export class MastodonService {
private apiRoutes = new ApiRoutes();
constructor(private readonly httpClient: HttpClient) { }
getInstance(instance: string): Promise<Instance>{
const route = `https://${instance}${this.apiRoutes.getInstance}`;
getInstance(instance: string): Promise<Instance> {
const route = `https://${instance}${this.apiRoutes.getInstance}`;
return this.httpClient.get<Instance>(route).toPromise();
}
@ -114,25 +114,25 @@ export class MastodonService {
return this.httpClient.post<Status>(url, formData, { headers: headers }).toPromise();
}
search(account: AccountInfo, query: string, resolve: boolean = false): Promise<Results>{
if(query[0] === '#') query = query.substr(1);
search(account: AccountInfo, query: string, resolve: boolean = false): Promise<Results> {
if (query[0] === '#') query = query.substr(1);
const route = `https://${account.instance}${this.apiRoutes.search}?q=${query}&resolve=${resolve}`;
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.get<Results>(route, { headers: headers }).toPromise()
}
getAccountStatuses(account: AccountInfo, targetAccountId: number, onlyMedia: boolean, onlyPinned: boolean, excludeReplies: boolean, maxId: string, sinceId: string, limit: number = 20): Promise<Status[]>{
getAccountStatuses(account: AccountInfo, targetAccountId: number, onlyMedia: boolean, onlyPinned: boolean, excludeReplies: boolean, maxId: string, sinceId: string, limit: number = 20): Promise<Status[]> {
const route = `https://${account.instance}${this.apiRoutes.getAccountStatuses}`.replace('{0}', targetAccountId.toString());
let params = `?only_media=${onlyMedia}&pinned=${onlyPinned}&exclude_replies=${excludeReplies}&limit=${limit}`;
if(maxId) params += `&max_id=${maxId}`;
if(sinceId) params += `&since_id=${sinceId}`;
if (maxId) params += `&max_id=${maxId}`;
if (sinceId) params += `&since_id=${sinceId}`;
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.get<Status[]>(route+params, { headers: headers }).toPromise();
return this.httpClient.get<Status[]>(route + params, { headers: headers }).toPromise();
}
getStatusContext(account: AccountInfo, targetStatusId: string): Promise<Context>{
getStatusContext(account: AccountInfo, targetStatusId: string): Promise<Context> {
const params = this.apiRoutes.getStatusContext.replace('{0}', targetStatusId);
const route = `https://${account.instance}${params}`;
@ -140,7 +140,7 @@ export class MastodonService {
return this.httpClient.get<Context>(route, { headers: headers }).toPromise();
}
searchAccount(account: AccountInfo, query: string, limit: number = 40, following: boolean = false): Promise<Account[]>{
searchAccount(account: AccountInfo, query: string, limit: number = 40, following: boolean = false): Promise<Account[]> {
const route = `https://${account.instance}${this.apiRoutes.searchForAccounts}?q=${query}&limit=${limit}&following=${following}`;
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.get<Account[]>(route, { headers: headers }).toPromise()
@ -152,7 +152,7 @@ export class MastodonService {
return this.httpClient.post<Status>(route, null, { headers: headers }).toPromise()
}
unreblog(account: AccountInfo, status: Status): Promise<Status> {
unreblog(account: AccountInfo, status: Status): Promise<Status> {
const route = `https://${account.instance}${this.apiRoutes.unreblogStatus}`.replace('{0}', status.id);
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.post<Status>(route, null, { headers: headers }).toPromise()
@ -163,7 +163,7 @@ export class MastodonService {
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.post<Status>(route, null, { headers: headers }).toPromise()
}
unfavorite(account: AccountInfo, status: Status): any {
const route = `https://${account.instance}${this.apiRoutes.unfavouritingStatus}`.replace('{0}', status.id);
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
@ -173,7 +173,7 @@ export class MastodonService {
getRelationships(account: AccountInfo, accountsToRetrieve: Account[]): Promise<Relationship[]> {
let params = "?";
accountsToRetrieve.forEach(x => {
if(params.includes('id')) params += '&';
if (params.includes('id')) params += '&';
params += `id[]=${x.id}`;
});
@ -182,11 +182,11 @@ export class MastodonService {
return this.httpClient.get<Relationship[]>(route, { headers: headers }).toPromise();
}
follow(currentlyUsedAccount: AccountInfo, account: Account): Promise<Relationship> {
follow(currentlyUsedAccount: AccountInfo, account: Account): Promise<Relationship> {
const route = `https://${currentlyUsedAccount.instance}${this.apiRoutes.follow}`.replace('{0}', account.id.toString());
const headers = new HttpHeaders({ 'Authorization': `Bearer ${currentlyUsedAccount.token.access_token}` });
return this.httpClient.post<Relationship>(route, null, { headers: headers }).toPromise();
}
}
unfollow(currentlyUsedAccount: AccountInfo, account: Account): Promise<Relationship> {
const route = `https://${currentlyUsedAccount.instance}${this.apiRoutes.unfollow}`.replace('{0}', account.id.toString());
@ -194,7 +194,23 @@ export class MastodonService {
return this.httpClient.post<Relationship>(route, null, { headers: headers }).toPromise();
}
uploadMediaAttachment(account: AccountInfo, file: File): Promise<Attachment> {
let input = new FormData();
input.append('file', file);
const route = `https://${account.instance}${this.apiRoutes.uploadMediaAttachment}`;
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.post<Attachment>(route, input, { headers: headers }).toPromise();
}
//TODO: add focus support
updateMediaAttachment(account: AccountInfo, mediaId: string, description: string): Promise<Attachment> {
let input = new FormData();
input.append('description', description);
const route = `https://${account.instance}${this.apiRoutes.updateMediaAttachment.replace('{0}', mediaId)}`;
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
return this.httpClient.put<Attachment>(route, input, { headers: headers }).toPromise();
}
}
export enum VisibilityEnum {

53
src/app/services/media.service.ts
View File

@ -5,37 +5,37 @@ import { BehaviorSubject, Subject } from 'rxjs';
import { AccountInfo } from '../states/accounts.state';
import { ApiRoutes } from './models/api.settings';
import { Attachment } from './models/mastodon.interfaces';
import { MastodonService } from './mastodon.service';
import { NotificationService } from './notification.service';
@Injectable({
providedIn: 'root'
})
export class MediaService {
export class MediaService {
private apiRoutes = new ApiRoutes();
mediaSubject: BehaviorSubject<MediaWrapper[]> = new BehaviorSubject<MediaWrapper[]>([]);
constructor(private readonly httpClient: HttpClient) { }
constructor(
private readonly notificationService: NotificationService,
private readonly mastodonService: MastodonService) { }
uploadMedia(files: File[], account: AccountInfo){
uploadMedia(account: AccountInfo, files: File[]){
for (let file of files) {
this.postMedia(file, account);
this.postMedia(account, file);
}
}
private postMedia(file: File, account: AccountInfo){
private postMedia(account: AccountInfo, file: File){
const uniqueId = `${file.name}${file.size}${Math.random()}`;
const wrapper = new MediaWrapper(uniqueId, file, null);
const wrapper = new MediaWrapper(uniqueId, file, null, null);
let medias = this.mediaSubject.value;
medias.push(wrapper);
this.mediaSubject.next(medias);
let input = new FormData();
input.append('file', file);
const route = `https://${account.instance}${this.apiRoutes.uploadMediaAttachment}`;
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
this.httpClient.post(route, input, { headers: headers }).toPromise()
this.mastodonService.uploadMediaAttachment(account, file)
.then((attachment: Attachment) => {
let currentMedias = this.mediaSubject.value;
let currentMedia = currentMedias.filter(x => x.id === uniqueId)[0];
@ -45,18 +45,37 @@ export class MediaService {
}
})
.catch((err)=>{
let currentMedias = this.mediaSubject.value;
let currentMedia = currentMedias.filter(x => x.id !== uniqueId);
this.mediaSubject.next(currentMedia);
//TODO: notify
this.remove(wrapper);
this.notificationService.notifyHttpError(err);
});
}
update( account: AccountInfo, media: MediaWrapper): any {
if(media.attachment.description === media.description) return;
this.mastodonService.updateMediaAttachment(account, media.attachment.id, media.description)
.then((att: Attachment) => {
let medias = this.mediaSubject.value;
let updatedMedia = medias.filter(x => x.id === media.id)[0];
updatedMedia.attachment.description = att.description;
this.mediaSubject.next(medias);
})
.catch((err) => {
this.notificationService.notifyHttpError(err);
});
}
remove(media: MediaWrapper): any {
let medias = this.mediaSubject.value;
let filteredMedias = medias.filter(x => x.id !== media.id);
this.mediaSubject.next(filteredMedias);
}
}
export class MediaWrapper {
constructor(
public id: string,
public file: File,
public attachment: Attachment) {}
public attachment: Attachment,
public description: string) {}
}

1
src/app/services/models/api.settings.ts
View File

@ -23,6 +23,7 @@ export class ApiRoutes {
followRemote = '/api/v1/follows';
getInstance = '/api/v1/instance';
uploadMediaAttachment = '/api/v1/media';
updateMediaAttachment = '/api/v1/media/{0}';
getMutes = '/api/v1/mutes';
getNotifications = '/api/v1/notifications';
getSingleNotifications = '/api/v1/notifications/{0}';

2
src/app/services/models/mastodon.interfaces.ts
View File

@ -61,6 +61,8 @@ export interface Attachment {
remote_url: string;
preview_url: string;
text_url: string;
meta: any;
description: string;
}
export interface Card {