Add a keyboard handler to close the join form when hitting "Escape"

client/js/join-channel.js

@@ -1,12 +1,20 @@
 "use strict";
 
 const $ = require("jquery");
+const Mousetrap = require("mousetrap");
 
 const socket = require("./socket");
 const utils = require("./utils");
 
 const sidebar = $("#sidebar");
 
+function closeForm(network) {
+	const form = network.find(".join-form");
+	form.find("input[name='channel']").val("");
+	form.find("input[name='key']").val("");
+	form.hide();
+}
+
 sidebar.on("click", ".add-channel", (e) => {
 	const id = $(e.target).data("id");
 	const joinForm = $(`#join-channel-${id}`);
@@ -30,8 +38,13 @@ sidebar.on("submit", ".join-form", function() {
 			target: form.prev().data("id"),
 		});
 	}
-	channel.val("");
+	closeForm(form.closest(".network"));
-	key.val("");
-	form.hide();
 	return false;
 });
+
+exports.handleKeybinds = function() {
+	sidebar.find(".join-form input, .join-form button").each(function() {
+		const network = $(this).closest(".network");
+		Mousetrap(this).bind("esc", () => closeForm(network));
+	});
+};

client/js/render.js

@@ -8,6 +8,7 @@ const utils = require("./utils");
 const sorting = require("./sorting");
 const constants = require("./constants");
 const condensed = require("./condensed");
+const JoinChannel = require("./join-channel");
 const helpers_parse = require("./libs/handlebars/parse");
 
 const chat = $("#chat");
@@ -183,6 +184,9 @@ function renderNetworks(data, singleNetwork) {
 		})
 	);
 
+	// Add keyboard handlers to the "Join a channel…" form inputs/button
+	JoinChannel.handleKeybinds();
+
 	let newChannels;
 	const channels = $.map(data.networks, function(n) {
 		return n.channels;