It’s all over the place, but here are the pieces…
/* request-form.ts */
import { FirebaseProvider } from '../../providers/firebase/firebase';
//***
base64Image: string="assets/img/no-picture.png";
photoUpdated:boolean=false;
constructor(public navCtrl: NavController, public navParams: NavParams, private toolbox:ToolboxProvider
,public actionSheetCtrl: ActionSheetController,private fbase:FirebaseProvider) {
}
//*** other stuff
presentActionSheet() // called to choose photo from gallery or camera. This is where imageData is set
{
let actionSheet = this.actionSheetCtrl.create({
title: 'Choose a photo',
buttons: [
{
text: 'Camera',
role: 'camera',
handler: () => {
this.toolbox.showGallery(true)
.then((imageData:string)=>{
this.base64Image = "data:image/jpeg;base64," + imageData;
this.photo = imageData;
this.photoUpdated=true;
})
.catch((err) => {
console.log("camera.getPicture(1) error: ", Object.getOwnPropertyNames(err));
});
}
},{
text: 'Gallery',
handler: () => {
this.toolbox.showGallery()
.then((imageData:string)=>{
this.base64Image = "data:image/jpeg;base64," + imageData;
this.photo = imageData;
this.photoUpdated=true;
})
.catch((err) => {
console.log("camera.getPicture(2) error: ", JSON.stringify(err, Object.getOwnPropertyNames(err)));
});
}
},{
text: 'Cancel',
role: 'cancel',
handler: () => {
console.log('Cancel clicked');
}
}
]
});
actionSheet.present();
}// Present action sheet
SaveRequest()//<!-- where the upload happens
{ //*** validation and stuff goes here
let env=this;
var reqId=this.objRequest.id;
this.fbase.addImageToStorage("/request_photos/" + reqId + "/photo.jpg",env.photo)
.then((url)=>{console.log("uploaded to ", url)})
.catch((e)=>{console.log("Help...", e)});
console.log("Done");
//*** etc etc
}
/* firebase.ts*/
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Platform} from 'ionic-angular';
import * as firebase from 'firebase/app';
import 'firebase/database';
import 'firebase/storage';
//** other stuff
// Add image to storage
addImageToStorage(url, img):Promise<string>
{
return new Promise((resolve, reject)=>{
try {
console.log("Begin");
firebase.storage().ref().child(url).putString(img, 'base64', {contentType: 'image/jpg'})
.then(
path => {console.log("done");resolve(path.downloadURL)},
e => console.log(e) //<-- maybe we can get more information?
)
.catch((e)=>{reject(e)});
} catch (error) {
console.warn("What the heck?? ", error);
}
})
}
