1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-24 22:33:16 +00:00

Make the keyboard-shortcut input focus automatically (#3776)

* add focus capability to edit-shortcut widget

* focus the keyboard-shortcut inputs in the control panel

... there's no other reason why it could have been opened other than just pressing a shorcut ...

... saves the mouseclick
This commit is contained in:
Simon Huber 2019-03-02 17:25:49 +01:00 committed by Jeremy Ruston
parent fb0713ae78
commit 87eab62b7e
2 changed files with 16 additions and 1 deletions

View File

@ -57,6 +57,10 @@ EditShortcutWidget.prototype.render = function(parent,nextSibling) {
// Link into the DOM // Link into the DOM
parent.insertBefore(this.inputNode,nextSibling); parent.insertBefore(this.inputNode,nextSibling);
this.domNodes.push(this.inputNode); this.domNodes.push(this.inputNode);
// Focus the input Node if focus === "yes" or focus === "true"
if(this.shortcutFocus === "yes" || this.shortcutFocus === "true") {
this.focus();
}
}; };
/* /*
@ -72,6 +76,7 @@ EditShortcutWidget.prototype.execute = function() {
this.shortcutStyle = this.getAttribute("style"); this.shortcutStyle = this.getAttribute("style");
this.shortcutTooltip = this.getAttribute("tooltip"); this.shortcutTooltip = this.getAttribute("tooltip");
this.shortcutAriaLabel = this.getAttribute("aria-label"); this.shortcutAriaLabel = this.getAttribute("aria-label");
this.shorcutFocus = this.getAttribute("focus");
}; };
/* /*
@ -118,6 +123,16 @@ EditShortcutWidget.prototype.handleKeydownEvent = function(event) {
} }
}; };
/*
focus the input node
*/
EditShortcutWidget.prototype.focus = function() {
if(this.inputNode.focus && this.inputNode.select) {
this.inputNode.focus();
this.inputNode.select();
}
};
/* /*
Selectively refreshes the widget if needed. Returns true if the widget needed re-rendering Selectively refreshes the widget if needed. Returns true if the widget needed re-rendering
*/ */

View File

@ -6,7 +6,7 @@ caption: {{$:/language/ControlPanel/KeyboardShortcuts/Caption}}
\define new-shortcut(title) \define new-shortcut(title)
<div class="tc-dropdown-item-plain"> <div class="tc-dropdown-item-plain">
<$edit-shortcut tiddler="$title$" placeholder={{$:/language/ControlPanel/KeyboardShortcuts/Add/Prompt}} style="width:auto;"/> <$button> <$edit-shortcut tiddler="$title$" placeholder={{$:/language/ControlPanel/KeyboardShortcuts/Add/Prompt}} focus="true" style="width:auto;"/> <$button>
<<lingo Add/Caption>> <<lingo Add/Caption>>
<$action-listops <$action-listops
$tiddler="$(shortcutTitle)$" $tiddler="$(shortcutTitle)$"