peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-19 04:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

compress image of publications and chat

Browse Source
This commit is contained in:
Eudes Inácio
2023-08-28 16:36:31 +01:00
parent fe6614a37e
commit 8525fcb8f6
7 changed files with 368 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/shared/chat/group-messages/group-messages.page.ts
+48 -1
View File
@@ -718,8 +718,18 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
//const imageData = await this.fileToBase64Service.convert(file)
//
var base64 = 'data:image/jpeg;base64,' + file.base64String
const compressedImage = await this.compressImageBase64(
base64,
800, // maxWidth
800, // maxHeight
0.9 // quality
).then((picture) => {
console.log('Selected: ', picture)
base64 = picture
});
const response = await fetch('data:image/jpeg;base64,' + file.base64String!);
const response = await fetch(base64);
const blob = await response.blob();
const formData = new FormData();
@@ -1123,5 +1133,42 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
} else { }
}
async compressImageBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
return new Promise((resolve, reject) => {
const image = new (window as any).Image();
image.src = base64String;
image.onload = async () => {
const canvas = document.createElement('canvas');
let newWidth = image.width;
let newHeight = image.height;
if (newWidth > maxWidth) {
newHeight *= maxWidth / newWidth;
newWidth = maxWidth;
}
if (newHeight > maxHeight) {
newWidth *= maxHeight / newHeight;
newHeight = maxHeight;
}
canvas.width = newWidth;
canvas.height = newHeight;
const context = canvas.getContext('2d');
context?.drawImage(image, 0, 0, newWidth, newHeight);
const compressedBase64 = canvas.toDataURL('image/jpeg', quality);
resolve(compressedBase64);
};
image.onerror = (error) => {
reject(error);
};
});
}
}
src/app/shared/chat/messages/messages.page.ts
+60 -2
View File
@@ -645,7 +645,18 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
source: CameraSource.Camera
});
const base64 = 'data:image/jpeg;base64,' + file.base64String
var base64 = 'data:image/jpeg;base64,' + file.base64String
const compressedImage = await this.compressImageBase64(
base64,
800, // maxWidth
800, // maxHeight
0.9 // quality
).then((picture) => {
console.log('Selected: ', picture)
base64 = picture
});
const blob = this.dataURItoBlob(base64)
const formData = new FormData();
@@ -770,8 +781,18 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
//const imageData = await this.fileToBase64Service.convert(file)
//
var base64 = 'data:image/jpeg;base64,' + file.base64String
const compressedImage = await this.compressImageBase64(
base64,
800, // maxWidth
800, // maxHeight
0.9 // quality
).then((picture) => {
console.log('Selected: ', picture)
base64 = picture
});
const response = await fetch('data:image/jpeg;base64,' + file.base64String!);
const response = await fetch(base64);
const blob = await response.blob();
const formData = new FormData();
@@ -1153,6 +1174,43 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
}
async compressImageBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
return new Promise((resolve, reject) => {
const image = new (window as any).Image();
image.src = base64String;
image.onload = async () => {
const canvas = document.createElement('canvas');
let newWidth = image.width;
let newHeight = image.height;
if (newWidth > maxWidth) {
newHeight *= maxWidth / newWidth;
newWidth = maxWidth;
}
if (newHeight > maxHeight) {
newWidth *= maxHeight / newHeight;
newHeight = maxHeight;
}
canvas.width = newWidth;
canvas.height = newHeight;
const context = canvas.getContext('2d');
context?.drawImage(image, 0, 0, newWidth, newHeight);
const compressedBase64 = canvas.toDataURL('image/jpeg', quality);
resolve(compressedBase64);
};
image.onerror = (error) => {
reject(error);
};
});
}
}
src/app/shared/publication/new-publication/new-publication.page.ts
+57 -1
View File
@@ -84,7 +84,16 @@ export class NewPublicationPage implements OnInit {
this.capturedImage = 'data:image/jpeg;base64,' +capturedImage.base64String;
this.capturedImageTitle = 'foto';
//
const compressedImage = await this.compressImageBase64(
this.capturedImage,
800, // maxWidth
800, // maxHeight
0.9 // quality
).then((picture) => {
console.log('taked: ', picture)
this.capturedImage = picture
});
}
async laodPicture() {
@@ -96,6 +105,17 @@ export class NewPublicationPage implements OnInit {
this.capturedImage = 'data:image/jpeg;base64,' +capturedImage.base64String;
this.capturedImageTitle = 'foto';
const compressedImage = await this.compressImageBase64(
this.capturedImage,
800, // maxWidth
800, // maxHeight
0.9 // quality
).then((picture) => {
console.log('Selected: ', picture)
this.capturedImage = picture
});
}
@@ -273,4 +293,40 @@ export class NewPublicationPage implements OnInit {
}
async compressImageBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
return new Promise((resolve, reject) => {
const image = new (window as any).Image();
image.src = base64String;
image.onload = async () => {
const canvas = document.createElement('canvas');
let newWidth = image.width;
let newHeight = image.height;
if (newWidth > maxWidth) {
newHeight *= maxWidth / newWidth;
newWidth = maxWidth;
}
if (newHeight > maxHeight) {
newWidth *= maxHeight / newHeight;
newHeight = maxHeight;
}
canvas.width = newWidth;
canvas.height = newHeight;
const context = canvas.getContext('2d');
context?.drawImage(image, 0, 0, newWidth, newHeight);
const compressedBase64 = canvas.toDataURL('image/jpeg', quality);
resolve(compressedBase64);
};
image.onerror = (error) => {
reject(error);
};
});
}
}