monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-11-09 21:51:29 +08:00
Code Issues Projects Releases Packages Wiki Activity

made the matrix layout cleaner, made code more versatile

Browse source
This commit is contained in:
David Martin 2020-08-11 01:13:44 -05:00
parent bcde747eb4
commit 41bf9bfe78
4 changed files with 29 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
public/css/style.scss
View file

@ -2403,7 +2403,7 @@ key {
}
}
.hidden-key {
.hidden-key, .hide-key {
opacity: 0;
}
@ -2436,4 +2436,9 @@ key {
.matrix {
display: flex;
justify-content: left;
margin-left: 4.51rem;
}
.matrixSpace {
grid-template-columns: 6.75fr 1.90fr 6.75fr;
}

10
public/index.html
View file

@ -1244,12 +1244,12 @@
<div class="button" keymapMode="next" tabindex="0" onclick="this.blur();">next</div>
</div>
</div>
<div class="section keymapMatrix">
<h1>keymap matrix</h1>
<div class="text">Displays the layout in a matrix style.</div>
<div class="section keymapStyle">
<h1>keymap style</h1>
<div class="text">Displays the keymap in a different style.</div>
<div class="buttons">
<div class="button off" tabindex="0" onclick="this.blur();">off</div>
<div class="button on" tabindex="0" onclick="this.blur();">on</div>
<div class="button" keymapStyle="off" tabindex="0" onclick="this.blur();">off</div>
<div class="button" keymapStyle="matrix" tabindex="0" onclick="this.blur();">matrix</div>
</div>
</div>
<div class="section keymapLayout">

8
public/js/settings.js
View file

@ -93,17 +93,17 @@ settingsGroups.keymapMode = new SettingsGroup(
},
() => {
if (config.keymapMode === "off") {
$(".pageSettings .section.keymapStyle").addClass("hidden");
$(".pageSettings .section.keymapLayout").addClass("hidden");
$(".pageSettings .section.keymapMatrix").addClass("hidden");
} else {
$(".pageSettings .section.keymapStyle").removeClass("hidden");
$(".pageSettings .section.keymapLayout").removeClass("hidden");
$(".pageSettings .section.keymapMatrix").removeClass("hidden");
}
}
);
settingsGroups.keymapMatrix = new SettingsGroup(
"keymapMatrix",
changeKeymapMatrix
"keymapStyle",
changeKeymapStyle
);
settingsGroups.keymapLayout = new SettingsGroup(
"keymapLayout",

20
public/js/userconfig.js
View file

@ -40,7 +40,7 @@ let defaultConfig = {
stopOnError: false,
showAllLines: false,
keymapMode: "off",
keymapMatrix: false,
keymapStyle: "off",
keymapLayout: "qwerty",
fontFamily: "Roboto_Mono",
smoothLineScroll: false,
@ -148,7 +148,7 @@ function applyConfig(configObj) {
setTimerColor(configObj.timerColor, true);
setTimerOpacity(configObj.timerOpacity, true);
changeKeymapMode(configObj.keymapMode, true);
changeKeymapMatrix(configObj.keymapMatrix, true);
changeKeymapStyle(configObj.keymapStyle, true);
changeKeymapLayout(configObj.keymapLayout, true);
setFontFamily(configObj.fontFamily, true);
setSmoothLineScroll(configObj.smoothLineScroll, true);
@ -793,14 +793,22 @@ function changeKeymapMode(mode, nosave) {
if (!nosave) saveConfigToCookie();
}
function changeKeymapMatrix(boolean, nosave) {
if (boolean !== undefined) config.keymapMatrix = boolean;
if (boolean === false) {
function changeKeymapStyle(style, nosave) {
if (style === "off") {
$(".r1, .r2, .r3, .r4").removeClass("matrix");
$(".r5").removeClass("matrixSpace");
$("#KeyLeftBracket").removeClass("hide-key");
$("#KeyRightBracket").removeClass("hide-key");
$("#KeyQuote").removeClass("hide-key");
}
if (boolean === true) {
if (style === "matrix") {
$(".r1, .r2, .r3, .r4").addClass("matrix");
$(".r5").addClass("matrixSpace");
$("#KeyLeftBracket").addClass("hide-key");
$("#KeyRightBracket").addClass("hide-key");
$("#KeyQuote").addClass("hide-key");
}
config.keymapStyle = style;
if (!nosave) saveConfigToCookie();
}