spencer/baby-tracker
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added spitup; day/hour edits; fixed diaper/meal stats;

Browse source
This commit is contained in:
Spencer Flagg 2024-02-01 23:14:04 +01:00
parent 4b5d438ee7
commit 725bb127b0
4 changed files with 76 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/lib/components/Action.svelte
View file

@ -97,15 +97,28 @@
<h3>
{action.type} @{new Date(action.timestamp).toLocaleString('en-NL', {
hour: '2-digit',
minute: '2-digit'
minute: '2-digit',
weekday: 'short',
day: 'numeric'
})}
</h3>
</div>
<div class="dialog__middle">
<button class="button--edit-time" on:click={() => adjustTime(-5)}>-5</button>
<button class="button--edit-time" on:click={() => adjustTime(-1)}>-1</button>
<button class="button--edit-time" on:click={() => adjustTime(1)}>+1</button>
<button class="button--edit-time" on:click={() => adjustTime(5)}>+5</button>
<div>
<button class="button--edit-time" on:click={() => adjustTime(-5)}>-5m</button>
<button class="button--edit-time" on:click={() => adjustTime(-1)}>-1m</button>
<button class="button--edit-time" on:click={() => adjustTime(1)}>+1m</button>
<button class="button--edit-time" on:click={() => adjustTime(5)}>+5m</button>
</div>
<div>
<button class="button--edit-time" on:click={() => adjustTime(-1*60*24)}>-1d</button>
<button class="button--edit-time" on:click={() => adjustTime(-1*60)}>-1h</button>
<button class="button--edit-time" on:click={() => adjustTime(1*60)}>+1h</button>
<button class="button--edit-time" on:click={() => adjustTime(1*60*24)}>+1d</button>
</div>
<div>
(you can move an event to a different day, but it will disappear from the page)
</div>
<button class="button button-outline button--edit-time" on:click={deleteAction}>Delete</button>
</div>
<div class=""><button class="button--close" on:click={closeDialog}>Done Editing</button></div>

1
src/routes/+page.svelte
View file

@ -107,6 +107,7 @@
{#if isLastActionDiaper}
<button class="button--poop" on:click={() => recordAction('poop')}>Poop</button>
{/if}
<button class="button--spitup" on:click={() => recordAction('spitup')}>Spit-Up</button>
{/if}
</aside>

79
src/routes/stats/+page.svelte
View file

@ -105,25 +105,35 @@
return Math.round(totalSleepDuration / sleepDurations.length);
}
function calculateAvgDiaperChanges(actions: Action[]): number {
let diaperChangesPerDay = new Map<string, number>();
function calculateAvgDiaperChanges(actions: any[]): number {
const today = new Date().toDateString(); // Get today's date as a string
for (const action of actions) {
if (action.type === 'diaper') {
const actionDate = action.timestamp.split('T')[0]; // Extract the date part
diaperChangesPerDay.set(actionDate, (diaperChangesPerDay.get(actionDate) || 0) + 1);
}
}
// Filter actions by type "food" and exclude today's actions
const foodActions = actions.filter((action) => {
const actionDate = new Date(action.timestamp).toDateString(); // Convert timestamp to date string
return action.type === 'diaper' && actionDate !== today;
});
if (diaperChangesPerDay.size === 0) {
return 0;
// Group by date
const actionsByDate: { [key: string]: number } = {};
foodActions.forEach((action) => {
const date = new Date(action.timestamp).toDateString(); // Convert timestamp to date string
if (!actionsByDate[date]) {
actionsByDate[date] = 1;
} else {
actionsByDate[date]++;
}
});
const totalDiaperChanges = Array.from(diaperChangesPerDay.values()).reduce(
(total, count) => total + count,
0
);
return totalDiaperChanges / diaperChangesPerDay.size;
// Calculate total actions and number of days
const totalActions = foodActions.length;
const numberOfDays = Object.keys(actionsByDate).length;
// Calculate average actions per day, excluding today
const average = numberOfDays > 0 ? totalActions / numberOfDays : 0;
// Return the average to one decimal place
return parseFloat(average.toFixed(1));
}
function calculateAvgDaysBetweenPoops(actions: Action[]): number {
@ -154,28 +164,41 @@
return parseFloat((totalDays / (poopDates.length - 1)).toFixed(2));
}
function calculateAvgMealsPerDay(actions: Action[]): number {
let mealsPerDay = new Map<string, number>();
function calculateAvgMealsPerDay(actions: any[]): number {
const today = new Date().toDateString(); // Get today's date as a string
for (const action of actions) {
if (action.type === 'food') {
const actionDate = action.timestamp.split('T')[0]; // Extract the date part
mealsPerDay.set(actionDate, (mealsPerDay.get(actionDate) || 0) + 1);
}
}
// Filter actions by type "food" and exclude today's actions
const foodActions = actions.filter((action) => {
const actionDate = new Date(action.timestamp).toDateString(); // Convert timestamp to date string
return action.type === 'food' && actionDate !== today;
});
if (mealsPerDay.size === 0) {
return 0;
// Group by date
const actionsByDate: { [key: string]: number } = {};
foodActions.forEach((action) => {
const date = new Date(action.timestamp).toDateString(); // Convert timestamp to date string
if (!actionsByDate[date]) {
actionsByDate[date] = 1;
} else {
actionsByDate[date]++;
}
});
const totalMeals = Array.from(mealsPerDay.values()).reduce((total, count) => total + count, 0);
return totalMeals / mealsPerDay.size;
// Calculate total actions and number of days
const totalActions = foodActions.length;
const numberOfDays = Object.keys(actionsByDate).length;
// Calculate average actions per day, excluding today
const average = numberOfDays > 0 ? totalActions / numberOfDays : 0;
// Return the average to one decimal place
return parseFloat(average.toFixed(1));
}
</script>
<section>
<h2>Stats</h2>
<p>(let me know how broken these are)</p>
<p>(diapers and meals should be correct now)</p>
<ul>
<li>{stats.avgSleepPerNap} min / nap</li>
<li>{stats.avgNapsPerDay} naps / day</li>

7
src/styles/app.css
View file

@ -19,6 +19,9 @@
[class*='--diaper'] {
--color: #3f88c5;
}
[class*='--spitup'] {
--color: #7f8b96;
}
/* d00000 ff7d00 */
body {
@ -55,7 +58,9 @@ input[type='submit'] {
}
button,
input[type='submit'] {
input[type='submit'],
button:focus,
input[type='submit']:focus {
background-color: var(--color);
border-color: var(--color);
transition: all .2s ease-in-out;