added notification when custom layoutfluid is saved

added default layoutfluid value
changed delimiter to #
addded a validation step and reverting back if validation failed

src/js/config.js

@@ -16,6 +16,7 @@ import * as PaceCaret from "./pace-caret";
 import * as UI from "./ui";
 import * as CommandlineLists from "./commandline-lists";
 import * as BackgroundFilter from "./custom-background-filter";
+import LayoutList from "./layouts";
 
 export let localStorageConfig = null;
 export let dbConfigLoaded = false;
@@ -117,6 +118,7 @@ let defaultConfig = {
   customBackground: "",
   customBackgroundSize: "cover",
   customBackgroundFilter: [0, 1, 1, 1, 1],
+  customLayoutfluid: "qwerty#dvorak#colemak",
 };
 
 function isConfigKeyValid(name) {
@@ -1402,13 +1404,32 @@ export function setCustomBackground(value, nosave) {
 
 export function setCustomLayoutfluid(value, nosave) {
   if (value == null || value == undefined) {
-    value = "qwerty_dvorak_colemak";
+    value = "qwerty#dvorak#colemak";
+  }
+  value = value.replace(/ /g, "#");
+  value
+    .split("#")
+    .map((l) => (l = l.toLowerCase()))
+    .join("#");
+
+  //validate the layouts
+  let allGood = true;
+  let list = Object.keys(LayoutList).map((l) => (l = l.toLowerCase()));
+  value.split("#").forEach((customLayout) => {
+    if (!list.includes(customLayout)) allGood = false;
+  });
+  if (!allGood) {
+    Notifications.add(
+      "One of the layouts were not found. Reverting to default",
+      0
+    );
+    value = "qwerty#dvorak#colemak";
+    nosave = false;
   }
-  value = value.replace(/ /g, "_");
   config.customLayoutfluid = value;
   CommandlineLists.defaultCommands.list.filter(
     (command) => command.id == "changeCustomLayoutfluid"
-  )[0].defaultValue = value;
+  )[0].defaultValue = value.replace(/#/g, " ");
   if (!nosave) saveToLocalStorage();
 }
 

src/js/input-controller.js

@@ -203,7 +203,7 @@ function handleSpace(event, isEnter) {
   if (Funbox.active === "layoutfluid" && Config.mode !== "time") {
     // here I need to check if Config.customLayoutFluid exists because of my scuffed solution of returning whenever value is undefined in the setCustomLayoutfluid function
     const layouts = Config.customLayoutfluid
-      ? Config.customLayoutfluid.split("_")
+      ? Config.customLayoutfluid.split("#")
       : ["qwerty", "dvorak", "colemak"];
     let index = 0;
     let outof = TestLogic.words.length;

src/js/settings.js

@@ -389,7 +389,7 @@ async function fillSettingsPage() {
   );
 
   $(".pageSettings .section.customLayoutfluid input").val(
-    Config.customLayoutfluid
+    Config.customLayoutfluid.replace(/#/g, " ")
   );
 }
 
@@ -793,6 +793,7 @@ $(".pageSettings .section.customLayoutfluid .inputAndSave .save").on(
     UpdateConfig.setCustomLayoutfluid(
       $(".pageSettings .section.customLayoutfluid .inputAndSave input").val()
     );
+    Notifications.add("Custom layoutfluid saved", 1);
   }
 );
 
@@ -802,6 +803,7 @@ $(".pageSettings .section.customLayoutfluid .inputAndSave .input").keypress(
       UpdateConfig.setCustomLayoutfluid(
         $(".pageSettings .section.customLayoutfluid .inputAndSave input").val()
       );
+      Notifications.add("Custom layoutfluid saved", 1);
     }
   }
 );

src/js/test/funbox.js

@@ -176,7 +176,7 @@ export async function activate(funbox, mode) {
       rememberSetting("layout", Config.layout, UpdateConfig.setLayout);
       UpdateConfig.setLayout(
         Config.customLayoutfluid
-          ? Config.customLayoutfluid.split("_")[0]
+          ? Config.customLayoutfluid.split("#")[0]
           : "qwerty"
       );
       Settings.groups.layout.updateButton();
@@ -187,7 +187,7 @@ export async function activate(funbox, mode) {
       );
       UpdateConfig.setKeymapLayout(
         Config.customLayoutfluid
-          ? Config.customLayoutfluid.split("_")[0]
+          ? Config.customLayoutfluid.split("#")[0]
           : "qwerty"
       );
       Settings.groups.keymapLayout.updateButton();

src/js/test/test-logic.js

@@ -763,12 +763,12 @@ export function restart(withSameWordset = false, nosave = false, event) {
       if (Funbox.active === "layoutfluid") {
         UpdateConfig.setLayout(
           Config.customLayoutfluid
-            ? Config.customLayoutfluid.split("_")[0]
+            ? Config.customLayoutfluid.split("#")[0]
             : "qwerty"
         );
         UpdateConfig.setKeymapLayout(
           Config.customLayoutfluid
-            ? Config.customLayoutfluid.split("_")[0]
+            ? Config.customLayoutfluid.split("#")[0]
             : "qwerty"
         );
         Keymap.highlightKey(

src/js/test/test-timer.js

@@ -42,7 +42,7 @@ export function start() {
 
       if (Funbox.active === "layoutfluid" && Config.mode === "time") {
         const layouts = Config.customLayoutfluid
-          ? Config.customLayoutfluid.split("_")
+          ? Config.customLayoutfluid.split("#")
           : ["qwerty", "dvorak", "colemak"];
         console.log(Config.customLayoutfluid);
         console.log(layouts);