playing with AI image recognition

vue3/src/apps/tandoor/Tandoor.vue

@@ -22,6 +22,7 @@
             <v-list-item prepend-icon="fas fa-calendar-alt" title="Mealplan" :to="{ name: 'view_mealplan', params: {} }"></v-list-item>
             <v-list-item prepend-icon="fas fa-shopping-cart" title="Shopping" :to="{ name: 'view_shopping', params: {} }"></v-list-item>
             <v-list-item prepend-icon="fas fa-bars" title="More" :to="{ name: 'view_books', params: {} }"></v-list-item>
+            <v-list-item prepend-icon="fas fa-bars" title="Test" :to="{ name: 'view_test', params: {} }"></v-list-item>
             <!-- TODO link -->
         </v-navigation-drawer>
 

vue3/src/apps/tandoor/main.ts

@@ -14,9 +14,11 @@ import luxonPlugin from "@/plugins/luxonPlugin";
 import RecipeEditPage from "@/pages/RecipeEditPage.vue";
 import MealPlanPage from "@/pages/MealPlanPage.vue";
 import SearchPage from "@/pages/SearchPage.vue";
+import TestPage from "@/pages/TestPage.vue";
 
 const routes = [
     {path: '/', component: StartPage, name: 'view_home'},
+    {path: '/test', component: TestPage, name: 'view_test'},
     {path: '/search', component: SearchPage, name: 'view_search'},
     {path: '/shopping', component: ShoppingListPage, name: 'view_shopping'},
     {path: '/mealplan', component: MealPlanPage, name: 'view_mealplan'},

vue3/src/openapi/.openapi-generator/FILES

@@ -22,6 +22,7 @@ models/FoodInheritField.ts
 models/FoodShoppingUpdate.ts
 models/FoodSimple.ts
 models/Group.ts
+models/ImportImage.ts
 models/ImportLog.ts
 models/Ingredient.ts
 models/IngredientString.ts

vue3/src/openapi/apis/ApiApi.ts

@@ -27,6 +27,7 @@ import type {
   FoodInheritField,
   FoodShoppingUpdate,
   Group,
+  ImportImage,
   ImportLog,
   Ingredient,
   IngredientString,
@@ -167,6 +168,8 @@ import {
     FoodShoppingUpdateToJSON,
     GroupFromJSON,
     GroupToJSON,
+    ImportImageFromJSON,
+    ImportImageToJSON,
     ImportLogFromJSON,
     ImportLogToJSON,
     IngredientFromJSON,
@@ -662,6 +665,10 @@ export interface ApiGroupRetrieveRequest {
     id: number;
 }
 
+export interface ApiImageToRecipeCreateRequest {
+    image: string;
+}
+
 export interface ApiImportLogCreateRequest {
     importLog: ImportLog;
 }
@@ -3962,6 +3969,60 @@ export class ApiApi extends runtime.BaseAPI {
         return await response.value();
     }
 
+    /**
+     */
+    async apiImageToRecipeCreateRaw(requestParameters: ApiImageToRecipeCreateRequest, initOverrides?: RequestInit | runtime.InitOverrideFunction): Promise<runtime.ApiResponse<ImportImage>> {
+        if (requestParameters['image'] == null) {
+            throw new runtime.RequiredError(
+                'image',
+                'Required parameter "image" was null or undefined when calling apiImageToRecipeCreate().'
+            );
+        }
+
+        const queryParameters: any = {};
+
+        const headerParameters: runtime.HTTPHeaders = {};
+
+        if (this.configuration && this.configuration.apiKey) {
+            headerParameters["Authorization"] = await this.configuration.apiKey("Authorization"); // ApiKeyAuth authentication
+        }
+
+        const consumes: runtime.Consume[] = [
+            { contentType: 'multipart/form-data' },
+        ];
+        // @ts-ignore: canConsumeForm may be unused
+        const canConsumeForm = runtime.canConsumeForm(consumes);
+
+        let formParams: { append(param: string, value: any): any };
+        let useForm = false;
+        if (useForm) {
+            formParams = new FormData();
+        } else {
+            formParams = new URLSearchParams();
+        }
+
+        if (requestParameters['image'] != null) {
+            formParams.append('image', requestParameters['image'] as any);
+        }
+
+        const response = await this.request({
+            path: `/api/image-to-recipe`,
+            method: 'POST',
+            headers: headerParameters,
+            query: queryParameters,
+            body: formParams,
+        }, initOverrides);
+
+        return new runtime.JSONApiResponse(response, (jsonValue) => ImportImageFromJSON(jsonValue));
+    }
+
+    /**
+     */
+    async apiImageToRecipeCreate(requestParameters: ApiImageToRecipeCreateRequest, initOverrides?: RequestInit | runtime.InitOverrideFunction): Promise<ImportImage> {
+        const response = await this.apiImageToRecipeCreateRaw(requestParameters, initOverrides);
+        return await response.value();
+    }
+
     /**
      * function to handle files passed by application importer
      */

vue3/src/openapi/models/ImportImage.ts

@@ -0,0 +1,61 @@
+/* tslint:disable */
+/* eslint-disable */
+/**
+ * Tandoor
+ * Tandoor API Docs
+ *
+ * The version of the OpenAPI document: 0.0.0
+ * 
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+
+import { mapValues } from '../runtime';
+/**
+ * 
+ * @export
+ * @interface ImportImage
+ */
+export interface ImportImage {
+    /**
+     * 
+     * @type {string}
+     * @memberof ImportImage
+     */
+    image: string;
+}
+
+/**
+ * Check if a given object implements the ImportImage interface.
+ */
+export function instanceOfImportImage(value: object): boolean {
+    if (!('image' in value)) return false;
+    return true;
+}
+
+export function ImportImageFromJSON(json: any): ImportImage {
+    return ImportImageFromJSONTyped(json, false);
+}
+
+export function ImportImageFromJSONTyped(json: any, ignoreDiscriminator: boolean): ImportImage {
+    if (json == null) {
+        return json;
+    }
+    return {
+        
+        'image': json['image'],
+    };
+}
+
+export function ImportImageToJSON(value?: ImportImage | null): any {
+    if (value == null) {
+        return value;
+    }
+    return {
+        
+        'image': value['image'],
+    };
+}
+

vue3/src/openapi/models/index.ts

@@ -19,6 +19,7 @@ export * from './FoodInheritField';
 export * from './FoodShoppingUpdate';
 export * from './FoodSimple';
 export * from './Group';
+export * from './ImportImage';
 export * from './ImportLog';
 export * from './Ingredient';
 export * from './IngredientString';

vue3/src/pages/TestPage.vue

@@ -0,0 +1,41 @@
+<template>
+    <v-file-input label="File input" v-model="image"></v-file-input>
+
+
+    <v-btn @click="imageToRecipe()">Upload</v-btn>
+
+
+    <v-textarea v-model="response"></v-textarea>
+</template>
+
+<script setup lang="ts">
+
+
+import {ApiApi} from "@/openapi";
+import {ref} from "vue";
+
+const image = ref(File)
+const response = ref('')
+
+function imageToRecipe() {
+    const api = new ApiApi()
+
+    const reader = new FileReader()
+    reader.readAsDataURL(image.value)
+
+    api.apiImageToRecipeCreate({image: image.value}).then(r => {
+        console.log(r)
+        response.value = r
+    }).catch(err => {
+        console.log(err)
+        response.value = err
+    })
+}
+
+
+</script>
+
+
+<style scoped>
+
+</style>