add initial img API endpoints

src/lib/components/CardAdd.svelte

@@ -6,6 +6,7 @@ import "$lib/css/icon.css"
 
 // all data shared with rest of page in card_data
 export let card_data
+export let image_preview_url
 
 import { img } from '$lib/js/img_store';
 
@@ -13,9 +14,9 @@ if(!card_data.tags){
 	card_data.tags = []
 }
 
+
 //locals
 let new_tag
-let image_preview_url
 
 
 export function show_local_image(){

src/routes/api/img/add/+server.ts

@@ -1,4 +1,3 @@
-import { writeFileSync } from 'fs';
 import path from 'path'
 import type { RequestHandler } from '@sveltejs/kit';
 import { BEARER_TOKEN } from '$env/static/private'

src/routes/api/img/delete/+server.ts

@@ -0,0 +1,24 @@
+import path from 'path'
+import type { RequestHandler } from '@sveltejs/kit';
+import { BEARER_TOKEN } from '$env/static/private'
+import { IMAGE_DIR } from '$env/static/private'
+import { unlink } from 'node:fs';
+import { error } from '@sveltejs/kit';
+
+export const POST =  (async ({ request })  => {
+    const data = await request.json();
+    if(data.bearer === BEARER_TOKEN){
+	[ "full", "thumb", "placeholder"].forEach((folder) => {
+		unlink(path.join(IMAGE_DIR, folder, data.name + ".webp"), (e) => {
+			if(e) throw error(500, "could not delete: " + folder + "/" + data.name + ".webp")
+		})
+	})
+	return new Response(JSON.stringify({msg: "Deleted image successfully"}),{
+			    status: 200,
+  	});
+    }
+    else{
+    	throw error(403, "Password incorrect")
+    }
+
+}) satisfies RequestHandler;

src/routes/api/img/mv/+server.ts

@@ -0,0 +1,24 @@
+import path from 'path'
+import type { RequestHandler } from '@sveltejs/kit';
+import { BEARER_TOKEN } from '$env/static/private'
+import { IMAGE_DIR } from '$env/static/private'
+import { rename } from 'node:fs';
+import { error } from '@sveltejs/kit';
+
+export const POST =  (async ({ request })  => {
+    const data = await request.json();
+    if(data.bearer === BEARER_TOKEN){
+	[ "full", "thumb", "placeholder"].forEach((folder) => {
+		rename(path.join(IMAGE_DIR, folder, data.old_name + ".webp"), path.join(IMAGE_DIR, folder, data.new_name + ".webp"), (e) => {
+		if(e) throw error(500, "could not mv: " + folder + "/" + data.old_name + ".webp")
+		})
+	});
+	return new Response(JSON.stringify({msg: "Deleted image successfully"}),{
+			    status: 200,
+  			});
+    }
+    else{
+    	throw error(403, "Password incorrect")
+    }
+
+}) satisfies RequestHandler;

src/routes/rezepte/edit/[name]/+page.svelte

@@ -8,6 +8,7 @@
     	export let data: PageData;
 	let preamble = data.recipe.preamble
 	let addendum = data.recipe.addendum
+	let image_preview_url="https://new.bocken.org/static/rezepte/thumb/" + data.recipe.short_name + ".webp"
 
 	import { season } from '$lib/js/season_store';
 	import { portions } from '$lib/js/portions_store';
@@ -24,6 +25,13 @@
 		season_local = s
 	});
 
+
+	import { img } from '$lib/js/img_store';
+	let img_local
+	img.update(() => "")
+	img.subscribe((i) => {
+		img_local = i});
+
 	let old_short_name = data.recipe.short_name
 
 	export let card_data ={
@@ -87,6 +95,21 @@
 		if(!response){
 			return
 		}
+		const res_img = await fetch('/api/img/delete', {
+			method: 'POST',
+			body: JSON.stringify({
+				name: old_short_name,
+			headers : {
+       				'content-type': 'application/json',
+				bearer: password
+				}
+			})
+			})
+		if(!res_img.ok){
+			const item = await res_img.json();
+			alert(item.message)
+			return
+		}
 		const res = await fetch('/api/delete', {
 			method: 'POST',
 			body: JSON.stringify({
@@ -98,7 +121,7 @@
 			})
 
 		})
-		if(res.status === 200){
+		if(res.ok){
 			const url = location.href.split('/')
 			url.splice(url.length -2, 2);
 			location.assign(url.join('/'))
@@ -109,6 +132,67 @@
 		}
 	}
 	async function doEdit() {
+		// two cases:
+		//new image uploaded (not implemented yet)
+		// new short_name -> move images as well
+		// if new image
+		if(img_local != ""){
+			async function delete_img(){
+				const res_img = await fetch('/api/img/delete', {
+					method: 'POST',
+					body: JSON.stringify({
+						name: old_short_name,
+					headers : {
+       						'content-type': 'application/json',
+						bearer: password
+						}
+					})
+				})
+				if(!res_img.ok){
+					const item = await res_img.json();
+					alert(item.message)
+					return
+				}
+			}
+			async function upload_img(){
+        			const data = {
+					image: img_local,
+					name: short_name,
+					bearer: password,
+				}
+        			const res = await fetch(`/api/img/add`, {
+        			    method: 'POST',
+        			    headers: {
+        			        'Content-Type': 'application/json',
+        			        Accept: 'application/json',
+					bearer: password,
+        			    },
+        			    body: JSON.stringify(data)
+        			});
+				if(!res.ok){
+					const item = await res_img.json();
+					alert(item.message)
+					return
+				}
+			}
+			delete_img()
+			upload_img()
+		}
+		// case new short_name:
+		else if(short_name != old_short_name){
+			const res_img = await fetch('/api/img/mv', {
+				method: 'POST',
+				body: JSON.stringify({
+					old_name: old_short_name,
+					new_name: short_name
+				})
+			})
+			if(!res_img.ok){
+				const item = await res_img.json();
+				alert(item.message)
+				return
+			}
+		}
 		const res = await fetch('/api/edit', {
 			method: 'POST',
 			body: JSON.stringify({
@@ -133,7 +217,7 @@
      				}
 			})
 		})
-		if(res.status === 200){
+		if(res.ok){
 			const url = location.href.split('/');
 			url.splice(url.length -2, 1);
 			location.assign(url.join('/'))
@@ -248,7 +332,7 @@ h3{
 </style>
 <h1>Rezept editieren</h1>
 
-<CardAdd {card_data}></CardAdd>
+<CardAdd {card_data} {image_preview_url} ></CardAdd>
 
 <h3>Kurzname (für URL):</h3>
 <input bind:value={short_name} placeholder="Kurzname"/>