Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
4103e1b0ca | ||
|
|
9d4a13c2c2 | ||
|
|
923f911472 | ||
|
|
272c4918b0 | ||
|
|
ff866cc514 | ||
|
|
e94d731c30 | ||
|
|
0aa0ec2989 | ||
|
|
21b60b007a | ||
|
|
7066e2e06e | ||
|
|
2b76a172e8 | ||
|
|
15495255ef | ||
|
|
3b9b68f4b1 | ||
|
|
7dcd475036 | ||
|
|
fc4877c3bd | ||
|
|
2da679d629 | ||
|
|
9e3f20b050 | ||
|
|
fa816b2e41 | ||
|
|
60d66b728e | ||
|
|
bae3b3505f | ||
|
|
7b1e7ba7c9 | ||
|
|
c0dbea10c5 | ||
|
|
a70ca93102 | ||
|
|
2bda3a26db | ||
|
|
8022502015 | ||
|
|
b07938e351 | ||
|
|
de95df44c1 | ||
|
|
2d7b6a1d5e | ||
|
|
4bbc49fe7e | ||
|
|
db2bf619ce | ||
|
|
6116ed2e21 | ||
|
|
1ba26ee723 | ||
|
|
fcedab0b19 | ||
|
|
72b6ea3803 | ||
|
|
4f25905d81 | ||
|
|
e3eeb3037c | ||
|
|
97e6be3afa | ||
|
|
d67b61d3c6 | ||
|
|
f0d18bb800 | ||
|
|
7f8d925299 |
@@ -24,9 +24,10 @@ Documentation: [`docs/`](docs/), built with Material for MkDocs.
|
|||||||
|
|
||||||
## Why this exists
|
## Why this exists
|
||||||
|
|
||||||
Todoist Pro, self-hosted, on your own hardware, with your own data — and with the
|
A fast, self-hosted task manager — projects, quick add, filters, notes and shared
|
||||||
integrations that a hosted product will not build for you: a real CalDAV server, a
|
lists — on your own hardware, with your own data, and with the integrations that a
|
||||||
mail-to-task address, and an MCP endpoint so Claude can work your task list directly.
|
hosted product will not build for you: a real CalDAV server, a mail-to-task address,
|
||||||
|
and an MCP endpoint so Claude can work your task list directly.
|
||||||
|
|
||||||
## What it does
|
## What it does
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
# Saved filters
|
# Saved filters
|
||||||
|
|
||||||
A filter is a small expression describing a slice of your tasks. The grammar is
|
A filter is a small expression describing a slice of your tasks. The grammar will
|
||||||
Todoist's, so if you are coming from there you already know it.
|
feel familiar if you have used query-based filters in other task apps.
|
||||||
|
|
||||||
```
|
```
|
||||||
today & p1
|
today & p1
|
||||||
|
|||||||
@@ -11,7 +11,8 @@ of. Which is what a to-do list is.
|
|||||||
|
|
||||||
## What it is for
|
## What it is for
|
||||||
|
|
||||||
Todoist Pro, on your own hardware, with your own data. And with the integrations a
|
A fast, self-hosted task manager — projects, quick add, filters, notes and shared
|
||||||
|
lists — on your own hardware, with your own data. And with the integrations a
|
||||||
hosted product will not build for you: a real CalDAV server, an address you can
|
hosted product will not build for you: a real CalDAV server, an address you can
|
||||||
forward mail to, and an MCP endpoint so Claude can work your task list directly.
|
forward mail to, and an MCP endpoint so Claude can work your task list directly.
|
||||||
|
|
||||||
@@ -22,15 +23,22 @@ forward mail to, and an MCP endpoint so Claude can work your task list directly.
|
|||||||
Firma, labelled regnskab. Danish and English, mixed freely in one line.
|
Firma, labelled regnskab. Danish and English, mixed freely in one line.
|
||||||
- **Projects, sections, sub-tasks, labels, [saved filters](filters.md).** List,
|
- **Projects, sections, sub-tasks, labels, [saved filters](filters.md).** List,
|
||||||
board and calendar views, and foldable groups over the projects in the sidebar.
|
board and calendar views, and foldable groups over the projects in the sidebar.
|
||||||
- **Notes, beside the work.** Rich text to write in, Markdown on disk. A note is
|
The calendar draws each task to its length — drag the foot to resize, the body
|
||||||
shared by filing it in a project; `#project` and `[[another note]]` are links,
|
to move it.
|
||||||
and a task shows what has been written about it.
|
- **Notes, beside the work.** Rich text to write in, Markdown on disk. Share a
|
||||||
|
single note with a person, or file it in a project; `#project` and
|
||||||
|
`[[another note]]` are links, and a task shows what has been written about it.
|
||||||
|
- **Delegate, and snooze.** Hand a task to somebody and it is marked with an
|
||||||
|
arrow to them, gathered on a *Waiting on others* page. Snooze one to park it,
|
||||||
|
greyed, at the foot of the list until a moment you pick — without touching when
|
||||||
|
it is due.
|
||||||
- **Drag where it means something** — reorder a list or a board, file a project
|
- **Drag where it means something** — reorder a list or a board, file a project
|
||||||
under a group, drop a task on another project, or drop it on another day.
|
under a group, drop a task on another project, or drop it on another day.
|
||||||
- **Sharing** with owner, editor and viewer roles. Anyone outside your instance
|
- **Sharing** with owner, editor and viewer roles. Anyone outside your instance
|
||||||
joins through an invite link.
|
joins through an invite link.
|
||||||
- **Live sync** — a change made by somebody else appears without a refresh.
|
- **Live sync** — a change made by somebody else appears without a refresh.
|
||||||
- **Repeating tasks** as RRULE, reminders, comments and attachments.
|
- **Repeating tasks** as RRULE, comments and attachments, and reminders that go
|
||||||
|
out as Web Push to an iPhone or a Mac.
|
||||||
- **[Calendar](caldav.md), [mail](mail.md) and [Claude](mcp.md)** connected over
|
- **[Calendar](caldav.md), [mail](mail.md) and [Claude](mcp.md)** connected over
|
||||||
open standards rather than private formats.
|
open standards rather than private formats.
|
||||||
|
|
||||||
@@ -48,7 +56,9 @@ columns.*
|
|||||||
|
|
||||||

|

