You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm_srca/Mohem/src/app/hmg-common/ui/file-uploder-profile/file-uploder-profile.compon...

187 lines
5.1 KiB
TypeScript

import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { ActionSheetController, Events, NavController } from '@ionic/angular';
import {CameraOptions, Camera, PictureSourceType} from '@ionic-native/Camera/ngx';
import { FilePath } from '@ionic-native/file-path/ngx';
import { File } from '@ionic-native/file/ngx';
import { TranslatorService } from '../../services/translator/translator.service';
import { Base64 } from '@ionic-native/base64/ngx';
import { DevicePermissionsService } from '../../services/device-permissions/device-permissions.service';
@Component({
selector: 'app-file-uploder-profile',
templateUrl: './file-uploder-profile.component.html',
styleUrls: ['./file-uploder-profile.component.scss'],
})
export class FileUploderProfileComponent implements OnInit {
@Input() multiupload = false;
@Input() attachmentname = 'attachment-loader';
public attachmentData: string;
@Input() maxFileSize = 10 * 1024 * 1024;
@Output() fileSelected = new EventEmitter();
@Output() onimgLoad = new EventEmitter();
public image: string;
public attachmentImg = 'assets/icon/attachment.png';
public deleteImg = 'assets/icon/delete.png';
public defultProfile = '../../../../assets/imgs/profile.png';
public selectedImage: any;
public nativePath: any;
public errorMsg: any;
public allowdType: any = ['jpg', 'jpeg', 'png'];
camera: boolean;
constructor(
public cameraController: Camera,
public actionSheetCtrl: ActionSheetController,
public event: Events,
public nav: NavController,
private filePath: FilePath,
// public FileChooser:FileChooser,
private file: File,
public ts: TranslatorService,
public base64: Base64,
private permissions: DevicePermissionsService
// private chooser: Chooser
) { }
ngOnInit() {
}
@Input() set src(src: string) {
this.image = src;
}
get src(): string {
return this.image;
}
// open the presentsheet
// selected attach
// need convert
// insert or display
private permissionsToOpenCamera() {
this.permissions.requestCameraAutherization().then(granted => {
this.camera = granted as boolean;
if (this.camera) {
this.openFile();
}
}
);
}
async openFile() {
const actionSheet = await this.actionSheetCtrl.create({
header: 'Change Profile Photo',
buttons: [{
// text: 'Delete Current Image',
// role: 'destructive',
// icon: 'trash',
// handler: () => {
// console.log('Delete clicked');
// this.deleteCurrent();
// }
// },{
text: 'Take Photo',
icon: 'camera',
handler: () => {
console.log('Take Photo');
this.takePicture(this.cameraController.PictureSourceType.CAMERA);
}
}, {
text: 'Choose from Library',
icon: 'images',
handler: () => {
console.log('Favorite clicked');
this.takePicture(this.cameraController.PictureSourceType.PHOTOLIBRARY);
}
}, {
text: 'Cancel',
icon: 'close',
role: 'cancel',
handler: () => {
console.log('Cancel clicked');
}
}]
});
await actionSheet.present();
}
public takePicture(sourceType: PictureSourceType) {
console.log('sourceType: ' + sourceType);
const options: CameraOptions = {
quality: 50,
destinationType: this.cameraController.DestinationType.DATA_URL,
encodingType: this.cameraController.EncodingType.JPEG,
sourceType,
correctOrientation: true,
targetWidth: 512,
targetHeight: 512
};
this.cameraController.getPicture(options).then(imageData => {
const data = 'data:image/jpeg;base64,' + imageData;
this.event.publish('Image', {message: 'hello'});
this.selectedImage = 'data:image/jpeg;base64, ' + imageData;
this.onimgLoad.emit(this.selectedImage);
});
}
public deleteCurrent() {
// send empty image
// this.onimgLoad.emit("");
console.log('deleteCurrent');
this.encodeFiles(this.defultProfile);
}
readFile(fileUrl: any) {
this.filePath.resolveNativePath(fileUrl).then(filePathResult => {
this.nativePath = filePathResult;
this.file.resolveLocalFilesystemUrl(this.nativePath).then(entry => {
entry.getMetadata(metadata => {
if (metadata.size <= this.maxFileSize) {
this.errorMsg = null;
this.encodeFiles(entry);
} else {
this.errorMsg = this.ts.trPK('general', 'large-file');
}
});
});
});
}
encodeFiles(entry) {
alert('encodeFiles');
this.base64.encodeFile(entry).then(
(base64File: string) => {
// const type = this.nativePath.substr(
// this.nativePath.lastIndexOf(".") + 1
// );
alert('base64File 1' + base64File);
// if (this.allowdType.includes(type.toLowerCase())) {
// } else {
// this.attachmentData = null;
// this.errorMsg = this.ts.trPK("general", "not-supported");
// }
},
err => {
console.log(err);
}
);
}
}