diff options
-rw-r--r-- | client-web/source/chat.ts | 10 | ||||
-rw-r--r-- | client-web/source/helper.ts | 2 | ||||
-rw-r--r-- | client-web/source/preferences/ui.ts | 8 |
3 files changed, 18 insertions, 2 deletions
diff --git a/client-web/source/chat.ts b/client-web/source/chat.ts index 792a620..e08437b 100644 --- a/client-web/source/chat.ts +++ b/client-web/source/chat.ts @@ -59,5 +59,15 @@ export class Chat extends OverlayUi { this.messages.append(ediv({ class: "message" }, espan(sender.display_name, { class: "author" }), ": ", ...els )) + this.shown = true + this.notify(sender, message) + } + notify(sender: User, message: ChatMessage) { + if (sender.local || document.hasFocus()) return + if (Notification.permission != "granted") return + let body = "(empty message)" + if (message.text) body = message.text + if (message.image) body = "(image)" + new Notification(`keks-meet: ${sender.display_name}`, { body }) } } diff --git a/client-web/source/helper.ts b/client-web/source/helper.ts index 3c5d0ff..35be473 100644 --- a/client-web/source/helper.ts +++ b/client-web/source/helper.ts @@ -36,6 +36,8 @@ export const eh6 = elem_with_content("h6") export const ediv = elem_with_children("div") export const espan = elem_with_content("span") export const elabel = elem_with_content("label") +export const ebutton = elem_with_content("button") +export const ebr = () => document.createElement("br") export const OVERLAYS = ediv({ class: "overlays" }) diff --git a/client-web/source/preferences/ui.ts b/client-web/source/preferences/ui.ts index 1aaaca0..3461da9 100644 --- a/client-web/source/preferences/ui.ts +++ b/client-web/source/preferences/ui.ts @@ -1,4 +1,4 @@ -import { ediv, elabel, espan, OverlayUi } from "../helper.ts"; +import { ebr, ebutton, ediv, elabel, espan, OverlayUi } from "../helper.ts"; import { PREF_DECLS } from "./decl.ts"; import { change_pref, PrefDecl, PREFS } from "./mod.ts"; @@ -21,7 +21,11 @@ export class PrefUi extends OverlayUi { } return espan(`(not implemented)`) }) - super(ediv({ class: "prefs-overlay" }, ...elements)) + const notification_perm = Notification.permission == "granted" ? ediv() : ediv({}, + espan("For keks-meet to send notifications, it needs you to grant permission: "), + ebutton("Grant", { onclick: () => Notification.requestPermission() }), + ) + super(ediv({ class: "prefs-overlay" }, notification_perm, ebr(), ...elements)) } } |