|
||||||
|
|
||||||
*What you have handed to somebody else, grouped by whoever has it.*
|
*What you have handed to somebody else, grouped by whoever has it — and each row
|
||||||
|
marked with an arrow to them, so a delegated task reads as delegated wherever you
|
||||||
|
meet it.*
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
|||||||
@@ -805,6 +805,28 @@ paths:
|
|||||||
"200": { $ref: "#/components/responses/Task" }
|
"200": { $ref: "#/components/responses/Task" }
|
||||||
"404": { $ref: "#/components/responses/NotFound" }
|
"404": { $ref: "#/components/responses/NotFound" }
|
||||||
|
|
||||||
|
/api/v1/tasks/{taskID}/snooze:
|
||||||
|
parameters:
|
||||||
|
- { name: taskID, in: path, required: true, schema: { type: string } }
|
||||||
|
post:
|
||||||
|
tags: [tasks]
|
||||||
|
summary: Snooze a task until a time, or wake it.
|
||||||
|
description: |
|
||||||
|
Parks the task at the bottom of its list, greyed, until `until` passes —
|
||||||
|
nothing else about it moves. An empty `until` wakes it now.
|
||||||
|
requestBody:
|
||||||
|
required: true
|
||||||
|
content:
|
||||||
|
application/json:
|
||||||
|
schema:
|
||||||
|
type: object
|
||||||
|
properties:
|
||||||
|
until: { type: string, format: date-time, description: "RFC3339; empty to wake." }
|
||||||
|
responses:
|
||||||
|
"200": { $ref: "#/components/responses/Task" }
|
||||||
|
"404": { $ref: "#/components/responses/NotFound" }
|
||||||
|
"422": { $ref: "#/components/responses/Validation" }
|
||||||
|
|
||||||
/api/v1/tasks/quick-add:
|
/api/v1/tasks/quick-add:
|
||||||
post:
|
post:
|
||||||
tags: [tasks]
|
tags: [tasks]
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 239 KiB After Width: | Height: | Size: 240 KiB |
|
Before Width: | Height: | Size: 276 KiB After Width: | Height: | Size: 300 KiB |
|
After Width: | Height: | Size: 219 KiB |
|
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 138 KiB |
|
Before Width: | Height: | Size: 306 KiB After Width: | Height: | Size: 325 KiB |
|
Before Width: | Height: | Size: 241 KiB After Width: | Height: | Size: 237 KiB |
|
After Width: | Height: | Size: 262 KiB |
|
Before Width: | Height: | Size: 328 KiB After Width: | Height: | Size: 350 KiB |
|
Before Width: | Height: | Size: 308 KiB After Width: | Height: | Size: 335 KiB |
|
Before Width: | Height: | Size: 215 KiB After Width: | Height: | Size: 220 KiB |
|
Before Width: | Height: | Size: 240 KiB After Width: | Height: | Size: 244 KiB |
|
Before Width: | Height: | Size: 232 KiB After Width: | Height: | Size: 229 KiB |
|
Before Width: | Height: | Size: 222 KiB After Width: | Height: | Size: 234 KiB |
|
Before Width: | Height: | Size: 221 KiB After Width: | Height: | Size: 234 KiB |
|
Before Width: | Height: | Size: 209 KiB After Width: | Height: | Size: 190 KiB |
|
Before Width: | Height: | Size: 180 KiB After Width: | Height: | Size: 217 KiB |
@@ -1,7 +1,8 @@
|
|||||||
# Self-hosting
|
# With Docker
|
||||||
|
|
||||||
verdande is one static binary and one directory. There is no database server, no
|
Running it yourself outside a panel: one static binary and one directory. There is
|
||||||
cache, no queue and no second process.
|
no database server, no cache, no queue and no second process. (Yggdrasil is
|
||||||
|
self-hosting too — for that route see [As a Rune](rune.md).)
|
||||||
|
|
||||||
## Docker
|
## Docker
|
||||||
|
|
||||||
|
|||||||
@@ -313,6 +313,18 @@ func (s *Server) handleExportNotes(w http.ResponseWriter, r *http.Request) {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Oldest first, and the id to break a tie. AllNotes comes back newest-first by
|
||||||
|
// the second, so two notes made in the same second have no order between them —
|
||||||
|
// and then which of two same-titled notes gets the plain name and which gets
|
||||||
|
// "(2)" is a coin toss that lands differently each export. Ordering the whole
|
||||||
|
// thing by when it was made settles it: the first note of a name keeps the name.
|
||||||
|
sort.SliceStable(notes, func(i, j int) bool {
|
||||||
|
if notes[i].CreatedAt.Equal(notes[j].CreatedAt) {
|
||||||
|
return notes[i].ID < notes[j].ID
|
||||||
|
}
|
||||||
|
return notes[i].CreatedAt.Before(notes[j].CreatedAt)
|
||||||
|
})
|
||||||
|
|
||||||
w.Header().Set("Content-Type", "application/zip")
|
w.Header().Set("Content-Type", "application/zip")
|
||||||
w.Header().Set("Content-Disposition",
|
w.Header().Set("Content-Disposition",
|
||||||
`attachment; filename="verdande-noter-`+time.Now().Format("2006-01-02")+`.zip"`)
|
`attachment; filename="verdande-noter-`+time.Now().Format("2006-01-02")+`.zip"`)
|
||||||
|
|||||||
@@ -148,15 +148,23 @@ func (s *Server) pushToUser(userID, title, body, projectID string) pushOutcome {
|
|||||||
return out
|
return out
|
||||||
}
|
}
|
||||||
|
|
||||||
payload := push.Payload{Title: title, Body: body, URL: "/projekt/" + projectID}
|
target := "/projekt/" + projectID
|
||||||
|
if projectID == "" {
|
||||||
|
target = "/"
|
||||||
|
}
|
||||||
|
payload := push.Payload{Title: title, Body: body, URL: target}
|
||||||
|
subject := s.vapidSubject()
|
||||||
for _, sub := range subs {
|
for _, sub := range subs {
|
||||||
err := push.Send(ctx, push.Subscription{
|
err := push.Send(ctx, push.Subscription{
|
||||||
Endpoint: sub.Endpoint, P256dh: sub.P256dh, Auth: sub.Auth,
|
Endpoint: sub.Endpoint, P256dh: sub.P256dh, Auth: sub.Auth,
|
||||||
}, payload, push.VAPID{
|
}, payload, push.VAPID{
|
||||||
Public: public, Private: private, Subject: "mailto:" + s.cfg.SMTP.From,
|
Public: public, Private: private, Subject: subject,
|
||||||
})
|
})
|
||||||
if err == nil {
|
if err == nil {
|
||||||
out.Sent++
|
out.Sent++
|
||||||
|
if delErr := s.db.MarkPushDelivered(ctx, sub.Endpoint); delErr != nil {
|
||||||
|
s.log.Warn("mark push delivered", "err", delErr)
|
||||||
|
}
|
||||||
continue
|
continue
|
||||||
}
|
}
|
||||||
// Warn, not Debug.
|
// Warn, not Debug.
|
||||||
@@ -257,6 +265,29 @@ func (s *Server) vapidKeys(ctx contextLike) (string, string, error) {
|
|||||||
return s.db.InstanceKeys(ctx, push.GenerateVAPIDKeys)
|
return s.db.InstanceKeys(ctx, push.GenerateVAPIDKeys)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// vapidSubject is the "sub" claim a push service is told to reach the sender at.
|
||||||
|
//
|
||||||
|
// It has to be one the service will actually accept, and Apple is the strict one:
|
||||||
|
// it answers 403 Forbidden to a mailto whose domain is made up — which is exactly
|
||||||
|
// what the old fallback, mailto:[email protected], was on an instance with
|
||||||
|
// no mail set up. Every push to an iPhone or a Mac was rejected, silently as far as
|
||||||
|
// the person waiting for the notification could tell.
|
||||||
|
//
|
||||||
|
// So a real address is used when there is one, and otherwise the instance's own
|
||||||
|
// https address — which is a valid VAPID subject, points at something that exists,
|
||||||
|
// and Apple accepts. Verified against web.push.apple.com: the mailto gets a 403,
|
||||||
|
// the https URL a 201.
|
||||||
|
func (s *Server) vapidSubject() string {
|
||||||
|
from := strings.TrimSpace(s.cfg.SMTP.From)
|
||||||
|
if from != "" && strings.Contains(from, "@") && !strings.HasSuffix(from, "@localhost") {
|
||||||
|
return "mailto:" + from
|
||||||
|
}
|
||||||
|
if strings.HasPrefix(s.cfg.BaseURL, "https://") || strings.HasPrefix(s.cfg.BaseURL, "http://") {
|
||||||
|
return s.cfg.BaseURL
|
||||||
|
}
|
||||||
|
return "mailto:[email protected]"
|
||||||
|
}
|
||||||
|
|
||||||
// --- subscription endpoints -----------------------------------------------------------
|
// --- subscription endpoints -----------------------------------------------------------
|
||||||
|
|
||||||
type pushSubscriptionRequest struct {
|
type pushSubscriptionRequest struct {
|
||||||
|
|||||||
@@ -0,0 +1,33 @@
|
|||||||
|
package httpapi
|
||||||
|
|
||||||
|
import (
|
||||||
|
"testing"
|
||||||
|
|
||||||
|
"github.com/kristianwind/verdande/internal/config"
|
||||||
|
)
|
||||||
|
|
||||||
|
// The VAPID subject has to be one a push service will accept. Apple answers 403 to
|
||||||
|
// a mailto with a made-up domain, which is what the no-mail fallback used to be, so
|
||||||
|
// every push to an Apple device was refused. With no real address, the instance's
|
||||||
|
// own https URL is used instead — valid, real, and accepted.
|
||||||
|
func TestVAPIDSubject(t *testing.T) {
|
||||||
|
cases := []struct {
|
||||||
|
name string
|
||||||
|
from string
|
||||||
|
baseURL string
|
||||||
|
want string
|
||||||
|
}{
|
||||||
|
{"a real address is used as-is", "[email protected]", "https://verdande.example.dk", "mailto:[email protected]"},
|
||||||
|
{"no mail falls back to the https url", "", "https://verdande.example.dk", "https://verdande.example.dk"},
|
||||||
|
{"the localhost default is not a real address", "verdande@localhost", "https://verdande.example.dk", "https://verdande.example.dk"},
|
||||||
|
{"a plain http dev url still serves as a subject", "", "http://localhost:8080", "http://localhost:8080"},
|
||||||
|
}
|
||||||
|
for _, tc := range cases {
|
||||||
|
t.Run(tc.name, func(t *testing.T) {
|
||||||
|
s := &Server{cfg: &config.Config{BaseURL: tc.baseURL, SMTP: config.SMTP{From: tc.from}}}
|
||||||
|
if got := s.vapidSubject(); got != tc.want {
|
||||||
|
t.Errorf("vapidSubject() = %q, want %q", got, tc.want)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -551,6 +551,7 @@ func New(cfg *config.Config, db *store.DB, log *slog.Logger, web fs.FS) *Server
|
|||||||
r.Post("/complete", s.handleCompleteTask)
|
r.Post("/complete", s.handleCompleteTask)
|
||||||
r.Post("/reopen", s.handleReopenTask)
|
r.Post("/reopen", s.handleReopenTask)
|
||||||
r.Post("/move", s.handleMoveTask)
|
r.Post("/move", s.handleMoveTask)
|
||||||
|
r.Post("/snooze", s.handleSnoozeTask)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -16,23 +16,24 @@ import (
|
|||||||
)
|
)
|
||||||
|
|
||||||
type taskJSON struct {
|
type taskJSON struct {
|
||||||
ID string `json:"id"`
|
ID string `json:"id"`
|
||||||
ProjectID string `json:"project_id"`
|
ProjectID string `json:"project_id"`
|
||||||
SectionID string `json:"section_id,omitempty"`
|
SectionID string `json:"section_id,omitempty"`
|
||||||
ParentID string `json:"parent_id,omitempty"`
|
ParentID string `json:"parent_id,omitempty"`
|
||||||
Content string `json:"content"`
|
Content string `json:"content"`
|
||||||
Description string `json:"description,omitempty"`
|
Description string `json:"description,omitempty"`
|
||||||
Priority int `json:"priority"`
|
Priority int `json:"priority"`
|
||||||
DueDate string `json:"due_date,omitempty"`
|
DueDate string `json:"due_date,omitempty"`
|
||||||
DueDatetime string `json:"due_datetime,omitempty"`
|
DueDatetime string `json:"due_datetime,omitempty"`
|
||||||
DurationMin *int `json:"duration_min,omitempty"`
|
DurationMin *int `json:"duration_min,omitempty"`
|
||||||
Recurrence string `json:"recurrence_rule,omitempty"`
|
Recurrence string `json:"recurrence_rule,omitempty"`
|
||||||
RepeatText string `json:"recurrence_text,omitempty"`
|
RepeatText string `json:"recurrence_text,omitempty"`
|
||||||
AssigneeID string `json:"assignee_id,omitempty"`
|
AssigneeID string `json:"assignee_id,omitempty"`
|
||||||
Labels []string `json:"labels"`
|
Labels []string `json:"labels"`
|
||||||
Completed bool `json:"completed"`
|
Completed bool `json:"completed"`
|
||||||
CompletedAt string `json:"completed_at,omitempty"`
|
CompletedAt string `json:"completed_at,omitempty"`
|
||||||
CreatedBy string `json:"created_by"`
|
SnoozedUntil string `json:"snoozed_until,omitempty"`
|
||||||
|
CreatedBy string `json:"created_by"`
|
||||||
// What the row can say without being opened. Sent with every task rather than
|
// What the row can say without being opened. Sent with every task rather than
|
||||||
// fetched when one is opened, because the point is that you see it in the list.
|
// fetched when one is opened, because the point is that you see it in the list.
|
||||||
SubtaskCount int `json:"subtask_count,omitempty"`
|
SubtaskCount int `json:"subtask_count,omitempty"`
|
||||||
@@ -67,6 +68,9 @@ func toTaskJSON(t store.Task) taskJSON {
|
|||||||
if t.CompletedAt != nil {
|
if t.CompletedAt != nil {
|
||||||
j.CompletedAt = t.CompletedAt.Format(time.RFC3339)
|
j.CompletedAt = t.CompletedAt.Format(time.RFC3339)
|
||||||
}
|
}
|
||||||
|
if t.SnoozedUntil != nil {
|
||||||
|
j.SnoozedUntil = t.SnoozedUntil.Format(time.RFC3339)
|
||||||
|
}
|
||||||
return j
|
return j
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -698,3 +702,52 @@ func parseLimit(raw string, def, max int) int {
|
|||||||
}
|
}
|
||||||
return n
|
return n
|
||||||
}
|
}
|
||||||
|
|
||||||
|
type snoozeRequest struct {
|
||||||
|
// Until is an RFC3339 time to snooze to, or empty to wake the task now.
|
||||||
|
Until string `json:"until"`
|
||||||
|
}
|
||||||
|
|
||||||
|
// handleSnoozeTask parks a task until a time, or wakes it. Snooze changes nothing
|
||||||
|
// but when the task wants to be seen — its due date and everything else stay put.
|
||||||
|
func (s *Server) handleSnoozeTask(w http.ResponseWriter, r *http.Request) {
|
||||||
|
var req snoozeRequest
|
||||||
|
if err := decodeJSON(w, r, &req); err != nil {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
taskID := chi.URLParam(r, "taskID")
|
||||||
|
user := userFrom(r.Context())
|
||||||
|
|
||||||
|
role, err := store.TaskRole(r.Context(), s.db, taskID, user.ID)
|
||||||
|
if err != nil || !role.CanEdit() {
|
||||||
|
writeError(w, http.StatusNotFound, CodeNotFound, "not found")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
var until *time.Time
|
||||||
|
if strings.TrimSpace(req.Until) != "" {
|
||||||
|
parsed, perr := time.Parse(time.RFC3339, req.Until)
|
||||||
|
if perr != nil {
|
||||||
|
writeFieldErrors(w, map[string]string{"until": "must be an RFC3339 time"})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
until = &parsed
|
||||||
|
}
|
||||||
|
if err := s.db.SnoozeTask(r.Context(), taskID, until); err != nil {
|
||||||
|
s.storeError(w, r, "snooze task", err)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
t, err := s.db.GetTask(r.Context(), taskID, user.ID)
|
||||||
|
if err != nil {
|
||||||
|
s.storeError(w, r, "get task", err)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
verb := "task.snoozed"
|
||||||
|
if until == nil {
|
||||||
|
verb = "task.unsnoozed"
|
||||||
|
}
|
||||||
|
s.activity(r, t.ProjectID, t.ID, verb, nil)
|
||||||
|
s.publish(t.ProjectID, "task.updated", toTaskJSON(*t))
|
||||||
|
writeJSON(w, http.StatusOK, toTaskJSON(*t))
|
||||||
|
}
|
||||||
|
|||||||
@@ -1817,3 +1817,50 @@ func TestATaskIsFoundByAWordInsideAWord(t *testing.T) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// A snoozed task sinks to the bottom of the list and greys until its time; waking
|
||||||
|
// it puts it back. The list order is what the row's dimming rides on.
|
||||||
|
func TestSnoozeSinksAndWakes(t *testing.T) {
|
||||||
|
ts := newTestServer(t)
|
||||||
|
ts.bootstrap(t)
|
||||||
|
|
||||||
|
_, a := ts.do(t, "POST", "/api/v1/tasks", map[string]any{"content": "Alfa"})
|
||||||
|
ts.do(t, "POST", "/api/v1/tasks", map[string]any{"content": "Bravo"})
|
||||||
|
aID, _ := a["id"].(string)
|
||||||
|
|
||||||
|
// Snooze Alfa two days out.
|
||||||
|
future := time.Now().Add(48 * time.Hour).UTC().Format(time.RFC3339)
|
||||||
|
resp, body := ts.do(t, "POST", "/api/v1/tasks/"+aID+"/snooze", map[string]any{"until": future})
|
||||||
|
if resp.StatusCode != http.StatusOK {
|
||||||
|
t.Fatalf("snooze: %d %v", resp.StatusCode, body)
|
||||||
|
}
|
||||||
|
if body["snoozed_until"] == "" || body["snoozed_until"] == nil {
|
||||||
|
t.Error("the response does not carry snoozed_until")
|
||||||
|
}
|
||||||
|
|
||||||
|
// Alfa now sorts after Bravo, though it was created first.
|
||||||
|
order := func() []string {
|
||||||
|
_, list := ts.do(t, "GET", "/api/v1/tasks", nil)
|
||||||
|
var out []string
|
||||||
|
for _, raw := range list["tasks"].([]any) {
|
||||||
|
out = append(out, raw.(map[string]any)["content"].(string))
|
||||||
|
}
|
||||||
|
return out
|
||||||
|
}
|
||||||
|
got := order()
|
||||||
|
if len(got) != 2 || got[0] != "Bravo" || got[1] != "Alfa" {
|
||||||
|
t.Errorf("snoozed task did not sink: order = %v", got)
|
||||||
|
}
|
||||||
|
|
||||||
|
// Wake it, and it comes back above Bravo.
|
||||||
|
resp, body = ts.do(t, "POST", "/api/v1/tasks/"+aID+"/snooze", map[string]any{"until": ""})
|
||||||
|
if resp.StatusCode != http.StatusOK {
|
||||||
|
t.Fatalf("wake: %d %v", resp.StatusCode, body)
|
||||||
|
}
|
||||||
|
if s, _ := body["snoozed_until"].(string); s != "" {
|
||||||
|
t.Errorf("waking left snoozed_until set: %q", s)
|
||||||
|
}
|
||||||
|
if got := order(); got[0] != "Alfa" {
|
||||||
|
t.Errorf("woken task did not return: order = %v", got)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@@ -62,8 +62,13 @@ func Render(cal Calendar) string {
|
|||||||
|
|
||||||
for _, t := range cal.Tasks {
|
for _, t := range cal.Tasks {
|
||||||
writeTodo(&b, t, cal.Domain)
|
writeTodo(&b, t, cal.Domain)
|
||||||
// A dated task also goes out as an event, for clients that ignore VTODO.
|
// A dated task also goes out as an event, for the calendar apps that ignore
|
||||||
if t.DueDatetime != nil && !t.Completed {
|
// VTODO — which is all of them: Apple Calendar and Google both drop a
|
||||||
|
// subscribed to-do on the floor and show only events. A task with a clock
|
||||||
|
// time becomes a timed event; one with only a date, an all-day event. Once
|
||||||
|
// this was limited to timed tasks, so a date-only task — most of them —
|
||||||
|
// simply never appeared in the calendar it was subscribed into.
|
||||||
|
if !t.Completed && (t.DueDatetime != nil || t.DueDate != "") {
|
||||||
writeEvent(&b, t, cal.Domain)
|
writeEvent(&b, t, cal.Domain)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -128,22 +133,31 @@ func writeTodo(b *strings.Builder, t Task, domain string) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
func writeEvent(b *strings.Builder, t Task, domain string) {
|
func writeEvent(b *strings.Builder, t Task, domain string) {
|
||||||
start := *t.DueDatetime
|
|
||||||
// Without a stated duration a task is shown as half an hour. A zero-length
|
|
||||||
// event collapses to an invisible sliver in most calendar grids.
|
|
||||||
minutes := 30
|
|
||||||
if t.DurationMin != nil && *t.DurationMin > 0 {
|
|
||||||
minutes = *t.DurationMin
|
|
||||||
}
|
|
||||||
end := start.Add(time.Duration(minutes) * time.Minute)
|
|
||||||
|
|
||||||
b.WriteString("BEGIN:VEVENT\r\n")
|
b.WriteString("BEGIN:VEVENT\r\n")
|
||||||
// A distinct UID suffix: the event and the to-do describe the same task, and
|
// A distinct UID suffix: the event and the to-do describe the same task, and
|
||||||
// sharing a UID would make a client treat them as two versions of one item.
|
// sharing a UID would make a client treat them as two versions of one item.
|
||||||
writeLine(b, "UID:"+t.ID+"-event@"+domain)
|
writeLine(b, "UID:"+t.ID+"-event@"+domain)
|
||||||
writeLine(b, "DTSTAMP:"+utc(t.UpdatedAt))
|
writeLine(b, "DTSTAMP:"+utc(t.UpdatedAt))
|
||||||
writeLine(b, "DTSTART:"+utc(start))
|
|
||||||
writeLine(b, "DTEND:"+utc(end))
|
if t.DueDatetime != nil {
|
||||||
|
start := *t.DueDatetime
|
||||||
|
// Without a stated duration a task is shown as half an hour. A zero-length
|
||||||
|
// event collapses to an invisible sliver in most calendar grids.
|
||||||
|
minutes := 30
|
||||||
|
if t.DurationMin != nil && *t.DurationMin > 0 {
|
||||||
|
minutes = *t.DurationMin
|
||||||
|
}
|
||||||
|
writeLine(b, "DTSTART:"+utc(start))
|
||||||
|
writeLine(b, "DTEND:"+utc(start.Add(time.Duration(minutes)*time.Minute)))
|
||||||
|
} else {
|
||||||
|
// A date with no time is an all-day event. DTEND is exclusive — a one-day
|
||||||
|
// event ends on the following date — which is what keeps it a single day in
|
||||||
|
// the grid rather than bleeding into the next.
|
||||||
|
day := strings.ReplaceAll(t.DueDate, "-", "")
|
||||||
|
writeLine(b, "DTSTART;VALUE=DATE:"+day)
|
||||||
|
writeLine(b, "DTEND;VALUE=DATE:"+nextDay(t.DueDate))
|
||||||
|
}
|
||||||
|
|
||||||
writeLine(b, "SUMMARY:"+escape(t.Content))
|
writeLine(b, "SUMMARY:"+escape(t.Content))
|
||||||
if t.Description != "" {
|
if t.Description != "" {
|
||||||
writeLine(b, "DESCRIPTION:"+escape(t.Description))
|
writeLine(b, "DESCRIPTION:"+escape(t.Description))
|
||||||
@@ -157,6 +171,17 @@ func writeEvent(b *strings.Builder, t Task, domain string) {
|
|||||||
|
|
||||||
func utc(t time.Time) string { return t.UTC().Format("20060102T150405Z") }
|
func utc(t time.Time) string { return t.UTC().Format("20060102T150405Z") }
|
||||||
|
|
||||||
|
// nextDay is the YYYYMMDD after a YYYY-MM-DD date, for an all-day event's exclusive
|
||||||
|
// DTEND. A malformed date is returned as its own compacted form rather than
|
||||||
|
// dropped, so a task never loses its event over a bad string.
|
||||||
|
func nextDay(date string) string {
|
||||||
|
d, err := time.Parse("2006-01-02", date)
|
||||||
|
if err != nil {
|
||||||
|
return strings.ReplaceAll(date, "-", "")
|
||||||
|
}
|
||||||
|
return d.AddDate(0, 0, 1).Format("20060102")
|
||||||
|
}
|
||||||
|
|
||||||
// escape applies RFC 5545 text escaping. A comma or semicolon in a task title is
|
// escape applies RFC 5545 text escaping. A comma or semicolon in a task title is
|
||||||
// a value separator in iCalendar, so an unescaped one silently truncates the
|
// a value separator in iCalendar, so an unescaped one silently truncates the
|
||||||
// summary at that character in every client.
|
// summary at that character in every client.
|
||||||
|
|||||||
@@ -102,19 +102,28 @@ func TestWholeDayDueDatesAreDates(t *testing.T) {
|
|||||||
|
|
||||||
// Google Calendar ignores VTODO. Timed tasks are therefore also emitted as events,
|
// Google Calendar ignores VTODO. Timed tasks are therefore also emitted as events,
|
||||||
// or a feed is useless in the calendar most people actually keep.
|
// or a feed is useless in the calendar most people actually keep.
|
||||||
func TestTimedTasksAlsoBecomeEvents(t *testing.T) {
|
func TestDatedTasksBecomeEvents(t *testing.T) {
|
||||||
out := Render(sample())
|
out := Render(sample())
|
||||||
|
|
||||||
if strings.Count(out, "BEGIN:VEVENT") != 1 {
|
// Every dated, unfinished task becomes an event, so it shows in a calendar app
|
||||||
t.Fatalf("got %d VEVENTs, want one for the single timed task",
|
// that ignores VTODO — timed t1, and date-only t2 and t3. The finished t4 has no
|
||||||
strings.Count(out, "BEGIN:VEVENT"))
|
// date and no event.
|
||||||
|
if got := strings.Count(out, "BEGIN:VEVENT"); got != 3 {
|
||||||
|
t.Fatalf("got %d VEVENTs, want 3 (one timed, two all-day)", got)
|
||||||
}
|
}
|
||||||
if !strings.Contains(out, "DTSTART:20260310T090000Z") {
|
|
||||||
t.Error("the event has no start")
|
// The timed one keeps its clock and its 45-minute duration.
|
||||||
|
if !strings.Contains(out, "DTSTART:20260310T090000Z") || !strings.Contains(out, "DTEND:20260310T094500Z") {
|
||||||
|
t.Error("the timed event's start or duration is wrong")
|
||||||
}
|
}
|
||||||
// 45 minutes of stated duration.
|
// The date-only ones are all-day: a DATE start and an exclusive next-day end, so
|
||||||
if !strings.Contains(out, "DTEND:20260310T094500Z") {
|
// they sit on their own day rather than bleeding into the next.
|
||||||
t.Error("the event's end does not reflect the task's duration")
|
if !strings.Contains(out, "DTSTART;VALUE=DATE:20260312") || !strings.Contains(out, "DTEND;VALUE=DATE:20260313") {
|
||||||
|
t.Error("the date-only event is not a single all-day event")
|
||||||
|
}
|
||||||
|
// A recurring date-only task carries its rule onto the event.
|
||||||
|
if !strings.Contains(out, "RRULE:FREQ=WEEKLY;BYDAY=MO") {
|
||||||
|
t.Error("the recurring task's event has no RRULE")
|
||||||
}
|
}
|
||||||
// The event must not share the to-do's UID, or clients treat them as one item.
|
// The event must not share the to-do's UID, or clients treat them as one item.
|
||||||
if !strings.Contains(out, "UID:[email protected]") {
|
if !strings.Contains(out, "UID:[email protected]") {
|
||||||
|
|||||||
@@ -0,0 +1,7 @@
|
|||||||
|
-- Snooze: put a task out of the way without finishing or filing it. A snoozed task
|
||||||
|
-- sinks to the bottom of its list and greys out until the time it is snoozed to,
|
||||||
|
-- then comes back on its own — no job wakes it, because "snoozed" is simply
|
||||||
|
-- snoozed_until being still in the future, read against the clock each time.
|
||||||
|
--
|
||||||
|
-- Null means not snoozed, which is every task until somebody snoozes one.
|
||||||
|
ALTER TABLE tasks ADD COLUMN snoozed_until INTEGER;
|
||||||
@@ -204,6 +204,17 @@ func (db *DB) dropPushEndpoint(ctx context.Context, endpoint string) error {
|
|||||||
// has failed enough times. A push service says 404 or 410 when an endpoint is gone,
|
// has failed enough times. A push service says 404 or 410 when an endpoint is gone,
|
||||||
// but it also has bad days — forgiving a few failures keeps a flaky network from
|
// but it also has bad days — forgiving a few failures keeps a flaky network from
|
||||||
// silently unsubscribing somebody's phone.
|
// silently unsubscribing somebody's phone.
|
||||||
|
// MarkPushDelivered records that a push went through: the failure count goes back
|
||||||
|
// to zero and last_used_at moves forward. Without it a subscription that failed a
|
||||||
|
// few times and then recovered would keep those failures on its record and be one
|
||||||
|
// flaky night away from the ten that delete it — even though it is working.
|
||||||
|
func (db *DB) MarkPushDelivered(ctx context.Context, endpoint string) error {
|
||||||
|
_, err := db.ExecContext(ctx,
|
||||||
|
`UPDATE push_subscriptions SET failures = 0, last_used_at = ? WHERE endpoint = ?`,
|
||||||
|
time.Now().Unix(), endpoint)
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
|
||||||
func (db *DB) RecordPushFailure(ctx context.Context, endpoint string, permanent bool) error {
|
func (db *DB) RecordPushFailure(ctx context.Context, endpoint string, permanent bool) error {
|
||||||
if permanent {
|
if permanent {
|
||||||
// Not scoped by user, and that is right here: this is the push service
|
// Not scoped by user, and that is right here: this is the push service
|
||||||
|
|||||||
@@ -29,6 +29,9 @@ type Task struct {
|
|||||||
AssigneeID string
|
AssigneeID string
|
||||||
CompletedAt *time.Time
|
CompletedAt *time.Time
|
||||||
CompletedBy string
|
CompletedBy string
|
||||||
|
// SnoozedUntil, when set and still in the future, parks the task at the bottom
|
||||||
|
// of its list, greyed, until it passes. Nil means the task is not snoozed.
|
||||||
|
SnoozedUntil *time.Time
|
||||||
// CreatedBy is empty when the author's account has been deleted: `created_by`
|
// CreatedBy is empty when the author's account has been deleted: `created_by`
|
||||||
// is ON DELETE SET NULL so the task survives the person who wrote it.
|
// is ON DELETE SET NULL so the task survives the person who wrote it.
|
||||||
CreatedBy string
|
CreatedBy string
|
||||||
@@ -219,7 +222,7 @@ func (db *DB) ListTasks(ctx context.Context, userID string, f TaskFilter) ([]Tas
|
|||||||
SELECT t.id, t.project_id, t.section_id, t.parent_id, t.content, t.description,
|
SELECT t.id, t.project_id, t.section_id, t.parent_id, t.content, t.description,
|
||||||
t.priority, t.due_date, t.due_datetime, t.due_timezone, t.duration_min,
|
t.priority, t.due_date, t.due_datetime, t.due_timezone, t.duration_min,
|
||||||
t.recurrence_rule, t.assignee_id, t.completed_at, t.completed_by,
|
t.recurrence_rule, t.assignee_id, t.completed_at, t.completed_by,
|
||||||
t.created_by, t.sort_order, t.created_at, t.updated_at,` + taskCounts + `
|
t.created_by, t.sort_order, t.created_at, t.updated_at, t.snoozed_until,` + taskCounts + `
|
||||||
FROM tasks t
|
FROM tasks t
|
||||||
JOIN projects p ON p.id = t.project_id
|
JOIN projects p ON p.id = t.project_id
|
||||||
WHERE ` + strings.Join(where, " AND ") + `
|
WHERE ` + strings.Join(where, " AND ") + `
|
||||||
@@ -313,7 +316,7 @@ func (db *DB) GetTask(ctx context.Context, taskID, userID string) (*Task, error)
|
|||||||
SELECT t.id, t.project_id, t.section_id, t.parent_id, t.content, t.description,
|
SELECT t.id, t.project_id, t.section_id, t.parent_id, t.content, t.description,
|
||||||
t.priority, t.due_date, t.due_datetime, t.due_timezone, t.duration_min,
|
t.priority, t.due_date, t.due_datetime, t.due_timezone, t.duration_min,
|
||||||
t.recurrence_rule, t.assignee_id, t.completed_at, t.completed_by,
|
t.recurrence_rule, t.assignee_id, t.completed_at, t.completed_by,
|
||||||
t.created_by, t.sort_order, t.created_at, t.updated_at,`+taskCounts+`
|
t.created_by, t.sort_order, t.created_at, t.updated_at, t.snoozed_until,`+taskCounts+`
|
||||||
FROM tasks t WHERE t.id = ? AND t.deleted_at IS NULL`, taskID)
|
FROM tasks t WHERE t.id = ? AND t.deleted_at IS NULL`, taskID)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return nil, err
|
return nil, err
|
||||||
@@ -390,7 +393,32 @@ func order(f TaskFilter) string {
|
|||||||
if f.CompletedOnly {
|
if f.CompletedOnly {
|
||||||
return "t.completed_at DESC, t.id DESC"
|
return "t.completed_at DESC, t.id DESC"
|
||||||
}
|
}
|
||||||
return "t.due_date IS NULL, t.due_date, t.priority, t.sort_order, t.created_at"
|
// A snoozed task sinks below everything else — the CASE is 1 while it is still
|
||||||
|
// snoozed and 0 the moment its time passes, so it rejoins the list in its proper
|
||||||
|
// place by the clock, with nothing to run. Compared as an integer, or the TEXT
|
||||||
|
// strftime returns would sort under every number.
|
||||||
|
snoozed := "(CASE WHEN t.snoozed_until > CAST(strftime('%s','now') AS INTEGER) THEN 1 ELSE 0 END)"
|
||||||
|
return snoozed + ", t.due_date IS NULL, t.due_date, t.priority, t.sort_order, t.created_at"
|
||||||
|
}
|
||||||
|
|
||||||
|
// SnoozeTask parks a task until a moment, or wakes it when until is nil. Only the
|
||||||
|
// snooze changes; the due date, the time, everything else is left alone — a snooze
|
||||||
|
// is about when you want to see it, not when it is due.
|
||||||
|
func (db *DB) SnoozeTask(ctx context.Context, id string, until *time.Time) error {
|
||||||
|
var v any
|
||||||
|
if until != nil {
|
||||||
|
v = until.Unix()
|
||||||
|
}
|
||||||
|
res, err := db.ExecContext(ctx,
|
||||||
|
`UPDATE tasks SET snoozed_until = ?, updated_at = ? WHERE id = ? AND deleted_at IS NULL`,
|
||||||
|
v, time.Now().Unix(), id)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
if n, _ := res.RowsAffected(); n == 0 {
|
||||||
|
return ErrNotFound
|
||||||
|
}
|
||||||
|
return nil
|
||||||
}
|
}
|
||||||
|
|
||||||
func scanTask(rows *sql.Rows) (Task, error) {
|
func scanTask(rows *sql.Rows) (Task, error) {
|
||||||
@@ -400,13 +428,13 @@ func scanTask(rows *sql.Rows) (Task, error) {
|
|||||||
// stays; it loses its author.
|
// stays; it loses its author.
|
||||||
var createdBy sql.NullString
|
var createdBy sql.NullString
|
||||||
var dueDatetime, completedAt sql.NullInt64
|
var dueDatetime, completedAt sql.NullInt64
|
||||||
var duration sql.NullInt64
|
var duration, snoozedUntil sql.NullInt64
|
||||||
var created, updated int64
|
var created, updated int64
|
||||||
|
|
||||||
err := rows.Scan(&t.ID, &t.ProjectID, §ionID, &parentID, &t.Content, &t.Description,
|
err := rows.Scan(&t.ID, &t.ProjectID, §ionID, &parentID, &t.Content, &t.Description,
|
||||||
&t.Priority, &dueDate, &dueDatetime, &dueTZ, &duration,
|
&t.Priority, &dueDate, &dueDatetime, &dueTZ, &duration,
|
||||||
&recurrence, &assignee, &completedAt, &completedBy,
|
&recurrence, &assignee, &completedAt, &completedBy,
|
||||||
&createdBy, &t.SortOrder, &created, &updated,
|
&createdBy, &t.SortOrder, &created, &updated, &snoozedUntil,
|
||||||
&t.SubtaskCount, &t.SubtaskDone, &t.AttachmentCount)
|
&t.SubtaskCount, &t.SubtaskDone, &t.AttachmentCount)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return t, err
|
return t, err
|
||||||
@@ -432,6 +460,10 @@ func scanTask(rows *sql.Rows) (Task, error) {
|
|||||||
v := int(duration.Int64)
|
v := int(duration.Int64)
|
||||||
t.DurationMin = &v
|
t.DurationMin = &v
|
||||||
}
|
}
|
||||||
|
if snoozedUntil.Valid {
|
||||||
|
v := time.Unix(snoozedUntil.Int64, 0).UTC()
|
||||||
|
t.SnoozedUntil = &v
|
||||||
|
}
|
||||||
t.CreatedAt = time.Unix(created, 0).UTC()
|
t.CreatedAt = time.Unix(created, 0).UTC()
|
||||||
t.UpdatedAt = time.Unix(updated, 0).UTC()
|
t.UpdatedAt = time.Unix(updated, 0).UTC()
|
||||||
return t, nil
|
return t, nil
|
||||||
|
|||||||
@@ -44,8 +44,8 @@ extra_css:
|
|||||||
nav:
|
nav:
|
||||||
- Home: index.md
|
- Home: index.md
|
||||||
- Setting it up:
|
- Setting it up:
|
||||||
- Self-hosting: self-hosting.md
|
|
||||||
- As a Rune: rune.md
|
- As a Rune: rune.md
|
||||||
|
- With Docker: self-hosting.md
|
||||||
- Configuration: configuration.md
|
- Configuration: configuration.md
|
||||||
- Using it:
|
- Using it:
|
||||||
- Signing in: signing-in.md
|
- Signing in: signing-in.md
|
||||||
|
|||||||
@@ -856,8 +856,11 @@
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<a class="button primary" href="https://kristianwind.github.io/verdande/self-hosting/">
|
<a class="button primary" href="https://kristianwind.github.io/verdande/rune/">
|
||||||
Self-host it
|
As a Rune
|
||||||
|
</a>
|
||||||
|
<a class="button" href="https://kristianwind.github.io/verdande/self-hosting/">
|
||||||
|
With Docker
|
||||||
</a>
|
</a>
|
||||||
<a class="button" href="https://github.com/kristianwind/verdande">Source</a>
|
<a class="button" href="https://github.com/kristianwind/verdande">Source</a>
|
||||||
<a class="button" href="https://kristianwind.github.io/verdande/">Documentation</a>
|
<a class="button" href="https://kristianwind.github.io/verdande/">Documentation</a>
|
||||||
@@ -928,13 +931,33 @@
|
|||||||
<div class="shots">
|
<div class="shots">
|
||||||
<figure class="shot">
|
<figure class="shot">
|
||||||
<img
|
<img
|
||||||
src="screenshots/board.webp"
|
src="screenshots/calendar-light.webp"
|
||||||
alt="A project in board view: one column per section, with task cards showing due dates, labels and repetition."
|
alt="A week in the calendar: timed tasks drawn to their length, a fifteen-minute stand-up short and a ninety-minute planning block tall, each on the day and at the time it is due."
|
||||||
width="1400"
|
width="1400"
|
||||||
height="900"
|
height="900"
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
/>
|
/>
|
||||||
<figcaption>Board view — one column per section.</figcaption>
|
<figcaption>The calendar draws a task to its length — drag its foot to change it.</figcaption>
|
||||||
|
</figure>
|
||||||
|
<figure class="shot">
|
||||||
|
<img
|
||||||
|
src="screenshots/notes-shared-light.webp"
|
||||||
|
alt="Notes with a Shared with me group at the top of the list, holding a note somebody else shared, marked with whose it is, open on the right."
|
||||||
|
width="1400"
|
||||||
|
height="900"
|
||||||
|
loading="lazy"
|
||||||
|
/>
|
||||||
|
<figcaption>A note shared with you, gathered under Shared with me.</figcaption>
|
||||||
|
</figure>
|
||||||
|
<figure class="shot">
|
||||||
|
<img
|
||||||
|
src="screenshots/board.webp"
|
||||||
|
alt="A project in board view: one column per section, with task cards showing due dates, labels, an arrow to whoever a task is delegated to, and a snoozed card greyed at the foot of its column."
|
||||||
|
width="1400"
|
||||||
|
height="900"
|
||||||
|
loading="lazy"
|
||||||
|
/>
|
||||||
|
<figcaption>Board view — one column per section. A delegated card carries an arrow to whoever has it; a snoozed one greys at the foot.</figcaption>
|
||||||
</figure>
|
</figure>
|
||||||
<figure class="shot">
|
<figure class="shot">
|
||||||
<img
|
<img
|
||||||
@@ -989,12 +1012,12 @@
|
|||||||
<figure class="shot">
|
<figure class="shot">
|
||||||
<img
|
<img
|
||||||
src="screenshots/delegated.webp"
|
src="screenshots/delegated.webp"
|
||||||
alt="Waiting on others: tasks that have been handed to somebody else, grouped under the person who has them."
|
alt="Waiting on others: tasks that have been handed to somebody else, grouped under the person who has them, each row carrying an arrow to that person."
|
||||||
width="1400"
|
width="1400"
|
||||||
height="900"
|
height="900"
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
/>
|
/>
|
||||||
<figcaption>Waiting on others — grouped by who has it.</figcaption>
|
<figcaption>Waiting on others — grouped by who has it, each marked with an arrow to them.</figcaption>
|
||||||
</figure>
|
</figure>
|
||||||
<figure class="shot">
|
<figure class="shot">
|
||||||
<img
|
<img
|
||||||
@@ -1050,8 +1073,8 @@
|
|||||||
<h3>Repeats, and says so in words</h3>
|
<h3>Repeats, and says so in words</h3>
|
||||||
<p>
|
<p>
|
||||||
Recurring tasks are RRULE underneath and "every other Tuesday" on the
|
Recurring tasks are RRULE underneath and "every other Tuesday" on the
|
||||||
screen. Reminders are absolute or relative, and go out to the devices
|
screen. Reminders are absolute or relative, and go out as Web Push to
|
||||||
you have allowed them on.
|
an iPhone or a Mac you have allowed them on.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
@@ -1063,12 +1086,38 @@
|
|||||||
written about it. Archive what is done with it; the bin is for mistakes.
|
written about it. Archive what is done with it; the bin is for mistakes.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="cell">
|
||||||
|
<h3>Share a note, or a page</h3>
|
||||||
|
<p>
|
||||||
|
Hand a single note to a person — to read or to edit — without standing up
|
||||||
|
a project for it. Notes other people share with you gather under
|
||||||
|
<em>Shared with me</em>, each marked with whose it is. File it in a project
|
||||||
|
instead and everyone who can read the project reads the note.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="cell">
|
||||||
|
<h3>How long it takes</h3>
|
||||||
|
<p>
|
||||||
|
A task can carry a length, and the calendar draws it to scale. Drag the
|
||||||
|
foot of a task to make it longer or shorter, or drag its body to another
|
||||||
|
day or time — the length comes along.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<h3>Waiting on others</h3>
|
<h3>Waiting on others</h3>
|
||||||
<p>
|
<p>
|
||||||
What you have handed to somebody else, on its own page, grouped under
|
What you have handed to somebody else, on its own page, grouped under
|
||||||
the person who has it. The thing a shared list stops being able to tell
|
the person who has it — and marked where you meet it too, with an arrow
|
||||||
you the moment it is shared.
|
out of your hands, so a list reads at a glance as which tasks are yours
|
||||||
|
and which you are waiting on.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="cell">
|
||||||
|
<h3>Snooze it out of the way</h3>
|
||||||
|
<p>
|
||||||
|
Park a task to this evening, tomorrow, next week, or a moment you pick.
|
||||||
|
It greys and sinks to the bottom of the list until then, and comes back
|
||||||
|
by itself — without touching when it is actually due.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -1188,6 +1237,23 @@
|
|||||||
<a href="https://github.com/kristianwind/verdande/releases">the releases page</a>.
|
<a href="https://github.com/kristianwind/verdande/releases">the releases page</a>.
|
||||||
</p>
|
</p>
|
||||||
<ul class="lately">
|
<ul class="lately">
|
||||||
|
<li>
|
||||||
|
<span class="ver">0.41</span>
|
||||||
|
A task you have delegated is marked where you meet it, not only on the
|
||||||
|
"Waiting on others" page. A task can be snoozed to the bottom of the list
|
||||||
|
until a moment you choose, and comes back by itself.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="ver">0.41</span>
|
||||||
|
Web Push reminders reach an iPhone and a Mac again, and every dated task
|
||||||
|
now shows up in a calendar you have subscribed to — not only the timed ones.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="ver">0.41</span>
|
||||||
|
The calendar draws each task to its length: drag the foot to resize, or the
|
||||||
|
body to move it. A single note can be shared with one person, and a
|
||||||
|
<code>[[note]]</code> is a link you follow inline.
|
||||||
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<span class="ver">0.34</span>
|
<span class="ver">0.34</span>
|
||||||
Sections can be dragged into the order the work actually happens in. The
|
Sections can be dragged into the order the work actually happens in. The
|
||||||
@@ -1199,21 +1265,6 @@
|
|||||||
or drag in, a source view, and a copy button on code blocks. Search
|
or drag in, a source view, and a copy button on code blocks. Search
|
||||||
stopped answering by date and started answering by relevance.
|
stopped answering by date and started answering by relevance.
|
||||||
</li>
|
</li>
|
||||||
<li>
|
|
||||||
<span class="ver">0.32</span>
|
|
||||||
A calendar of its own as a menu item, with a read-only Google calendar
|
|
||||||
that can be laid over it.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<span class="ver">0.31</span>
|
|
||||||
Mailboxes over IMAP, so flagging a mail in iCloud or Fastmail makes a
|
|
||||||
task — not only Gmail.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<span class="ver">0.30</span>
|
|
||||||
An installation count that says exactly what it sends, and can be turned
|
|
||||||
off in one click.
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 41 KiB |
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 40 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 47 KiB After Width: | Height: | Size: 53 KiB |
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 48 KiB |
|
Before Width: | Height: | Size: 56 KiB After Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 52 KiB After Width: | Height: | Size: 60 KiB |
|
Before Width: | Height: | Size: 35 KiB After Width: | Height: | Size: 38 KiB |
|
Before Width: | Height: | Size: 41 KiB After Width: | Height: | Size: 45 KiB |
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 41 KiB |
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 40 KiB |
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 38 KiB |
@@ -86,6 +86,29 @@ test('hurtig tilføjelse opretter en opgave, og den kan lukkes', async ({ page }
|
|||||||
expect(trouble).toEqual([]);
|
expect(trouble).toEqual([]);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('en URL i en opgave bliver et klikbart link, og resten åbner opgaven', async ({ page }) => {
|
||||||
|
const trouble = watchForTrouble(page);
|
||||||
|
await page.goto('/');
|
||||||
|
|
||||||
|
const box = page.getByLabel('Ny opgave');
|
||||||
|
// The URL is one token, so the parser leaves it in the title; "i dag" is what it
|
||||||
|
// takes. The link is made at display time — the stored title is still plain text.
|
||||||
|
await box.fill('læs https://example.com/artikel i dag');
|
||||||
|
await box.press('Enter');
|
||||||
|
|
||||||
|
const row = page.locator('.row').filter({ hasText: 'læs' });
|
||||||
|
const link = row.getByRole('link', { name: 'https://example.com/artikel' });
|
||||||
|
await expect(link).toHaveAttribute('href', 'https://example.com/artikel');
|
||||||
|
await expect(link).toHaveAttribute('rel', /noopener/);
|
||||||
|
|
||||||
|
// Clicking the plain part of the title still opens the task; only the link is
|
||||||
|
// carved out. Aimed at the top-left, over "læs", not the URL in the middle.
|
||||||
|
await row.locator('.content').click({ position: { x: 3, y: 3 } });
|
||||||
|
await expect(page.getByRole('complementary', { name: 'Opgave' })).toBeVisible();
|
||||||
|
|
||||||
|
expect(trouble).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
test('hvert link i sidebjælken fører et sted hen', async ({ page }) => {
|
test('hvert link i sidebjælken fører et sted hen', async ({ page }) => {
|
||||||
const trouble = watchForTrouble(page);
|
const trouble = watchForTrouble(page);
|
||||||
await page.goto('/');
|
await page.goto('/');
|
||||||
@@ -127,6 +150,32 @@ test('hvert link i sidebjælken fører et sted hen', async ({ page }) => {
|
|||||||
expect(trouble).toEqual([]);
|
expect(trouble).toEqual([]);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('en opgave kan slumres og hentes frem igen', async ({ page }) => {
|
||||||
|
const trouble = watchForTrouble(page);
|
||||||
|
await page.goto('/');
|
||||||
|
|
||||||
|
// "i dag" is parsed as the due date, so the task is named "Alfa" and shows here.
|
||||||
|
const box = page.getByLabel('Ny opgave');
|
||||||
|
await box.fill('Alfa i dag');
|
||||||
|
await box.press('Enter');
|
||||||
|
|
||||||
|
// Snooze it to tomorrow from its drawer.
|
||||||
|
await page.getByText('Alfa', { exact: true }).click();
|
||||||
|
const drawer = page.getByRole('complementary', { name: 'Opgave' });
|
||||||
|
await drawer.getByRole('button', { name: 'I morgen' }).click();
|
||||||
|
|
||||||
|
// The row greys — it carries the snoozed class and a "slumret til" mark.
|
||||||
|
const alfa = page.locator('.row', { hasText: 'Alfa' });
|
||||||
|
await expect(alfa).toHaveClass(/snoozed/);
|
||||||
|
await expect(alfa.locator('.snooze-mark')).toBeVisible();
|
||||||
|
|
||||||
|
// The drawer now offers to wake it, and waking takes the grey off.
|
||||||
|
await drawer.getByRole('button', { name: 'Væk nu' }).click();
|
||||||
|
await expect(alfa).not.toHaveClass(/snoozed/);
|
||||||
|
|
||||||
|
expect(trouble).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
test('en opgave kan åbnes og redigeres', async ({ page }) => {
|
test('en opgave kan åbnes og redigeres', async ({ page }) => {
|
||||||
const trouble = watchForTrouble(page);
|
const trouble = watchForTrouble(page);
|
||||||
await page.goto('/');
|
await page.goto('/');
|
||||||
@@ -911,7 +960,7 @@ test('en rolle kan rettes uden at fjerne personen', async ({ browser, page }) =>
|
|||||||
await page.keyboard.press('Escape');
|
await page.keyboard.press('Escape');
|
||||||
|
|
||||||
const row = page.locator('.row').filter({ hasText: 'brænde kaffe' });
|
const row = page.locator('.row').filter({ hasText: 'brænde kaffe' });
|
||||||
await expect(row.getByTitle('Ansvarlig: andreas')).toBeVisible();
|
await expect(row.getByTitle('Uddelegeret til andreas')).toBeVisible();
|
||||||
// And not on a task that is nobody's.
|
// And not on a task that is nobody's.
|
||||||
await page.getByLabel('Ny opgave').fill('min egen');
|
await page.getByLabel('Ny opgave').fill('min egen');
|
||||||
await page.getByLabel('Ny opgave').press('Enter');
|
await page.getByLabel('Ny opgave').press('Enter');
|
||||||
@@ -1225,6 +1274,69 @@ test('kalenderen viser Googles begivenheder over egne opgaver, og kun opgaven ka
|
|||||||
* thing this view was before anything was laid over it — and a Google account that
|
* thing this view was before anything was laid over it — and a Google account that
|
||||||
* is not there must not take it down with it.
|
* is not there must not take it down with it.
|
||||||
*/
|
*/
|
||||||
|
test('en opgaves længde kan trækkes længere på kalenderen', async ({ page }) => {
|
||||||
|
const trouble = watchForTrouble(page);
|
||||||
|
await page.goto('/');
|
||||||
|
|
||||||
|
// A timed task today at ten, half an hour long. Today, so the week opens on it
|
||||||
|
// without paging, and ten is inside the hours the grid draws by default.
|
||||||
|
const today = await page.evaluate(() => {
|
||||||
|
const d = new Date();
|
||||||
|
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||||
|
});
|
||||||
|
const id = await page.evaluate(async (day) => {
|
||||||
|
const r = await fetch('/api/v1/tasks', {
|
||||||
|
method: 'POST',
|
||||||
|
credentials: 'include',
|
||||||
|
headers: { 'Content-Type': 'application/json', 'Sec-Fetch-Site': 'same-origin' },
|
||||||
|
body: JSON.stringify({
|
||||||
|
content: 'Møde med Anders',
|
||||||
|
due_date: day,
|
||||||
|
due_time: '10:00',
|
||||||
|
duration_min: 30
|
||||||
|
})
|
||||||
|
});
|
||||||
|
return (await r.json()).id;
|
||||||
|
}, today);
|
||||||
|
|
||||||
|
await page.goto('/kalender');
|
||||||
|
await page.getByRole('button', { name: 'Uge', exact: true }).click();
|
||||||
|
|
||||||
|
const chip = page
|
||||||
|
.locator(`[data-date="${today}"] .tevent.task`)
|
||||||
|
.filter({ hasText: 'Møde med Anders' });
|
||||||
|
await expect(chip).toBeVisible();
|
||||||
|
const before = await chip.evaluate((el) => el.getBoundingClientRect().height);
|
||||||
|
|
||||||
|
// Drag the foot of the task down a good stretch. It should grow, both on screen
|
||||||
|
// and in what the server stores — a resize is a change of length, not of time.
|
||||||
|
const box = await chip.boundingBox();
|
||||||
|
await page.mouse.move(box.x + box.width / 2, box.y + box.height - 2);
|
||||||
|
await page.mouse.down();
|
||||||
|
await page.mouse.move(box.x + box.width / 2, box.y + box.height + 130, { steps: 6 });
|
||||||
|
await page.mouse.up();
|
||||||
|
|
||||||
|
await expect
|
||||||
|
.poll(async () =>
|
||||||
|
page.evaluate(async (tid) => {
|
||||||
|
const r = await fetch('/api/v1/tasks/' + tid, {
|
||||||
|
credentials: 'include',
|
||||||
|
headers: { 'Sec-Fetch-Site': 'same-origin' }
|
||||||
|
});
|
||||||
|
return (await r.json()).duration_min;
|
||||||
|
}, id)
|
||||||
|
)
|
||||||
|
.toBeGreaterThan(30);
|
||||||
|
|
||||||
|
// And the chip is taller than it was, so the length is something you can see.
|
||||||
|
await expect.poll(async () => chip.evaluate((el) => el.getBoundingClientRect().height)).toBeGreaterThan(before);
|
||||||
|
|
||||||
|
// The time did not move: it is still a ten o'clock task.
|
||||||
|
await expect(chip.locator('.at')).toHaveText('10:00');
|
||||||
|
|
||||||
|
expect(trouble).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
test('kalenderen virker uden en forbundet Google-konto', async ({ page }) => {
|
test('kalenderen virker uden en forbundet Google-konto', async ({ page }) => {
|
||||||
const trouble = watchForTrouble(page);
|
const trouble = watchForTrouble(page);
|
||||||
await page.goto('/kalender');
|
await page.goto('/kalender');
|
||||||
@@ -2440,7 +2552,8 @@ test('en note kan deles med et projekts folk, og tages tilbage igen', async ({ p
|
|||||||
await page.keyboard.type('Fælles aftale om leveringen');
|
await page.keyboard.type('Fælles aftale om leveringen');
|
||||||
await page.getByRole('textbox', { name: 'Notens tekst' }).blur();
|
await page.getByRole('textbox', { name: 'Notens tekst' }).blur();
|
||||||
|
|
||||||
// Shared by being filed in a project. Not an access list of its own.
|
// Filing it in a project — the controls live in the Del popover in the footer.
|
||||||
|
await page.locator('.sharewrap > button').click();
|
||||||
await page.getByLabel('Læg i projekt').selectOption({ label: 'Delenoter' });
|
await page.getByLabel('Læg i projekt').selectOption({ label: 'Delenoter' });
|
||||||
await expect(page.getByText('delt med projektets folk')).toBeVisible();
|
await expect(page.getByText('delt med projektets folk')).toBeVisible();
|
||||||
|
|
||||||
@@ -2451,6 +2564,7 @@ test('en note kan deles med et projekts folk, og tages tilbage igen', async ({ p
|
|||||||
// Taken back out, it is the author's alone again.
|
// Taken back out, it is the author's alone again.
|
||||||
await sidebar.getByRole('link', { name: 'Noter', exact: true }).click();
|
await sidebar.getByRole('link', { name: 'Noter', exact: true }).click();
|
||||||
await page.getByRole('button', { name: /Fælles aftale/ }).click();
|
await page.getByRole('button', { name: /Fælles aftale/ }).click();
|
||||||
|
await page.locator('.sharewrap > button').click();
|
||||||
await page.getByLabel('Læg i projekt').selectOption({ label: 'Intet projekt' });
|
await page.getByLabel('Læg i projekt').selectOption({ label: 'Intet projekt' });
|
||||||
await expect(page.getByText('din igen')).toBeVisible();
|
await expect(page.getByText('din igen')).toBeVisible();
|
||||||
|
|
||||||
@@ -2487,10 +2601,12 @@ test('en note kan deles med en person direkte, og dukker op hos dem', async ({ b
|
|||||||
await page.keyboard.type('Ferieplan for hele holdet');
|
await page.keyboard.type('Ferieplan for hele holdet');
|
||||||
await page.getByRole('textbox', { name: 'Notens tekst' }).blur();
|
await page.getByRole('textbox', { name: 'Notens tekst' }).blur();
|
||||||
|
|
||||||
const share = page.locator('.people-share');
|
// Sharing lives in a popover behind the Del button in the footer.
|
||||||
|
await page.locator('.sharewrap > button').click();
|
||||||
|
const share = page.locator('.sharepanel');
|
||||||
await expect(share).toBeVisible();
|
await expect(share).toBeVisible();
|
||||||
await share.locator('.addshare select').first().selectOption({ label: 'Sofie' });
|
await share.locator('.addshare select').first().selectOption({ label: 'Sofie' });
|
||||||
await page.getByRole('button', { name: 'Del', exact: true }).click();
|
await share.getByRole('button', { name: 'Tilføj' }).click();
|
||||||
|
|
||||||
// She is on the note now, with the role she was given.
|
// She is on the note now, with the role she was given.
|
||||||
const row = share.locator('.sharelist li').filter({ hasText: 'Sofie' });
|
const row = share.locator('.sharelist li').filter({ hasText: 'Sofie' });
|
||||||
@@ -2557,6 +2673,47 @@ test('udseendet kan skiftes uafhængigt af temaet, og overlever en genindlæsnin
|
|||||||
expect(trouble).toEqual([]);
|
expect(trouble).toEqual([]);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('[[ foreslår en note, og linket lander i noten', async ({ page }) => {
|
||||||
|
const trouble = watchForTrouble(page);
|
||||||
|
await page.goto('/noter');
|
||||||
|
|
||||||
|
// One note to point at, then another to write the link in.
|
||||||
|
await page.getByRole('button', { name: 'Ny note' }).click();
|
||||||
|
const ed = page.getByRole('textbox', { name: 'Notens tekst' });
|
||||||
|
await ed.click();
|
||||||
|
await page.keyboard.type('Rejseplan til Berlin');
|
||||||
|
await ed.blur();
|
||||||
|
await page.waitForTimeout(600);
|
||||||
|
|
||||||
|
await page.getByRole('button', { name: 'Ny note' }).click();
|
||||||
|
await ed.click();
|
||||||
|
await page.keyboard.type('Mine planer');
|
||||||
|
await page.keyboard.press('Enter');
|
||||||
|
await page.keyboard.type('Se ');
|
||||||
|
await page.keyboard.type('[[Rejse');
|
||||||
|
|
||||||
|
// The picker offers the note by title, and choosing it turns the text into a
|
||||||
|
// real inline link — the title, not the brackets.
|
||||||
|
const option = page.locator('.suggestions button', { hasText: 'Rejseplan til Berlin' });
|
||||||
|
await expect(option).toBeVisible();
|
||||||
|
await option.click();
|
||||||
|
const inline = ed.locator('a.notelink', { hasText: 'Rejseplan til Berlin' });
|
||||||
|
await expect(inline).toBeVisible();
|
||||||
|
|
||||||
|
// It survives the round-trip through Markdown and a reload.
|
||||||
|
await ed.blur();
|
||||||
|
await page.waitForTimeout(900);
|
||||||
|
await page.reload();
|
||||||
|
await page.getByRole('button', { name: /Mine planer/ }).click();
|
||||||
|
await expect(ed.locator('a.notelink', { hasText: 'Rejseplan til Berlin' })).toBeVisible();
|
||||||
|
|
||||||
|
// And it is a link you can follow: clicking it opens the note it names.
|
||||||
|
await ed.locator('a.notelink', { hasText: 'Rejseplan til Berlin' }).click();
|
||||||
|
await expect(ed.locator('h1')).toHaveText('Rejseplan til Berlin');
|
||||||
|
|
||||||
|
expect(trouble).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
test('en ny note begynder som titel, og linjen efter er brødtekst', async ({ page }) => {
|
test('en ny note begynder som titel, og linjen efter er brødtekst', async ({ page }) => {
|
||||||
const trouble = watchForTrouble(page);
|
const trouble = watchForTrouble(page);
|
||||||
await page.goto('/noter');
|
await page.goto('/noter');
|
||||||
@@ -2981,7 +3138,8 @@ test('en note kan oprettes inde fra et projekt og hører til det med det samme',
|
|||||||
await page.waitForTimeout(1200);
|
await page.waitForTimeout(1200);
|
||||||
|
|
||||||
// Den hører til projektet med det samme: "Læg i projekt" står på projektet,
|
// Den hører til projektet med det samme: "Læg i projekt" står på projektet,
|
||||||
// uden at nogen har valgt det bagefter.
|
// uden at nogen har valgt det bagefter. Kontrollen ligger i Del-popoveren.
|
||||||
|
await page.locator('.sharewrap > button').click();
|
||||||
await expect(page.getByLabel('Læg i projekt')).toHaveValue(/.+/);
|
await expect(page.getByLabel('Læg i projekt')).toHaveValue(/.+/);
|
||||||
const shared = await page.getByLabel('Læg i projekt').evaluate((el) => el.selectedOptions[0].textContent);
|
const shared = await page.getByLabel('Læg i projekt').evaluate((el) => el.selectedOptions[0].textContent);
|
||||||
expect(shared).toContain('Tagprojekt');
|
expect(shared).toContain('Tagprojekt');
|
||||||
@@ -3049,6 +3207,96 @@ test('en note kan trækkes hen på et projekt i sidebjælken', async ({ page })
|
|||||||
expect(trouble).toEqual([]);
|
expect(trouble).toEqual([]);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('en note kan arkiveres fra sin egen fod, og hentes frem igen', async ({ page }) => {
|
||||||
|
const trouble = watchForTrouble(page);
|
||||||
|
await page.goto('/noter');
|
||||||
|
|
||||||
|
await page.getByRole('button', { name: 'Ny note' }).click();
|
||||||
|
const ed = page.getByRole('textbox', { name: 'Notens tekst' });
|
||||||
|
await ed.click();
|
||||||
|
await page.keyboard.type('Kvartalsplan');
|
||||||
|
await ed.blur();
|
||||||
|
await page.waitForTimeout(700);
|
||||||
|
|
||||||
|
// The Arkivér button in the note's footer puts it away: it leaves the list.
|
||||||
|
await page.locator('footer .actions .button', { hasText: 'Arkivér' }).click();
|
||||||
|
await expect(page.locator('.notes button.row', { hasText: 'Kvartalsplan' })).toHaveCount(0);
|
||||||
|
|
||||||
|
// It is in the archive, where the same button now offers to bring it back.
|
||||||
|
await page.getByRole('button', { name: 'Vis arkivet' }).click();
|
||||||
|
await page.locator('.notes button.row', { hasText: 'Kvartalsplan' }).click();
|
||||||
|
await page.locator('footer .actions .button', { hasText: 'Tag frem igen' }).click();
|
||||||
|
await expect(page.locator('.notes button.row', { hasText: 'Kvartalsplan' })).toHaveCount(0);
|
||||||
|
|
||||||
|
// And back in the ordinary list.
|
||||||
|
await page.getByRole('button', { name: 'Vis arkivet' }).click();
|
||||||
|
await expect(page.locator('.notes button.row', { hasText: 'Kvartalsplan' })).toBeVisible();
|
||||||
|
|
||||||
|
expect(trouble).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('en monospace-linje kan forlades — på retur og gennem menuen', async ({ page }) => {
|
||||||
|
const trouble = watchForTrouble(page);
|
||||||
|
await page.goto('/noter');
|
||||||
|
|
||||||
|
await page.getByRole('button', { name: 'Ny note' }).click();
|
||||||
|
const ed = page.getByRole('textbox', { name: 'Notens tekst' });
|
||||||
|
await ed.click();
|
||||||
|
await page.keyboard.type('Titel');
|
||||||
|
await page.keyboard.press('Enter');
|
||||||
|
|
||||||
|
// En monospace-linje, og så retur: linjen efter skal være brødtekst, ikke mere
|
||||||
|
// monospace. Før rettelsen holdt en <pre> på markøren, og alt derefter blev ved
|
||||||
|
// med at være kode.
|
||||||
|
await page.getByRole('button', { name: 'Formatér' }).click();
|
||||||
|
await page.getByRole('menuitem', { name: 'Monotype' }).click();
|
||||||
|
await page.keyboard.type('kode linje');
|
||||||
|
await page.keyboard.press('Enter');
|
||||||
|
await page.keyboard.type('almindelig tekst');
|
||||||
|
|
||||||
|
// Koden står i sin blok; teksten efter står uden for den.
|
||||||
|
await expect(ed.locator('pre')).toHaveText('kode linje');
|
||||||
|
await expect(ed.locator('p').filter({ hasText: 'almindelig tekst' })).toBeVisible();
|
||||||
|
await expect(ed.locator('pre').filter({ hasText: 'almindelig tekst' })).toHaveCount(0);
|
||||||
|
|
||||||
|
// Shift+retur bliver derimod i blokken, så flerlinjet kode stadig kan skrives.
|
||||||
|
await page.getByRole('button', { name: 'Formatér' }).click();
|
||||||
|
await page.getByRole('menuitem', { name: 'Monotype' }).click();
|
||||||
|
await page.keyboard.type('linje et');
|
||||||
|
await page.keyboard.press('Shift+Enter');
|
||||||
|
await page.keyboard.type('linje to');
|
||||||
|
await expect(ed.locator('pre').filter({ hasText: 'linje et' })).toContainText('linje to');
|
||||||
|
|
||||||
|
// Og menuen kan føre en monospace-linje tilbage til brødtekst — dét, der før
|
||||||
|
// lagde et <p> inde i <pre> og ikke kom nogen vegne.
|
||||||
|
await page.getByRole('button', { name: 'Formatér' }).click();
|
||||||
|
await page.getByRole('menuitem', { name: 'Brødtekst' }).click();
|
||||||
|
// Den blok er nu brødtekst, ikke kode: den står som <p>, ikke i en <pre>.
|
||||||
|
await expect(ed.locator('p').filter({ hasText: 'linje et' })).toBeVisible();
|
||||||
|
await expect(ed.locator('pre').filter({ hasText: 'linje et' })).toHaveCount(0);
|
||||||
|
|
||||||
|
// Det overlever turen gennem Markdown. En ren note for sig, så prøven ikke
|
||||||
|
// afhænger af alt det ovenfor: kode, retur, brødtekst — gem, hent igen.
|
||||||
|
await page.getByRole('button', { name: 'Ny note' }).click();
|
||||||
|
await ed.click();
|
||||||
|
await page.keyboard.type('Rundtur');
|
||||||
|
await page.keyboard.press('Enter');
|
||||||
|
await page.getByRole('button', { name: 'Formatér' }).click();
|
||||||
|
await page.getByRole('menuitem', { name: 'Monotype' }).click();
|
||||||
|
await page.keyboard.type('docker pull');
|
||||||
|
await page.keyboard.press('Enter');
|
||||||
|
await page.keyboard.type('og så videre i almindelig skrift');
|
||||||
|
await ed.blur();
|
||||||
|
await page.waitForTimeout(1200);
|
||||||
|
await page.reload();
|
||||||
|
await page.getByRole('button', { name: /Rundtur/ }).click();
|
||||||
|
await expect(ed.locator('pre')).toContainText('docker pull');
|
||||||
|
await expect(ed.locator('p').filter({ hasText: 'almindelig skrift' })).toBeVisible();
|
||||||
|
await expect(ed.locator('pre').filter({ hasText: 'almindelig skrift' })).toHaveCount(0);
|
||||||
|
|
||||||
|
expect(trouble).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
test('kodeblokken har en kopiér-knap, og knappen havner ikke i filen', async ({ page }) => {
|
test('kodeblokken har en kopiér-knap, og knappen havner ikke i filen', async ({ page }) => {
|
||||||
const trouble = watchForTrouble(page);
|
const trouble = watchForTrouble(page);
|
||||||
await page.context().grantPermissions(['clipboard-read', 'clipboard-write']);
|
await page.context().grantPermissions(['clipboard-read', 'clipboard-write']);
|
||||||
@@ -3122,7 +3370,8 @@ test('flere noter kan markeres, arkiveres og hentes frem igen', async ({ page })
|
|||||||
await rows.filter({ hasText: 'Bravo' }).click({ modifiers: ['Meta'] });
|
await rows.filter({ hasText: 'Bravo' }).click({ modifiers: ['Meta'] });
|
||||||
await expect(page.getByText('2 markeret')).toBeVisible();
|
await expect(page.getByText('2 markeret')).toBeVisible();
|
||||||
|
|
||||||
await page.getByRole('button', { name: 'Arkivér', exact: true }).click();
|
// The selection bar's Arkivér, not the open note's own in the footer.
|
||||||
|
await page.locator('.picked-bar').getByRole('button', { name: 'Arkivér', exact: true }).click();
|
||||||
await page.waitForTimeout(900);
|
await page.waitForTimeout(900);
|
||||||
|
|
||||||
// Væk fra listen, og ikke i papirkurven: arkivering er ikke sletning.
|
// Væk fra listen, og ikke i papirkurven: arkivering er ikke sletning.
|
||||||
|
|||||||
@@ -73,6 +73,11 @@ const SHOTS = [
|
|||||||
{ name: 'detail', path: (ids) => `/opgave/${ids.detail}`, theme: 'dark' },
|
{ name: 'detail', path: (ids) => `/opgave/${ids.detail}`, theme: 'dark' },
|
||||||
{ name: 'notes', path: '/noter', theme: 'dark', prepare: openMeetingNote },
|
{ name: 'notes', path: '/noter', theme: 'dark', prepare: openMeetingNote },
|
||||||
{ name: 'notes-source', path: '/noter', theme: 'dark', prepare: showNoteSource },
|
{ name: 'notes-source', path: '/noter', theme: 'dark', prepare: showNoteSource },
|
||||||
|
// The new work, and in the light theme, which is what most people want to look
|
||||||
|
// at a landing page in. The calendar drawing tasks to their length, and a note
|
||||||
|
// somebody shared into the "Shared with me" group.
|
||||||
|
{ name: 'calendar-light', path: '/kalender', theme: 'light', prepare: showWeek },
|
||||||
|
{ name: 'notes-shared-light', path: '/noter', theme: 'light', prepare: openSharedNote },
|
||||||
{ name: 'delegated', path: '/uddelegeret', theme: 'dark' },
|
{ name: 'delegated', path: '/uddelegeret', theme: 'dark' },
|
||||||
{ name: 'settings', path: '/indstillinger/integrationer', theme: 'dark' },
|
{ name: 'settings', path: '/indstillinger/integrationer', theme: 'dark' },
|
||||||
// Scrolled, because the themes are the second panel on the page and a picture
|
// Scrolled, because the themes are the second panel on the page and a picture
|
||||||
@@ -114,6 +119,13 @@ async function showNoteSource(page) {
|
|||||||
await page.waitForTimeout(600);
|
await page.waitForTimeout(600);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function openSharedNote(page) {
|
||||||
|
// The note Mette shared in, so the "Shared with me" group and its owner chip are
|
||||||
|
// what the picture is of rather than something the group happens to sit above.
|
||||||
|
await page.locator('button.row', { hasText: 'Packaging quotes' }).first().click();
|
||||||
|
await page.waitForTimeout(600);
|
||||||
|
}
|
||||||
|
|
||||||
async function showThemes(page) {
|
async function showThemes(page) {
|
||||||
// scrollIntoView rather than Playwright's scrollIntoViewIfNeeded: the heading is
|
// scrollIntoView rather than Playwright's scrollIntoViewIfNeeded: the heading is
|
||||||
// already a few pixels inside the viewport when the page loads, so "if needed"
|
// already a few pixels inside the viewport when the page loads, so "if needed"
|
||||||
@@ -340,6 +352,23 @@ async function handOver(ids) {
|
|||||||
await api(`/tasks/${ids.detail}/comments`, {
|
await api(`/tasks/${ids.detail}/comments`, {
|
||||||
body: 'Room is booked for ten. Summer numbers are in the shared folder — the labels are still with the printer, I chase them Thursday.'
|
body: 'Room is booked for ten. Summer numbers are in the shared folder — the labels are still with the printer, I chase them Thursday.'
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// A note of Mette's own, handed to the owner — so their Notes page has a
|
||||||
|
// "Shared with me" group with a real note in it, marked as hers. This is the
|
||||||
|
// other half of sharing: not the project path, but a page passed to a person.
|
||||||
|
const note = await api('/notes', {
|
||||||
|
body: `# Packaging quotes
|
||||||
|
|
||||||
|
Three back, one still to come:
|
||||||
|
|
||||||
|
- **Nordfelt** — 79 øre a bag at 2,000, plates included
|
||||||
|
- **Kolding Karton** — 84 øre, faster, kinder about small runs
|
||||||
|
- Bruun still owes me a number
|
||||||
|
|
||||||
|
I'd lean Kolding for the first run and revisit at volume. #Autumn launch`
|
||||||
|
});
|
||||||
|
await api(`/notes/${note.id}/shares`, { user_id: ids.owner, role: 'editor' });
|
||||||
|
|
||||||
return { colleague: me.id };
|
return { colleague: me.id };
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -373,6 +402,8 @@ async function seed({ colleague, noteTitle }) {
|
|||||||
).padStart(2, '0')}`;
|
).padStart(2, '0')}`;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const me = await api('/auth/me', null, 'GET');
|
||||||
|
|
||||||
// Two headings over the projects, which is what the sidebar grew for.
|
// Two headings over the projects, which is what the sidebar grew for.
|
||||||
const work = await api('/project-groups', { name: 'Work' });
|
const work = await api('/project-groups', { name: 'Work' });
|
||||||
const home = await api('/project-groups', { name: 'Home' });
|
const home = await api('/project-groups', { name: 'Home' });
|
||||||
@@ -420,6 +451,17 @@ async function seed({ colleague, noteTitle }) {
|
|||||||
{ content: 'Water the greenhouse', due_date: day(0), recurrence_rule: 'FREQ=DAILY', project_id: garden.id },
|
{ content: 'Water the greenhouse', due_date: day(0), recurrence_rule: 'FREQ=DAILY', project_id: garden.id },
|
||||||
{ content: 'Collect the parcel from the post office', due_date: day(0), labels: ['errands'] },
|
{ content: 'Collect the parcel from the post office', due_date: day(0), labels: ['errands'] },
|
||||||
|
|
||||||
|
// A handful given a time and a length, so the calendar's week draws them to
|
||||||
|
// scale rather than as a row of identical blocks — a stand-up, a long
|
||||||
|
// planning block, a call, a review. Spread across the day and the days, so
|
||||||
|
// the picture is a week that has a shape.
|
||||||
|
{ content: 'Stand-up', due_date: day(0), due_time: '09:00', duration_min: 15, project_id: launch.id, section_id: inFlight.id },
|
||||||
|
{ content: 'Planning block', due_date: day(0), due_time: '10:00', duration_min: 90, priority: 2, project_id: launch.id, section_id: planning.id, labels: ['meeting'] },
|
||||||
|
{ content: 'Call with the printer', due_date: day(0), due_time: '13:30', duration_min: 30, project_id: launch.id, labels: ['waiting'] },
|
||||||
|
{ content: 'Interview: designer', due_date: day(1), due_time: '11:00', duration_min: 60, priority: 1, project_id: launch.id, section_id: inFlight.id },
|
||||||
|
{ content: 'Budget review', due_date: day(2), due_time: '14:00', duration_min: 45, priority: 1, project_id: launch.id, section_id: inFlight.id },
|
||||||
|
{ content: 'One-to-one with Mette', due_date: day(3), due_time: '15:30', duration_min: 30, project_id: launch.id },
|
||||||
|
|
||||||
// The next couple of weeks, so Upcoming and the month grid have something in
|
// The next couple of weeks, so Upcoming and the month grid have something in
|
||||||
// them rather than a row of empty cells.
|
// them rather than a row of empty cells.
|
||||||
{ content: 'Book a plumber for the bathroom', due_date: day(1), priority: 2, project_id: house.id },
|
{ content: 'Book a plumber for the bathroom', due_date: day(1), priority: 2, project_id: house.id },
|
||||||
@@ -441,6 +483,17 @@ async function seed({ colleague, noteTitle }) {
|
|||||||
const made = {};
|
const made = {};
|
||||||
for (const task of tasks) made[task.content] = await api('/tasks', task);
|
for (const task of tasks) made[task.content] = await api('/tasks', task);
|
||||||
|
|
||||||
|
// One task snoozed, so the board and the list show a card parked at the bottom
|
||||||
|
// of its section — greyed, with a "snoozed until" mark — set aside rather than
|
||||||
|
// forgotten, and without touching when it is due.
|
||||||
|
const snoozeUntil = (() => {
|
||||||
|
const d = new Date();
|
||||||
|
d.setDate(d.getDate() + 2);
|
||||||
|
d.setHours(9, 0, 0, 0);
|
||||||
|
return d.toISOString();
|
||||||
|
})();
|
||||||
|
await api(`/tasks/${made['Write the job advert'].id}/snooze`, { until: snoozeUntil });
|
||||||
|
|
||||||
// A saved filter, because the sidebar shows them and an empty heading reads as
|
// A saved filter, because the sidebar shows them and an empty heading reads as
|
||||||
// a feature that does not work.
|
// a feature that does not work.
|
||||||
await api('/filters', { name: 'Important this week', query: 'p1 & 7 days' });
|
await api('/filters', { name: 'Important this week', query: 'p1 & 7 days' });
|
||||||
@@ -560,6 +613,7 @@ The opening notes are a task, so they can be ticked off: task:${detail.id}`
|
|||||||
await api('/users', { email: '[email protected]' });
|
await api('/users', { email: '[email protected]' });
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
owner: me.id,
|
||||||
work: launch.id,
|
work: launch.id,
|
||||||
detail: detail.id,
|
detail: detail.id,
|
||||||
invite: invite.link,
|
invite: invite.link,
|
||||||
|
|||||||
@@ -310,6 +310,7 @@ export const api = {
|
|||||||
completeTask: (id) => post(`/tasks/${id}/complete`),
|
completeTask: (id) => post(`/tasks/${id}/complete`),
|
||||||
reopenTask: (id) => post(`/tasks/${id}/reopen`),
|
reopenTask: (id) => post(`/tasks/${id}/reopen`),
|
||||||
moveTask: (id, data) => post(`/tasks/${id}/move`, data),
|
moveTask: (id, data) => post(`/tasks/${id}/move`, data),
|
||||||
|
snoozeTask: (id, until) => post(`/tasks/${id}/snooze`, { until: until ?? '' }),
|
||||||
|
|
||||||
quickAdd: (text, projectId, sectionId) =>
|
quickAdd: (text, projectId, sectionId) =>
|
||||||
post('/tasks/quick-add', { text, project_id: projectId, section_id: sectionId }),
|
post('/tasks/quick-add', { text, project_id: projectId, section_id: sectionId }),
|
||||||
|
|||||||
@@ -286,6 +286,48 @@
|
|||||||
/** The cell lit up under the pointer. */
|
/** The cell lit up under the pointer. */
|
||||||
let over = $state(null);
|
let over = $state(null);
|
||||||
|
|
||||||
|
// A resize in progress: which task, and where its foot is being dragged to, in
|
||||||
|
// minutes since midnight. Kept apart from the stored length so the task can
|
||||||
|
// follow the handle live and only be written when the drag ends.
|
||||||
|
let resizing = $state(null);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Dragging the foot of a timed task changes how long it is.
|
||||||
|
*
|
||||||
|
* Pointer events rather than the HTML5 drag the body uses: the two must not be
|
||||||
|
* the same gesture, or every attempt to make a task longer would instead pick it
|
||||||
|
* up and move it. stopPropagation keeps the handle's press from starting the
|
||||||
|
* move, and the column it lives in is what the minutes are measured against —
|
||||||
|
* the same box onDropAt reads a drop time from.
|
||||||
|
*/
|
||||||
|
function startResize(event, task, date) {
|
||||||
|
event.stopPropagation();
|
||||||
|
event.preventDefault();
|
||||||
|
const col = event.currentTarget.closest('.daycol');
|
||||||
|
if (!col || !task.due_datetime) return;
|
||||||
|
const at = new Date(task.due_datetime);
|
||||||
|
const from = at.getHours() * 60 + at.getMinutes();
|
||||||
|
resizing = { id: task.id, from, to: from + (task.duration_min || 30), date: iso(date) };
|
||||||
|
|
||||||
|
const onMove = (e) => {
|
||||||
|
const box = col.getBoundingClientRect();
|
||||||
|
const share = Math.min(Math.max((e.clientY - box.top) / box.height, 0), 1);
|
||||||
|
const minutes = hours.from * 60 + share * hours.minutes;
|
||||||
|
// Quarter-hour steps, at least a quarter long, never past midnight.
|
||||||
|
const snapped = Math.min(Math.max(Math.round(minutes / 15) * 15, from + 15), 24 * 60);
|
||||||
|
resizing = { ...resizing, to: snapped };
|
||||||
|
};
|
||||||
|
const onUp = async () => {
|
||||||
|
window.removeEventListener('pointermove', onMove);
|
||||||
|
window.removeEventListener('pointerup', onUp);
|
||||||
|
const current = resizing;
|
||||||
|
resizing = null;
|
||||||
|
if (current) await app.resize(current.id, current.to - current.from);
|
||||||
|
};
|
||||||
|
window.addEventListener('pointermove', onMove);
|
||||||
|
window.addEventListener('pointerup', onUp);
|
||||||
|
}
|
||||||
|
|
||||||
function onDragOver(event, date) {
|
function onDragOver(event, date) {
|
||||||
if (!carries(event, TASK)) return;
|
if (!carries(event, TASK)) return;
|
||||||
accept(event);
|
accept(event);
|
||||||
@@ -394,7 +436,16 @@
|
|||||||
if (!task.due_datetime) continue;
|
if (!task.due_datetime) continue;
|
||||||
const at = new Date(task.due_datetime);
|
const at = new Date(task.due_datetime);
|
||||||
const from = at.getHours() * 60 + at.getMinutes();
|
const from = at.getHours() * 60 + at.getMinutes();
|
||||||
out.push({ kind: 'task', ref: task, from, to: from + 30 });
|
// The task's own length, not a fixed half hour. A quarter-hour floor so a
|
||||||
|
// zero-minute task is still something to see and grab, and the end of the
|
||||||
|
// day is the ceiling. While a resize is in flight this task follows the
|
||||||
|
// handle instead of its stored length.
|
||||||
|
let to =
|
||||||
|
resizing && resizing.id === task.id
|
||||||
|
? resizing.to
|
||||||
|
: from + (task.duration_min || 30);
|
||||||
|
to = Math.min(Math.max(to, from + 15), 24 * 60);
|
||||||
|
out.push({ kind: 'task', ref: task, from, to });
|
||||||
}
|
}
|
||||||
|
|
||||||
return out.toSorted((a, b) => a.from - b.from || a.to - b.to);
|
return out.toSorted((a, b) => a.from - b.from || a.to - b.to);
|
||||||
@@ -547,12 +598,13 @@
|
|||||||
</svelte:element>
|
</svelte:element>
|
||||||
{/snippet}
|
{/snippet}
|
||||||
|
|
||||||
{#snippet taskChip(task, kind, extra = '', at = '')}
|
{#snippet taskChip(task, kind, extra = '', at = '', date = null)}
|
||||||
<!-- Draggable as well as clickable: moving something to another day is the
|
<!-- Draggable as well as clickable: moving something to another day is the
|
||||||
whole reason to be looking at a calendar. The browser needs a few pixels
|
whole reason to be looking at a calendar. The browser needs a few pixels
|
||||||
of movement before it calls a press a drag, so the click survives. -->
|
of movement before it calls a press a drag, so the click survives. -->
|
||||||
<button
|
<button
|
||||||
class={kind}
|
class={kind}
|
||||||
|
class:resizing={resizing?.id === task.id}
|
||||||
data-priority={task.priority}
|
data-priority={task.priority}
|
||||||
draggable="true"
|
draggable="true"
|
||||||
ondragstart={(e) => startDrag(e, TASK, task.id)}
|
ondragstart={(e) => startDrag(e, TASK, task.id)}
|
||||||
@@ -562,6 +614,16 @@
|
|||||||
>
|
>
|
||||||
{#if at}<span class="at">{at}</span>{/if}
|
{#if at}<span class="at">{at}</span>{/if}
|
||||||
{task.content}
|
{task.content}
|
||||||
|
<!-- Only a task standing at a time can be made longer, and only where the
|
||||||
|
grid has room to show it — the timed column, which passes the date. -->
|
||||||
|
{#if date && task.due_datetime}
|
||||||
|
<span
|
||||||
|
class="resize"
|
||||||
|
title={t('cal.resize')}
|
||||||
|
aria-hidden="true"
|
||||||
|
onpointerdown={(e) => startResize(e, task, date)}
|
||||||
|
></span>
|
||||||
|
{/if}
|
||||||
</button>
|
</button>
|
||||||
{/snippet}
|
{/snippet}
|
||||||
|
|
||||||
@@ -632,7 +694,7 @@
|
|||||||
{#if item.kind === 'event'}
|
{#if item.kind === 'event'}
|
||||||
{@render eventChip(item.ref, date, 'tevent', place(item))}
|
{@render eventChip(item.ref, date, 'tevent', place(item))}
|
||||||
{:else}
|
{:else}
|
||||||
{@render taskChip(item.ref, 'tevent task', place(item), clock(item.from))}
|
{@render taskChip(item.ref, 'tevent task', place(item), clock(item.from), date)}
|
||||||
{/if}
|
{/if}
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
@@ -937,6 +999,29 @@
|
|||||||
cursor: grab;
|
cursor: grab;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* The grip along the foot of a task, for dragging its length. Out of the way
|
||||||
|
until the task is hovered or being resized, so it never competes with the
|
||||||
|
words above it. */
|
||||||
|
.tevent.task .resize {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
height: 7px;
|
||||||
|
cursor: ns-resize;
|
||||||
|
opacity: 0;
|
||||||
|
touch-action: none;
|
||||||
|
}
|
||||||
|
.tevent.task:hover .resize,
|
||||||
|
.tevent.task.resizing .resize {
|
||||||
|
opacity: 1;
|
||||||
|
background: linear-gradient(to bottom, transparent, var(--line-strong));
|
||||||
|
}
|
||||||
|
.tevent.task.resizing {
|
||||||
|
cursor: ns-resize;
|
||||||
|
z-index: 5;
|
||||||
|
}
|
||||||
|
|
||||||
.tevent.task[data-priority='1'] {
|
.tevent.task[data-priority='1'] {
|
||||||
border-left-color: var(--p1);
|
border-left-color: var(--p1);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -20,7 +20,7 @@
|
|||||||
import { api, humanMessage } from '$lib/api.js';
|
import { api, humanMessage } from '$lib/api.js';
|
||||||
import { colorVar } from '$lib/colors.js';
|
import { colorVar } from '$lib/colors.js';
|
||||||
|
|
||||||
let { note, onchange, onsave } = $props();
|
let { note, notes = [], onchange, onsave, onopennote } = $props();
|
||||||
|
|
||||||
let editor;
|
let editor;
|
||||||
// Forslagslisten, så tastaturvalget kan rulle den frem.
|
// Forslagslisten, så tastaturvalget kan rulle den frem.
|
||||||
@@ -120,11 +120,99 @@
|
|||||||
|
|
||||||
function setStyle(style) {
|
function setStyle(style) {
|
||||||
stylesOpen = false;
|
stylesOpen = false;
|
||||||
|
editor?.focus();
|
||||||
if (style.key === 'bullet') return apply('insertUnorderedList');
|
if (style.key === 'bullet') return apply('insertUnorderedList');
|
||||||
if (style.key === 'numbered') return apply('insertOrderedList');
|
if (style.key === 'numbered') return apply('insertOrderedList');
|
||||||
|
|
||||||
|
// formatBlock is unreliable around <pre>. Asked to turn a monospace line back
|
||||||
|
// into body, Chromium and WebKit nest a <p> *inside* the <pre> —
|
||||||
|
// `<pre>…<p>body</p></pre>` — so the text stays monospace and there is no way
|
||||||
|
// out of the block from the menu. Do any conversion that touches a <pre> by
|
||||||
|
// hand, replacing the element rather than reformatting inside it.
|
||||||
|
const block = currentBlock();
|
||||||
|
if (block && (block.tagName === 'PRE' || style.tag === 'pre')) {
|
||||||
|
replaceBlock(block, style.tag);
|
||||||
|
return;
|
||||||
|
}
|
||||||
apply('formatBlock', style.tag);
|
apply('formatBlock', style.tag);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Replaces a block element with one of another tag, keeping its contents and the
|
||||||
|
* caret. Used where execCommand cannot be trusted — converting to or from a
|
||||||
|
* <pre>, which it either nests or ignores.
|
||||||
|
*/
|
||||||
|
function replaceBlock(block, tag) {
|
||||||
|
// The copy button lives inside the <pre> so it can sit in its corner; it is
|
||||||
|
// not text and must not travel into a paragraph. addCopyButtons puts it back
|
||||||
|
// on the next render for any <pre> that still needs one.
|
||||||
|
block.querySelectorAll?.('.copy').forEach((b) => b.remove());
|
||||||
|
|
||||||
|
const el = document.createElement(tag);
|
||||||
|
while (block.firstChild) el.appendChild(block.firstChild);
|
||||||
|
if (!el.firstChild) el.appendChild(document.createElement('br'));
|
||||||
|
block.replaceWith(el);
|
||||||
|
|
||||||
|
const range = document.createRange();
|
||||||
|
range.selectNodeContents(el);
|
||||||
|
range.collapse(false);
|
||||||
|
const selection = window.getSelection();
|
||||||
|
selection.removeAllRanges();
|
||||||
|
selection.addRange(range);
|
||||||
|
|
||||||
|
readState();
|
||||||
|
changed();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Steps out of a code block on Enter.
|
||||||
|
*
|
||||||
|
* A <pre> is preformatted, so the browser answers Enter by inserting a <br> and
|
||||||
|
* staying inside it — which means a monospace last line makes every line after
|
||||||
|
* it monospace too, with no way back to body by typing. Plain Enter now leaves
|
||||||
|
* the block: the tail after the caret becomes a paragraph below the <pre>, and
|
||||||
|
* that is where the caret lands. Shift+Enter is left untouched, so a soft line
|
||||||
|
* break still writes multi-line code inside the block.
|
||||||
|
*/
|
||||||
|
function exitPre(pre) {
|
||||||
|
pre.querySelectorAll('.copy').forEach((b) => b.remove());
|
||||||
|
|
||||||
|
const selection = window.getSelection();
|
||||||
|
const range = selection.getRangeAt(0);
|
||||||
|
|
||||||
|
// Everything from the caret to the end of the block leaves with the new line.
|
||||||
|
const tail = document.createRange();
|
||||||
|
tail.setStart(range.endContainer, range.endOffset);
|
||||||
|
tail.setEnd(pre, pre.childNodes.length);
|
||||||
|
const frag = tail.extractContents();
|
||||||
|
|
||||||
|
// A break at the head of what we carried is the empty line return was pressed
|
||||||
|
// on; it should not open the paragraph with a blank row.
|
||||||
|
while (frag.firstChild && frag.firstChild.nodeName === 'BR') frag.removeChild(frag.firstChild);
|
||||||
|
|
||||||
|
const p = document.createElement('p');
|
||||||
|
if (frag.childNodes.length) p.appendChild(frag);
|
||||||
|
// The split can leave an empty text node behind, and a block with no element
|
||||||
|
// and no text is not a caret host in Chromium — the next keystroke falls back
|
||||||
|
// into the block above. An empty paragraph needs a <br> to be stood in.
|
||||||
|
if (!p.textContent && !p.querySelector('br, img')) {
|
||||||
|
p.replaceChildren(document.createElement('br'));
|
||||||
|
}
|
||||||
|
|
||||||
|
// And the same break seen from the other side, left dangling in the <pre>.
|
||||||
|
while (pre.lastChild && pre.lastChild.nodeName === 'BR') pre.removeChild(pre.lastChild);
|
||||||
|
|
||||||
|
// Leaving an empty block behind is leaving nothing: the <pre> itself goes.
|
||||||
|
if (!pre.textContent.trim()) pre.replaceWith(p);
|
||||||
|
else pre.after(p);
|
||||||
|
|
||||||
|
const caret = document.createRange();
|
||||||
|
caret.setStart(p, 0);
|
||||||
|
caret.collapse(true);
|
||||||
|
selection.removeAllRanges();
|
||||||
|
selection.addRange(caret);
|
||||||
|
}
|
||||||
|
|
||||||
/** What the caret is standing in, for the toolbar's pressed states. */
|
/** What the caret is standing in, for the toolbar's pressed states. */
|
||||||
function readState() {
|
function readState() {
|
||||||
if (!editor) return;
|
if (!editor) return;
|
||||||
@@ -302,9 +390,26 @@
|
|||||||
if (!node || node.nodeType !== Node.TEXT_NODE || !selection.isCollapsed) return null;
|
if (!node || node.nodeType !== Node.TEXT_NODE || !selection.isCollapsed) return null;
|
||||||
|
|
||||||
const before = node.textContent.slice(0, selection.anchorOffset);
|
const before = node.textContent.slice(0, selection.anchorOffset);
|
||||||
const match = /(?:^|\s)#([\p{L}\p{N}_-]*)$/u.exec(before);
|
|
||||||
if (!match) return null;
|
// A note link, [[, is the same idea as a project tag and gets the same
|
||||||
return { node, start: selection.anchorOffset - match[1].length, term: match[1] };
|
// completion — checked first because it is the longer opener. The term runs
|
||||||
|
// to the caret and is anything up to the closing bracket, which has not been
|
||||||
|
// typed yet.
|
||||||
|
const note = /\[\[([^\]\n]*)$/u.exec(before);
|
||||||
|
if (note) {
|
||||||
|
return { kind: 'note', node, start: selection.anchorOffset - note[1].length, term: note[1] };
|
||||||
|
}
|
||||||
|
|
||||||
|
const project = /(?:^|\s)#([\p{L}\p{N}_-]*)$/u.exec(before);
|
||||||
|
if (project) {
|
||||||
|
return {
|
||||||
|
kind: 'project',
|
||||||
|
node,
|
||||||
|
start: selection.anchorOffset - project[1].length,
|
||||||
|
term: project[1]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -348,46 +453,87 @@
|
|||||||
// pixels for hvert bogstav, mens listen snævres ind.
|
// pixels for hvert bogstav, mens listen snævres ind.
|
||||||
if (!suggestions.length) menuAt = tagPosition(partial);
|
if (!suggestions.length) menuAt = tagPosition(partial);
|
||||||
|
|
||||||
// Alle der passer, ikke de seks første.
|
suggestions = partial.kind === 'note' ? noteMatches(term) : projectMatches(term);
|
||||||
//
|
|
||||||
// Loftet på seks var sat, dengang listen ikke kunne rulle, og det gjorde
|
|
||||||
// noget værre end at skjule: med tyve projekter og et blot tastet `#` viste
|
|
||||||
// den seks vilkårlige og så færdig ud. Man kunne ikke se, at der manglede
|
|
||||||
// noget — kun at ens eget projekt ikke var der.
|
|
||||||
//
|
|
||||||
// Rækkefølgen bærer nu det, loftet gjorde forkert: det, der begynder med
|
|
||||||
// det tastede, står øverst, resten alfabetisk. Skriver man "ga", er
|
|
||||||
// GarageRisteriet den første, ikke den, der tilfældigvis lå først.
|
|
||||||
const matches = app.projects.filter(
|
|
||||||
(p) => !p.is_inbox && p.name.toLowerCase().includes(term)
|
|
||||||
);
|
|
||||||
matches.sort((a, b) => {
|
|
||||||
const an = a.name.toLowerCase();
|
|
||||||
const bn = b.name.toLowerCase();
|
|
||||||
const ap = an.startsWith(term);
|
|
||||||
const bp = bn.startsWith(term);
|
|
||||||
if (ap !== bp) return ap ? -1 : 1;
|
|
||||||
return an.localeCompare(bn, 'da');
|
|
||||||
});
|
|
||||||
suggestions = matches;
|
|
||||||
chosen = 0;
|
chosen = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Replaces the half-typed tag with the whole name. */
|
// Alle der passer, ikke de seks første. Rækkefølgen bærer det: det, der begynder
|
||||||
function accept(project) {
|
// med det tastede, står øverst, resten alfabetisk. Skriver man "ga", er
|
||||||
|
// GarageRisteriet den første, ikke den, der tilfældigvis lå først.
|
||||||
|
function projectMatches(term) {
|
||||||
|
return app.projects
|
||||||
|
.filter((p) => !p.is_inbox && p.name.toLowerCase().includes(term))
|
||||||
|
.map((p) => ({ id: p.id, kind: 'project', label: p.name, color: p.color }))
|
||||||
|
.sort((a, b) => rank(a.label, b.label, term));
|
||||||
|
}
|
||||||
|
|
||||||
|
// The same completion for [[ as for #, over the notes the page has loaded. The
|
||||||
|
// current note is left out — a note that links to itself is a loop nobody meant
|
||||||
|
// — and a note with no title yet cannot be pointed at, so it is skipped too.
|
||||||
|
function noteMatches(term) {
|
||||||
|
return notes
|
||||||
|
.filter((n) => n.id !== note?.id && n.title && n.title.toLowerCase().includes(term))
|
||||||
|
.map((n) => ({ id: n.id, kind: 'note', label: n.title }))
|
||||||
|
.sort((a, b) => rank(a.label, b.label, term));
|
||||||
|
}
|
||||||
|
|
||||||
|
function rank(a, b, term) {
|
||||||
|
const al = a.toLowerCase();
|
||||||
|
const bl = b.toLowerCase();
|
||||||
|
const ap = al.startsWith(term);
|
||||||
|
const bp = bl.startsWith(term);
|
||||||
|
if (ap !== bp) return ap ? -1 : 1;
|
||||||
|
return al.localeCompare(bl, 'da');
|
||||||
|
}
|
||||||
|
|
||||||
|
const escHtml = (s) => s.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
||||||
|
const escAttr = (s) => escHtml(s).replace(/"/g, '"');
|
||||||
|
|
||||||
|
// A click on a note link follows it; a click anywhere else re-colours the code,
|
||||||
|
// as it did before. The link is contenteditable="false", so the click is a click
|
||||||
|
// and not a caret landing in the middle of a word.
|
||||||
|
function onEditorClick(event) {
|
||||||
|
const link = event.target.closest?.('.notelink');
|
||||||
|
if (link) {
|
||||||
|
event.preventDefault();
|
||||||
|
onopennote?.(link.getAttribute('data-note') ?? link.textContent);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
colourCode();
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Replaces the half-typed tag with the whole thing. */
|
||||||
|
function accept(item) {
|
||||||
const partial = partialTag();
|
const partial = partialTag();
|
||||||
if (!partial) return;
|
if (!partial) return;
|
||||||
|
|
||||||
const range = document.createRange();
|
const range = document.createRange();
|
||||||
range.setStart(partial.node, partial.start);
|
|
||||||
range.setEnd(partial.node, partial.start + partial.term.length);
|
|
||||||
const selection = window.getSelection();
|
const selection = window.getSelection();
|
||||||
selection.removeAllRanges();
|
|
||||||
selection.addRange(range);
|
|
||||||
|
|
||||||
// A trailing space, because the next thing typed is a word and not more of
|
if (item.kind === 'note') {
|
||||||
// the tag — and without it the suggestions come straight back.
|
// Swallow the opening [[ as well and drop the finished link in its place,
|
||||||
document.execCommand('insertText', false, project.name + ' ');
|
// so it is a link the moment it is chosen — not the brackets, waiting to
|
||||||
|
// become one when the note is next opened. A space after, as its own text,
|
||||||
|
// so the caret leaves the atomic link and the next word is a word.
|
||||||
|
range.setStart(partial.node, partial.start - 2);
|
||||||
|
range.setEnd(partial.node, partial.start + partial.term.length);
|
||||||
|
selection.removeAllRanges();
|
||||||
|
selection.addRange(range);
|
||||||
|
document.execCommand(
|
||||||
|
'insertHTML',
|
||||||
|
false,
|
||||||
|
`<a class="notelink" data-note="${escAttr(item.label)}" contenteditable="false">${escHtml(item.label)}</a>`
|
||||||
|
);
|
||||||
|
document.execCommand('insertText', false, ' ');
|
||||||
|
} else {
|
||||||
|
range.setStart(partial.node, partial.start);
|
||||||
|
range.setEnd(partial.node, partial.start + partial.term.length);
|
||||||
|
selection.removeAllRanges();
|
||||||
|
selection.addRange(range);
|
||||||
|
// A trailing space, or the suggestions come straight back for the tag.
|
||||||
|
document.execCommand('insertText', false, `${item.label} `);
|
||||||
|
}
|
||||||
|
|
||||||
suggestions = [];
|
suggestions = [];
|
||||||
onchange?.(htmlToMarkdown(editor));
|
onchange?.(htmlToMarkdown(editor));
|
||||||
}
|
}
|
||||||
@@ -470,6 +616,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (event.key === 'Enter' && !event.shiftKey) {
|
if (event.key === 'Enter' && !event.shiftKey) {
|
||||||
|
// A code block is the one place the browser keeps the caret inside on
|
||||||
|
// Enter rather than starting a new block. Step out of it ourselves, or a
|
||||||
|
// monospace last line traps everything typed after it in monospace.
|
||||||
|
const block = currentBlock();
|
||||||
|
if (block && block.tagName === 'PRE') {
|
||||||
|
event.preventDefault();
|
||||||
|
exitPre(block);
|
||||||
|
changed();
|
||||||
|
return;
|
||||||
|
}
|
||||||
// After the split, not before it.
|
// After the split, not before it.
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
keepTitleFirst();
|
keepTitleFirst();
|
||||||
@@ -678,7 +834,7 @@
|
|||||||
readState();
|
readState();
|
||||||
readSuggestions();
|
readSuggestions();
|
||||||
}}
|
}}
|
||||||
onclick={colourCode}
|
onclick={onEditorClick}
|
||||||
onmouseup={readState}
|
onmouseup={readState}
|
||||||
{onkeydown}
|
{onkeydown}
|
||||||
{onpaste}
|
{onpaste}
|
||||||
@@ -698,7 +854,7 @@
|
|||||||
style:top={menuAt ? `${menuAt.top}px` : null}
|
style:top={menuAt ? `${menuAt.top}px` : null}
|
||||||
style:left={menuAt ? `${menuAt.left}px` : null}
|
style:left={menuAt ? `${menuAt.left}px` : null}
|
||||||
>
|
>
|
||||||
{#each suggestions as project, i (project.id)}
|
{#each suggestions as item, i (item.kind + item.id)}
|
||||||
<li>
|
<li>
|
||||||
<button
|
<button
|
||||||
class:on={i === chosen}
|
class:on={i === chosen}
|
||||||
@@ -706,12 +862,17 @@
|
|||||||
aria-selected={i === chosen}
|
aria-selected={i === chosen}
|
||||||
onmousedown={(e) => {
|
onmousedown={(e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
accept(project);
|
accept(item);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<span class="dot" style="background: {colorVar(project.color)}" aria-hidden="true"
|
{#if item.kind === 'note'}
|
||||||
></span>
|
<span class="dot note" aria-hidden="true">[[</span>
|
||||||
#{project.name}
|
{item.label}
|
||||||
|
{:else}
|
||||||
|
<span class="dot" style="background: {colorVar(item.color)}" aria-hidden="true"
|
||||||
|
></span>
|
||||||
|
#{item.label}
|
||||||
|
{/if}
|
||||||
</button>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
{/each}
|
{/each}
|
||||||
@@ -864,6 +1025,18 @@
|
|||||||
font-size: var(--text-sm);
|
font-size: var(--text-sm);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* A note suggestion wears the brackets that open it where a project wears its
|
||||||
|
colour, so the two kinds are told apart at a glance in the same list. */
|
||||||
|
.suggestions .dot.note {
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
background: none;
|
||||||
|
color: var(--ink-faint);
|
||||||
|
font-family: var(--mono, ui-monospace, monospace);
|
||||||
|
font-size: 0.85em;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.suggestions button.on {
|
.suggestions button.on {
|
||||||
background: var(--surface);
|
background: var(--surface);
|
||||||
color: var(--ink);
|
color: var(--ink);
|
||||||
@@ -1023,6 +1196,18 @@
|
|||||||
margin: var(--s2) 0;
|
margin: var(--s2) 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* A note link reads as a link: the accent colour, underlined on hover, and a
|
||||||
|
pointer so it is plainly something to click rather than to edit. */
|
||||||
|
.page :global(a.notelink) {
|
||||||
|
color: var(--accent);
|
||||||
|
text-decoration: none;
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: var(--radius-sm);
|
||||||
|
}
|
||||||
|
.page :global(a.notelink:hover) {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
.page :global(blockquote) {
|
.page :global(blockquote) {
|
||||||
margin: 0 0 var(--s2);
|
margin: 0 0 var(--s2);
|
||||||
padding-left: var(--s3);
|
padding-left: var(--s3);
|
||||||
|
|||||||
@@ -13,7 +13,7 @@
|
|||||||
import { api, humanMessage } from '$lib/api.js';
|
import { api, humanMessage } from '$lib/api.js';
|
||||||
import { app, projectName, clockOf } from '$lib/stores.svelte.js';
|
import { app, projectName, clockOf } from '$lib/stores.svelte.js';
|
||||||
import { focusOnMount } from '$lib/focus.js';
|
import { focusOnMount } from '$lib/focus.js';
|
||||||
import { t } from '$lib/i18n.svelte.js';
|
import { t, tag } from '$lib/i18n.svelte.js';
|
||||||
import { REPEATS } from '$lib/when.js';
|
import { REPEATS } from '$lib/when.js';
|
||||||
|
|
||||||
let { task, onclose } = $props();
|
let { task, onclose } = $props();
|
||||||
@@ -23,6 +23,49 @@
|
|||||||
let priority = $state(4);
|
let priority = $state(4);
|
||||||
let dueDate = $state('');
|
let dueDate = $state('');
|
||||||
let dueTime = $state('');
|
let dueTime = $state('');
|
||||||
|
// Length in minutes, as a string for the field. Only meaningful with a time —
|
||||||
|
// see the field below — so it is seeded and shown alongside the clock.
|
||||||
|
let duration = $state('');
|
||||||
|
let snoozeCustom = $state('');
|
||||||
|
|
||||||
|
const snoozed = $derived(!!task?.snoozed_until && new Date(task.snoozed_until) > new Date());
|
||||||
|
const snoozedText = $derived(
|
||||||
|
snoozed
|
||||||
|
? new Date(task.snoozed_until).toLocaleString(tag(), {
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'short',
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
})
|
||||||
|
: ''
|
||||||
|
);
|
||||||
|
|
||||||
|
async function snoozeTo(iso) {
|
||||||
|
snoozeCustom = '';
|
||||||
|
try {
|
||||||
|
await app.snooze(task.id, iso);
|
||||||
|
} catch (e) {
|
||||||
|
app.toast(humanMessage(e));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Quick picks, in local time, as ISO for the API. This evening is six; the
|
||||||
|
// morning ones are nine; next week is the coming Monday.
|
||||||
|
const atLocal = (d, h) => {
|
||||||
|
d.setHours(h, 0, 0, 0);
|
||||||
|
return d.toISOString();
|
||||||
|
};
|
||||||
|
const thisEvening = () => atLocal(new Date(), 18);
|
||||||
|
const tomorrowMorning = () => {
|
||||||
|
const d = new Date();
|
||||||
|
d.setDate(d.getDate() + 1);
|
||||||
|
return atLocal(d, 9);
|
||||||
|
};
|
||||||
|
const nextWeek = () => {
|
||||||
|
const d = new Date();
|
||||||
|
d.setDate(d.getDate() + (((8 - d.getDay()) % 7) || 7));
|
||||||
|
return atLocal(d, 9);
|
||||||
|
};
|
||||||
let labels = $state('');
|
let labels = $state('');
|
||||||
let projectId = $state('');
|
let projectId = $state('');
|
||||||
let recurrence = $state('');
|
let recurrence = $state('');
|
||||||
@@ -57,6 +100,7 @@
|
|||||||
priority = task.priority;
|
priority = task.priority;
|
||||||
dueDate = task.due_date ?? '';
|
dueDate = task.due_date ?? '';
|
||||||
dueTime = task.due_datetime ? clockOf(task.due_datetime) : '';
|
dueTime = task.due_datetime ? clockOf(task.due_datetime) : '';
|
||||||
|
duration = task.duration_min ? String(task.duration_min) : '';
|
||||||
labels = (task.labels ?? []).join(', ');
|
labels = (task.labels ?? []).join(', ');
|
||||||
projectId = task.project_id;
|
projectId = task.project_id;
|
||||||
recurrence = task.recurrence_rule ?? '';
|
recurrence = task.recurrence_rule ?? '';
|
||||||
@@ -436,10 +480,50 @@
|
|||||||
disabled={!dueDate}
|
disabled={!dueDate}
|
||||||
onchange={() => save({ due_date: dueDate, due_time: dueTime })}
|
onchange={() => save({ due_date: dueDate, due_time: dueTime })}
|
||||||
/>
|
/>
|
||||||
|
<!-- Length in minutes, and only with a time to hang it on: a duration
|
||||||
|
without a start is a length of nothing, and the calendar has
|
||||||
|
nowhere to draw it. Empty clears it. -->
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
class="dur"
|
||||||
|
min="0"
|
||||||
|
step="15"
|
||||||
|
aria-label={t('detail.duration')}
|
||||||
|
placeholder={t('detail.durationShort')}
|
||||||
|
bind:value={duration}
|
||||||
|
disabled={!dueTime}
|
||||||
|
onchange={() =>
|
||||||
|
save({ duration_min: duration === '' ? 0 : Math.max(0, Math.round(Number(duration))) })}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Snooze: park it out of the way until a moment, without touching when it is
|
||||||
|
due. While snoozed the row greys and sinks to the bottom of its list. -->
|
||||||
|
<div class="field">
|
||||||
|
<span class="field-label">{t('detail.snooze')}</span>
|
||||||
|
{#if snoozed}
|
||||||
|
<div class="snoozed-now">
|
||||||
|
<span>{t('task.snoozedUntil', { when: snoozedText })}</span>
|
||||||
|
<button class="snooze-btn" onclick={() => snoozeTo('')}>{t('detail.wake')}</button>
|
||||||
|
</div>
|
||||||
|
{:else}
|
||||||
|
<div class="snooze-row">
|
||||||
|
<button class="snooze-btn" onclick={() => snoozeTo(thisEvening())}>{t('detail.thisEvening')}</button>
|
||||||
|
<button class="snooze-btn" onclick={() => snoozeTo(tomorrowMorning())}>{t('detail.tomorrow')}</button>
|
||||||
|
<button class="snooze-btn" onclick={() => snoozeTo(nextWeek())}>{t('detail.nextWeek')}</button>
|
||||||
|
<input
|
||||||
|
type="datetime-local"
|
||||||
|
class="snooze-custom"
|
||||||
|
aria-label={t('detail.snoozeCustom')}
|
||||||
|
bind:value={snoozeCustom}
|
||||||
|
onchange={() => snoozeCustom && snoozeTo(new Date(snoozeCustom).toISOString())}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label for="labels">{t('detail.labels')}</label>
|
<label for="labels">{t('detail.labels')}</label>
|
||||||
<input
|
<input
|
||||||
@@ -731,6 +815,11 @@
|
|||||||
width: 7.5rem;
|
width: 7.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.due input.dur {
|
||||||
|
flex: none;
|
||||||
|
width: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.due input:disabled {
|
.due input:disabled {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
}
|
}
|
||||||
@@ -741,13 +830,47 @@
|
|||||||
gap: var(--s2);
|
gap: var(--s2);
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
label,
|
||||||
|
.field-label {
|
||||||
font-size: var(--text-xs);
|
font-size: var(--text-xs);
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
letter-spacing: 0.06em;
|
letter-spacing: 0.06em;
|
||||||
color: var(--ink-faint);
|
color: var(--ink-faint);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.snooze-row {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: var(--s1);
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.snooze-btn {
|
||||||
|
width: auto;
|
||||||
|
padding: var(--s1) var(--s2);
|
||||||
|
font-size: var(--text-xs);
|
||||||
|
background: var(--surface);
|
||||||
|
border: 1px solid var(--line);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
color: var(--ink);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.snooze-btn:hover {
|
||||||
|
background: var(--surface-raised);
|
||||||
|
}
|
||||||
|
.snooze-custom {
|
||||||
|
width: auto;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 9rem;
|
||||||
|
}
|
||||||
|
.snoozed-now {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: var(--s2);
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
color: var(--ink-muted);
|
||||||
|
}
|
||||||
|
|
||||||
input,
|
input,
|
||||||
textarea,
|
textarea,
|
||||||
select {
|
select {
|
||||||
@@ -992,5 +1115,21 @@
|
|||||||
width: auto;
|
width: auto;
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Two columns is half a phone each: Prioritet collapses to "Ing" and the
|
||||||
|
due-row (date + fixed-width time + duration) runs off the right edge. One
|
||||||
|
column per field gives each its full width; the due-row wraps if even that
|
||||||
|
is not enough. */
|
||||||
|
.grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.due {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.due input[type='date'] {
|
||||||
|
flex: 1 1 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -120,7 +120,18 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
let ordered = $derived([...tasks].sort((a, b) => a.sort_order - b.sort_order));
|
// A snoozed task sinks below the rest, then rises back when its time passes —
|
||||||
|
// the same order the server sorts a list in, kept here so a drag-sorted list
|
||||||
|
// agrees rather than jumping when it reloads.
|
||||||
|
const snoozedNow = (t) => t.snoozed_until && new Date(t.snoozed_until) > new Date();
|
||||||
|
let ordered = $derived(
|
||||||
|
[...tasks].sort((a, b) => {
|
||||||
|
const sa = snoozedNow(a) ? 1 : 0;
|
||||||
|
const sb = snoozedNow(b) ? 1 : 0;
|
||||||
|
if (sa !== sb) return sa - sb;
|
||||||
|
return a.sort_order - b.sort_order;
|
||||||
|
})
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#each ordered as task (task.id)}
|
{#each ordered as task (task.id)}
|
||||||
|
|||||||
@@ -11,6 +11,7 @@
|
|||||||
import { app } from '$lib/stores.svelte.js';
|
import { app } from '$lib/stores.svelte.js';
|
||||||
import { t, tag } from '$lib/i18n.svelte.js';
|
import { t, tag } from '$lib/i18n.svelte.js';
|
||||||
import { repeatLabel } from '$lib/when.js';
|
import { repeatLabel } from '$lib/when.js';
|
||||||
|
import { linkify } from '$lib/linkify.js';
|
||||||
|
|
||||||
let { task, onedit } = $props();
|
let { task, onedit } = $props();
|
||||||
|
|
||||||
@@ -63,9 +64,30 @@
|
|||||||
})
|
})
|
||||||
: null
|
: null
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Snoozed while its time is still ahead. Greys the row and adds a "slumret til"
|
||||||
|
// mark, so a parked task reads as set-aside rather than forgotten.
|
||||||
|
let snoozed = $derived(task.snoozed_until && new Date(task.snoozed_until) > new Date());
|
||||||
|
let snoozedLabel = $derived.by(() => {
|
||||||
|
if (!snoozed) return null;
|
||||||
|
const at = new Date(task.snoozed_until);
|
||||||
|
const midnight = new Date();
|
||||||
|
midnight.setHours(0, 0, 0, 0);
|
||||||
|
const days = Math.round((new Date(at.toDateString()) - midnight) / 86400000);
|
||||||
|
const clock = at.toLocaleTimeString(tag(), { hour: '2-digit', minute: '2-digit' });
|
||||||
|
if (days <= 0) return clock;
|
||||||
|
if (days === 1) return t('task.tomorrow') + ' ' + clock;
|
||||||
|
return at.toLocaleDateString(tag(), { day: 'numeric', month: 'short' }) + ' ' + clock;
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="row" class:leaving class:completed={task.completed} data-priority={task.priority}>
|
<div
|
||||||
|
class="row"
|
||||||
|
class:leaving
|
||||||
|
class:completed={task.completed}
|
||||||
|
class:snoozed
|
||||||
|
data-priority={task.priority}
|
||||||
|
>
|
||||||
<button
|
<button
|
||||||
class="check"
|
class="check"
|
||||||
class:checked={task.completed || leaving}
|
class:checked={task.completed || leaving}
|
||||||
@@ -78,13 +100,44 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<!-- Opening the detail drawer is the default. `onedit` is for the callers that
|
<!-- A URL pasted into the title or the description is clickable, without the
|
||||||
want the click to mean something else. -->
|
text ever having been anything but plain text. The link is a real <a>, which
|
||||||
<button class="body" onclick={() => (onedit ? onedit(task) : app.openDetail(task.id))}>
|
an <a> in a <button> may not be — so the body is a role=button rather than a
|
||||||
<span class="content">{task.content}</span>
|
button, and each link stops its click from also opening the task. Clicking
|
||||||
|
any plain text still opens it. -->
|
||||||
|
<!-- svelte-ignore a11y_no_static_element_interactions -->
|
||||||
|
<div
|
||||||
|
class="body"
|
||||||
|
role="button"
|
||||||
|
tabindex="0"
|
||||||
|
onclick={() => (onedit ? onedit(task) : app.openDetail(task.id))}
|
||||||
|
onkeydown={(e) => {
|
||||||
|
if (e.key === 'Enter' || e.key === ' ') {
|
||||||
|
e.preventDefault();
|
||||||
|
onedit ? onedit(task) : app.openDetail(task.id);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<span class="content"
|
||||||
|
>{#each linkify(task.content) as run}{#if run.href}<a
|
||||||
|
class="tlink"
|
||||||
|
href={run.href}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
onclick={(e) => e.stopPropagation()}>{run.text}</a
|
||||||
|
>{:else}{run.text}{/if}{/each}</span
|
||||||
|
>
|
||||||
|
|
||||||
{#if task.description}
|
{#if task.description}
|
||||||
<span class="description">{task.description}</span>
|
<span class="description"
|
||||||
|
>{#each linkify(task.description) as run}{#if run.href}<a
|
||||||
|
class="tlink"
|
||||||
|
href={run.href}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
onclick={(e) => e.stopPropagation()}>{run.text}</a
|
||||||
|
>{:else}{run.text}{/if}{/each}</span
|
||||||
|
>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{#if assignee || due || task.labels?.length || repeats || task.subtask_count || task.attachment_count}
|
{#if assignee || due || task.labels?.length || repeats || task.subtask_count || task.attachment_count}
|
||||||
@@ -92,14 +145,28 @@
|
|||||||
{#if assignee}
|
{#if assignee}
|
||||||
<!-- First in the row, because "who" changes what the rest of the line
|
<!-- First in the row, because "who" changes what the rest of the line
|
||||||
means: a date on somebody else's task is their deadline, not
|
means: a date on somebody else's task is their deadline, not
|
||||||
yours. -->
|
yours. The hand-off arrow marks it as delegated — out of your
|
||||||
<span class="assignee" title={t('task.assignee', { name: assignee.name })}>
|
hands and into theirs — so a list reads at a glance as which are
|
||||||
|
yours to do and which you are waiting on. -->
|
||||||
|
<span class="assignee" title={t('task.delegatedTo', { name: assignee.name })}>
|
||||||
|
<svg class="handoff" viewBox="0 0 24 24" aria-hidden="true">
|
||||||
|
<path d="M13 5l7 7-7 7" />
|
||||||
|
<path d="M20 12H4" />
|
||||||
|
</svg>
|
||||||
<span class="face" style="background: {assignee.avatar_color}">
|
<span class="face" style="background: {assignee.avatar_color}">
|
||||||
{assignee.name[0]?.toUpperCase() ?? '?'}
|
{assignee.name[0]?.toUpperCase() ?? '?'}
|
||||||
</span>
|
</span>
|
||||||
{assignee.name}
|
{assignee.name}
|
||||||
</span>
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
|
{#if snoozed}
|
||||||
|
<span class="snooze-mark" title={t('task.snoozedUntil', { when: snoozedLabel })}>
|
||||||
|
<svg viewBox="0 0 24 24" aria-hidden="true">
|
||||||
|
<path d="M4 6h8l-8 8h8" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" />
|
||||||
|
</svg>
|
||||||
|
{snoozedLabel}
|
||||||
|
</span>
|
||||||
|
{/if}
|
||||||
{#if due}
|
{#if due}
|
||||||
<span class="due" data-tone={due.tone}>
|
<span class="due" data-tone={due.tone}>
|
||||||
{due.text}{#if time} {time}{/if}
|
{due.text}{#if time} {time}{/if}
|
||||||
@@ -151,7 +218,7 @@
|
|||||||
{/each}
|
{/each}
|
||||||
</span>
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
</button>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
@@ -183,6 +250,26 @@
|
|||||||
text-decoration-color: var(--ink-faint);
|
text-decoration-color: var(--ink-faint);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Parked, not gone: dimmed so it reads as set aside, but still there and still
|
||||||
|
readable. The checkbox and the snooze mark keep their weight, so it can be
|
||||||
|
woken or ticked off without peering at it. */
|
||||||
|
.row.snoozed .content,
|
||||||
|
.row.snoozed .description,
|
||||||
|
.row.snoozed .meta {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
.snooze-mark {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 3px;
|
||||||
|
color: var(--ink-muted);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
.snooze-mark svg {
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
.check {
|
.check {
|
||||||
flex: none;
|
flex: none;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
@@ -252,6 +339,13 @@
|
|||||||
gap: 2px;
|
gap: 2px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: var(--radius-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.body:focus-visible {
|
||||||
|
outline: 2px solid var(--accent);
|
||||||
|
outline-offset: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
@@ -260,6 +354,20 @@
|
|||||||
overflow-wrap: anywhere;
|
overflow-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* A real link, so it can be middle-clicked, copied and previewed. Its own click
|
||||||
|
is stopped from bubbling, so opening the page does not also open the task. */
|
||||||
|
.tlink {
|
||||||
|
color: var(--accent);
|
||||||
|
text-decoration: underline;
|
||||||
|
text-decoration-thickness: 1px;
|
||||||
|
text-underline-offset: 2px;
|
||||||
|
overflow-wrap: anywhere;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlink:hover {
|
||||||
|
text-decoration-thickness: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
.description {
|
.description {
|
||||||
font-size: var(--text-sm);
|
font-size: var(--text-sm);
|
||||||
color: var(--ink-muted);
|
color: var(--ink-muted);
|
||||||
@@ -309,8 +417,25 @@
|
|||||||
.assignee {
|
.assignee {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: var(--s1);
|
gap: 4px;
|
||||||
color: var(--ink-muted);
|
color: var(--ink-muted);
|
||||||
|
background: var(--surface-raised);
|
||||||
|
border: 1px solid var(--line);
|
||||||
|
border-radius: var(--radius-full);
|
||||||
|
padding: 1px var(--s2) 1px 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* The delegation mark: an arrow leaving, in the accent so the chip reads as
|
||||||
|
handed-off rather than as just another name. */
|
||||||
|
.handoff {
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
fill: none;
|
||||||
|
stroke: var(--accent);
|
||||||
|
stroke-width: 2;
|
||||||
|
stroke-linecap: round;
|
||||||
|
stroke-linejoin: round;
|
||||||
|
flex: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.face {
|
.face {
|
||||||
|
|||||||
@@ -0,0 +1,68 @@
|
|||||||
|
/**
|
||||||
|
* Splits a plain string into runs of text and the URLs inside it, so a task's
|
||||||
|
* title or description can be shown with the links clickable without the text
|
||||||
|
* ever having been anything but plain text on disk.
|
||||||
|
*
|
||||||
|
* A task is not rich text — the title is an `<input>` and the description a
|
||||||
|
* `<textarea>` — so there is nowhere to *store* a link. What there is instead is
|
||||||
|
* a person who pasted one in and expects to be able to click it. This finds the
|
||||||
|
* ones that are unambiguously links and leaves everything else exactly as typed.
|
||||||
|
*
|
||||||
|
* Deliberately conservative about what counts as a link: an explicit
|
||||||
|
* `http://`/`https://`, or a bare `www.` host. "example.com" on its own is not
|
||||||
|
* matched — most of those are sentences ("the file.txt is here"), and a false
|
||||||
|
* link in a title is worse than a real one left plain.
|
||||||
|
*/
|
||||||
|
|
||||||
|
// A trailing `.,;:!?` or a closing bracket is almost always punctuation the
|
||||||
|
// sentence owns rather than part of the URL, so the run stops before it. A `)`
|
||||||
|
// is only dropped when the URL holds no `(` of its own — Wikipedia-style links
|
||||||
|
// carry balanced parentheses that belong to the address.
|
||||||
|
const URL_RE = /\b(?:https?:\/\/|www\.)[^\s<>]+/gi;
|
||||||
|
|
||||||
|
function trimTrailing(url) {
|
||||||
|
let end = url.length;
|
||||||
|
while (end > 0) {
|
||||||
|
const ch = url[end - 1];
|
||||||
|
if ('.,;:!?"\''.includes(ch)) {
|
||||||
|
end--;
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
if (ch === ')' && !url.slice(0, end).includes('(')) {
|
||||||
|
end--;
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return url.slice(0, end);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {string} text
|
||||||
|
* @returns {Array<{ text: string, href?: string }>} runs in order; a run with an
|
||||||
|
* `href` is a link, one without is plain text. An empty or link-free string
|
||||||
|
* comes back as a single text run (possibly empty) so callers can render it the
|
||||||
|
* same way regardless.
|
||||||
|
*/
|
||||||
|
export function linkify(text) {
|
||||||
|
const value = text ?? '';
|
||||||
|
const runs = [];
|
||||||
|
let last = 0;
|
||||||
|
|
||||||
|
for (const match of value.matchAll(URL_RE)) {
|
||||||
|
const raw = trimTrailing(match[0]);
|
||||||
|
if (!raw) continue;
|
||||||
|
const start = match.index;
|
||||||
|
|
||||||
|
if (start > last) runs.push({ text: value.slice(last, start) });
|
||||||
|
|
||||||
|
const href = raw.startsWith('www.') ? `https://${raw}` : raw;
|
||||||
|
runs.push({ text: raw, href });
|
||||||
|
last = start + raw.length;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (last < value.length) runs.push({ text: value.slice(last) });
|
||||||
|
if (!runs.length) runs.push({ text: value });
|
||||||
|
|
||||||
|
return runs;
|
||||||
|
}
|
||||||
@@ -22,10 +22,13 @@ export const da = {
|
|||||||
'notes.unshared': 'Noten er din igen.',
|
'notes.unshared': 'Noten er din igen.',
|
||||||
// Deling med enkeltpersoner, ved siden af projektet.
|
// Deling med enkeltpersoner, ved siden af projektet.
|
||||||
'notes.groupSharedWithMe': 'Delt med mig',
|
'notes.groupSharedWithMe': 'Delt med mig',
|
||||||
|
'notes.linkOpen': 'Åbn',
|
||||||
|
'notes.linkMissing': 'Noten blev ikke fundet.',
|
||||||
'notes.sharedBy': 'Delt af {name}',
|
'notes.sharedBy': 'Delt af {name}',
|
||||||
'notes.sharePeople': 'Del med personer',
|
'notes.sharePeople': 'Del med personer',
|
||||||
'notes.sharePick': 'Vælg en person …',
|
'notes.sharePick': 'Vælg en person …',
|
||||||
'notes.shareAdd': 'Del',
|
'notes.shareButton': 'Del',
|
||||||
|
'notes.shareAdd': 'Tilføj',
|
||||||
'notes.shareRoleViewer': 'Kan læse',
|
'notes.shareRoleViewer': 'Kan læse',
|
||||||
'notes.shareRoleEditor': 'Kan rette',
|
'notes.shareRoleEditor': 'Kan rette',
|
||||||
'notes.shareRemove': 'Fjern adgang',
|
'notes.shareRemove': 'Fjern adgang',
|
||||||
@@ -185,6 +188,7 @@ export const da = {
|
|||||||
'repeat.everyN.month': 'hver {n}. måned',
|
'repeat.everyN.month': 'hver {n}. måned',
|
||||||
'repeat.everyN.year': 'hvert {n}. år',
|
'repeat.everyN.year': 'hvert {n}. år',
|
||||||
'task.assignee': 'Ansvarlig: {name}',
|
'task.assignee': 'Ansvarlig: {name}',
|
||||||
|
'task.delegatedTo': 'Uddelegeret til {name}',
|
||||||
'task.subtasks': '{done} af {total} undertasks er lukket',
|
'task.subtasks': '{done} af {total} undertasks er lukket',
|
||||||
'task.attachments': '{n} vedhæftet',
|
'task.attachments': '{n} vedhæftet',
|
||||||
'task.priority': 'Prioritet {n}',
|
'task.priority': 'Prioritet {n}',
|
||||||
@@ -262,6 +266,10 @@ export const da = {
|
|||||||
'Hvor du er logget ind. Genkender du ikke en af dem, så log den ud og skift adgangskode.',
|
'Hvor du er logget ind. Genkender du ikke en af dem, så log den ud og skift adgangskode.',
|
||||||
'account.thisDevice': 'denne enhed',
|
'account.thisDevice': 'denne enhed',
|
||||||
'account.signOutDevice': 'Log ud',
|
'account.signOutDevice': 'Log ud',
|
||||||
|
'account.support': 'Støt projektet',
|
||||||
|
'account.supportHint':
|
||||||
|
'verdande er fri, open source-software under MIT-licensen — ingen betalt version, intet holdt tilbage. Sparede den dig en eftermiddag, kan du give vedligeholderen en kop kaffe. Helt frivilligt, og intet i appen ændrer sig.',
|
||||||
|
'account.buyCoffee': 'Buy me a coffee',
|
||||||
|
|
||||||
'account.totpEnabled': 'Slået til.',
|
'account.totpEnabled': 'Slået til.',
|
||||||
'account.recoveryLeftOne': '{n} gendannelseskode tilbage.',
|
'account.recoveryLeftOne': '{n} gendannelseskode tilbage.',
|
||||||
@@ -596,6 +604,15 @@ export const da = {
|
|||||||
'detail.none': 'Ingen',
|
'detail.none': 'Ingen',
|
||||||
'detail.due': 'Forfalder',
|
'detail.due': 'Forfalder',
|
||||||
'detail.dueTime': 'Klokkeslæt',
|
'detail.dueTime': 'Klokkeslæt',
|
||||||
|
'detail.duration': 'Længde i minutter',
|
||||||
|
'detail.snooze': 'Slumre',
|
||||||
|
'detail.wake': 'Væk nu',
|
||||||
|
'detail.thisEvening': 'I aften',
|
||||||
|
'detail.tomorrow': 'I morgen',
|
||||||
|
'detail.nextWeek': 'Næste uge',
|
||||||
|
'detail.snoozeCustom': 'Vælg tidspunkt',
|
||||||
|
'task.snoozedUntil': 'Slumret til {when}',
|
||||||
|
'detail.durationShort': 'min',
|
||||||
'detail.labels': 'Etiketter',
|
'detail.labels': 'Etiketter',
|
||||||
'detail.labelsPlaceholder': 'adskilt af komma',
|
'detail.labelsPlaceholder': 'adskilt af komma',
|
||||||
'detail.project': 'Projekt',
|
'detail.project': 'Projekt',
|
||||||
@@ -748,6 +765,7 @@ export const da = {
|
|||||||
'cal.settings': 'Indstillinger',
|
'cal.settings': 'Indstillinger',
|
||||||
'cal.noneChosen': 'Ingen af kontoens kalendere er valgt endnu.',
|
'cal.noneChosen': 'Ingen af kontoens kalendere er valgt endnu.',
|
||||||
'cal.allDay': 'Hele dagen',
|
'cal.allDay': 'Hele dagen',
|
||||||
|
'cal.resize': 'Træk for at ændre længden',
|
||||||
'cal.openInGoogle': 'Åbn i Google Kalender',
|
'cal.openInGoogle': 'Åbn i Google Kalender',
|
||||||
'cal.beyondWindow':
|
'cal.beyondWindow':
|
||||||
'Begivenheder gemmes fra {from} til {to}. Uden for det viser gitteret kun dine egne opgaver.',
|
'Begivenheder gemmes fra {from} til {to}. Uden for det viser gitteret kun dine egne opgaver.',
|
||||||
|
|||||||
@@ -18,10 +18,13 @@ export const en = {
|
|||||||
'notes.unshared': 'The note is yours again.',
|
'notes.unshared': 'The note is yours again.',
|
||||||
// Sharing with individual people, alongside the project.
|
// Sharing with individual people, alongside the project.
|
||||||
'notes.groupSharedWithMe': 'Shared with me',
|
'notes.groupSharedWithMe': 'Shared with me',
|
||||||
|
'notes.linkOpen': 'Open',
|
||||||
|
'notes.linkMissing': 'That note could not be found.',
|
||||||
'notes.sharedBy': 'Shared by {name}',
|
'notes.sharedBy': 'Shared by {name}',
|
||||||
'notes.sharePeople': 'Share with people',
|
'notes.sharePeople': 'Share with people',
|
||||||
'notes.sharePick': 'Choose someone …',
|
'notes.sharePick': 'Choose someone …',
|
||||||
'notes.shareAdd': 'Share',
|
'notes.shareButton': 'Share',
|
||||||
|
'notes.shareAdd': 'Add',
|
||||||
'notes.shareRoleViewer': 'Can view',
|
'notes.shareRoleViewer': 'Can view',
|
||||||
'notes.shareRoleEditor': 'Can edit',
|
'notes.shareRoleEditor': 'Can edit',
|
||||||
'notes.shareRemove': 'Remove access',
|
'notes.shareRemove': 'Remove access',
|
||||||
@@ -181,6 +184,7 @@ export const en = {
|
|||||||
'repeat.everyN.month': 'every {n} months',
|
'repeat.everyN.month': 'every {n} months',
|
||||||
'repeat.everyN.year': 'every {n} years',
|
'repeat.everyN.year': 'every {n} years',
|
||||||
'task.assignee': 'Assigned to {name}',
|
'task.assignee': 'Assigned to {name}',
|
||||||
|
'task.delegatedTo': 'Delegated to {name}',
|
||||||
'task.subtasks': '{done} of {total} sub-tasks are done',
|
'task.subtasks': '{done} of {total} sub-tasks are done',
|
||||||
'task.attachments': '{n} attached',
|
'task.attachments': '{n} attached',
|
||||||
'task.priority': 'Priority {n}',
|
'task.priority': 'Priority {n}',
|
||||||
@@ -258,6 +262,10 @@ export const en = {
|
|||||||
'Where you are signed in. If you do not recognise one, sign it out and change your password.',
|
'Where you are signed in. If you do not recognise one, sign it out and change your password.',
|
||||||
'account.thisDevice': 'this device',
|
'account.thisDevice': 'this device',
|
||||||
'account.signOutDevice': 'Sign out',
|
'account.signOutDevice': 'Sign out',
|
||||||
|
'account.support': 'Support the project',
|
||||||
|
'account.supportHint':
|
||||||
|
'verdande is free, open-source software under the MIT licence — no paid tier, nothing held back. If it saved you an afternoon, you can buy the maintainer a coffee. Entirely optional, and nothing in the app changes either way.',
|
||||||
|
'account.buyCoffee': 'Buy me a coffee',
|
||||||
|
|
||||||
'account.totpEnabled': 'On.',
|
'account.totpEnabled': 'On.',
|
||||||
'account.recoveryLeftOne': '{n} recovery code left.',
|
'account.recoveryLeftOne': '{n} recovery code left.',
|
||||||
@@ -592,6 +600,15 @@ export const en = {
|
|||||||
'detail.none': 'None',
|
'detail.none': 'None',
|
||||||
'detail.due': 'Due',
|
'detail.due': 'Due',
|
||||||
'detail.dueTime': 'Time',
|
'detail.dueTime': 'Time',
|
||||||
|
'detail.duration': 'Length in minutes',
|
||||||
|
'detail.snooze': 'Snooze',
|
||||||
|
'detail.wake': 'Wake now',
|
||||||
|
'detail.thisEvening': 'This evening',
|
||||||
|
'detail.tomorrow': 'Tomorrow',
|
||||||
|
'detail.nextWeek': 'Next week',
|
||||||
|
'detail.snoozeCustom': 'Pick a time',
|
||||||
|
'task.snoozedUntil': 'Snoozed until {when}',
|
||||||
|
'detail.durationShort': 'min',
|
||||||
'detail.labels': 'Labels',
|
'detail.labels': 'Labels',
|
||||||
'detail.labelsPlaceholder': 'separated by commas',
|
'detail.labelsPlaceholder': 'separated by commas',
|
||||||
'detail.project': 'Project',
|
'detail.project': 'Project',
|
||||||
@@ -741,6 +758,7 @@ export const en = {
|
|||||||
'cal.settings': 'Settings',
|
'cal.settings': 'Settings',
|
||||||
'cal.noneChosen': 'None of the account’s calendars are chosen yet.',
|
'cal.noneChosen': 'None of the account’s calendars are chosen yet.',
|
||||||
'cal.allDay': 'All day',
|
'cal.allDay': 'All day',
|
||||||
|
'cal.resize': 'Drag to change the length',
|
||||||
'cal.openInGoogle': 'Open in Google Calendar',
|
'cal.openInGoogle': 'Open in Google Calendar',
|
||||||
'cal.beyondWindow':
|
'cal.beyondWindow':
|
||||||
'Events are kept from {from} to {to}. Outside that the grid shows only your own tasks.',
|
'Events are kept from {from} to {to}. Outside that the grid shows only your own tasks.',
|
||||||
|
|||||||
@@ -70,19 +70,39 @@ const attr = (s) => escapeHtml(s).replace(/"/g, '"').replace(/'/g, ''')
|
|||||||
* det overlever hverken en contenteditable eller en Markdown-fil.
|
* det overlever hverken en contenteditable eller en Markdown-fil.
|
||||||
*/
|
*/
|
||||||
const IMAGE = /!\[([^\]]*)\]\((\/api\/v1\/attachments\/[0-9a-f-]+)\)/g;
|
const IMAGE = /!\[([^\]]*)\]\((\/api\/v1\/attachments\/[0-9a-f-]+)\)/g;
|
||||||
|
// [[a note by title]], the spelling every note app settled on. Non-greedy, so two
|
||||||
|
// links on one line stay two.
|
||||||
|
const NOTELINK = /\[\[([^\]\n]+?)\]\]/g;
|
||||||
const MARK = "\u0000";
|
const MARK = "\u0000";
|
||||||
|
|
||||||
/** Inline marks, innermost first so a bold word inside italics survives both. */
|
/** Inline marks, innermost first so a bold word inside italics survives both. */
|
||||||
function inlineToHtml(text) {
|
function inlineToHtml(text) {
|
||||||
|
// Lifted out before anything escapes or marks the text, and dropped back in
|
||||||
|
// whole at the end — the same placeholder trick the image already used, now for
|
||||||
|
// two kinds of thing the surrounding markup must not touch.
|
||||||
|
const pieces = [];
|
||||||
|
const lift = (html) => {
|
||||||
|
pieces.push(html);
|
||||||
|
return `${MARK}${pieces.length - 1}${MARK}`;
|
||||||
|
};
|
||||||
|
|
||||||
// Kun vores egen adresse bliver til et billede. Et `` fra en
|
// Kun vores egen adresse bliver til et billede. Et `` fra en
|
||||||
// indsat tekst ville ellers hente fra en fremmed vært, når noten åbnes, og
|
// indsat tekst ville ellers hente fra en fremmed vært, når noten åbnes, og
|
||||||
// fortælle den, at den er blevet læst — og en note er det sidste sted, man vil
|
// fortælle den, at den er blevet læst — og en note er det sidste sted, man vil
|
||||||
// have en sporingspixel. Alt andet står som den tekst, det er.
|
// have en sporingspixel. Alt andet står som den tekst, det er.
|
||||||
const images = [];
|
let lifted = (text ?? '').replace(IMAGE, (_, alt, src) => lift(`<img src="${src}" alt="${attr(alt)}">`));
|
||||||
const lifted = (text ?? '').replace(IMAGE, (_, alt, src) => {
|
|
||||||
images.push(`<img src="${src}" alt="${attr(alt)}">`);
|
// A [[note]] is a link you can follow, not the brackets it was typed as. Made an
|
||||||
return `${MARK}${images.length - 1}${MARK}`;
|
// atomic token — contenteditable="false" — so it moves and deletes as one thing,
|
||||||
});
|
// and it carries the title it points at in data-note; the editor reads that on a
|
||||||
|
// click. htmlToMarkdown turns it back into [[title]] exactly.
|
||||||
|
lifted = lifted.replace(
|
||||||
|
NOTELINK,
|
||||||
|
(_, title) =>
|
||||||
|
lift(
|
||||||
|
`<a class="notelink" data-note="${attr(title)}" contenteditable="false">${escapeHtml(title)}</a>`
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
const marked = escapeHtml(lifted)
|
const marked = escapeHtml(lifted)
|
||||||
.replace(/<u>(.+?)<\/u>/g, '<u>$1</u>')
|
.replace(/<u>(.+?)<\/u>/g, '<u>$1</u>')
|
||||||
@@ -91,7 +111,7 @@ function inlineToHtml(text) {
|
|||||||
.replace(/~~(.+?)~~/g, '<s>$1</s>')
|
.replace(/~~(.+?)~~/g, '<s>$1</s>')
|
||||||
.replace(/(^|[^*])\*([^*]+)\*/g, '$1<em>$2</em>');
|
.replace(/(^|[^*])\*([^*]+)\*/g, '$1<em>$2</em>');
|
||||||
|
|
||||||
return marked.replace(new RegExp(MARK + '(\\d+)' + MARK, 'g'), (_, i) => images[Number(i)] ?? '');
|
return marked.replace(new RegExp(MARK + '(\\d+)' + MARK, 'g'), (_, i) => pieces[Number(i)] ?? '');
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -234,6 +254,13 @@ function inlineToMarkdown(node) {
|
|||||||
if (node.nodeType === Node.TEXT_NODE) return node.textContent;
|
if (node.nodeType === Node.TEXT_NODE) return node.textContent;
|
||||||
if (node.nodeType !== Node.ELEMENT_NODE) return '';
|
if (node.nodeType !== Node.ELEMENT_NODE) return '';
|
||||||
|
|
||||||
|
// A note link goes back to the brackets it came from, by the title it carries
|
||||||
|
// rather than by the text it shows — the two are the same today, but the title
|
||||||
|
// is the thing that must survive the round trip.
|
||||||
|
if (node.tagName === 'A' && node.classList?.contains('notelink')) {
|
||||||
|
return `[[${node.getAttribute('data-note') ?? node.textContent}]]`;
|
||||||
|
}
|
||||||
|
|
||||||
const inner = [...node.childNodes].map(inlineToMarkdown).join('');
|
const inner = [...node.childNodes].map(inlineToMarkdown).join('');
|
||||||
switch (node.tagName) {
|
switch (node.tagName) {
|
||||||
// Et billede har ingen tekst i sig, så uden det her læses det som ingenting
|
// Et billede har ingen tekst i sig, så uden det her læses det som ingenting
|
||||||
|
|||||||
@@ -403,6 +403,32 @@ class AppState {
|
|||||||
await this.update(id, { due_date: date, due_time: clock });
|
await this.update(id, { due_date: date, due_time: clock });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sets how long a task is, in minutes. Nothing else about it moves — the date
|
||||||
|
* and time are left alone, so making a task longer on the calendar does not
|
||||||
|
* also reschedule it.
|
||||||
|
*/
|
||||||
|
/**
|
||||||
|
* Snoozes a task until an ISO time, or wakes it when `until` is empty. Nothing
|
||||||
|
* else about the task moves — a snooze is about when you want to see it, not when
|
||||||
|
* it is due. Optimistic, so it greys and sinks at once.
|
||||||
|
*/
|
||||||
|
async snooze(id, until) {
|
||||||
|
await this.#optimistic(
|
||||||
|
id,
|
||||||
|
{ snoozed_until: until || undefined },
|
||||||
|
() => api.snoozeTask(id, until || '')
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
async resize(id, minutes) {
|
||||||
|
const previous = this.get(id);
|
||||||
|
if (!previous) return;
|
||||||
|
const rounded = Math.max(15, Math.round(minutes / 15) * 15);
|
||||||
|
if (previous.duration_min === rounded) return;
|
||||||
|
await this.update(id, { duration_min: rounded });
|
||||||
|
}
|
||||||
|
|
||||||
async remove(id) {
|
async remove(id) {
|
||||||
const previous = [...this.tasks];
|
const previous = [...this.tasks];
|
||||||
this.tasks = this.tasks.filter((t) => t.id !== id);
|
this.tasks = this.tasks.filter((t) => t.id !== id);
|
||||||
|
|||||||
@@ -571,6 +571,42 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<!-- Last, and quietly: a donate link belongs in Settings, never in the way of the
|
||||||
|
work. A plain anchor with an inline SVG — no third-party script, no webfont,
|
||||||
|
no tracking — so it works offline and cannot phone home. See the coffee-cup
|
||||||
|
snippet for why not their generated button. -->
|
||||||
|
<section class="panel">
|
||||||
|
<header>
|
||||||
|
<h2>{t('account.support')}</h2>
|
||||||
|
<p class="hint">{t('account.supportHint')}</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<a
|
||||||
|
class="bmc"
|
||||||
|
href="https://buymeacoffee.com/kristianwind"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.8"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
aria-hidden="true"
|
||||||
|
focusable="false"
|
||||||
|
>
|
||||||
|
<path d="M4 9h13v6a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V9Z" />
|
||||||
|
<path d="M17 10h1.5a2.5 2.5 0 0 1 0 5H17" />
|
||||||
|
<path d="M7.5 5.6c0-.9.8-1.1.8-2M11 5.6c0-.9.8-1.1.8-2M14.5 5.6c0-.9.8-1.1.8-2" />
|
||||||
|
</svg>
|
||||||
|
{t('account.buyCoffee')} ↗
|
||||||
|
</a>
|
||||||
|
</section>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.looks {
|
.looks {
|
||||||
margin-top: var(--s4);
|
margin-top: var(--s4);
|
||||||
@@ -771,4 +807,36 @@
|
|||||||
.uri {
|
.uri {
|
||||||
overflow-wrap: anywhere;
|
overflow-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* The understated variant: present, not loud. Bordered and in the muted ink so
|
||||||
|
it reads as a footnote, brightening on hover. The cup is outline-only. */
|
||||||
|
.bmc {
|
||||||
|
align-self: flex-start;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: var(--s2);
|
||||||
|
padding: var(--s2) var(--s3);
|
||||||
|
border: 1px solid var(--line-strong);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
color: var(--ink-muted);
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
transition:
|
||||||
|
color var(--fast) var(--ease),
|
||||||
|
border-color var(--fast) var(--ease);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bmc:hover {
|
||||||
|
color: var(--ink);
|
||||||
|
border-color: var(--ink-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bmc:focus-visible {
|
||||||
|
outline: 2px solid var(--accent);
|
||||||
|
outline-offset: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bmc svg {
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -14,6 +14,7 @@
|
|||||||
import { api, humanMessage } from '$lib/api.js';
|
import { api, humanMessage } from '$lib/api.js';
|
||||||
import { app } from '$lib/stores.svelte.js';
|
import { app } from '$lib/stores.svelte.js';
|
||||||
import { page } from '$app/stores';
|
import { page } from '$app/stores';
|
||||||
|
import { goto } from '$app/navigation';
|
||||||
import { t, tag } from '$lib/i18n.svelte.js';
|
import { t, tag } from '$lib/i18n.svelte.js';
|
||||||
import { NOTE, startDrag } from '$lib/dnd.js';
|
import { NOTE, startDrag } from '$lib/dnd.js';
|
||||||
import { colorVar } from '$lib/colors.js';
|
import { colorVar } from '$lib/colors.js';
|
||||||
@@ -193,6 +194,26 @@
|
|||||||
let shareBusy = $state(false);
|
let shareBusy = $state(false);
|
||||||
const ownsSelected = $derived(!!selected && selected.created_by === app.user?.id);
|
const ownsSelected = $derived(!!selected && selected.created_by === app.user?.id);
|
||||||
|
|
||||||
|
// The whole of sharing — a project and named people — lives in a popover behind
|
||||||
|
// one button, so the note's footer stays a status and three buttons rather than
|
||||||
|
// a row that runs off its own width.
|
||||||
|
let shareOpen = $state(false);
|
||||||
|
let shareWrap = $state(null);
|
||||||
|
// Closing on a switch of note, and only then: the panel belongs to the note it
|
||||||
|
// was opened on. Tracked by id rather than by the object, so a save that returns
|
||||||
|
// a fresh copy of the same note does not slam the panel shut mid-use.
|
||||||
|
let sharePanelFor = $state(null);
|
||||||
|
$effect(() => {
|
||||||
|
const id = selected?.id ?? null;
|
||||||
|
if (id !== sharePanelFor) {
|
||||||
|
shareOpen = false;
|
||||||
|
sharePanelFor = id;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
function onShareOutside(event) {
|
||||||
|
if (shareOpen && shareWrap && !shareWrap.contains(event.target)) shareOpen = false;
|
||||||
|
}
|
||||||
|
|
||||||
$effect(() => {
|
$effect(() => {
|
||||||
const id = selected?.id;
|
const id = selected?.id;
|
||||||
// Nulstil ved hvert skift, så den forrige notes folk ikke står et øjeblik
|
// Nulstil ved hvert skift, så den forrige notes folk ikke står et øjeblik
|
||||||
@@ -633,11 +654,56 @@
|
|||||||
// What the note points at, for the panel under the editor.
|
// What the note points at, for the panel under the editor.
|
||||||
let links = $derived(selected?.links ?? []);
|
let links = $derived(selected?.links ?? []);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Follows a link from the panel to the thing it names.
|
||||||
|
*
|
||||||
|
* A [[note]] resolves by its title to a note — the one on the list if it is
|
||||||
|
* there, otherwise looked up — and opens it in place. A #project and a task go
|
||||||
|
* to their own pages. Until now these were text and nothing else: the note said
|
||||||
|
* it pointed somewhere and there was no way to go.
|
||||||
|
*/
|
||||||
|
async function openLink(link) {
|
||||||
|
if (link.kind === 'note') {
|
||||||
|
const wanted = link.target_id.toLowerCase();
|
||||||
|
const here = notes.find((n) => (n.title ?? '').toLowerCase() === wanted);
|
||||||
|
if (here) {
|
||||||
|
open(here);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const found = (await api.notes({ q: link.target_id })).notes ?? [];
|
||||||
|
const hit = found.find((n) => (n.title ?? '').toLowerCase() === wanted) ?? found[0];
|
||||||
|
if (hit) open(hit);
|
||||||
|
else app.toast(t('notes.linkMissing'));
|
||||||
|
} catch (e) {
|
||||||
|
app.toast(humanMessage(e));
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (link.kind === 'project') {
|
||||||
|
const project = app.projects.find(
|
||||||
|
(p) => p.name.toLowerCase() === link.target_id.toLowerCase()
|
||||||
|
);
|
||||||
|
if (project) goto(`/projekt/${project.id}`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (link.kind === 'task') {
|
||||||
|
goto(`/opgave/${link.target_id}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<svelte:head><title>{t('notes.title')} · verdande</title></svelte:head>
|
<svelte:head><title>{t('notes.title')} · verdande</title></svelte:head>
|
||||||
|
|
||||||
|
<svelte:window
|
||||||
|
onclick={onShareOutside}
|
||||||
|
onkeydown={(e) => {
|
||||||
|
if (e.key === 'Escape' && shareOpen) shareOpen = false;
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
<div class="notes">
|
<div class="notes">
|
||||||
<aside>
|
<aside>
|
||||||
<div class="head">
|
<div class="head">
|
||||||
@@ -849,6 +915,8 @@
|
|||||||
{#if selected}
|
{#if selected}
|
||||||
<NoteEditor
|
<NoteEditor
|
||||||
note={selected}
|
note={selected}
|
||||||
|
notes={notes}
|
||||||
|
onopennote={(title) => openLink({ kind: 'note', target_id: title })}
|
||||||
onchange={(body) => {
|
onchange={(body) => {
|
||||||
draft = body;
|
draft = body;
|
||||||
typed();
|
typed();
|
||||||
@@ -861,79 +929,119 @@
|
|||||||
{#if links.length}
|
{#if links.length}
|
||||||
<span class="links">
|
<span class="links">
|
||||||
{#each links as link}
|
{#each links as link}
|
||||||
<span class="link">{label(link)}</span>
|
<button class="link" onclick={() => openLink(link)} title={t('notes.linkOpen')}>
|
||||||
|
{label(link)}
|
||||||
|
</button>
|
||||||
{/each}
|
{/each}
|
||||||
</span>
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
<!-- Filing a note in a project is one way to share it: everybody who can
|
|
||||||
read the project reads the note. Owner only, because moving a note
|
|
||||||
the owner is not in would take it away from them. -->
|
|
||||||
{#if ownsSelected}
|
|
||||||
<label class="share">
|
|
||||||
<span class="hint">{t('notes.shareWith')}</span>
|
|
||||||
<select value={selected.project_id ?? ''} onchange={(e) => share(e.currentTarget.value)}>
|
|
||||||
<option value="">{t('notes.private')}</option>
|
|
||||||
{#each app.projects.filter((p) => !p.is_inbox) as project (project.id)}
|
|
||||||
<option value={project.id}>{project.name}</option>
|
|
||||||
{/each}
|
|
||||||
</select>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
<!-- The other way: hand the note to named people, without a project
|
|
||||||
between. The owner picks who and at what role; the list below is
|
|
||||||
who can already see it. -->
|
|
||||||
<div class="people-share">
|
|
||||||
<span class="hint">{t('notes.sharePeople')}</span>
|
|
||||||
{#if shares.length}
|
|
||||||
<ul class="sharelist">
|
|
||||||
{#each shares as sh (sh.user.id)}
|
|
||||||
<li>
|
|
||||||
<span class="who">
|
|
||||||
<span class="avatar" style="--who: {sh.user.avatar_color}" aria-hidden="true"></span>
|
|
||||||
{sh.user.name}
|
|
||||||
</span>
|
|
||||||
<select
|
|
||||||
value={sh.role}
|
|
||||||
onchange={(e) => changeShareRole(sh.user.id, e.currentTarget.value)}
|
|
||||||
>
|
|
||||||
<option value="viewer">{t('notes.shareRoleViewer')}</option>
|
|
||||||
<option value="editor">{t('notes.shareRoleEditor')}</option>
|
|
||||||
</select>
|
|
||||||
<button
|
|
||||||
class="unshare"
|
|
||||||
onclick={() => removeShare(sh.user.id)}
|
|
||||||
title={t('notes.shareRemove')}
|
|
||||||
aria-label={t('notes.shareRemove')}>×</button
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
{/each}
|
|
||||||
</ul>
|
|
||||||
{:else}
|
|
||||||
<span class="none">{t('notes.shareNobody')}</span>
|
|
||||||
{/if}
|
|
||||||
{#if shareCandidates.length}
|
|
||||||
<div class="addshare">
|
|
||||||
<select bind:value={sharePick}>
|
|
||||||
<option value="">{t('notes.sharePick')}</option>
|
|
||||||
{#each shareCandidates as person (person.id)}
|
|
||||||
<option value={person.id}>{person.name}</option>
|
|
||||||
{/each}
|
|
||||||
</select>
|
|
||||||
<select bind:value={shareRole}>
|
|
||||||
<option value="viewer">{t('notes.shareRoleViewer')}</option>
|
|
||||||
<option value="editor">{t('notes.shareRoleEditor')}</option>
|
|
||||||
</select>
|
|
||||||
<button class="button" disabled={!sharePick || shareBusy} onclick={addShare}>
|
|
||||||
{t('notes.shareAdd')}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
|
<!-- All of sharing behind one button. A note has two ways in — a
|
||||||
|
project and named people — and both belong to the owner; the
|
||||||
|
panel gathers them rather than lining them up across the footer. -->
|
||||||
|
{#if ownsSelected}
|
||||||
|
<div class="sharewrap" bind:this={shareWrap}>
|
||||||
|
<button
|
||||||
|
class="button"
|
||||||
|
class:on={shareOpen}
|
||||||
|
aria-expanded={shareOpen}
|
||||||
|
aria-haspopup="dialog"
|
||||||
|
onclick={() => (shareOpen = !shareOpen)}
|
||||||
|
>
|
||||||
|
{t('notes.shareButton')}{#if shares.length}<span class="count">{shares.length}</span>{/if}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{#if shareOpen}
|
||||||
|
<div class="sharepanel" role="dialog" aria-label={t('notes.shareButton')}>
|
||||||
|
<!-- Filing it in a project: everybody who can read the project
|
||||||
|
reads the note. A real <label> around the select, so it is
|
||||||
|
named for a screen reader and not only for the eye. -->
|
||||||
|
<section>
|
||||||
|
<label class="field">
|
||||||
|
<span class="phead">{t('notes.shareWith')}</span>
|
||||||
|
<select
|
||||||
|
aria-label={t('notes.shareWith')}
|
||||||
|
value={selected.project_id ?? ''}
|
||||||
|
onchange={(e) => share(e.currentTarget.value)}
|
||||||
|
>
|
||||||
|
<option value="">{t('notes.private')}</option>
|
||||||
|
{#each app.projects.filter((p) => !p.is_inbox) as project (project.id)}
|
||||||
|
<option value={project.id}>{project.name}</option>
|
||||||
|
{/each}
|
||||||
|
</select>
|
||||||
|
</label>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Handing it to named people, without a project between. -->
|
||||||
|
<section>
|
||||||
|
<span class="phead">{t('notes.sharePeople')}</span>
|
||||||
|
{#if shares.length}
|
||||||
|
<ul class="sharelist">
|
||||||
|
{#each shares as sh (sh.user.id)}
|
||||||
|
<li>
|
||||||
|
<span class="who">
|
||||||
|
<span
|
||||||
|
class="avatar"
|
||||||
|
style="--who: {sh.user.avatar_color}"
|
||||||
|
aria-hidden="true"
|
||||||
|
></span>
|
||||||
|
{sh.user.name}
|
||||||
|
</span>
|
||||||
|
<select
|
||||||
|
value={sh.role}
|
||||||
|
onchange={(e) => changeShareRole(sh.user.id, e.currentTarget.value)}
|
||||||
|
>
|
||||||
|
<option value="viewer">{t('notes.shareRoleViewer')}</option>
|
||||||
|
<option value="editor">{t('notes.shareRoleEditor')}</option>
|
||||||
|
</select>
|
||||||
|
<button
|
||||||
|
class="unshare"
|
||||||
|
onclick={() => removeShare(sh.user.id)}
|
||||||
|
title={t('notes.shareRemove')}
|
||||||
|
aria-label={t('notes.shareRemove')}>×</button
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
{/each}
|
||||||
|
</ul>
|
||||||
|
{:else}
|
||||||
|
<span class="none">{t('notes.shareNobody')}</span>
|
||||||
|
{/if}
|
||||||
|
{#if shareCandidates.length}
|
||||||
|
<div class="addshare">
|
||||||
|
<select bind:value={sharePick}>
|
||||||
|
<option value="">{t('notes.sharePick')}</option>
|
||||||
|
{#each shareCandidates as person (person.id)}
|
||||||
|
<option value={person.id}>{person.name}</option>
|
||||||
|
{/each}
|
||||||
|
</select>
|
||||||
|
<select bind:value={shareRole}>
|
||||||
|
<option value="viewer">{t('notes.shareRoleViewer')}</option>
|
||||||
|
<option value="editor">{t('notes.shareRoleEditor')}</option>
|
||||||
|
</select>
|
||||||
|
<button
|
||||||
|
class="button"
|
||||||
|
disabled={!sharePick || shareBusy}
|
||||||
|
onclick={addShare}
|
||||||
|
>
|
||||||
|
{t('notes.shareAdd')}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
<button class="button" onclick={save}>{t('notes.save')}</button>
|
<button class="button" onclick={save}>{t('notes.save')}</button>
|
||||||
{#if ownsSelected}
|
{#if ownsSelected}
|
||||||
|
<!-- Laid away, not thrown away: archive is the note leaving the list
|
||||||
|
without leaving the account, and it reads "bring it back" once it
|
||||||
|
already has. Owner only, like delete. -->
|
||||||
|
<button class="button" onclick={() => archiveOne(selected)}>
|
||||||
|
{selected.archived_at ? t('notes.unarchive') : t('notes.archive')}
|
||||||
|
</button>
|
||||||
<button class="button danger" onclick={() => remove(selected)}>{t('notes.delete')}</button>
|
<button class="button danger" onclick={() => remove(selected)}>{t('notes.delete')}</button>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
@@ -1555,18 +1663,71 @@
|
|||||||
.link {
|
.link {
|
||||||
color: var(--ink-muted);
|
color: var(--ink-muted);
|
||||||
background: var(--surface);
|
background: var(--surface);
|
||||||
|
border: 1px solid var(--line);
|
||||||
border-radius: var(--radius-sm);
|
border-radius: var(--radius-sm);
|
||||||
padding: 0 var(--s1);
|
padding: 0 var(--s1);
|
||||||
font-family: var(--mono, ui-monospace, monospace);
|
font-family: var(--mono, ui-monospace, monospace);
|
||||||
|
font-size: inherit;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.link:hover {
|
||||||
|
color: var(--ink);
|
||||||
|
background: var(--surface-raised);
|
||||||
|
border-color: var(--line-strong);
|
||||||
}
|
}
|
||||||
|
|
||||||
.share {
|
/* Sharing lives in a popover above the Del button, so the footer stays a status
|
||||||
|
and a few buttons rather than a row that runs off its own width. */
|
||||||
|
.sharewrap {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button.on {
|
||||||
|
background: var(--surface-raised);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sharewrap .count {
|
||||||
|
margin-left: 0.4em;
|
||||||
|
padding: 0 0.45em;
|
||||||
|
border-radius: var(--radius-full);
|
||||||
|
background: var(--line-strong);
|
||||||
|
font-size: 0.85em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sharepanel {
|
||||||
|
position: absolute;
|
||||||
|
bottom: calc(100% + var(--s2));
|
||||||
|
right: 0;
|
||||||
|
z-index: 20;
|
||||||
|
width: 20rem;
|
||||||
|
max-width: 80vw;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
flex-direction: column;
|
||||||
|
gap: var(--s3);
|
||||||
|
padding: var(--s3);
|
||||||
|
background: var(--surface-raised);
|
||||||
|
border: 1px solid var(--line-strong);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
box-shadow: 0 8px 24px rgb(0 0 0 / 0.18);
|
||||||
|
text-align: left;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sharepanel section,
|
||||||
|
.sharepanel .field {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
gap: var(--s1);
|
gap: var(--s1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.share select {
|
.sharepanel .phead {
|
||||||
|
font-size: var(--text-xs);
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--ink-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sharepanel select {
|
||||||
font-size: var(--text-xs);
|
font-size: var(--text-xs);
|
||||||
padding: 2px var(--s1);
|
padding: 2px var(--s1);
|
||||||
}
|
}
|
||||||
@@ -1597,15 +1758,7 @@
|
|||||||
content: none;
|
content: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Del med personer, under the note. */
|
.sharepanel .none {
|
||||||
.people-share {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: var(--s1);
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.people-share .none {
|
|
||||||
font-size: var(--text-xs);
|
font-size: var(--text-xs);
|
||||||
color: var(--ink-faint);
|
color: var(--ink-faint);
|
||||||
}
|
}
|
||||||
@@ -1673,6 +1826,15 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
gap: var(--s1);
|
gap: var(--s1);
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
margin-top: var(--s1);
|
||||||
|
}
|
||||||
|
/* The person picker takes its own row, so the role and the button below it never
|
||||||
|
get squeezed to nothing in the panel's width. */
|
||||||
|
.addshare select:first-child {
|
||||||
|
flex: 1 1 100%;
|
||||||
|
}
|
||||||
|
.addshare .button {
|
||||||
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
.addshare select {
|
.addshare select {
|
||||||
font-size: var(--text-xs);
|
font-size: var(--text-xs);
|
||||||
|
|||||||