Auto focus input element after inserting food

Improve and fix issues with color generation
Implement ctrl-tab navigation between weight and energy
2024-08-10 19:39:36 +02:00 · 2024-08-10 19:36:26 +02:00 · 2024-08-10 19:36:17 +02:00 · 2024-08-10 19:22:19 +02:00 · 2024-08-10 14:03:20 +02:00 · 2024-08-10 13:51:04 +02:00
16 changed files with 171 additions and 23 deletions
--- a/app.go
+++ b/app.go
@@ -2,6 +2,7 @@ package main

 import (
 	"context"
+	"os"
 )

 // App struct
@@ -135,3 +136,8 @@ func (a *App) SetSetting(key string, value int64) WailsGenericAck {
 	}
 	return WailsGenericAck{Success: true}
 }
+
+//region other
+func (a *App) Close() {
+	os.Exit(0)
+}
--- a/db.go
+++ b/db.go
@@ -3,6 +3,7 @@ package main
 import (
 	"database/sql"
 	"fmt"
+	"log"
 	"time"

 	_ "github.com/mattn/go-sqlite3"
@@ -44,6 +45,58 @@ func (db *DB) Open() error {
 	return nil
 }

+func (db *DB) Init(ddl string) error {
+	if !db.Ready {
+		return fmt.Errorf("database not ready")
+	}
+
+	var rows map[string]struct{} = make(map[string]struct{})
+	// TODO: Maybe make this better one day...
+	var expected = map[string]struct{}{
+		"food":     {},
+		"weight":   {},
+		"settings": {},
+	}
+
+	res, err := db.readConn.Query("SELECT name FROM sqlite_master WHERE type='table';")
+	if err != nil {
+		Error.Printf("%++v", err)
+		return err
+	}
+	defer res.Close()
+	for res.Next() {
+		var name string
+		err := res.Scan(&name)
+		if err != nil {
+			Error.Printf("%++v", err)
+			return err
+		}
+		rows[name] = struct{}{}
+	}
+
+	var needsInit bool
+	for table := range expected {
+		if _, ok := rows[table]; !ok {
+			log.Printf("Table %s not found, initializing", table)
+			needsInit = true
+			break;
+		}
+	}
+
+	if !needsInit {
+		log.Printf("Database already initialized")
+		return nil
+	}
+
+	_, err = db.writeConn.Exec(ddl)
+	if err != nil {
+		Error.Printf("%++v", err)
+		return err
+	}
+
+	return nil
+}
+
 func (db *DB) Close() error {
 	err := db.writeConn.Close()
 	if err != nil {
--- a/food.ddl
+++ b/food.ddl
@@ -5,7 +5,6 @@ create table weight (
 	weight real not null
 );

-
 create index weightDateIdx on weight(date);
 create index weightDailyIdx on weight(strftime('%Y-%m-%d', date));
 create index weightWeeklyIdx on weight(strftime('%Y-%W', date));
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,12 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
-    <meta charset="UTF-8"/>
-    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
+    <meta charset="UTF-8" />
+    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
    <title>calorie-counter</title>
 </head>
+
 <body>
-<div id="app"></div>
-<script src="./src/main.ts" type="module"></script>
+    <div id="app"></div>
+    <script src="./src/main.ts" type="module"></script>
 </body>
-</html>
+
+</html>
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -1,9 +1,30 @@
 <script lang="ts">
 	import Header from "$lib/components/Header.svelte";
 	import Router from "$lib/router/Router.svelte";
-	import { Toaster } from 'svelte-sonner'
+	import { Close } from "$wails/main/App";
+	import { Toaster } from "svelte-sonner";
+	import * as srouter from "svelte-spa-router";
+	import { location } from "svelte-spa-router";
+
+	function keyDown(event: KeyboardEvent) {
+		if (event.ctrlKey && event.key == "r") {
+			window.location.reload();
+		}
+		if (event.ctrlKey && event.key == "w") {
+			Close();
+		}
+		if (event.ctrlKey && event.key == "Tab") {
+			if ($location == "/") {
+				srouter.replace("/Weight");
+			} else if ($location == "/Weight") {
+				srouter.replace("/");
+			}
+		}
+	}
 </script>

+<svelte:window on:keydown={keyDown} />
+
 <Toaster />
 <template>
 	<Header />
--- a/frontend/src/lib/components/Energy/EmptyFoodComp.svelte
+++ b/frontend/src/lib/components/Energy/EmptyFoodComp.svelte
@@ -19,6 +19,7 @@
 	let per100: string = "";
 	let per100Edited: boolean = false;
 	let per100Element: HTMLTableCellElement;
+	let nameElement: HTMLTableCellElement;

 	async function update(event: KeyboardEvent & { currentTarget: EventTarget & HTMLTableCellElement }) {
 		name = name.trim();
@@ -26,7 +27,7 @@
 		description = description.trim();
 		per100 = per100.trim();

-		if (!per100Edited && event.currentTarget === per100Element) per100Edited = true;
+		if (!per100Edited && event.currentTarget == per100Element) per100Edited = true;

 		if (event.key == "Enter") {
 			event.preventDefault();
@@ -48,6 +49,7 @@
 			}

 			foodStore.update((value) => [res.data, ...value]);
+			nameElement.focus();
 		}

 		if (!per100Edited)
@@ -75,6 +77,7 @@
 			contenteditable="true"
 			autofocus
 			on:keydown={update}
+			bind:this={nameElement}
 		>
 		</td>
 		<td
--- a/frontend/src/lib/components/Energy/EnergyToday.svelte
+++ b/frontend/src/lib/components/Energy/EnergyToday.svelte
@@ -34,16 +34,18 @@
 		remainingToday = $settingsStore.target;
 		let now = new Date();
 		let todayDate = formatter.format(now);
-		const [day, month, year] = todayDate.split('/');
+		const [day, month, year] = todayDate.split("/");
 		todayDate = `${year}-${month}-${day}`;

-		$foodStore.forEach((food) => {
-			if (food.date.split("T")[0] == todayDate) {
-				remainingToday -= food.energy;
-			} else {
-				return;
-			}
-		});
+		if ($foodStore) {
+			$foodStore.forEach((food) => {
+				if (food.date.split("T")[0] == todayDate) {
+					remainingToday -= food.energy;
+				} else {
+					return;
+				}
+			});
+		}
 		remainingToday = Math.round(remainingToday);
 		computeColor();
 	}
--- a/frontend/src/lib/components/Energy/FoodTable.svelte
+++ b/frontend/src/lib/components/Energy/FoodTable.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
-	import { GenerateColor } from "$lib/utils";
+	import { GenerateColor, RemoveExistingColors } from "$lib/utils";
 	import { main } from "$wails/models";
 	import EmptyFoodComp from "./EmptyFoodComp.svelte";
 	import FoodComp from "./FoodComp.svelte";

 	export let items: main.Food[] = [];
+	RemoveExistingColors();

 	let minCal = 1e5;
 	let maxCal = 0;
--- a/frontend/src/lib/components/Header.svelte
+++ b/frontend/src/lib/components/Header.svelte
@@ -1,9 +1,10 @@
 <script lang="ts">
 	import { link, location } from "svelte-spa-router";
-	import { faGear } from "@fortawesome/free-solid-svg-icons";
+	import { faGear} from "@fortawesome/free-solid-svg-icons";
 	import Fa from "svelte-fa";
 	import Settings from "./Settings/Settings.svelte";
 	import EnergyToday from "./Energy/EnergyToday.svelte";
+	import RefreshComponent from "./RefreshComponent.svelte";
 	Fa;

 	type Link = {
@@ -88,6 +89,7 @@
 			<Fa icon={faGear} scale={2} />
 		</button>
 	</div>
+	<RefreshComponent />
 	<EnergyToday />
 </header>

--- a/frontend/src/lib/components/RefreshComponent.svelte
+++ b/frontend/src/lib/components/RefreshComponent.svelte
@@ -0,0 +1,42 @@
+<script lang="ts">
+	import { dailyFoodStore } from "$lib/store/Energy/dailyFoodStore";
+	import { monthlyFoodStore } from "$lib/store/Energy/monthlyFoodStore";
+	import { weeklyFoodStore } from "$lib/store/Energy/weeklyFoodStore";
+	import { yearlyFoodStore } from "$lib/store/Energy/yearlyFoodStore";
+	import { dailyWeightStore } from "$lib/store/Weight/dailyWeightStore";
+	import { monthlyWeightStore } from "$lib/store/Weight/monthlyWeightStore";
+	import { weeklyWeightStore } from "$lib/store/Weight/weeklyWeightStore";
+	import { yearlyWeightStore } from "$lib/store/Weight/yearlyWeightStore";
+	import { faRefresh } from "@fortawesome/free-solid-svg-icons";
+	import Fa from "svelte-fa";
+	Fa;
+
+	// YES refresh DOES exist FFS
+	function refreshStores() {
+		// @ts-ignore
+		dailyFoodStore.refresh();
+		// @ts-ignore
+		weeklyFoodStore.refresh();
+		// @ts-ignore
+		monthlyFoodStore.refresh();
+		// @ts-ignore
+		yearlyFoodStore.refresh();
+		// @ts-ignore
+		dailyWeightStore.refresh();
+		// @ts-ignore
+		weeklyWeightStore.refresh();
+		// @ts-ignore
+		monthlyWeightStore.refresh();
+		// @ts-ignore
+		yearlyWeightStore.refresh();
+	}
+</script>
+
+<template>
+	<!-- svelte-ignore a11y-click-events-have-key-events -->
+	<div class="absolute right-20 pt-4 pb-4 pr-8 pl-8 cursor-pointer" on:click={refreshStores}>
+		<button>
+			<Fa icon={faRefresh} scale={2} />
+		</button>
+	</div>
+</template>
--- a/frontend/src/lib/components/Weight/WeightTable.svelte
+++ b/frontend/src/lib/components/Weight/WeightTable.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
-	import { GenerateColor } from "$lib/utils";
+	import { GenerateColor, RemoveExistingColors } from "$lib/utils";
 	import EmptyWeightComp from "$components/Weight/EmptyWeightComp.svelte";
 	import WeightComp from "$components/Weight/WeightComp.svelte";
 	import { main } from "$wails/models";

 	export let items: main.Weight[] = [];
+	RemoveExistingColors();

 	const dateColors: Map<string, string> = new Map<string, string>();

--- a/frontend/src/lib/router/routes/Weight/Weight.svelte
+++ b/frontend/src/lib/router/routes/Weight/Weight.svelte
@@ -4,7 +4,6 @@

 	let forceUpdate = false;
 	weightStore.subscribe(() => {
-		console.log("updte");
 		forceUpdate = !forceUpdate;
 	});
 </script>
--- a/frontend/src/lib/utils.ts
+++ b/frontend/src/lib/utils.ts
@@ -68,8 +68,11 @@ function GenerateRandomHSL(): Color {

 const existingColors: Color[] = [];

+function RemoveExistingColors() {
+	existingColors.length = 0;
+}
 function GenerateColor(): string {
-	const minDistance = 15;
+	const minDistance = 5;

 	let newColor: Color;
 	let isDistinct = false;
@@ -89,7 +92,9 @@ function GenerateColor(): string {
 				break;
 			}
 		}
-		existingColors.push(newColor);
+		if (isDistinct) {
+			existingColors.push(newColor);
+		}
 	}

 	// We can not reach this point without having a color generated
@@ -104,5 +109,5 @@ function LerpColor(color1: Color, color2: Color, t: number): Color {
 	return { h, s, l };
 }

-export { GenerateColor, LerpColor };
+export { GenerateColor, LerpColor, RemoveExistingColors };
 export type { Color };
--- a/frontend/wailsjs/go/main/App.d.ts
+++ b/frontend/wailsjs/go/main/App.d.ts
@@ -2,6 +2,8 @@
 // This file is automatically generated. DO NOT EDIT
 import {main} from '../models';

+export function Close():Promise<void>;
+
 export function CreateFood(arg1:main.Food):Promise<main.WailsFood1>;

 export function CreateWeight(arg1:main.Weight):Promise<main.WailsWeight1>;
--- a/frontend/wailsjs/go/main/App.js
+++ b/frontend/wailsjs/go/main/App.js
@@ -2,6 +2,10 @@
 // Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
 // This file is automatically generated. DO NOT EDIT

+export function Close() {
+  return window['go']['main']['App']['Close']();
+}
+
 export function CreateFood(arg1) {
  return window['go']['main']['App']['CreateFood'](arg1);
 }
--- a/main.go
+++ b/main.go
@@ -7,6 +7,7 @@ import (
 	"io"
 	"log"
 	"os"
+	_ "embed"

 	"github.com/wailsapp/wails/v2"
 	"github.com/wailsapp/wails/v2/pkg/options"
@@ -39,6 +40,9 @@ var (
 	weightService   *WeightService
 )

+//go:embed food.ddl
+var foodDDL string
+
 // TODO: Embed food.ddl and create DB if no exists
 // TODO: Add averages to graphs (ie. R2) https://stackoverflow.com/questions/60622195/how-to-draw-a-linear-regression-line-in-chart-js
 func main() {
@@ -52,6 +56,7 @@ func main() {
 		os.Exit(1)
 	}
 	defer db.Close()
+	db.Init(foodDDL)

 	settingsService = &SettingsService{db: &db}
 	err = settingsService.LoadSettings()
Author	SHA1	Message	Date
PhatPhuckDave	d290cae3f7	Auto focus input element after inserting food	2024-08-10 19:39:36 +02:00
PhatPhuckDave	376201373e	Improve and fix issues with color generation	2024-08-10 19:36:26 +02:00
PhatPhuckDave	84002d1856	Implement ctrl-tab navigation between weight and energy	2024-08-10 19:36:17 +02:00
PhatPhuckDave	3118069297	Implement refresh on ctrl-r and close on ctrl-w	2024-08-10 19:22:19 +02:00
PhatPhuckDave	80fb660677	Add refresh button for aggregate stores	2024-08-10 14:03:20 +02:00
PhatPhuckDave	de461cb031	Fix issue with crashing when having no entries today	2024-08-10 13:51:04 +02:00
PhatPhuckDave	6d684b34ef	Implement DB auto init	2024-08-10 01:03:11 +02:00