dave/calorie-counter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 16 Wiki Activity

Code format

Browse Source
This commit is contained in:
PhatPhuckDave
2024-11-08 10:36:24 +01:00
parent 31c7b31e65
commit fc688bf4bc
20 changed files with 230 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/lib/components/Energy/Aggregated/AggregatedFoodComp.svelte
View File

@@ -1,13 +1,15 @@
<script lang="ts">
import { main } from "$wails/models";
export let item: main.AggregatedFood
export let item: main.AggregatedFood;
</script>
<template>
<tr class="border-b border-gray-200 dark:border-gray-700">
<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
scope="row">
<th
class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
scope="row"
>
{item.period}
</th>
<td class="px-6 py-4">

42
frontend/src/lib/components/Energy/Aggregated/AggregatedFoodTable.svelte
View File

@@ -90,49 +90,51 @@
<template>
<div class="flex flex-col gap-6 p-6 bg-gray-900 min-h-screen">
<div class="bg-gray-800 rounded-lg p-6 shadow-lg border border-gray-700">
<Line {data}
<Line
{data}
options={{
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
position: 'top',
position: "top",
labels: {
padding: 20,
color: 'rgb(229, 231, 235)',
color: "rgb(229, 231, 235)",
font: {
size: 12,
family: "'Nunito', sans-serif"
}
}
}
family: "'Nunito', sans-serif",
},
},
},
},
scales: {
y: {
grid: {
color: 'rgba(75, 85, 99, 0.2)'
color: "rgba(75, 85, 99, 0.2)",
},
ticks: {
color: 'rgb(229, 231, 235)',
color: "rgb(229, 231, 235)",
font: {
family: "'Nunito', sans-serif"
}
}
family: "'Nunito', sans-serif",
},
},
},
x: {
grid: {
color: 'rgba(75, 85, 99, 0.2)'
color: "rgba(75, 85, 99, 0.2)",
},
ticks: {
color: 'rgb(229, 231, 235)',
color: "rgb(229, 231, 235)",
font: {
family: "'Nunito', sans-serif"
}
}
}
}
family: "'Nunito', sans-serif",
},
},
},
},
}}
class="max-h-[50vh] h-[50vh]" />
class="max-h-[50vh] h-[50vh]"
/>
</div>
<div class="relative flex flex-col h-[43vh]" data-vaul-drawer-wrapper id="page">
<div class="relative overflow-x-auto shadow-md rounded-lg">

5
frontend/src/lib/components/Energy/EnergyToday.svelte
View File

@@ -57,7 +57,10 @@
</script>
<template>
<div class="px-6 py-3 text-3xl font-bold rounded-lg bg-gray-800/50 shadow-lg border border-gray-700" style="color: {color}">
<div
class="px-6 py-3 text-3xl font-bold rounded-lg bg-gray-800/50 shadow-lg border border-gray-700"
style="color: {color}"
>
<span class="mr-2">{remainingToday}</span>
<span class="text-lg text-gray-400">kcal remaining</span>
</div>

92
frontend/src/lib/components/Energy/FoodComp.svelte
View File

