monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-11-17 14:19:40 +08:00
Code Issues Projects Releases Packages Wiki Activity

improved differentiation between mouse and keyboard input in the command line. fixes #785

Browse source
This commit is contained in:
Miodec 2021-01-03 23:02:02 +00:00
parent 0e232879c0
commit 5e5b556b0d
2 changed files with 38 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/js/commandline.js
View file

@ -1758,6 +1758,10 @@ if (Object.keys(layouts).length > 0) {
}
$("#commandLine input").keyup((e) => {
commandLineMouseMode = false;
$("#commandLineWrapper #commandLine .suggestions .entry").removeClass(
"activeMouse"
);
if (e.keyCode == 38 || e.keyCode == 40 || e.keyCode == 13 || e.code == "Tab")
return;
updateSuggestedCommands();
@ -1828,7 +1832,33 @@ $("#commandInput input").keydown((e) => {
return;
});
let commandLineMouseMode = false;
$(document).on("mousemove", () => {
if (!commandLineMouseMode) commandLineMouseMode = true;
});
$(document).on(
"mouseenter",
"#commandLineWrapper #commandLine .suggestions .entry",
(e) => {
if (!commandLineMouseMode) return;
$(e.target).addClass("activeMouse");
}
);
$(document).on(
"mouseleave",
"#commandLineWrapper #commandLine .suggestions .entry",
(e) => {
if (!commandLineMouseMode) return;
$(e.target).removeClass("activeMouse");
}
);
$("#commandLineWrapper #commandLine .suggestions").on("mouseover", (e) => {
if (!commandLineMouseMode) return;
console.log("clearing keyboard active");
$("#commandLineWrapper #commandLine .suggestions .entry").removeClass(
"activeKeyboard"
);

15
src/sass/style.scss
View file

@ -853,8 +853,9 @@ a:hover {
}
&.activeMouse {
color: var(--bg-color);
background: var(--main-color);
color: var(--text-color);
background: var(--sub-color);
cursor: pointer;
}
&.activeKeyboard {
@ -862,11 +863,11 @@ a:hover {
background: var(--main-color);
}
&:hover {
color: var(--text-color);
background: var(--sub-color);
cursor: pointer;
}
// &:hover {
// color: var(--text-color);
// background: var(--sub-color);
// cursor: pointer;
// }
}
}
}