13
A simple example, no code required:
If I press CTRL + F, automatically the browser opens a search bar on the page.
I made sure that by pressing CTRL + F it points to an input within the system.
I intend to put several other controllers, such as changing a tab boostrap with CTRL + TAB, close a modal with ESC. open internal help with F11 among others.
Examples:
To Navigate between tabs using CTRL + SETA
var change_tab = function () {
var map = {37: false, 39: false, 17: false};
$(document).keydown(function (e) {
if (e.keyCode in map) {
map[e.keyCode] = true;
if (map[37] && map[17]) {
var $el = $('.nav.nav-tabs').find('li');
$el.each(function () {
if ($(this).hasClass('active') === true) {
$(this).prev('li').find('a').trigger('click');
}
});
}
if (map[39] && map[17]) {
var $el = $('.nav.nav-tabs').find('li');
$el.each(function () {
if ($(this).hasClass('active') === true) {
$(this).next('li').find('a').trigger('click');
}
});
}
}
}).keyup(function (e) {
if (e.keyCode in map) {
map[e.keyCode] = false;
}
});
}
To maximize a form with CTRL + F11:
var make_full = function () {
var map = {17: false, 122: false};
$(document).keydown(function (e) {
if (e.keyCode in map) {
map[e.keyCode] = true;
if (map[17] && map[122]) {
$('.fullscreen').trigger('click');
}
}
}).keyup(function (e) {
if (e.keyCode in map) {
map[e.keyCode] = false;
}
});
}
The doubt is simple:
This type of practice is considered user friendly?
Is there any problem in replacing native browser shortcut keys with the keys I want to interact with within my system (EX:
CTRL + Fto open the search)?Is there any recommendation or standard (such as PSR-4 for autoload in PHP) on how to use this type of functionality correctly ?
PS: In the case in question the target is an internal system, it is not something to be marketed, I just need that who will use, can do as many things in the shortest possible time, since the focus of the system is precisely to streamline processes, here I have simple examples, but I have shortcuts that fill dates, trigger filters, push notifications, and many other things, some are above native actions.
What I see in the market in web applications mostly is creating alternative key patterns for internal functionalities, such as:
Alt+ForCtrl+Alt+Fto search for something in the app instead of usingCtrl+Fwhich makes it impossible to use the standard functionality via the shortcut. But there are also some apps that simply overwrite these features, such as Google Drive, which in a document when makingCtrl+Fopen an internal search.– Fernando Leal
Perhaps the question would receive more attention with a title more suited to the core of the question, something like: "What is the impact of replacing keyboard shortcuts?" or "I should use custom keyboard shortcuts that override browser shortcuts?"
– nunks
@nunks.lol but I think the references you gave in the question + the answer were enough, I just haven’t accepted yet to see if anyone else answers anything else
– AnthraxisBR
Cool, good that I’m helping =). I found this article very good in Medium, takes the subject practically to exhaustion...
– nunks