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.
190 lines
5.2 KiB
TypeScript
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);
|
|
}
|
|
);
|
|
}
|
|
|
|
|
|
}
|