added an option to randomise the theme after completing a test

public/index.html

@@ -454,6 +454,17 @@
             <div class="button" fontsize="2" tabindex="0" onclick="this.blur();">2</div>
           </div>
         </div>
+        <div class="section randomTheme">
+          <h1>randomise theme</h1>
+          <div class="text">
+            After completing a test, the theme will be set to a random one. The random themes are not saved to your
+            config.
+          </div>
+          <div class="buttons">
+            <div class="button on" tabindex="0" onclick="this.blur();">on</div>
+            <div class="button off" tabindex="0" onclick="this.blur();">off</div>
+          </div>
+        </div>
         <div class="section themes">
           <h1>theme</h1>
           <div class='tabs'>

public/js/commandline.js

@@ -130,6 +130,13 @@ let commands = {
         toggleColorfulMode();
       },
     },
+    {
+      id: "toggleRandomTheme",
+      display: "Toggle random theme",
+      exec: () => {
+        toggleRandomTheme();
+      },
+    },
     {
       id: "changeDifficulty",
       display: "Change difficulty...",

public/js/script.js

@@ -1253,6 +1253,7 @@ function restartTest(withSameWordset = false) {
   }
 
   if (resultVisible) {
+    if (config.randomTheme) randomiseTheme();
     $("#words").stop(true, true).animate(
       {
         opacity: 0,

public/js/settings.js

@@ -48,6 +48,7 @@ function updateSettingsPage() {
   setSettingsButton("discordDot", config.showDiscordDot);
   setSettingsButton("colorfulMode", config.colorfulMode);
   setSettingsButton("maxConfidence", config.maxConfidence);
+  setSettingsButton("randomTheme", config.randomTheme);
 
   setActiveThemeButton();
   setActiveLanguageButton();
@@ -476,6 +477,18 @@ $(".pageSettings .section.colorfulMode .buttons .button.off").click((e) => {
   setSettingsButton("colorfulMode", config.colorfulMode);
 });
 
+//extra color
+$(".pageSettings .section.randomTheme .buttons .button.on").click((e) => {
+  setRandomTheme(true);
+  // showNotification('Colorful mode on', 1000);
+  setSettingsButton("randomTheme", config.randomTheme);
+});
+$(".pageSettings .section.randomTheme .buttons .button.off").click((e) => {
+  setRandomTheme(false);
+  // showNotification('Colorful mode off', 1000);
+  setSettingsButton("randomTheme", config.randomTheme);
+});
+
 //tags
 $(document).on(
   "click",

public/js/userconfig.js

@@ -35,6 +35,7 @@ let defaultConfig = {
   maxConfidence: false,
   timerStyle: "bar",
   colorfulMode: true,
+  randomTheme: true,
 };
 
 let cookieConfig = null;
@@ -487,6 +488,24 @@ function setTheme(name, nosave) {
   if (!nosave) saveConfigToCookie();
 }
 
+function randomiseTheme() {
+  let randomtheme = themesList[Math.floor(Math.random() * themesList.length)];
+  setTheme(randomtheme.name, true);
+}
+
+function setRandomTheme(bool, nosave) {
+  if (bool == undefined) {
+    bool = false;
+  }
+  config.randomTheme = bool;
+  if (!nosave) saveConfigToCookie();
+}
+
+function toggleRandomTheme() {
+  config.randomTheme = !config.randomTheme;
+  saveConfigToCookie();
+}
+
 function setCustomTheme(boolean, nosave) {
   if (boolean !== undefined) config.customTheme = boolean;
   // setCustomThemeColors(config.customThemeColors, nosave);