From ec4975c3db83cc69f929030c2b5dad7b56b0f7c2 Mon Sep 17 00:00:00 2001
From: Jack <bartnikjack@gmail.com>
Date: Fri, 3 Jul 2020 03:00:14 +0100
Subject: [PATCH] added an option to randomise the theme after completing a
 test

---
 public/index.html        | 11 +++++++++++
 public/js/commandline.js |  7 +++++++
 public/js/script.js      |  1 +
 public/js/settings.js    | 13 +++++++++++++
 public/js/userconfig.js  | 19 +++++++++++++++++++
 5 files changed, 51 insertions(+)

diff --git a/public/index.html b/public/index.html
index 782802729..6ff23a78a 100644
--- a/public/index.html
+++ b/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'>
diff --git a/public/js/commandline.js b/public/js/commandline.js
index 3d06b242d..6a54c3a48 100644
--- a/public/js/commandline.js
+++ b/public/js/commandline.js
@@ -130,6 +130,13 @@ let commands = {
         toggleColorfulMode();
       },
     },
+    {
+      id: "toggleRandomTheme",
+      display: "Toggle random theme",
+      exec: () => {
+        toggleRandomTheme();
+      },
+    },
     {
       id: "changeDifficulty",
       display: "Change difficulty...",
diff --git a/public/js/script.js b/public/js/script.js
index 50f21242b..ed358811d 100644
--- a/public/js/script.js
+++ b/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,
diff --git a/public/js/settings.js b/public/js/settings.js
index 6e39390e4..71c1c61fb 100644
--- a/public/js/settings.js
+++ b/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",
diff --git a/public/js/userconfig.js b/public/js/userconfig.js
index 69606283d..ea7a1eeb6 100644
--- a/public/js/userconfig.js
+++ b/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);