Andreas/evennia
1
0
Fork 0
mirror of https://github.com/evennia/evennia.git synced 2026-03-16 21:06:30 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #2905 from selberhad/fix_multi_input_focus

Browse source 
fix: multiple inputs now retain focus correctly
This commit is contained in:
Griatch 2022-10-09 11:33:09 +02:00 • committed by GitHub
commit 06b281d180
2 changed files with 42 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

8
evennia/web/static/webclient/js/plugins/default_in.js
View file

@ -47,7 +47,7 @@ let defaultInPlugin = (function () {
// enter key by itself should toggle focus
if( inputfield.length < 1 ) {
inputfield = $(".inputfield:last");
inputfield = $(".inputfield.focused");
inputfield.focus();
if( inputfield.length < 1 ) { // non-goldenlayout backwards compatibility
$("#inputfield").focus();
@ -64,9 +64,9 @@ let defaultInPlugin = (function () {
if( focusOnKeydown ) {
// is an inputfield actually focused?
if( inputfield.length < 1 ) {
// Nope, focus the last .inputfield found in the DOM (or #inputfield)
// :last only matters if multi-input plugins are in use
inputfield = $(".inputfield:last");
// Nope, focus the most recently used input field (or #inputfield)
// .focused only matters if multi-input plugins are in use
inputfield = $(".inputfield.focused");
inputfield.focus();
if( inputfield.length < 1 ) { // non-goldenlayout backwards compatibility
$("#inputfield").focus();

43
evennia/web/static/webclient/js/plugins/goldenlayout.js
View file

@ -32,6 +32,20 @@ let goldenlayout = (function () {
id: "inputComponent",
};
// helper function: only allow a function to be called once
function once(func) {
function _f() {
if (!_f.isCalled) {
_f.isCalled = true;
_f.res = func.apply(this, arguments);
}
return _f.res;
}
_f.prototype = func.prototype;
_f.isCalled = false;
return _f;
}
// helper function: filter vals out of array
function filter (vals, array) {
if( Array.isArray( vals ) && Array.isArray( array ) ) {
@ -247,10 +261,28 @@ let goldenlayout = (function () {
}
}
//
// ensure only one handler is set up on the parent with once
var registerInputTabChangeHandler = once(function (tab) {
tab.header.parent.on( "activeContentItemChanged", onActiveInputTabChange );
});
//
// Handle when the active input tab changes
var onActiveInputTabChange = function (tab) {
$('.inputfield').removeClass('focused');
$('.inputfield', tab.tab.contentItem.element).addClass('focused');
}
//
var onActiveTabChange = function (tab) {
// ensure only one handler is set up on the parent with once
var registerMainTabChangeHandler = once(function (tab) {
tab.header.parent.on( "activeContentItemChanged", onActiveMainTabChange );
});
//
// Handle when the active main tab changes
var onActiveMainTabChange = function (tab) {
let renamebox = document.getElementById("renamebox");
let typelist = document.getElementById("typelist");
let updatelist = document.getElementById("updatelist");
@ -268,7 +300,6 @@ let goldenlayout = (function () {
}
}
//
// Save the GoldenLayout state to localstorage whenever it changes.
var onStateChanged = function () {
@ -344,7 +375,7 @@ let goldenlayout = (function () {
tab.element.prepend( $("#optionsbutton").clone(true).addClass("lm_title") );
}
tab.header.parent.on( "activeContentItemChanged", onActiveTabChange );
registerMainTabChangeHandler(tab);
}
@ -352,7 +383,9 @@ let goldenlayout = (function () {
//
var onInputCreate = function (tab) {
//HTML for the typeDropdown
let splitControl = $("<span class='lm_title' style='font-size: 1.5em;width: 1em;'>+</span>");
let splitControl = $(
"<span class='lm_title' style='font-size: 1.5em;width: 1em;'>+</span>"
);
// track adding a new tab
splitControl.click( tab, function (evnt) {
@ -362,7 +395,7 @@ let goldenlayout = (function () {
// Add the typeDropdown to the header
tab.element.append( splitControl );
tab.header.parent.on( "activeContentItemChanged", onActiveTabChange );
registerInputTabChangeHandler(tab);
}