@@ -1,84 +1,94 @@
<script lang="ts">
import { UpdateFood } from '$wails/main/App';
import {main} from '$wails/models'
import { toast } from 'svelte-sonner'
import { UpdateFood } from "$wails/main/App";
import { main } from "$wails/models";
import { toast } from "svelte-sonner";
export let item: main.Food
export let energyColor: string
export let nameColor: string
export let dateColor: string
export let item: main.Food;
export let energyColor: string;
export let nameColor: string;
export let dateColor: string;
let amount: string = item.amount.toString()
let per100: string = item.per100?.toString() ?? ''
let description: string = item.description ?? ''
let name: string = item.food
let amount: string = item.amount.toString();
let per100: string = item.per100?.toString() ?? "";
let description: string = item.description ?? "";
let name: string = item.food;
async function update(event: KeyboardEvent & { currentTarget: (EventTarget & HTMLTableCellElement) }) {
if (event.key == 'Enter') {
event.preventDefault()
await updateItem()
async function update(event: KeyboardEvent & { currentTarget: EventTarget & HTMLTableCellElement }) {
if (event.key == "Enter") {
event.preventDefault();
await updateItem();
}
}
async function focusOutUpdate() {
await updateItem()
await updateItem();
}
async function updateItem() {
amount = amount.trim()
per100 = per100.trim()
description = description.trim()
name = name.trim()
amount = amount.trim();
per100 = per100.trim();
description = description.trim();
name = name.trim();
item.food = name
item.description = description
item.amount = parseInt(amount)
item.per100 = parseInt(per100)
item.food = name;
item.description = description;
item.amount = parseInt(amount);
item.per100 = parseInt(per100);
const res = await UpdateFood(item)
const res = await UpdateFood(item);
if (!res.success) {
toast.error(`failed to update food item with error ${res.error}`)
toast.error(`failed to update food item with error ${res.error}`);
} else {
item = res.data
item = res.data;
}
name = item.food
description = item.description ?? ''
amount = item.amount.toString()
per100 = item.per100?.toString() ?? ''
name = item.food;
description = item.description ?? "";
amount = item.amount.toString();
per100 = item.per100?.toString() ?? "";
}
</script>
<template>
<tr class="border-b border-gray-200 dark:border-gray-700 font-bold text-lg">
<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
<th
class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
style="color: {dateColor}"
scope="row">
scope="row"
>
{item.date}
</th>
<td class="px-6 py-4"
<td
class="px-6 py-4"
style="color: {nameColor}"
contenteditable="true"
bind:innerText={name}
on:focusout={focusOutUpdate}
on:keydown={update}>
on:keydown={update}
>
</td>
<td class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
<td
class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
contenteditable="true"
bind:innerText={description}
on:focusout={focusOutUpdate}
on:keydown={update}>
on:keydown={update}
>
</td>
<td class="px-6 py-4"
<td
class="px-6 py-4"
contenteditable="true"
bind:innerText={amount}
on:focusout={focusOutUpdate}
on:keydown={update}>
on:keydown={update}
>
</td>
<td class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
<td
class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
contenteditable="true"
bind:innerText={per100}
on:focusout={focusOutUpdate}
on:keydown={update}>
on:keydown={update}
>
</td>
<td class="px-6 py-4" style="color: {energyColor}">
{item.energy}

2
frontend/src/lib/components/Settings/Setting.svelte
View File

@@ -18,7 +18,7 @@
if (!res.success) {
toast.error(`Failed to set setting with error ${res.error}`);
editSetting = String(setting);
return
return;
}
setting = numSetting;
settingsStore.update((store) => {

2
frontend/src/lib/components/Settings/Settings.svelte
View File

@@ -11,7 +11,7 @@
<div class="flex flex-2 flex-col gap-4 text-left text-xl">
{#each Object.keys($settingsStore) as key}
<Setting key={key} setting={$settingsStore[key]} />
<Setting {key} setting={$settingsStore[key]} />
{/each}
</div>
</Modal>

10
frontend/src/lib/components/Weight/Aggregated/AggregatedWeightComp.svelte
View File

@@ -1,13 +1,15 @@
<script lang="ts">
import {main} from '$wails/models'
import { main } from "$wails/models";
export let item: main.AggregatedWeight
export let item: main.AggregatedWeight;
</script>
<template>
<tr class="border-b border-gray-200 dark:border-gray-700">
<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
scope="row">
<th
class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
scope="row"
>
{item.period}
</th>
<td class="px-6 py-4">

42
frontend/src/lib/components/Weight/Aggregated/AggregatedWeightTable.svelte
View File

@@ -59,49 +59,51 @@
<template>
<div class="flex flex-col gap-6 p-6 bg-gray-900 min-h-screen">
<div class="bg-gray-800 rounded-lg p-6 shadow-lg border border-gray-700">
<Line {data}
<Line
{data}
options={{
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
position: 'top',
position: "top",
labels: {
padding: 20,
color: 'rgb(229, 231, 235)',
color: "rgb(229, 231, 235)",
font: {
size: 12,
family: "'Nunito', sans-serif"
}
}
}
family: "'Nunito', sans-serif",
},
},
},
},
scales: {
y: {
grid: {
color: 'rgba(75, 85, 99, 0.2)'
color: "rgba(75, 85, 99, 0.2)",
},
ticks: {
color: 'rgb(229, 231, 235)',
color: "rgb(229, 231, 235)",
font: {
family: "'Nunito', sans-serif"
}
}
family: "'Nunito', sans-serif",
},
},
},
x: {
grid: {
color: 'rgba(75, 85, 99, 0.2)'
color: "rgba(75, 85, 99, 0.2)",
},
ticks: {
color: 'rgb(229, 231, 235)',
color: "rgb(229, 231, 235)",
font: {
family: "'Nunito', sans-serif"
}
}
}
}
family: "'Nunito', sans-serif",
},
},
},
},
}}
class="max-h-[50vh] h-[50vh]" />
class="max-h-[50vh] h-[50vh]"
/>
</div>
<div class="relative flex flex-col h-[43vh]" data-vaul-drawer-wrapper id="page">
<div class="relative overflow-x-auto shadow-md rounded-lg">

