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.
mohemmionic5/Mohem/src/app/hmg-common/ui/file-uploder-profile/file-uploder-profile.compon...

190 lines
5.2 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 { FileChooser } from '@ionic-native/file-chooser';
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';
// import { Chooser } from '@ionic-native/chooser';
@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: 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);
}
);
}
}