From f90c564a3d72f57028055dcd644faebb8dbf38b3 Mon Sep 17 00:00:00 2001 From: Norbert Schmidt Date: Wed, 22 Feb 2023 09:08:38 +0100 Subject: [PATCH] More plantnet bugfixes. But working now --- .../classify/classify-routing.module.ts | 2 + .../plantnet/classify/classify.page.html | 36 +-- .../plantnet/classify/classify.page.ts | 262 +++++++++++------- .../plantnet/plantnet-routing.module.ts | 7 +- 4 files changed, 170 insertions(+), 137 deletions(-) diff --git a/src/app/mobisplugins/plantnet/classify/classify-routing.module.ts b/src/app/mobisplugins/plantnet/classify/classify-routing.module.ts index 6c9730e..5f51222 100644 --- a/src/app/mobisplugins/plantnet/classify/classify-routing.module.ts +++ b/src/app/mobisplugins/plantnet/classify/classify-routing.module.ts @@ -8,6 +8,8 @@ const routes: Routes = [ path: '', component: ClassifyPage } + + ]; @NgModule({ diff --git a/src/app/mobisplugins/plantnet/classify/classify.page.html b/src/app/mobisplugins/plantnet/classify/classify.page.html index 6b0c137..19a5d12 100644 --- a/src/app/mobisplugins/plantnet/classify/classify.page.html +++ b/src/app/mobisplugins/plantnet/classify/classify.page.html @@ -1,6 +1,6 @@ - Classify your image + Image classification @@ -20,36 +20,14 @@ - Choose a class + Best match: - - - - - Leaf - - - -Flower - - -Fruit - - - -Bark - - -Automatic - - - - - - - - + + {{result}} + +Submit + diff --git a/src/app/mobisplugins/plantnet/classify/classify.page.ts b/src/app/mobisplugins/plantnet/classify/classify.page.ts index 3a961a3..6721492 100644 --- a/src/app/mobisplugins/plantnet/classify/classify.page.ts +++ b/src/app/mobisplugins/plantnet/classify/classify.page.ts @@ -1,13 +1,17 @@ import { Component, OnInit } from '@angular/core'; -import {ENV} from '../../../app.constant'; +import { ENV } from '../../../app.constant'; import { TranslateService } from '@ngx-translate/core'; import { AuthService } from '../../../services/auth.service'; import { Auth, user } from '@angular/fire/auth'; import { Storage } from '@ionic/storage-angular'; import { Router } from '@angular/router'; import { Geolocation } from '@capacitor/geolocation'; - import { Http } from '@capacitor-community/http'; +import * as Parse from 'parse'; + +// debug purpose: Chrome without CORS on mac +// open /Applications/Google\ Chrome.app --args --user-data-dir="/var/tmp/Chrome dev session" --disable-web-security + @Component({ selector: 'app-classify', @@ -15,62 +19,162 @@ import { Http } from '@capacitor-community/http'; styleUrls: ['./classify.page.scss'], }) export class ClassifyPage implements OnInit { - PROJECT = 'all'; // try 'weurope' or 'canada' - API_URL = 'https://my-api.plantnet.org/v2/identify/' + this.PROJECT + '?api-key='; - API_PRIVATE_KEY = ENV.plantnetKey; // secret - API_SIMSEARCH_OPTION = '&include-related-images=true'; // optional: get most similar images - API_LANG = '&lang=en'; // default: en - - uploadSuccess = false; // Add this line - image = ''; - user = null; - language = ''; - latitude: number; - longitude: number; - altitude: number; + PROJECT = 'all'; // try 'weurope' or 'canada' + API_URL = 'https://my-api.plantnet.org/v2/identify/' + this.PROJECT + '?api-key='; + API_PRIVATE_KEY = ENV.plantnetKey; // secret + API_SIMSEARCH_OPTION = '&include-related-images=true'; // optional: get most similar images + API_LANG = '&lang=en'; // default: en + // add result variabel for showing result to user + result = ''; + + parsefile: any; + parsefileName: any; + parsefileUrl: any; + + uploadSuccess = false; // Add this line + image = ''; + + user = null; + language = ''; + latitude: number; + longitude: number; + altitude: number; constructor( + private storage: Storage, + private authService: AuthService, + private afAuth: Auth, + private translateService: TranslateService, + private router: Router -private storage: Storage, -private authService: AuthService, -private afAuth: Auth, -private translateService: TranslateService, -private router: Router - - ) { user(this.afAuth).subscribe((response) => { + ) { + user(this.afAuth).subscribe((response) => { //fill the user to verify if someone is logged in this.user = response; - console.log(this.user.uid); - }); } + }); + } ngOnInit() { - + // get location this.getLocation(); + Parse.initialize(ENV.parseAppId, ENV.parseJSKey); + (Parse as any).serverURL = ENV.parseServerUrl; // use your server url + + this.storage.create(); + + // get file out of storage and submit to parse + this.storage.get('plantnet_image').then((val) => { // get image from storage + this.image = val; + this.parsefile = new Parse.File('plantnet_image.jpg', { base64: this.image }); + this.parsefile.save().then( + (response: any) => { + this.parsefileUrl = this.parsefile.toJSON().url; + this.parsefileName = this.parsefile.toJSON().name; + console.log('parsefileUrl', this.parsefileUrl); + console.log('parsefileName', this.parsefileName); + + // call function to submit to plantnet + + this.submit_to_plantnet(); - // get image from local storage - this.storage.get('image').then((image) => { - console.log(image); - this.image = image; + } + ) }); - -// add rose.jpg from assets directory for testing - const imageUri = 'assets/rose.jpg'; + }; + + + + + + + + + + + + + + + + + + + + + submit_image_with_classification() { + + const plantnet_data_store = Parse.Object.extend('plantnet_data'); + + // create new instance of parse class + + const plantnet_data = new plantnet_data_store(); + + // set value for parse clas + + + + plantnet_data.set('user_uid', this.user.uid); + plantnet_data.set('name', this.user.displayName); + plantnet_data.set('email', this.user.email); + plantnet_data.set('image', this.parsefile); + plantnet_data.set('classification', this.result); + plantnet_data.set('latitude', this.latitude); + plantnet_data.set('longitude', this.longitude); + plantnet_data.set('altitude', this.altitude); + + + plantnet_data.save().then( + (result: any) => { + console.log(result); + }, + (error: any) => { + console.log(error); + } + ); + + + +// go to plantnet page + this.router.navigate(['/plantnet']); + + + + } + + async getLocation() { + const position = await Geolocation.getCurrentPosition({ + enableHighAccuracy: true, + }); + this.latitude = position.coords.latitude; + console.log(position.coords.latitude); + this.longitude = position.coords.longitude; + this.altitude = position.coords.altitude; + return position.coords; + } + + + + submit_to_plantnet() { + + + + const imageUri = this.parsefileUrl; const imageType = 'image/jpeg'; - const imageName = 'rose.jpg'; - + const imageName = this.parsefileName; + fetch(imageUri) .then(response => response.blob()) .then(blob => { const formData = new FormData(); formData.append('images', new File([blob], imageName, { type: imageType })); formData.append('organs', 'auto'); - + const url = 'https://my-api.plantnet.org/v2/identify/all'; const headers = { 'accept': 'application/json', @@ -91,87 +195,31 @@ private router: Router data: formData }).then(response => { console.log(response.data); + + // show result on to user + + this.result = response.data.results[0].species.scientificName; + + console.log(this.result); + + }).catch(error => { - console.error(error); + console.log ('error in response', error); + this.result = 'Species not found'; }); }) .catch(error => { console.error(error); }); - + + // route to plantnet page - -}; - - - - - - - - - - - - - - - - - - - - - savetoParse() { - - const plantnet_data_store = Parse.Object.extend('plantnet_data'); - - // create new instance of parse class - - const plantnet_data = new plantnet_data_store(); - - // set value for parse clas - - const file = new Parse.File('plantnet_image.jpg', { base64: this.image }); - file.save().then( - (file) => { - console.log(file); - }, - (error) => { - console.log(error); - } - ); - // add location and clasiification - - plantnet_data.set('user_uid', this.user.uid); - plantnet_data.set('name', this.user.displayName); - plantnet_data.set('email', this.user.email); - plantnet_data.set('image', file); - plantnet_data.set('latitude', this.latitude); - plantnet_data.set('longitude', this.longitude); - plantnet_data.set('altitude', this.altitude); - - - plantnet_data.save().then( - (result: any) => { - console.log(result); - }, - (error: any) => { - console.log(error); - } - ); } - async getLocation() { - const position = await Geolocation.getCurrentPosition({ - enableHighAccuracy: true, - }); - this.latitude = position.coords.latitude; - console.log(position.coords.latitude); - this.longitude = position.coords.longitude; - this.altitude = position.coords.altitude; - return position.coords; - } + + + + } diff --git a/src/app/mobisplugins/plantnet/plantnet-routing.module.ts b/src/app/mobisplugins/plantnet/plantnet-routing.module.ts index bb82488..cfa7637 100644 --- a/src/app/mobisplugins/plantnet/plantnet-routing.module.ts +++ b/src/app/mobisplugins/plantnet/plantnet-routing.module.ts @@ -11,7 +11,12 @@ const routes: Routes = [ { path: 'classify', loadChildren: () => import('./classify/classify.module').then( m => m.ClassifyPageModule) - } + }, + { + path: 'plantnet', + loadChildren: () => import('./plantnet.module').then( m => m.PlantnetPageModule) + }, + ]; @NgModule({