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

fix audio upload

This commit is contained in:
Nicolas Constant 2019-07-25 23:24:29 -04:00
parent ed42426733
commit 2339ca55ea
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 64 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -2,18 +2,30 @@
<div *ngIf="m.attachment === null" class="media__loading" title="{{m.file.name}}">
<app-waiting-animation class="waiting-icon"></app-waiting-animation>
</div>
<div *ngIf="m.attachment !== null" class="media__loaded" title="{{m.file.name}}"
(mouseleave) ="updateMedia(m)">
<div *ngIf="m.attachment !== null && !m.audioType" class="media__loaded" title="{{m.file.name}}"
(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">
<button class="media__loaded--button" title="remove" (click)="removeMedia(m)">
<fa-icon [icon]="faTimes"></fa-icon>
<fa-icon [icon]="faTimes"></fa-icon>
</button>
<input class="media__loaded--description" [(ngModel)]="m.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}}" />
<img *ngIf="!m.audioType" class="media__loaded--preview" src="{{m.attachment.preview_url}}" />
</div>
<div *ngIf="m.attachment !== null && m.audioType" class="audio">
<button class="audio__button" title="remove" (click)="removeMedia(m)">
<fa-icon [icon]="faTimes"></fa-icon>
</button>
<audio *ngIf="m.audioType" controls class="audio__player">
<source src="{{ m.attachment.url }}" type="{{ m.audioType }}">
Your browser does not support the audio element.
</audio>
</div>
</div>

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

@ -4,11 +4,11 @@
.media {
width: calc(100%);
padding: 0 5px 5px 5px;
padding: 5px 5px 0px 5px;
&__loading{
width: calc(100%);
border: 1px solid $status-secondary-color;
//border: 1px solid $status-secondary-color;
// background: rgb(0, 96, 134);
overflow: hidden;
padding: 0;
@ -16,7 +16,7 @@
&__loaded{
width: calc(100%);
height: 75px;
border: 1px solid $status-secondary-color;
//border: 1px solid $status-secondary-color;
position: relative;
transition: all .2s;
@ -74,7 +74,29 @@
object-fit: cover;
object-position: 50% 50%;
}
}
}
.audio {
width: calc(100%);
height: 30px;
&__player {
width: calc(100% - 20px);
height: 30px;
}
&__button {
@include clearButton;
display: block;
width: 10px;
height: 10px;
color: white;
float: right;
// position: absolute;
// top:5px;
// right:8px;
}
}

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

@ -29,7 +29,7 @@ export class MediaService {
let medias = this.mediaSubject.value;
medias.push(wrapper);
if(medias.length > 4){
if (medias.length > 4) {
medias.splice(0, 1);
}
this.mediaSubject.next(medias);
@ -104,8 +104,26 @@ export class MediaWrapper {
constructor(
public id: string,
public file: File,
public attachment: Attachment) { }
attachment: Attachment) {
this.attachment = attachment;
}
private _attachment: Attachment;
public get attachment(): Attachment {
return this._attachment;
}
public set attachment(value: Attachment){
if (value && value.meta && value.meta.audio_encode) {
this.audioType = `audio/${value.meta.audio_encode}`;
} else if (value && value.pleroma && value.pleroma.mime_type) {
this.audioType = value.pleroma.mime_type;
}
this._attachment = value;
}
public description: string;
public isMigrating: boolean;
public audioType: string;
}