Update static/js/04-main.js
This commit is contained in:
parent
86b0a7a5ab
commit
f08e24696c
@ -6,13 +6,8 @@ Glow.openCallPanel = async () => {
|
||||
Glow.calls.ensureState();
|
||||
Glow.state.calls.panelOpen = true;
|
||||
|
||||
const overlay = document.getElementById("callOverlay");
|
||||
const participants = document.getElementById("callParticipants");
|
||||
|
||||
overlay?.classList.remove("hidden");
|
||||
participants?.classList.remove("hidden");
|
||||
|
||||
Glow.restoreCallPanelPosition?.();
|
||||
Glow.els.callOverlay?.classList.remove("hidden");
|
||||
Glow.els.callParticipants?.classList.remove("hidden");
|
||||
|
||||
if (Glow.state.calls.activeCall?.groupSession?.id) {
|
||||
await Glow.calls.refreshBackendParticipants();
|
||||
@ -68,104 +63,11 @@ Glow.loadRooms = async () => {
|
||||
Glow.updateChatControls();
|
||||
};
|
||||
|
||||
Glow.restoreCallPanelPosition = () => {
|
||||
const overlay = Glow.els.callOverlay;
|
||||
if (!overlay) return;
|
||||
|
||||
const savedX = localStorage.getItem("glow_call_panel_x");
|
||||
const savedY = localStorage.getItem("glow_call_panel_y");
|
||||
|
||||
if (savedX == null || savedY == null) return;
|
||||
|
||||
const x = Number(savedX);
|
||||
const y = Number(savedY);
|
||||
|
||||
if (!Number.isFinite(x) || !Number.isFinite(y)) return;
|
||||
|
||||
Glow.state.calls.drag.x = x;
|
||||
Glow.state.calls.drag.y = y;
|
||||
overlay.style.left = `${x}px`;
|
||||
overlay.style.top = `${y}px`;
|
||||
overlay.style.right = "auto";
|
||||
overlay.style.bottom = "auto";
|
||||
overlay.style.alignItems = "flex-start";
|
||||
overlay.style.justifyContent = "flex-start";
|
||||
};
|
||||
|
||||
Glow.persistCallPanelPosition = () => {
|
||||
const drag = Glow.state.calls?.drag;
|
||||
if (!drag) return;
|
||||
if (!Number.isFinite(drag.x) || !Number.isFinite(drag.y)) return;
|
||||
localStorage.setItem("glow_call_panel_x", String(drag.x));
|
||||
localStorage.setItem("glow_call_panel_y", String(drag.y));
|
||||
};
|
||||
|
||||
Glow.confirmDirtySettingsBeforeNavigate = async action => {
|
||||
if (Glow.state.activeView !== "settings" || !Glow.isSettingsDirty()) {
|
||||
await action();
|
||||
return true;
|
||||
}
|
||||
|
||||
Glow.syncSettingsSavePanel?.();
|
||||
|
||||
const values = await Glow.openDialog({
|
||||
title: "Unsaved settings changes",
|
||||
body: "You have unsaved changes. Would you like to save before leaving this page?",
|
||||
confirmText: "Save and leave",
|
||||
cancelText: "Stay"
|
||||
});
|
||||
|
||||
if (values === null) {
|
||||
const discard = await Glow.openDialog({
|
||||
title: "Discard changes?",
|
||||
body: "If you leave now, your unsaved settings changes will be lost.",
|
||||
confirmText: "Discard changes",
|
||||
cancelText: "Stay",
|
||||
danger: true
|
||||
});
|
||||
|
||||
if (!discard) {
|
||||
return false;
|
||||
}
|
||||
|
||||
Glow.discardSettingsDraft?.();
|
||||
await action();
|
||||
return true;
|
||||
}
|
||||
|
||||
try {
|
||||
await Glow.saveSettingsDraft?.();
|
||||
await action();
|
||||
return true;
|
||||
} catch (error) {
|
||||
Glow.showToast(error.message || "Could not save settings.", "error");
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
Glow.navigateToView = async (view, options = {}) => {
|
||||
return Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
if (typeof options.before === "function") {
|
||||
await options.before();
|
||||
}
|
||||
|
||||
Glow.state.activeView = view;
|
||||
Glow.updateViewUI();
|
||||
|
||||
if (typeof options.after === "function") {
|
||||
await options.after();
|
||||
}
|
||||
|
||||
if (options.schedulePoll !== false) {
|
||||
Glow.schedulePoll?.();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
Glow.updateViewUI = () => {
|
||||
const view = Glow.state.activeView || "feed";
|
||||
const room = Glow.state.activeRoom;
|
||||
const dm = Glow.state.activeDm;
|
||||
|
||||
const feedActive = view === "feed";
|
||||
const dmListActive = view === "dms";
|
||||
const chatActive = view === "room" || view === "channel" || view === "dm";
|
||||
@ -318,7 +220,7 @@ Glow.updateAuthUI = () => {
|
||||
Glow.els.logoutButton.classList.toggle("hidden", !authenticated);
|
||||
|
||||
Glow.els.headerAccount.textContent =
|
||||
user ? `${user.username} · ${user.role}` : "not signed in";
|
||||
user ? `${user.username} · ${user.role}` : "not signed in";
|
||||
|
||||
document.body.classList.toggle("is-moderator", Glow.canModerate());
|
||||
document.body.classList.toggle("is-admin", Glow.isAdmin());
|
||||
@ -387,6 +289,7 @@ Glow.checkAuth = async () => {
|
||||
|
||||
await Glow.checkInvite();
|
||||
await Glow.loadRooms();
|
||||
await Glow.loadTeamsForAdapter?.();
|
||||
await Glow.loadDms?.().catch(() => {});
|
||||
|
||||
Glow.state.activeView = "feed";
|
||||
@ -432,6 +335,7 @@ Glow.authenticate = async endpoint => {
|
||||
|
||||
await Glow.checkInvite();
|
||||
await Glow.loadRooms();
|
||||
await Glow.loadTeamsForAdapter?.();
|
||||
await Glow.loadDms?.().catch(() => {});
|
||||
|
||||
Glow.state.activeView = "feed";
|
||||
@ -541,7 +445,6 @@ Glow.toggleNotifications = async () => {
|
||||
"glow_notifications_enabled",
|
||||
String(Glow.state.notificationsEnabled)
|
||||
);
|
||||
Glow.updateAdminPreferenceButtons?.();
|
||||
Glow.showToast(
|
||||
Glow.state.notificationsEnabled
|
||||
? "Browser notifications enabled."
|
||||
@ -562,7 +465,6 @@ Glow.toggleTypingIndicators = () => {
|
||||
Glow.renderTyping();
|
||||
}
|
||||
|
||||
Glow.updateAdminPreferenceButtons?.();
|
||||
Glow.showToast(
|
||||
Glow.state.typingIndicatorsEnabled
|
||||
? "Typing indicators enabled."
|
||||
@ -657,6 +559,7 @@ Glow.els.threadForm?.addEventListener("submit", event => Glow.sendThreadReply?.(
|
||||
Glow.els.messageInput.addEventListener("input", () => {
|
||||
Glow.autoResizeComposer();
|
||||
Glow.updateMessageCount();
|
||||
Glow.handleEmojiAutocompleteInput?.("main");
|
||||
clearTimeout(Glow.state.typingTimer);
|
||||
|
||||
if (Glow.els.messageInput.value.trim()) {
|
||||
@ -672,25 +575,13 @@ Glow.els.messageInput.addEventListener("input", () => {
|
||||
Glow.els.threadInput?.addEventListener("input", () => {
|
||||
Glow.autoResizeThreadComposer?.();
|
||||
Glow.updateThreadMessageCount?.();
|
||||
Glow.handleEmojiAutocompleteInput?.("thread");
|
||||
});
|
||||
|
||||
Glow.els.messageInput.addEventListener("keydown", event => {
|
||||
if (Glow.state.emojiAutocomplete?.open) {
|
||||
if (event.key === "Enter" || event.key === "Tab") {
|
||||
if (typeof Glow.applyEmojiSuggestion === "function") {
|
||||
event.preventDefault();
|
||||
Glow.applyEmojiSuggestion();
|
||||
if (Glow.handleEmojiAutocompleteKeydown?.(event, "main")) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (event.key === "Escape") {
|
||||
if (typeof Glow.closeEmojiAutocomplete === "function") {
|
||||
event.preventDefault();
|
||||
Glow.closeEmojiAutocomplete();
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (event.key === "Enter" && !event.shiftKey) {
|
||||
event.preventDefault();
|
||||
@ -699,22 +590,9 @@ Glow.els.messageInput.addEventListener("keydown", event => {
|
||||
});
|
||||
|
||||
Glow.els.threadInput?.addEventListener("keydown", event => {
|
||||
if (Glow.state.emojiAutocomplete?.open && Glow.state.emojiAutocomplete.owner === "thread") {
|
||||
if (event.key === "Enter" || event.key === "Tab") {
|
||||
if (typeof Glow.applyEmojiSuggestion === "function") {
|
||||
event.preventDefault();
|
||||
Glow.applyEmojiSuggestion();
|
||||
if (Glow.handleEmojiAutocompleteKeydown?.(event, "thread")) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (event.key === "Escape") {
|
||||
if (typeof Glow.closeEmojiAutocomplete === "function") {
|
||||
event.preventDefault();
|
||||
Glow.closeEmojiAutocomplete();
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (event.key === "Enter" && !event.shiftKey) {
|
||||
event.preventDefault();
|
||||
@ -760,33 +638,20 @@ Glow.els.threadAttachmentInput?.addEventListener("change", () => {
|
||||
Glow.setSelectedThreadAttachment?.(files);
|
||||
});
|
||||
|
||||
Glow.els.feedButton.addEventListener("click", async () => {
|
||||
await Glow.navigateToView("feed", {
|
||||
before: async () => {
|
||||
Glow.state.activeDm = null;
|
||||
},
|
||||
after: async () => {
|
||||
await Glow.loadFeed();
|
||||
}
|
||||
});
|
||||
});
|
||||
Glow.els.feedButton.addEventListener("click", Glow.openFeed);
|
||||
|
||||
Glow.els.dmsButton?.addEventListener("click", async () => {
|
||||
await Glow.navigateToView("dms", {
|
||||
after: async () => {
|
||||
Glow.state.activeView = "dms";
|
||||
Glow.updateViewUI();
|
||||
await Glow.loadDms?.();
|
||||
}
|
||||
});
|
||||
Glow.schedulePoll();
|
||||
});
|
||||
|
||||
Glow.els.pagesButton?.addEventListener("click", async () => {
|
||||
await Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
Glow.els.pagesButton?.addEventListener("click", () => {
|
||||
Glow.openPages?.();
|
||||
});
|
||||
});
|
||||
|
||||
Glow.els.backButton?.addEventListener("click", async () => {
|
||||
await Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
if (Glow.state.activeView === "thread") {
|
||||
await Glow.returnToChannel?.();
|
||||
} else if (Glow.state.activeView === "page") {
|
||||
@ -798,7 +663,6 @@ Glow.els.backButton?.addEventListener("click", async () => {
|
||||
Glow.updateViewUI();
|
||||
await Glow.loadDms?.();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
Glow.els.loginButton.addEventListener("click", () => {
|
||||
@ -819,41 +683,73 @@ Glow.els.passwordInput.addEventListener("keydown", event => {
|
||||
Glow.els.logoutButton.addEventListener("click", Glow.logout);
|
||||
|
||||
Glow.els.roomSelect.addEventListener("change", async () => {
|
||||
const selected = Glow.state.rooms.find(
|
||||
room => room.slug === Glow.els.roomSelect.value
|
||||
);
|
||||
if (!selected) return;
|
||||
const selectedRoom =
|
||||
Glow.state.rooms.find(room => room.slug === Glow.els.roomSelect.value) || null;
|
||||
const selectedChannel =
|
||||
Glow.state.channels?.find(channel => channel.slug === Glow.els.roomSelect.value) || null;
|
||||
|
||||
await Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
if (selectedChannel && Glow.state.activeTeam) {
|
||||
Glow.state.activeDm = null;
|
||||
Glow.state.activeRoom = selected;
|
||||
Glow.state.activeChannel = selectedChannel;
|
||||
Glow.state.activeRoom = selectedChannel;
|
||||
Glow.state.activeView = "channel";
|
||||
} else if (selectedRoom) {
|
||||
Glow.state.activeDm = null;
|
||||
Glow.state.activeChannel = null;
|
||||
Glow.state.activeRoom = selectedRoom;
|
||||
Glow.state.activeView = "room";
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
Glow.state.typingUsers = [];
|
||||
Glow.state.dmTypingUsers = [];
|
||||
Glow.renderTyping();
|
||||
Glow.updateViewUI();
|
||||
|
||||
if (Glow.state.activeView === "channel") {
|
||||
await Glow.loadChannelMessages?.();
|
||||
} else {
|
||||
await Glow.loadMessages();
|
||||
}
|
||||
|
||||
Glow.pollTyping();
|
||||
Glow.pingPresence?.();
|
||||
Glow.refreshPresence?.();
|
||||
Glow.schedulePoll();
|
||||
});
|
||||
});
|
||||
|
||||
Glow.els.teamSelect?.addEventListener("change", () => {
|
||||
Glow.els.teamSelect?.addEventListener("change", async () => {
|
||||
const teams = Glow.state.teams || [];
|
||||
Glow.state.activeTeam =
|
||||
const selected =
|
||||
teams.find(team => team.slug === Glow.els.teamSelect.value) || null;
|
||||
|
||||
Glow.state.activeTeam = selected;
|
||||
|
||||
if (selected && typeof Glow.loadChannelsForTeam === "function") {
|
||||
try {
|
||||
await Glow.loadChannelsForTeam(selected.slug);
|
||||
if (Glow.state.activeChannel) {
|
||||
Glow.state.activeDm = null;
|
||||
Glow.state.activeRoom = Glow.state.activeChannel;
|
||||
Glow.state.activeView = "channel";
|
||||
Glow.updateViewUI();
|
||||
await Glow.loadChannelMessages?.();
|
||||
Glow.pollTyping?.();
|
||||
Glow.pingPresence?.();
|
||||
Glow.refreshPresence?.();
|
||||
Glow.schedulePoll();
|
||||
}
|
||||
} catch (error) {
|
||||
Glow.showToast(error.message || "Could not load channels for this team.", "error");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Glow.els.adminFab.addEventListener("click", Glow.openAdminPanel);
|
||||
Glow.els.closeAdminButton.addEventListener("click", Glow.closeAdminPanel);
|
||||
Glow.els.createRoomButton.addEventListener("click", Glow.createRoom);
|
||||
Glow.els.clearMessagesButton.addEventListener("click", Glow.clearActiveRoom);
|
||||
Glow.els.typingToggleButton?.addEventListener("click", Glow.toggleTypingIndicators);
|
||||
Glow.els.notificationsToggleButton?.addEventListener("click", Glow.toggleNotifications);
|
||||
Glow.els.themeButton?.addEventListener("click", Glow.openAccentColorPicker);
|
||||
|
||||
Glow.els.settingsButton?.addEventListener("click", () => {
|
||||
Glow.toggleHeaderMenu?.();
|
||||
@ -916,10 +812,9 @@ document.getElementById("closeCallPanelButton")?.addEventListener("click", () =>
|
||||
Glow.calls.ensureState();
|
||||
Glow.state.calls.panelOpen = false;
|
||||
document.getElementById("callOverlay")?.classList.add("hidden");
|
||||
Glow.persistCallPanelPosition?.();
|
||||
});
|
||||
|
||||
document.addEventListener("keydown", async event => {
|
||||
document.addEventListener("keydown", event => {
|
||||
if (event.key !== "Escape") return;
|
||||
|
||||
if (!Glow.els.dialogOverlay.classList.contains("hidden")) {
|
||||
@ -927,11 +822,6 @@ document.addEventListener("keydown", async event => {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!Glow.els.imageCropOverlay?.classList.contains("hidden")) {
|
||||
Glow.profileResetCropState?.();
|
||||
return;
|
||||
}
|
||||
|
||||
if (!Glow.els.mediaOverlay?.classList.contains("hidden")) {
|
||||
Glow.closeMediaModal?.();
|
||||
return;
|
||||
@ -951,30 +841,23 @@ document.addEventListener("keydown", async event => {
|
||||
Glow.calls.ensureState();
|
||||
Glow.state.calls.panelOpen = false;
|
||||
Glow.els.callOverlay.classList.add("hidden");
|
||||
Glow.persistCallPanelPosition?.();
|
||||
return;
|
||||
}
|
||||
|
||||
if (Glow.state.activeView === "thread") {
|
||||
await Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
Glow.returnToChannel?.();
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (Glow.state.activeView === "page") {
|
||||
await Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
Glow.openPages?.();
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (Glow.state.activeView === "dm") {
|
||||
await Glow.confirmDirtySettingsBeforeNavigate(async () => {
|
||||
Glow.state.activeView = "dms";
|
||||
Glow.updateViewUI();
|
||||
Glow.loadDms?.();
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
@ -1058,13 +941,7 @@ setInterval(() => {
|
||||
}
|
||||
}, 10000);
|
||||
|
||||
window.addEventListener("beforeunload", event => {
|
||||
if (Glow.state.activeView === "settings" && Glow.isSettingsDirty()) {
|
||||
event.preventDefault();
|
||||
event.returnValue = "";
|
||||
return "";
|
||||
}
|
||||
|
||||
window.addEventListener("beforeunload", () => {
|
||||
const sessionId = Glow.state.calls.activeCall?.groupSession?.id;
|
||||
if (!sessionId || !navigator.sendBeacon) return;
|
||||
|
||||
@ -1096,5 +973,4 @@ Glow.autoResizeComposer();
|
||||
Glow.updateMessageCount();
|
||||
Glow.autoResizeThreadComposer?.();
|
||||
Glow.updateThreadMessageCount?.();
|
||||
Glow.state.dmLayoutMode = Glow.loadDmLayoutPreference();
|
||||
Glow.checkAuth();
|
||||
Loading…
x
Reference in New Issue
Block a user