add project start time.

svelte-ui/src/components/DaysLeft.svelte

@@ -72,7 +72,7 @@
   {:else if (started)}
     <span class:danger class="started">{amountStr}{compact ? "" : " "}{unit} {!compact ? "left" : ""}</span>
   {:else}
-    <span class="pending">In {amountStr}{compact ? "" : " "}{unit}</span>
+    <span class="pending">{compact ? "" : "In "}{amountStr}{compact ? "" : " "}{unit}</span>
   {/if}
 </span>
 

svelte-ui/src/components/DeadlineSelect.svelte

@@ -75,17 +75,17 @@
 
       options.push({
         id: "this_year",
-        label: "This Year",
+        label: "End of this year",
         value: endOfYear(now),
       });
       options.push({
         id: "next_year",
-        label: "Next Year",
+        label: "End of next year",
         value: endOfYear(new Date(Date.now() + (365.25 * 86400000))),
       });
       options.push({
         id: "last_year",
-        label: "Last Year",
+        label: "End of last year",
         value: endOfYear(new Date(Date.now() - (365.25 * 86400000))),
       });
 

svelte-ui/src/components/ProgressNumbers.svelte

@@ -24,9 +24,9 @@
       progressTarget = Math.max((project.tasks||[]).map(t => t.itemAmount * (t.item.groupWeight || 1)).reduce((n,m) => n+m, 0), 1);
     
       if (project.endTime) {
-        const start = Date.parse(project.createdTime);
+        const start = Date.parse(project.startTime || project.createdTime);
         const end = Date.parse(project.endTime);
-        const now = Math.min(Date.now(), end);
+        const now = Math.max(Math.min(Date.now(), end), start);
 
         timeProgress = (now - start) / (end - start);
       } else {
@@ -37,7 +37,7 @@
     if (goal != null) {
       const start = Date.parse(goal.startTime);
       const end = Date.parse(goal.endTime);
-      const now = Math.min(Date.now(), end);
+      const now = Math.max(Math.min(Date.now(), end), start);
 
       progressAmount = goal.completedAmount;
       progressTarget = goal.amount;

svelte-ui/src/components/QLListItem.svelte

@@ -33,7 +33,7 @@
         <div class="content">{project.name}</div>
         {#if project.endTime}
           <div class="times">
-            <DaysLeft compact startTime={project.createdTime} endTime={project.endTime} />
+            <DaysLeft compact startTime={project.startTime || project.createdTime} endTime={project.endTime} />
           </div>
         {/if}
       </div>

svelte-ui/src/components/StartTimeSelect.svelte

@@ -0,0 +1,118 @@
+<script lang="ts">
+  import { onMount } from "svelte";
+  import { startOfMonth, startOfWeek, startOfYear, formatFormTime, lastMonth, nextMonth } from "../utils/time";
+  import EveryMinute from "./EveryMinute.svelte";
+
+  interface DateOption {
+    id: string
+    label: string
+    value: Date
+  }
+
+  export let value: string;
+  export let disabled: boolean;
+
+  let selected: string = "custom";
+  let options: DateOption[] = [];
+  let now: Date = new Date();
+
+  onMount(() => {
+    if (value === "") {
+      selected = "none";
+      return;
+    }
+
+    for (const option of options) {
+      if (formatFormTime(option.value) === value) {
+        selected = option.id;
+      }
+    }
+  });
+
+  $: {
+    if (options.length === 0) {
+      let current = startOfMonth(now);
+      const nextWeek = new Date(now.getTime() + (86400000 * 7));
+      const lastWeek = new Date(now.getTime() - (86400000 * 7));
+
+      options.push({
+        id: "none",
+        label: "Project's creation date",
+        value: new Date(Number.NaN),
+      });
+
+      options.push({
+        id: "this_week",
+        label: "Start of this Week",
+        value: startOfWeek(now),
+      });
+      options.push({
+        id: "next_week",
+        label: "Start of next Week",
+        value: startOfWeek(nextWeek),
+      });
+      options.push({
+        id: "last_week",
+        label: "Start of last Week",
+        value: startOfWeek(lastWeek),
+      });
+
+      options.push({
+        id: "this_month",
+        label: "Start of this month",
+        value: startOfMonth(current),
+      });
+      options.push({
+        id: "next_month",
+        label: "Start of next month",
+        value: startOfMonth(nextMonth(current)),
+      });
+      options.push({
+        id: "last_month",
+        label: "Start of last month",
+        value: startOfMonth(lastMonth(current)),
+      });
+
+      options.push({
+        id: "this_year",
+        label: "Beginning of this year",
+        value: startOfYear(now),
+      });
+      options.push({
+        id: "next_year",
+        label: "Beginning of next year",
+        value: startOfYear(new Date(Date.now() + (365.25 * 86400000))),
+      });
+      options.push({
+        id: "last_year",
+        label: "Beginning of last year",
+        value: startOfYear(new Date(Date.now() - (365.25 * 86400000))),
+      });
+
+      options.push({
+        id: "custom",
+        label: "Specific Date",
+        value: null,
+      });
+    }
+  }
+
+  $: {
+    if (selected !== "custom") {
+      const option = options.find(o => o.id === selected);
+      if (option != null) {
+        value = formatFormTime(option.value);
+      }
+    }
+  }
+</script>
+
+<EveryMinute bind:now={now} />
+<select name="endTime" disabled={disabled} bind:value={selected}>
+  {#each options as option (option.id)}
+    <option value={option.id}>{option.label}</option>
+  {/each}
+</select>
+{#if selected === "custom"}
+  <input disabled={disabled} name="value" type="datetime-local" bind:value={value} />
+{/if}

svelte-ui/src/forms/ProjectForm.svelte

@@ -4,6 +4,7 @@
   import DeadlineSelect from "../components/DeadlineSelect.svelte";
   import IconSelect from "../components/IconSelect.svelte";
   import Modal from "../components/Modal.svelte";
+  import StartTimeSelect from "../components/StartTimeSelect.svelte";
   import StatusTagSelect from "../components/StatusTagSelect.svelte";
   import { DEFAULT_ICON } from "../external/icons";
   import type { ProjectResult } from "../models/project";
@@ -34,6 +35,7 @@
     throw new Error("Wrong form")
   }
 
+  let startTime = formatFormTime(project.startTime);
   let endTime = formatFormTime(project.endTime);
   let name = project.name;
   let description = project.description;
@@ -52,6 +54,7 @@
     if (creation) {
       stuffLogClient.createProject({
         active: statusTag === "",
+        startTime: ( startTime == "" ) ? null : new Date(startTime),
         endTime: ( endTime == "" ) ? null : new Date(endTime),
         statusTag: statusTag !== "" ? statusTag : null,
 
@@ -77,6 +80,8 @@
       stuffLogClient.updateProject(project.id, {
         endTime: ( endTime == "" ) ? null : new Date(endTime),
         clearEndTime: ( endTime == "" ),
+        startTime: ( startTime == "" ) ? null : new Date(startTime),
+        clearStartTime: ( startTime == "" ),
         active: statusTag === "",
         statusTag: statusTag || null,
         clearStatusTag: statusTag === "",
@@ -111,6 +116,10 @@
     <IconSelect disabled={deletion} bind:value={icon} />
     <label for="endTime">Deadline (Optional)</label>
     <DeadlineSelect disabled={deletion} bind:value={endTime} />
+    {#if endTime != ""}
+      <label for="endTime">Start time (Optional)</label>
+      <StartTimeSelect disabled={deletion} bind:value={startTime} />
+    {/if}
     <label for="statusTag">Status</label>
     <StatusTagSelect disabled={deletion} isProject bind:value={statusTag} />
 

svelte-ui/src/models/project.ts

@@ -9,6 +9,7 @@ export default interface Project {
   active: boolean
   createdTime: string
   favorite: boolean
+  startTime?: string
   endTime?: string
   statusTag?: string
 }
@@ -29,6 +30,7 @@ export interface ProjectInput {
   description: string
   icon: IconName
   active: boolean
+  startTime?: string | Date
   endTime?: string | Date
   statusTag?: string
   favorite?: boolean
@@ -39,6 +41,8 @@ export interface ProjectUpdate {
   description?: string
   icon?: string
   active?: boolean
+  startTime?: string | Date
+  clearStartTime?: boolean
   endTime?: string | Date
   clearEndTime?: boolean
   statusTag?: string