hardlounge/client/js/options.js

180 lines
5.9 KiB
JavaScript
Raw Normal View History

2017-04-22 13:03:00 +00:00
"use strict";
2017-05-18 20:08:54 +00:00
2017-04-22 13:03:00 +00:00
const $ = require("jquery");
const escapeRegExp = require("lodash/escapeRegExp");
2017-04-22 13:03:00 +00:00
const userStyles = $("#user-specified-css");
const storage = require("./localStorage");
2017-05-06 18:44:57 +00:00
const tz = require("./libs/handlebars/tz");
2017-04-22 13:03:00 +00:00
const windows = $("#windows");
const chat = $("#chat");
// Default options
const options = {
autocomplete: true,
nickPostfix: "",
2017-04-22 13:03:00 +00:00
coloredNicks: true,
desktopNotifications: false,
highlights: [],
2017-04-22 13:03:00 +00:00
links: true,
2017-05-09 22:18:32 +00:00
motd: true,
2017-04-22 13:03:00 +00:00
notification: true,
notifyAllMessages: false,
2017-05-06 18:44:57 +00:00
showSeconds: false,
statusMessages: "condensed",
2018-02-04 17:32:04 +00:00
theme: $("#theme").prop("href").match(/themes\/(.*?)\.css$/), // TODO: Make this a data attribute in v3
2017-12-06 22:27:35 +00:00
media: true,
2017-04-22 13:03:00 +00:00
userStyles: userStyles.text(),
};
let userOptions = JSON.parse(storage.get("settings")) || {};
2018-02-04 17:32:04 +00:00
options.theme = options.theme ? options.theme[1] : "example"; // TODO: Remove in v3
for (const key in options) {
if (userOptions[key] !== undefined) {
options[key] = userOptions[key];
}
}
2017-04-22 13:03:00 +00:00
2017-11-07 20:22:16 +00:00
// Apply custom CSS on page load
if (typeof userOptions.userStyles === "string" && !/[?&]nocss/.test(window.location.search)) {
userStyles.html(userOptions.userStyles);
}
userOptions = null;
2017-04-22 13:03:00 +00:00
module.exports = options;
// Due to cyclical dependency, have to require it after exports
const autocompletion = require("./autocompletion");
2017-06-26 09:01:55 +00:00
module.exports.shouldOpenMessagePreview = function(type) {
return type === "link" ? options.links : options.media;
2017-06-26 09:01:55 +00:00
};
2017-11-07 20:22:16 +00:00
module.exports.initialize = () => {
module.exports.initialize = null;
const settings = $("#settings");
for (var i in options) {
if (i === "userStyles") {
settings.find("#user-specified-css-input").val(options[i]);
} else if (i === "highlights") {
settings.find("input[name=" + i + "]").val(options[i]);
} else if (i === "nickPostfix") {
settings.find("input[name=" + i + "]").val(options[i]);
2017-11-07 20:22:16 +00:00
} else if (i === "statusMessages") {
settings.find(`input[name=${i}][value=${options[i]}]`)
.prop("checked", true);
} else if (i === "theme") {
$("#theme").prop("href", "themes/" + options[i] + ".css");
2017-11-07 20:22:16 +00:00
settings.find("select[name=" + i + "]").val(options[i]);
} else if (options[i]) {
settings.find("input[name=" + i + "]").prop("checked", true);
2017-04-22 13:03:00 +00:00
}
}
2017-12-06 13:55:55 +00:00
const desktopNotificationsCheckbox = $("#desktopNotifications");
const warningUnsupported = $("#warnUnsupportedDesktopNotifications");
const warningBlocked = $("#warnBlockedDesktopNotifications").hide();
// Updates the checkbox and warning in settings when the Settings page is
// opened or when the checkbox state is changed.
// When notifications are not supported, this is never called (because
// checkbox state can not be changed).
const updateDesktopNotificationStatus = function() {
if (Notification.permission === "denied") {
desktopNotificationsCheckbox.prop("disabled", true);
desktopNotificationsCheckbox.prop("checked", false);
2017-12-06 13:55:55 +00:00
warningBlocked.show();
} else {
if (Notification.permission === "default" && desktopNotificationsCheckbox.prop("checked")) {
desktopNotificationsCheckbox.prop("checked", false);
2017-12-06 13:55:55 +00:00
}
desktopNotificationsCheckbox.prop("disabled", false);
2017-12-06 13:55:55 +00:00
warningBlocked.hide();
}
};
// If browser does not support notifications, override existing settings and
// display proper message in settings.
if (("Notification" in window)) {
warningUnsupported.hide();
windows.on("show", "#settings", updateDesktopNotificationStatus);
} else {
options.desktopNotifications = false;
desktopNotificationsCheckbox.prop("disabled", true);
desktopNotificationsCheckbox.prop("checked", false);
2017-12-06 13:55:55 +00:00
}
2017-11-07 20:22:16 +00:00
settings.on("change", "input, select, textarea", function() {
const self = $(this);
const type = self.prop("type");
const name = self.prop("name");
2017-04-22 13:03:00 +00:00
2017-11-07 20:22:16 +00:00
if (type === "password") {
return;
} else if (type === "radio") {
if (self.prop("checked")) {
options[name] = self.val();
}
} else if (type === "checkbox") {
options[name] = self.prop("checked");
} else {
options[name] = self.val();
}
2017-04-22 13:03:00 +00:00
2017-11-07 20:22:16 +00:00
storage.set("settings", JSON.stringify(options));
if (name === "motd") {
chat.toggleClass("hide-" + name, !self.prop("checked"));
} else if (name === "statusMessages") {
chat.toggleClass("hide-status-messages", options[name] === "hidden");
chat.toggleClass("condensed-status-messages", options[name] === "condensed");
} else if (name === "coloredNicks") {
chat.toggleClass("colored-nicks", self.prop("checked"));
} else if (name === "theme") {
$("#theme").prop("href", "themes/" + options[name] + ".css");
2017-11-07 20:22:16 +00:00
} else if (name === "userStyles") {
userStyles.html(options[name]);
} else if (name === "highlights") {
var highlightString = options[name];
options.highlights = highlightString.split(",").map(function(h) {
return h.trim();
}).filter(function(h) {
// Ensure we don't have empty string in the list of highlights
// otherwise, users get notifications for everything
return h !== "";
});
// Construct regex with wordboundary for every highlight item
const highlightsTokens = options.highlights.map(function(h) {
return escapeRegExp(h);
});
if (highlightsTokens && highlightsTokens.length) {
module.exports.highlightsRE = new RegExp("\\b(?:" + highlightsTokens.join("|") + ")\\b", "i");
} else {
module.exports.highlightsRE = null;
}
} else if (name === "nickPostfix") {
options.nickPostfix = options[name];
2017-11-07 20:22:16 +00:00
} else if (name === "showSeconds") {
chat.find(".msg > .time").each(function() {
$(this).text(tz($(this).parent().data("time")));
});
chat.toggleClass("show-seconds", self.prop("checked"));
} else if (name === "autocomplete") {
if (self.prop("checked")) {
2017-12-05 17:44:40 +00:00
autocompletion.enable();
2017-11-07 20:22:16 +00:00
} else {
2017-12-05 17:44:40 +00:00
autocompletion.disable();
2017-11-07 20:22:16 +00:00
}
2017-12-06 13:55:55 +00:00
} else if (name === "desktopNotifications") {
if ($(this).prop("checked") && Notification.permission !== "granted") {
Notification.requestPermission(updateDesktopNotificationStatus);
}
2017-11-07 20:22:16 +00:00
}
}).find("input")
.trigger("change");
2017-04-22 13:03:00 +00:00
};