48
frontend/src/lib/components/Weight/EmptyWeightComp.svelte
View File

@@ -1,34 +1,34 @@
<script lang="ts">
import { toast } from 'svelte-sonner'
import { toast } from "svelte-sonner";
import { main } from "$wails/models";
import { CreateWeight } from '$wails/main/App';
import { weightStore } from '$lib/store/Weight/weightStore';
import { CreateWeight } from "$wails/main/App";
import { weightStore } from "$lib/store/Weight/weightStore";
let item: main.Weight = {
weight: 0,
id: 0,
date: ''
}
let weight: string | null = null
date: "",
};
let weight: string | null = null;
async function update(event: KeyboardEvent & { currentTarget: (EventTarget & HTMLTableCellElement) }) {
if (!weight) return
weight = weight.trim()
async function update(event: KeyboardEvent & { currentTarget: EventTarget & HTMLTableCellElement }) {
if (!weight) return;
weight = weight.trim();
if (event.key == 'Enter') {
event.preventDefault()
item.weight = parseFloat(weight)
if (event.key == "Enter") {
event.preventDefault();
item.weight = parseFloat(weight);
if (isNaN(item.weight)) {
toast.error('Weight must be a number')
return
toast.error("Weight must be a number");
return;
}
const res = await CreateWeight(item)
weight = ''
const res = await CreateWeight(item);
weight = "";
if (!res.success) {
toast.error(`failed to create weight with error ${res.error}`)
return
toast.error(`failed to create weight with error ${res.error}`);
return;
}
console.log("update");
@@ -39,16 +39,20 @@
<template>
<tr class="border-b border-gray-200 dark:border-gray-700 text-lg font-bold">
<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
scope="row">
<th
class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
scope="row"
>
</th>
<td bind:innerText={weight}
<td
bind:innerText={weight}
class:border-[3px]={!weight}
class:border-red-600={!weight}
class="px-6 py-4 overflow-hidden"
contenteditable="true"
autofocus
on:keydown={update}>
on:keydown={update}
>
</td>
</tr>
</template>

10
frontend/src/lib/components/Weight/WeightComp.svelte
View File

@@ -1,15 +1,17 @@
<script lang="ts">
import { main } from "$wails/models";
export let item: main.Weight
export let dateColor: string
export let item: main.Weight;
export let dateColor: string;
</script>
<template>
<tr class="border-b border-gray-200 dark:border-gray-700 font-bold text-lg">
<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
<th
class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
style="color: {dateColor}"
scope="row">
scope="row"
>
{item.date}
</th>
<td class="px-6 py-4">

46
frontend/src/lib/router/Router.svelte
View File

@@ -1,29 +1,29 @@
<script lang="ts">
import Router from 'svelte-spa-router'
import Energy from './routes/Energy/Energy.svelte'
import Daily from './routes/Energy/Daily.svelte'
import Weekly from './routes/Energy/Weekly.svelte'
import Monthly from './routes/Energy/Monthly.svelte'
import Yearly from './routes/Energy/Yearly.svelte'
import Weight from './routes/Weight/Weight.svelte'
import WDaily from './routes/Weight/WDaily.svelte'
import WWeekly from './routes/Weight/WWeekly.svelte'
import WMonthly from './routes/Weight/WMonthly.svelte'
import WYearly from './routes/Weight/WYearly.svelte'
import Router from "svelte-spa-router";
import Energy from "./routes/Energy/Energy.svelte";
import Daily from "./routes/Energy/Daily.svelte";
import Weekly from "./routes/Energy/Weekly.svelte";
import Monthly from "./routes/Energy/Monthly.svelte";
import Yearly from "./routes/Energy/Yearly.svelte";
import Weight from "./routes/Weight/Weight.svelte";
import WDaily from "./routes/Weight/WDaily.svelte";
import WWeekly from "./routes/Weight/WWeekly.svelte";
import WMonthly from "./routes/Weight/WMonthly.svelte";
import WYearly from "./routes/Weight/WYearly.svelte";
const routes = {
'/': Energy,
'/Energy': Energy,
'/Energy/daily': Daily,
'/Energy/weekly': Weekly,
'/Energy/monthly': Monthly,
'/Energy/yearly': Yearly,
'/Weight': Weight,
'/Weight/daily': WDaily,
'/Weight/weekly': WWeekly,
'/Weight/monthly': WMonthly,
'/Weight/yearly': WYearly
}
"/": Energy,
"/Energy": Energy,
"/Energy/daily": Daily,
"/Energy/weekly": Weekly,
"/Energy/monthly": Monthly,
"/Energy/yearly": Yearly,
"/Weight": Weight,
"/Weight/daily": WDaily,
"/Weight/weekly": WWeekly,
"/Weight/monthly": WMonthly,
"/Weight/yearly": WYearly,
};
</script>
<Router {routes} />

6
frontend/src/lib/router/routes/Weight/WDaily.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
import { dailyWeightStore } from '$lib/store/Weight/dailyWeightStore'
import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
import { dailyWeightStore } from "$lib/store/Weight/dailyWeightStore";
</script>
<template>
<AggregatedWeightTable items="{$dailyWeightStore}" />
<AggregatedWeightTable items={$dailyWeightStore} />
</template>

6
frontend/src/lib/router/routes/Weight/WMonthly.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import { monthlyWeightStore } from '$lib/store/Weight/monthlyWeightStore'
import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
import { monthlyWeightStore } from "$lib/store/Weight/monthlyWeightStore";
import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
</script>
<template>
<AggregatedWeightTable items="{$monthlyWeightStore}" />
<AggregatedWeightTable items={$monthlyWeightStore} />
</template>

6
frontend/src/lib/router/routes/Weight/WWeekly.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import { weeklyWeightStore } from '$lib/store/Weight/weeklyWeightStore'
import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
import { weeklyWeightStore } from "$lib/store/Weight/weeklyWeightStore";
import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
</script>
<template>
<AggregatedWeightTable items="{$weeklyWeightStore}" />
<AggregatedWeightTable items={$weeklyWeightStore} />
</template>

6
frontend/src/lib/router/routes/Weight/WYearly.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
import { yearlyWeightStore } from '$lib/store/Weight/yearlyWeightStore'
import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
import { yearlyWeightStore } from "$lib/store/Weight/yearlyWeightStore";
</script>
<template>
<AggregatedWeightTable items="{$yearlyWeightStore}" />
<AggregatedWeightTable items={$yearlyWeightStore} />
</template>

1
frontend/src/lib/utils.ts
View File

@@ -1,7 +1,6 @@
import { cubicOut } from "svelte/easing";
import type { TransitionConfig } from "svelte/transition";
import regression from "regression";
import type { ChartData, Point } from "chart.js";
type FlyAndScaleParams = {
y?: number;

10
frontend/src/main.ts
View File

@@ -1,8 +1,8 @@
import './style.css'
import App from './App.svelte'
import "./style.css";
import App from "./App.svelte";
const app = new App({
target: document.getElementById('app')
})
target: document.getElementById("app"),
});
export default app
export default app;

8
frontend/src/style.css
View File

@@ -11,17 +11,15 @@ html {
body {
margin: 0;
color: white;
font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
"Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
"Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}
@font-face {
font-family: "Nunito";
font-style: normal;
font-weight: 400;
src: local(""),
url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
src: local(""), url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
}
#app {