Make a consistent single funciton for updating notified/favicon/title
This commit is contained in:
parent
47b9924f26
commit
b6e07a43f5
@ -19,7 +19,7 @@
|
|||||||
<title>The Lounge</title>
|
<title>The Lounge</title>
|
||||||
|
|
||||||
<!-- Browser tab icon -->
|
<!-- Browser tab icon -->
|
||||||
<link id="favicon" rel="icon" sizes="16x16 32x32 64x64" href="img/favicon-normal.ico" data-other="img/favicon-alerted.ico" data-toggled="false" type="image/x-icon">
|
<link id="favicon" rel="icon" sizes="16x16 32x32 64x64" href="img/favicon-normal.ico" data-other="img/favicon-alerted.ico" type="image/x-icon">
|
||||||
|
|
||||||
<!-- Safari pinned tab icon -->
|
<!-- Safari pinned tab icon -->
|
||||||
<link rel="mask-icon" href="img/icon-black-transparent-bg.svg" color="#415363">
|
<link rel="mask-icon" href="img/icon-black-transparent-bg.svg" color="#415363">
|
||||||
|
@ -132,21 +132,6 @@ window.vueMounted = () => {
|
|||||||
|
|
||||||
socket.emit("open", channel ? channel.channel.id : null);
|
socket.emit("open", channel ? channel.channel.id : null);
|
||||||
|
|
||||||
let hasAnyHighlights = false;
|
|
||||||
|
|
||||||
for (const network of vueApp.networks) {
|
|
||||||
for (const chan of network.channels) {
|
|
||||||
if (chan.highlight > 0) {
|
|
||||||
hasAnyHighlights = true;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!hasAnyHighlights) {
|
|
||||||
utils.toggleNotificationMarkers(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!keepSidebarOpen && $(window).outerWidth() <= utils.mobileViewportPixels) {
|
if (!keepSidebarOpen && $(window).outerWidth() <= utils.mobileViewportPixels) {
|
||||||
slideoutMenu.toggle(false);
|
slideoutMenu.toggle(false);
|
||||||
}
|
}
|
||||||
@ -161,7 +146,7 @@ window.vueMounted = () => {
|
|||||||
.addClass("active")
|
.addClass("active")
|
||||||
.trigger("show");
|
.trigger("show");
|
||||||
|
|
||||||
utils.updateTitle();
|
utils.synchronizeNotifiedState();
|
||||||
|
|
||||||
if (self.hasClass("chan")) {
|
if (self.hasClass("chan")) {
|
||||||
vueApp.$nextTick(() => $("#chat-container").addClass("active"));
|
vueApp.$nextTick(() => $("#chat-container").addClass("active"));
|
||||||
@ -223,15 +208,7 @@ window.vueMounted = () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
$(document).on("visibilitychange focus click", () => {
|
$(document).on("visibilitychange focus click", () => {
|
||||||
for (const network of vueApp.networks) {
|
utils.synchronizeNotifiedState();
|
||||||
for (const channel of network.channels) {
|
|
||||||
if (channel.highlight > 0) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
utils.toggleNotificationMarkers(false);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Compute how many milliseconds are remaining until the next day starts
|
// Compute how many milliseconds are remaining until the next day starts
|
||||||
|
@ -98,16 +98,7 @@ socket.on("init", function(data) {
|
|||||||
vueApp.$nextTick(() => openCorrectChannel(previousActive, data.active));
|
vueApp.$nextTick(() => openCorrectChannel(previousActive, data.active));
|
||||||
|
|
||||||
utils.confirmExit();
|
utils.confirmExit();
|
||||||
|
utils.synchronizeNotifiedState();
|
||||||
for (const network of vueApp.networks) {
|
|
||||||
for (const channel of network.channels) {
|
|
||||||
if (channel.highlight > 0) {
|
|
||||||
utils.updateTitle();
|
|
||||||
utils.toggleNotificationMarkers(true);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
function openCorrectChannel(clientActive, serverActive) {
|
function openCorrectChannel(clientActive, serverActive) {
|
||||||
|
@ -32,7 +32,7 @@ socket.on("msg", function(data) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (data.msg.self || data.msg.highlight) {
|
if (data.msg.self || data.msg.highlight) {
|
||||||
utils.updateTitle();
|
utils.synchronizeNotifiedState();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Display received notices and errors in currently active channel.
|
// Display received notices and errors in currently active channel.
|
||||||
@ -89,8 +89,6 @@ function notifyMessage(targetId, channel, activeChannel, msg) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
utils.toggleNotificationMarkers(true);
|
|
||||||
|
|
||||||
if (options.settings.desktopNotifications && ("Notification" in window) && Notification.permission === "granted") {
|
if (options.settings.desktopNotifications && ("Notification" in window) && Notification.permission === "granted") {
|
||||||
let title;
|
let title;
|
||||||
let body;
|
let body;
|
||||||
|
@ -27,5 +27,5 @@ socket.on("open", function(id) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
utils.updateTitle();
|
utils.synchronizeNotifiedState();
|
||||||
});
|
});
|
||||||
|
@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
const $ = require("jquery");
|
const $ = require("jquery");
|
||||||
const socket = require("../socket");
|
const socket = require("../socket");
|
||||||
|
const utils = require("../utils");
|
||||||
const {vueApp, findChannel} = require("../vue");
|
const {vueApp, findChannel} = require("../vue");
|
||||||
|
|
||||||
socket.on("part", function(data) {
|
socket.on("part", function(data) {
|
||||||
@ -18,4 +19,6 @@ socket.on("part", function(data) {
|
|||||||
if (channel) {
|
if (channel) {
|
||||||
channel.network.channels.splice(channel.network.channels.findIndex((c) => c.id === data.chan), 1);
|
channel.network.channels.splice(channel.network.channels.findIndex((c) => c.id === data.chan), 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
utils.synchronizeNotifiedState();
|
||||||
});
|
});
|
||||||
|
@ -17,8 +17,7 @@ module.exports = {
|
|||||||
hasRoleInChannel,
|
hasRoleInChannel,
|
||||||
move,
|
move,
|
||||||
closeChan,
|
closeChan,
|
||||||
toggleNotificationMarkers,
|
synchronizeNotifiedState,
|
||||||
updateTitle,
|
|
||||||
togglePasswordField,
|
togglePasswordField,
|
||||||
requestIdleCallback,
|
requestIdleCallback,
|
||||||
};
|
};
|
||||||
@ -51,13 +50,31 @@ function scrollIntoViewNicely(el) {
|
|||||||
|
|
||||||
const favicon = $("#favicon");
|
const favicon = $("#favicon");
|
||||||
|
|
||||||
|
function synchronizeNotifiedState() {
|
||||||
|
updateTitle();
|
||||||
|
|
||||||
|
let hasAnyHighlights = false;
|
||||||
|
|
||||||
|
for (const network of vueApp.networks) {
|
||||||
|
for (const chan of network.channels) {
|
||||||
|
if (chan.highlight > 0) {
|
||||||
|
hasAnyHighlights = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleNotificationMarkers(hasAnyHighlights);
|
||||||
|
}
|
||||||
|
|
||||||
function toggleNotificationMarkers(newState) {
|
function toggleNotificationMarkers(newState) {
|
||||||
// Toggles the favicon to red when there are unread notifications
|
// Toggles the favicon to red when there are unread notifications
|
||||||
if (favicon.data("toggled") !== newState) {
|
if (vueApp.isNotified !== newState) {
|
||||||
|
vueApp.isNotified = newState;
|
||||||
|
|
||||||
const old = favicon.prop("href");
|
const old = favicon.prop("href");
|
||||||
favicon.prop("href", favicon.data("other"));
|
favicon.prop("href", favicon.data("other"));
|
||||||
favicon.data("other", old);
|
favicon.data("other", old);
|
||||||
favicon.data("toggled", newState);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Toggles a dot on the menu icon when there are unread notifications
|
// Toggles a dot on the menu icon when there are unread notifications
|
||||||
|
@ -25,6 +25,7 @@ const vueApp = new Vue({
|
|||||||
connected: false,
|
connected: false,
|
||||||
connectionError: false,
|
connectionError: false,
|
||||||
fileUploadEnabled: false,
|
fileUploadEnabled: false,
|
||||||
|
isNotified: false,
|
||||||
appName: document.title,
|
appName: document.title,
|
||||||
activeChannel: null,
|
activeChannel: null,
|
||||||
networks: [],
|
networks: [],
|
||||||
|
Loading…
Reference in New Issue
Block a user