From d2b03854319d5ff030ade8fa299773addc6d882f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= Date: Thu, 21 Dec 2017 15:40:50 -0500 Subject: [PATCH] Add a keyboard handler to close the join form when hitting "Escape" --- client/js/join-channel.js | 19 ++++++++++++++++--- client/js/render.js | 4 ++++ 2 files changed, 20 insertions(+), 3 deletions(-) diff --git a/client/js/join-channel.js b/client/js/join-channel.js index 738bf9e9..a8858ffd 100644 --- a/client/js/join-channel.js +++ b/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(""); - key.val(""); - form.hide(); + closeForm(form.closest(".network")); 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)); + }); +}; diff --git a/client/js/render.js b/client/js/render.js index 3d8461cb..17772d82 100644 --- a/client/js/render.js +++ b/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;