Add message for file size limit in background-upload.

This commit is contained in:
Konstantinos Triantafyllou 2023-05-03 17:07:39 +03:00
parent ced4fe404d
commit 3b4ea6102c
1 changed files with 67 additions and 57 deletions

View File

@ -9,7 +9,8 @@ declare var UIkit;
selector: 'background-upload',
template: `
<input #file id="photo" type="file" class="uk-hidden" (change)="fileChangeEvent($event)"/>
<div *ngIf="!background.imageFile" class=" upload uk-text-center uk-height-small uk-flex uk-flex-middle uk-flex-center uk-text-uppercase">
<div *ngIf="!background.imageFile"
class=" upload uk-text-center uk-height-small uk-flex uk-flex-middle uk-flex-center uk-text-uppercase">
<span uk-icon="icon: cloud-upload"></span>
<div uk-form-custom>
<span class="uk-link uk-margin-small-left" (click)="file.click()">upload image</span>
@ -21,14 +22,16 @@ declare var UIkit;
[style.background-image]=" getUrl()">
<a (click)="removePhoto()" uk-tooltip="Remove" class="uk-float-right uk-border-rounded uk-margin-top uk-margin-right uk-background-muted uk-button uk-button-link">
<a (click)="removePhoto()" uk-tooltip="Remove"
class="uk-float-right uk-border-rounded uk-margin-top uk-margin-right uk-background-muted uk-button uk-button-link">
<icon name="delete" [defaultSize]="true" [flex]="true"></icon>
</a>
</div>
</div>
<div *ngIf="background.imageFile" class="uk-margin-top">
<div class="uk-text-bold uk-text-uppercase uk-text-meta uk-margin-small-bottom uk-margin-large-top">position</div>
<div class="uk-width-expand uk-padding-remove-left" input type="select" inputClass="flat x-small" [(value)]="background.position"
<div class="uk-width-expand uk-padding-remove-left" input type="select" inputClass="flat x-small"
[(value)]="background.position"
[options]="['top','center','bottom']">
</div>
@ -63,6 +66,7 @@ export class BackgroundUploadComponent implements OnInit {
ngOnInit() {
this.properties = properties;
}
ngOnDestroy() {
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscription) {
@ -87,7 +91,6 @@ export class BackgroundUploadComponent implements OnInit {
}
public deletePhoto() {
if (this.background.imageFile) {
this.subscriptions.push(this.utilsService.deletePhoto(properties.utilsService + '/delete/community/' + this.communityId + "/" + this.background.imageFile).subscribe());
@ -131,17 +134,24 @@ export class BackgroundUploadComponent implements OnInit {
this.background.imageFile = res.filename;
}, error => {
if (error.error.message) {
UIkit.notification('The maximum size of an image is 1MB, please check if your file exceeds this limit.', {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
} else {
UIkit.notification("An error has been occurred during upload your image. Try again later", {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
}
}));
}
}
getUrl()
{
getUrl() {
return "url('" + (this.background.imageFile.indexOf('data:') == -1 ? (this.properties.utilsService +
'/download/' + this.background.imageFile) : this.background.imageFile) + "')";
}