first commit
This commit is contained in:
@@ -0,0 +1,80 @@
|
||||
<script>
|
||||
import GoalEntry from "../components/GoalEntry.svelte";
|
||||
import ProjectEntry from "../components/ProjectEntry.svelte";
|
||||
import { fpGoalStore } from "../stores/goal";
|
||||
import { fpProjectStore } from "../stores/project";
|
||||
|
||||
$: {
|
||||
if ($fpGoalStore.stale && !$fpGoalStore.loading) {
|
||||
fpGoalStore.load({
|
||||
maxTime: new Date(Date.now() + (86400000 * 30)),
|
||||
minTime: new Date(Date.now() - (86400000 * 3)),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
$: {
|
||||
if ($fpProjectStore.stale && !$fpProjectStore.loading) {
|
||||
fpProjectStore.load({
|
||||
active: true,
|
||||
expiring: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="page">
|
||||
<div class="left">
|
||||
{#if !$fpGoalStore.loading || $fpGoalStore.goals.length > 0}
|
||||
<h1>Active Goals</h1>
|
||||
{/if}
|
||||
{#each $fpGoalStore.goals as goal (goal.id)}
|
||||
<GoalEntry goal={goal} />
|
||||
{/each}
|
||||
</div>
|
||||
<div class="right">
|
||||
{#if !$fpProjectStore.loading || $fpProjectStore.projects.length > 0}
|
||||
<h1>Upcoming Deadlines</h1>
|
||||
{/if}
|
||||
{#each $fpProjectStore.projects as project (project.id)}
|
||||
<ProjectEntry project={project} />
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div.page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
padding: 0 1ch;
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
div.left, div.right {
|
||||
width: 50%;
|
||||
padding: 0 1ch;
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.5em;
|
||||
font-weight: 100;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
div.page {
|
||||
display: block;
|
||||
}
|
||||
div.left, div.right {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
padding-bottom: 2em;
|
||||
max-width: 100%;
|
||||
width: 640px;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,34 @@
|
||||
<script lang="ts">
|
||||
import Boi from "../components/Boi.svelte";
|
||||
import GoalEntry from "../components/GoalEntry.svelte";
|
||||
import type { ModalData } from "../stores/modal";
|
||||
import goalStore from "../stores/goal";
|
||||
|
||||
const mdGoalAdd: ModalData = {name: "goal.add"};
|
||||
|
||||
let minTime = new Date(Date.now() - 366 * 86400000);
|
||||
|
||||
$: {
|
||||
if ($goalStore.stale && !$goalStore.loading) {
|
||||
goalStore.load({minTime});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="page">
|
||||
{#each $goalStore.goals as goal (goal.id)}
|
||||
<GoalEntry showAllOptions goal={goal} />
|
||||
{/each}
|
||||
<Boi open={mdGoalAdd}>Add Goal</Boi>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div.page {
|
||||
display: block;
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
width: 640px;
|
||||
margin-top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,32 @@
|
||||
<script lang="ts">
|
||||
import Boi from "../components/Boi.svelte";
|
||||
import GroupEntry from "../components/GroupEntry.svelte";
|
||||
import type { ModalData } from "../stores/modal";
|
||||
import groupStore from "../stores/group";
|
||||
|
||||
const mdGroupAdd: ModalData = {name: "group.add"};
|
||||
|
||||
$: {
|
||||
if ($groupStore.stale && !$groupStore.loading) {
|
||||
groupStore.load();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="page">
|
||||
{#each $groupStore.groups as group (group.id)}
|
||||
<GroupEntry showAllOptions group={group} />
|
||||
{/each}
|
||||
<Boi open={mdGroupAdd}>Add Group</Boi>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div.page {
|
||||
display: block;
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
width: 640px;
|
||||
margin-top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,105 @@
|
||||
<script lang="ts">
|
||||
import LogEntry from "../components/LogEntry.svelte";
|
||||
import type { LogResult } from "../models/log";
|
||||
import logStore from "../stores/logs";
|
||||
import { formatDate, formatTime, formatWeekdayDate } from "../utils/time";
|
||||
import Boi from "../components/Boi.svelte";
|
||||
|
||||
let groupedLogs: {day: number, text: string, logs: LogResult[]}[] = [];
|
||||
let earliestDate = $logStore.filter.minTime || new Date(Date.now() - (86400000*30));
|
||||
|
||||
function loadMore() {
|
||||
if (!$logStore.stale && !$logStore.loading) {
|
||||
earliestDate = new Date(earliestDate.getTime() - (86400000*30));
|
||||
logStore.markStale();
|
||||
}
|
||||
}
|
||||
|
||||
$: {
|
||||
if ($logStore.stale && !$logStore.loading) {
|
||||
logStore.load({
|
||||
minTime: earliestDate,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
$: {
|
||||
if (!$logStore.loading) {
|
||||
groupedLogs = [];
|
||||
|
||||
if ($logStore.logs.length > 0) {
|
||||
const now = new Date();
|
||||
const firstUtc = Math.floor(Date.parse($logStore.logs[0].loggedTime) / 86400000) * 86400000;
|
||||
const todayUtc = Math.floor(now.getTime() / 86400000) * 86400000;
|
||||
const first = firstUtc + (now.getTimezoneOffset() * 60000);
|
||||
const today = todayUtc + (now.getTimezoneOffset() * 60000);
|
||||
const yesterday = today - 86400000;
|
||||
const tomorrow = today + 86400000;
|
||||
|
||||
let currentDay = first;
|
||||
let remainingLogs = $logStore.logs;
|
||||
|
||||
while (remainingLogs.length > 0) {
|
||||
const currentLogs: LogResult[] = [];
|
||||
for (const log of remainingLogs) {
|
||||
if (Date.parse(log.loggedTime) >= currentDay) {
|
||||
currentLogs.push(log);
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (currentLogs.length > 0) {
|
||||
remainingLogs = remainingLogs.slice(currentLogs.length);
|
||||
|
||||
let text = formatWeekdayDate(currentDay);
|
||||
if (currentDay === tomorrow) {
|
||||
text = "Tomorrow";
|
||||
} else if (currentDay === today) {
|
||||
text = "Today";
|
||||
} else if (currentDay === yesterday) {
|
||||
text = "Yesterday";
|
||||
}
|
||||
|
||||
groupedLogs.push({day: currentDay, text, logs: currentLogs});
|
||||
}
|
||||
|
||||
currentDay -= 86400000;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="page">
|
||||
{#each groupedLogs as logGroup (logGroup.day)}
|
||||
<h2>{logGroup.text}</h2>
|
||||
{#each logGroup.logs as log (log.id)}
|
||||
<LogEntry log={log} />
|
||||
{/each}
|
||||
{/each}
|
||||
{#if !$logStore.loading && !$logStore.stale}
|
||||
<Boi on:click={loadMore}>Load More</Boi>
|
||||
{:else}
|
||||
<Boi disabled>Loading...</Boi>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div.page {
|
||||
display: block;
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
width: 640px;
|
||||
margin-top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.5em;
|
||||
font-weight: 100;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
margin-top: 1em;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,34 @@
|
||||
<script lang="ts">
|
||||
import Boi from "../components/Boi.svelte";
|
||||
import ProjectEntry from "../components/ProjectEntry.svelte";
|
||||
import type { ModalData } from "../stores/modal";
|
||||
import projectStore from "../stores/project";
|
||||
|
||||
const mdProjectAdd: ModalData = {name: "project.add"};
|
||||
|
||||
$: {
|
||||
if ($projectStore.stale && !$projectStore.loading) {
|
||||
projectStore.load({
|
||||
active: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="page">
|
||||
{#each $projectStore.projects as project (project.id)}
|
||||
<ProjectEntry showAllOptions project={project} />
|
||||
{/each}
|
||||
<Boi open={mdProjectAdd}>Add Project</Boi>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div.page {
|
||||
display: block;
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
width: 640px;
|
||||
margin-top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user