Merge pull request #1500 from thelounge/xpaw/even-more-modules
Move even more code out of lounge.js
This commit is contained in:
Pavel Djundik
GitHub
commit
8de7f44b98
112
client/js/keybinds.js
Normal file
112
client/js/keybinds.js
Normal file
@ -0,0 +1,112 @@
|
||||
"use strict";
|
||||
|
||||
const $ = require("jquery");
|
||||
const Mousetrap = require("mousetrap");
|
||||
const utils = require("./utils");
|
||||
const input = $("#input");
|
||||
const sidebar = $("#sidebar");
|
||||
const windows = $("#windows");
|
||||
const contextMenuContainer = $("#context-menu-container");
|
||||
|
||||
Mousetrap.bind([
|
||||
"pageup",
|
||||
"pagedown"
|
||||
], function(e, key) {
|
||||
let container = windows.find(".window.active");
|
||||
|
||||
// Chat windows scroll message container
|
||||
if (container.attr("id") === "chat-container") {
|
||||
container = container.find(".chan.active .chat");
|
||||
}
|
||||
|
||||
container.finish();
|
||||
|
||||
const offset = container.get(0).clientHeight * 0.9;
|
||||
let scrollTop = container.scrollTop();
|
||||
|
||||
if (key === "pageup") {
|
||||
scrollTop = Math.floor(scrollTop - offset);
|
||||
} else {
|
||||
scrollTop = Math.ceil(scrollTop + offset);
|
||||
}
|
||||
|
||||
container.animate({
|
||||
scrollTop: scrollTop
|
||||
}, 200);
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
Mousetrap.bind([
|
||||
"command+up",
|
||||
"command+down",
|
||||
"ctrl+up",
|
||||
"ctrl+down"
|
||||
], function(e, keys) {
|
||||
const channels = sidebar.find(".chan");
|
||||
const index = channels.index(channels.filter(".active"));
|
||||
const direction = keys.split("+").pop();
|
||||
let target;
|
||||
|
||||
switch (direction) {
|
||||
case "up":
|
||||
target = (channels.length + (index - 1 + channels.length)) % channels.length;
|
||||
break;
|
||||
|
||||
case "down":
|
||||
target = (channels.length + (index + 1 + channels.length)) % channels.length;
|
||||
break;
|
||||
}
|
||||
|
||||
channels.eq(target).click();
|
||||
});
|
||||
|
||||
Mousetrap.bind([
|
||||
"command+shift+l",
|
||||
"ctrl+shift+l"
|
||||
], function(e) {
|
||||
if (e.target === input[0]) {
|
||||
utils.clear();
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
Mousetrap.bind([
|
||||
"escape"
|
||||
], function() {
|
||||
contextMenuContainer.hide();
|
||||
});
|
||||
|
||||
const colorsHotkeys = {
|
||||
k: "\x03",
|
||||
b: "\x02",
|
||||
u: "\x1F",
|
||||
i: "\x1D",
|
||||
o: "\x0F",
|
||||
};
|
||||
|
||||
for (const hotkey in colorsHotkeys) {
|
||||
Mousetrap.bind([
|
||||
"command+" + hotkey,
|
||||
"ctrl+" + hotkey
|
||||
], function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const cursorPosStart = input.prop("selectionStart");
|
||||
const cursorPosEnd = input.prop("selectionEnd");
|
||||
const value = input.val();
|
||||
let newValue = value.substring(0, cursorPosStart) + colorsHotkeys[e.key];
|
||||
|
||||
if (cursorPosStart === cursorPosEnd) {
|
||||
// If no text is selected, insert at cursor
|
||||
newValue += value.substring(cursorPosEnd, value.length);
|
||||
} else {
|
||||
// If text is selected, insert formatting character at start and the end
|
||||
newValue += value.substring(cursorPosStart, cursorPosEnd) + colorsHotkeys[e.key] + value.substring(cursorPosEnd, value.length);
|
||||
}
|
||||
|
||||
input
|
||||
.val(newValue)
|
||||
.get(0).setSelectionRange(cursorPosStart + 1, cursorPosEnd + 1);
|
||||
});
|
||||
}
|
||||
@ -4,23 +4,22 @@
|
||||
require("jquery-ui/ui/widgets/sortable");
|
||||
const $ = require("jquery");
|
||||
const moment = require("moment");
|
||||
const Mousetrap = require("mousetrap");
|
||||
const URI = require("urijs");
|
||||
const fuzzy = require("fuzzy");
|
||||
|
||||
// our libraries
|
||||
require("./libs/jquery/inputhistory");
|
||||
require("./libs/jquery/stickyscroll");
|
||||
const helpers_roundBadgeNumber = require("./libs/handlebars/roundBadgeNumber");
|
||||
const slideoutMenu = require("./libs/slideout");
|
||||
const templates = require("../views");
|
||||
const socket = require("./socket");
|
||||
require("./socket-events");
|
||||
const storage = require("./localStorage");
|
||||
const options = require("./options");
|
||||
require("./options");
|
||||
const utils = require("./utils");
|
||||
require("./autocompletion");
|
||||
require("./webpush");
|
||||
require("./keybinds");
|
||||
require("./clipboard");
|
||||
|
||||
$(function() {
|
||||
@ -29,20 +28,6 @@ $(function() {
|
||||
|
||||
$(document.body).data("app-name", document.title);
|
||||
|
||||
var pop;
|
||||
try {
|
||||
pop = new Audio();
|
||||
pop.src = "audio/pop.ogg";
|
||||
} catch (e) {
|
||||
pop = {
|
||||
play: $.noop
|
||||
};
|
||||
}
|
||||
|
||||
$("#play").on("click", function() {
|
||||
pop.play();
|
||||
});
|
||||
|
||||
var windows = $("#windows");
|
||||
var viewport = $("#viewport");
|
||||
var sidebarSlide = slideoutMenu(viewport[0], sidebar[0]);
|
||||
@ -494,95 +479,6 @@ $(function() {
|
||||
container.html(templates.user_filtered({matches: result})).show();
|
||||
});
|
||||
|
||||
chat.on("msg", ".messages", function(e, target, msg) {
|
||||
var unread = msg.unread;
|
||||
msg = msg.msg;
|
||||
|
||||
if (msg.self) {
|
||||
return;
|
||||
}
|
||||
|
||||
var button = sidebar.find(".chan[data-target='" + target + "']");
|
||||
if (msg.highlight || (options.notifyAllMessages && msg.type === "message")) {
|
||||
if (!document.hasFocus() || !$(target).hasClass("active")) {
|
||||
if (options.notification) {
|
||||
try {
|
||||
pop.play();
|
||||
} catch (exception) {
|
||||
// On mobile, sounds can not be played without user interaction.
|
||||
}
|
||||
}
|
||||
utils.toggleNotificationMarkers(true);
|
||||
|
||||
if (options.desktopNotifications && Notification.permission === "granted") {
|
||||
var title;
|
||||
var body;
|
||||
|
||||
if (msg.type === "invite") {
|
||||
title = "New channel invite:";
|
||||
body = msg.from + " invited you to " + msg.channel;
|
||||
} else {
|
||||
title = msg.from;
|
||||
if (!button.hasClass("query")) {
|
||||
title += " (" + button.data("title").trim() + ")";
|
||||
}
|
||||
if (msg.type === "message") {
|
||||
title += " says:";
|
||||
}
|
||||
body = msg.text.replace(/\x03(?:[0-9]{1,2}(?:,[0-9]{1,2})?)?|[\x00-\x1F]|\x7F/g, "").trim();
|
||||
}
|
||||
|
||||
try {
|
||||
var notify = new Notification(title, {
|
||||
body: body,
|
||||
icon: "img/logo-64.png",
|
||||
tag: target
|
||||
});
|
||||
notify.addEventListener("click", function() {
|
||||
window.focus();
|
||||
button.click();
|
||||
this.close();
|
||||
});
|
||||
} catch (exception) {
|
||||
// `new Notification(...)` is not supported and should be silenced.
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (button.hasClass("active")) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!unread) {
|
||||
return;
|
||||
}
|
||||
|
||||
var badge = button.find(".badge").html(helpers_roundBadgeNumber(unread));
|
||||
|
||||
if (msg.highlight) {
|
||||
badge.addClass("highlight");
|
||||
}
|
||||
});
|
||||
|
||||
chat.on("click", ".show-more-button", function() {
|
||||
var self = $(this);
|
||||
var lastMessage = self.parent().next(".messages").children(".msg").first();
|
||||
if (lastMessage.is(".condensed")) {
|
||||
lastMessage = lastMessage.children(".msg").first();
|
||||
}
|
||||
var lastMessageId = parseInt(lastMessage[0].id.replace("msg-", ""), 10);
|
||||
|
||||
self
|
||||
.text("Loading older messages…")
|
||||
.prop("disabled", true);
|
||||
|
||||
socket.emit("more", {
|
||||
target: self.data("id"),
|
||||
lastId: lastMessageId
|
||||
});
|
||||
});
|
||||
|
||||
var forms = $("#sign-in, #connect, #change-password");
|
||||
|
||||
windows.on("show", "#sign-in", function() {
|
||||
@ -668,111 +564,6 @@ $(function() {
|
||||
$(this).data("lastvalue", nick);
|
||||
});
|
||||
|
||||
(function HotkeysScope() {
|
||||
Mousetrap.bind([
|
||||
"pageup",
|
||||
"pagedown"
|
||||
], function(e, key) {
|
||||
let container = windows.find(".window.active");
|
||||
|
||||
// Chat windows scroll message container
|
||||
if (container.attr("id") === "chat-container") {
|
||||
container = container.find(".chan.active .chat");
|
||||
}
|
||||
|
||||
container.finish();
|
||||
|
||||
const offset = container.get(0).clientHeight * 0.9;
|
||||
let scrollTop = container.scrollTop();
|
||||
|
||||
if (key === "pageup") {
|
||||
scrollTop = Math.floor(scrollTop - offset);
|
||||
} else {
|
||||
scrollTop = Math.ceil(scrollTop + offset);
|
||||
}
|
||||
|
||||
container.animate({
|
||||
scrollTop: scrollTop
|
||||
}, 200);
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
Mousetrap.bind([
|
||||
"command+up",
|
||||
"command+down",
|
||||
"ctrl+up",
|
||||
"ctrl+down"
|
||||
], function(e, keys) {
|
||||
var channels = sidebar.find(".chan");
|
||||
var index = channels.index(channels.filter(".active"));
|
||||
var direction = keys.split("+").pop();
|
||||
switch (direction) {
|
||||
case "up":
|
||||
// Loop
|
||||
var upTarget = (channels.length + (index - 1 + channels.length)) % channels.length;
|
||||
channels.eq(upTarget).click();
|
||||
break;
|
||||
|
||||
case "down":
|
||||
// Loop
|
||||
var downTarget = (channels.length + (index + 1 + channels.length)) % channels.length;
|
||||
channels.eq(downTarget).click();
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
Mousetrap.bind([
|
||||
"command+shift+l",
|
||||
"ctrl+shift+l"
|
||||
], function(e) {
|
||||
if (e.target === input[0]) {
|
||||
utils.clear();
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
Mousetrap.bind([
|
||||
"escape"
|
||||
], function() {
|
||||
contextMenuContainer.hide();
|
||||
});
|
||||
|
||||
var colorsHotkeys = {
|
||||
k: "\x03",
|
||||
b: "\x02",
|
||||
u: "\x1F",
|
||||
i: "\x1D",
|
||||
o: "\x0F",
|
||||
};
|
||||
|
||||
for (var hotkey in colorsHotkeys) {
|
||||
Mousetrap.bind([
|
||||
"command+" + hotkey,
|
||||
"ctrl+" + hotkey
|
||||
], function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const cursorPosStart = input.prop("selectionStart");
|
||||
const cursorPosEnd = input.prop("selectionEnd");
|
||||
const value = input.val();
|
||||
let newValue = value.substring(0, cursorPosStart) + colorsHotkeys[e.key];
|
||||
|
||||
if (cursorPosStart === cursorPosEnd) {
|
||||
// If no text is selected, insert at cursor
|
||||
newValue += value.substring(cursorPosEnd, value.length);
|
||||
} else {
|
||||
// If text is selected, insert formatting character at start and the end
|
||||
newValue += value.substring(cursorPosStart, cursorPosEnd) + colorsHotkeys[e.key] + value.substring(cursorPosEnd, value.length);
|
||||
}
|
||||
|
||||
input
|
||||
.val(newValue)
|
||||
.get(0).setSelectionRange(cursorPosStart + 1, cursorPosEnd + 1);
|
||||
});
|
||||
}
|
||||
}());
|
||||
|
||||
$(document).on("visibilitychange focus click", () => {
|
||||
if (sidebar.find(".highlight").length === 0) {
|
||||
utils.toggleNotificationMarkers(false);
|
||||
|
||||
@ -54,3 +54,21 @@ socket.on("more", function(data) {
|
||||
.text("Show older messages")
|
||||
.prop("disabled", false);
|
||||
});
|
||||
|
||||
chat.on("click", ".show-more-button", function() {
|
||||
var self = $(this);
|
||||
var lastMessage = self.parent().next(".messages").children(".msg").first();
|
||||
if (lastMessage.is(".condensed")) {
|
||||
lastMessage = lastMessage.children(".msg").first();
|
||||
}
|
||||
var lastMessageId = parseInt(lastMessage[0].id.replace("msg-", ""), 10);
|
||||
|
||||
self
|
||||
.text("Loading older messages…")
|
||||
.prop("disabled", true);
|
||||
|
||||
socket.emit("more", {
|
||||
target: self.data("id"),
|
||||
lastId: lastMessageId
|
||||
});
|
||||
});
|
||||
|
||||
@ -4,7 +4,22 @@ const $ = require("jquery");
|
||||
const socket = require("../socket");
|
||||
const render = require("../render");
|
||||
const utils = require("../utils");
|
||||
const options = require("../options");
|
||||
const helpers_roundBadgeNumber = require("../libs/handlebars/roundBadgeNumber");
|
||||
const chat = $("#chat");
|
||||
const sidebar = $("#sidebar");
|
||||
|
||||
let pop;
|
||||
try {
|
||||
pop = new Audio();
|
||||
pop.src = "audio/pop.ogg";
|
||||
} catch (e) {
|
||||
pop = {
|
||||
play: $.noop
|
||||
};
|
||||
}
|
||||
|
||||
$("#play").on("click", () => pop.play());
|
||||
|
||||
socket.on("msg", function(data) {
|
||||
// We set a maximum timeout of 2 seconds so that messages don't take too long to appear.
|
||||
@ -27,14 +42,13 @@ function processReceivedMessage(data) {
|
||||
render.appendMessage(
|
||||
container,
|
||||
targetId,
|
||||
$(target).attr("data-type"),
|
||||
channel.attr("data-type"),
|
||||
data.msg
|
||||
);
|
||||
|
||||
container.trigger("msg", [
|
||||
target,
|
||||
data
|
||||
]).trigger("keepToBottom");
|
||||
container.trigger("keepToBottom");
|
||||
|
||||
notifyMessage(targetId, channel, data);
|
||||
|
||||
var lastVisible = container.find("div:visible").last();
|
||||
if (data.msg.self
|
||||
@ -70,3 +84,71 @@ function processReceivedMessage(data) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function notifyMessage(targetId, channel, msg) {
|
||||
const unread = msg.unread;
|
||||
msg = msg.msg;
|
||||
|
||||
if (msg.self) {
|
||||
return;
|
||||
}
|
||||
|
||||
const button = sidebar.find(".chan[data-id='" + targetId + "']");
|
||||
if (msg.highlight || (options.notifyAllMessages && msg.type === "message")) {
|
||||
if (!document.hasFocus() || !channel.hasClass("active")) {
|
||||
if (options.notification) {
|
||||
try {
|
||||
pop.play();
|
||||
} catch (exception) {
|
||||
// On mobile, sounds can not be played without user interaction.
|
||||
}
|
||||
}
|
||||
|
||||
utils.toggleNotificationMarkers(true);
|
||||
|
||||
if (options.desktopNotifications && Notification.permission === "granted") {
|
||||
let title;
|
||||
let body;
|
||||
|
||||
if (msg.type === "invite") {
|
||||
title = "New channel invite:";
|
||||
body = msg.from + " invited you to " + msg.channel;
|
||||
} else {
|
||||
title = msg.from;
|
||||
if (!button.hasClass("query")) {
|
||||
title += " (" + button.data("title").trim() + ")";
|
||||
}
|
||||
if (msg.type === "message") {
|
||||
title += " says:";
|
||||
}
|
||||
body = msg.text.replace(/\x03(?:[0-9]{1,2}(?:,[0-9]{1,2})?)?|[\x00-\x1F]|\x7F/g, "").trim();
|
||||
}
|
||||
|
||||
try {
|
||||
const notify = new Notification(title, {
|
||||
body: body,
|
||||
icon: "img/logo-64.png",
|
||||
tag: `lounge-${targetId}`
|
||||
});
|
||||
notify.addEventListener("click", function() {
|
||||
window.focus();
|
||||
button.click();
|
||||
this.close();
|
||||
});
|
||||
} catch (exception) {
|
||||
// `new Notification(...)` is not supported and should be silenced.
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!unread || button.hasClass("active")) {
|
||||
return;
|
||||
}
|
||||
|
||||
const badge = button.find(".badge").html(helpers_roundBadgeNumber(unread));
|
||||
|
||||
if (msg.highlight) {
|
||||
badge.addClass("highlight");
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user