sharing custom themes now done via a url

public/js/misc.js

@@ -397,4 +397,26 @@ function getPositionString(number) {
     numend = "rd";
   }
   return number + numend;
+}
+
+function findGetParameter(parameterName) {
+  var result = null,
+      tmp = [];
+  location.search
+      .substr(1)
+      .split("&")
+      .forEach(function (item) {
+        tmp = item.split("=");
+        if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
+      });
+  return result;
+}
+
+function objectToQueryString(obj) {
+  var str = [];
+  for (var p in obj)
+    if (obj.hasOwnProperty(p)) {
+      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
+    }
+  return str.join("&");
 }

public/js/script.js

@@ -4764,6 +4764,23 @@ $(document).ready(() => {
     .removeClass("hidden")
     .stop(true, true)
     .animate({ opacity: 1 }, 250, () => {
+      let theme = findGetParameter("customTheme");
+      if (theme !== null) {
+        try {
+          theme = theme.split(",");
+          config.customThemeColors = theme;
+          showNotification("Custom theme applied", 1000);
+        } catch (e) {
+          showNotification(
+            "Something went wrong. Reverting to default custom colors.",
+            3000
+          );
+          config.customThemeColors = defaultConfig.customThemeColors;
+        }
+        setCustomTheme(true);
+        setCustomThemeInputs();
+        applyCustomThemeColors();
+      }
       if (window.location.pathname === "/account") {
         history.replaceState("/", null, "/");
       } else if (window.location.pathname !== "/") {

public/js/settings.js

@@ -445,12 +445,27 @@ $("#customThemeShareWrapper").click((e) => {
   }
 });
 
-$("#customThemeShare .button").click((e) => {
-  hideCustomThemeShare();
-});
+// $("#customThemeShare .button").click((e) => {
+//   hideCustomThemeShare();
+// });
 
 $("#shareCustomThemeButton").click((e) => {
-  showCustomThemeShare();
+  // showCustomThemeShare();
+
+  let share = [];
+  $.each(
+    $(".pageSettings .section.customTheme [type='color']"),
+    (index, element) => {
+      share.push($(element).attr("value"));
+    }
+  );
+
+  let url = "https://monkey-type.com?" + objectToQueryString({ customTheme: share });
+  navigator.clipboard.writeText(url).then(function() {
+    showNotification("URL Copied to clipboard", 2000);
+  }, function(err) {
+    showNotification("Something went wrong when copying the URL: "+ err, 5000);
+  });
 });
 
 function toggleFavouriteTheme(themename) {