From ade233fe47165ec90d67e50724af2094015cdffd Mon Sep 17 00:00:00 2001 From: Ian Gulliver Date: Sat, 27 Jun 2020 21:18:19 +0000 Subject: [PATCH] Overall timer --- main.go | 40 +++++++++++++++++++++++++++++++++ static/remote.css | 5 +++++ static/remote.js | 41 ++++++++++++++++++++++++++++++++-- static/remote.ts | 57 +++++++++++++++++++++++++++++++++++++++++++++-- 4 files changed, 139 insertions(+), 4 deletions(-) diff --git a/main.go b/main.go index 6d27c99..6a8fcdd 100644 --- a/main.go +++ b/main.go @@ -32,6 +32,11 @@ type adminRequest struct { PublicClientId string `json:"public_client_id"` } +type resetRequest struct { + RoomId string `json:"room_id"` + AdminSecret string `json:"admin_secret"` +} + type announceRequest struct { RoomId string `json:"room_id"` ClientId string `json:"client_id"` @@ -79,6 +84,7 @@ type adminEvent struct { type standardEvent struct { Active bool `json:"active"` + TimerStart int64 `json:"timer_start"` AdminSecret string `json:"admin_secret"` } @@ -88,6 +94,7 @@ type controlEvent struct { type room struct { roomId string + timerStart time.Time clientById map[string]*client clientByPublicId map[string]*client present map[*presentState]bool @@ -140,6 +147,7 @@ func main() { http.HandleFunc("/api/create", create) http.HandleFunc("/api/present", present) http.HandleFunc("/api/remove", remove) + http.HandleFunc("/api/reset", reset) http.HandleFunc("/api/watch", watch) server := http.Server{ @@ -386,6 +394,29 @@ func remove(w http.ResponseWriter, r *http.Request) { c.remove() } +func reset(w http.ResponseWriter, r *http.Request) { + mu.Lock() + defer mu.Unlock() + + req := &resetRequest{} + + err := json.NewDecoder(r.Body).Decode(req) + if err != nil { + http.Error(w, err.Error(), http.StatusBadRequest) + return + } + + rm := getRoom(req.RoomId) + + if req.AdminSecret != rm.adminSecret() { + http.Error(w, "invalid admin_secret", http.StatusBadRequest) + return + } + + rm.timerStart = time.Now() + rm.updateAllClients() +} + func watch(w http.ResponseWriter, r *http.Request) { ws := newWatchState(w, r) if ws == nil { @@ -436,6 +467,7 @@ func (c *client) update() { e := &event{ StandardEvent: &standardEvent{ Active: c.Active, + TimerStart: c.room.timerStart.Unix(), }, } if c.Admin { @@ -447,6 +479,7 @@ func (c *client) update() { func newRoom(roomId string) *room { return &room{ roomId: roomId, + timerStart: time.Now(), clientById: map[string]*client{}, clientByPublicId: map[string]*client{}, present: map[*presentState]bool{}, @@ -505,6 +538,12 @@ func (rm *room) sendControlEvent(ce *controlEvent) { } } +func (rm *room) updateAllClients() { + for _, client := range rm.clientById { + client.update() + } +} + func newWatchState(w http.ResponseWriter, r *http.Request) *watchState { mu.Lock() defer mu.Unlock() @@ -539,6 +578,7 @@ func newWatchState(w http.ResponseWriter, r *http.Request) *watchState { } ws.client.eventChan = ws.eventChan + ws.client.update() w.Header().Set("Content-Type", "text/event-stream") w.Header().Set("Cache-Control", "no-cache") diff --git a/static/remote.css b/static/remote.css index c58b1d9..376b04b 100644 --- a/static/remote.css +++ b/static/remote.css @@ -78,6 +78,11 @@ tfoot tr { cursor: pointer; } +.action { + cursor: pointer; + margin-left: 10px; +} + .github { bottom: 0; color: var(--subtle-color); diff --git a/static/remote.js b/static/remote.js index d881411..f530537 100644 --- a/static/remote.js +++ b/static/remote.js @@ -63,6 +63,7 @@ function watch(roomId, clientId, adminSecret, prnt) { } const es = new EventSource(url.toString()); renderControls(roomId, clientId, adminSecret, prnt, es); + renderTimers(roomId, adminSecret, prnt, es); if (adminSecret) { renderAdmin(roomId, adminSecret, prnt, es); } @@ -100,11 +101,47 @@ function renderControls(roomId, clientId, adminSecret, prnt, es) { controls.classList.remove("enable"); } }); - const clockDiv = create(prnt, "div", "\u00a0Time: "); +} +function renderTimers(roomId, adminSecret, prnt, es) { + let overallStart = null; + es.addEventListener("message", (e) => { + const event = JSON.parse(e.data); + if (!event.standard_event) { + return; + } + overallStart = parseInt(event.standard_event.timer_start || "0", 10) || null; + }); + const width = 10; + const clockDiv = create(prnt, "div", "Clock: ".padStart(width, "\u00a0")); const clock = create(clockDiv, "span"); + const overallDiv = create(prnt, "div", "Overall: ".padStart(width, "\u00a0")); + const overall = create(overallDiv, "span"); + if (adminSecret) { + const reset = create(overallDiv, "span", "↺", ["action"]); + reset.addEventListener("click", () => { + const req = { + room_id: roomId, + admin_secret: adminSecret, + }; + fetch("/api/reset", { + method: "POST", + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify(req), + }); + }); + } setInterval(() => { const now = new Date(); - clock.innerText = `${now.getHours().toString().padStart(2, "0")}:${now.getMinutes().toString().padStart(2, "0")}:${now.getSeconds().toString().padStart(2, "0")}`; + clock.innerText = `${now.getHours().toString().padStart(2, "0")}h${now.getMinutes().toString().padStart(2, "0")}m${now.getSeconds().toString().padStart(2, "0")}s`; + if (overallStart) { + const o = Math.trunc(now.getTime() / 1000 - overallStart); + overall.innerText = `${Math.trunc(o / 3600).toString().padStart(2, "0")}h${Math.trunc(o % 3600 / 60).toString().padStart(2, "0")}m${Math.trunc(o % 60).toString().padStart(2, "0")}s`; + } + else { + overall.innerText = ""; + } }, 250); } function renderAdmin(roomId, adminSecret, prnt, es) { diff --git a/static/remote.ts b/static/remote.ts index 905d142..ce85e86 100644 --- a/static/remote.ts +++ b/static/remote.ts @@ -34,12 +34,18 @@ interface RemoveRequest { client_id: string; } +interface ResetRequest { + room_id: string; + admin_secret: string; +} + interface Event { standard_event?: StandardEvent; admin_event?: AdminEvent; } interface StandardEvent { + timer_start?: string; active?: boolean; admin_secret?: string; } @@ -135,6 +141,8 @@ function watch(roomId: string, clientId: string, adminSecret: string | null, prn renderControls(roomId, clientId, adminSecret, prnt, es); + renderTimers(roomId, adminSecret, prnt, es); + if (adminSecret) { renderAdmin(roomId, adminSecret, prnt, es); } @@ -180,12 +188,57 @@ function renderControls(roomId: string, clientId: string, adminSecret: string | controls.classList.remove("enable"); } }); +} - const clockDiv = create(prnt, "div", "\u00a0Time: "); +function renderTimers(roomId: string, adminSecret: string | null, prnt: HTMLElement, es: EventSource) { + let overallStart: number | null = null; + + es.addEventListener("message", (e) => { + const event = JSON.parse(e.data) as Event; + + if (!event.standard_event) { + return; + } + + overallStart = parseInt(event.standard_event.timer_start || "0", 10) || null; + }); + + const width = 10; + + const clockDiv = create(prnt, "div", "Clock: ".padStart(width, "\u00a0")); const clock = create(clockDiv, "span"); + + const overallDiv = create(prnt, "div", "Overall: ".padStart(width, "\u00a0")); + const overall = create(overallDiv, "span"); + + if (adminSecret) { + const reset = create(overallDiv, "span", "↺", ["action"]); + reset.addEventListener("click", () => { + const req: ResetRequest = { + room_id: roomId, + admin_secret: adminSecret, + }; + + fetch("/api/reset", { + method: "POST", + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify(req), + }); + }); + } + setInterval(() => { const now = new Date(); - clock.innerText = `${now.getHours().toString().padStart(2, "0")}:${now.getMinutes().toString().padStart(2, "0")}:${now.getSeconds().toString().padStart(2, "0")}`; + clock.innerText = `${now.getHours().toString().padStart(2, "0")}h${now.getMinutes().toString().padStart(2, "0")}m${now.getSeconds().toString().padStart(2, "0")}s`; + + if (overallStart) { + const o = Math.trunc(now.getTime() / 1000 - overallStart); + overall.innerText = `${Math.trunc(o / 3600).toString().padStart(2, "0")}h${Math.trunc(o % 3600 / 60).toString().padStart(2, "0")}m${Math.trunc(o % 60).toString().padStart(2, "0")}s`; + } else { + overall.innerText = ""; + } }, 250); }