Initial Commit

.idea/.gitignore

@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/

.idea/SpotifyBackgroundSwitcher.iml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+    <orderEntry type="library" name="@types/jquery" level="application" />
+  </component>
+</module>

.idea/jsLibraryMappings.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="JavaScriptLibraryMappings">
+    <file url="PROJECT" libraries="{@types/jquery}" />
+  </component>
+</project>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/SpotifyBackgroundSwitcher.iml" filepath="$PROJECT_DIR$/.idea/SpotifyBackgroundSwitcher.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>

script.js

@@ -0,0 +1,270 @@
+// ==UserScript==
+// @name         Spotify Background Changer
+// @namespace    http://tampermonkey.net/
+// @version      0.1
+// @description  Changes the background of Spotify playlists and albums in a rainbow pattern
+// @author       You
+// @match        https://open.spotify.com/playlist/*
+// @match        https://open.spotify.com/album/*
+// @require      https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js
+// @grant        none
+// @run-at       document-end
+// ==/UserScript==
+
+"use strict";
+
+waitForKeyElements(".xYgjMpAjE5XT05aRIezb", changeBackground);
+
+let r1, g1, b1, r2, b2, g2
+let topIntensityCutoff = 235
+let topDarknessCutoff = 75
+
+let difference = 60
+
+let bottomIntensityCutoff = topIntensityCutoff - difference
+let bottomDarknessCutoff = topDarknessCutoff - difference
+
+let topIncreaseBlue = true;
+let topDecreaseRed = false;
+let topIncreaseGreen = false;
+let topDecreaseBlue = false;
+let topIncreaseRed = false;
+let topDecreaseGreen = false;
+
+let bottomIncreaseBlue = true;
+let bottomDecreaseRed = false;
+let bottomIncreaseGreen = false;
+let bottomDecreaseBlue = false;
+let bottomIncreaseRed = false;
+let bottomDecreaseGreen = false;
+
+
+function changeBackground() {
+    const htmlCollection = document.getElementsByClassName("gHImFiUWOg93pvTefeAD xYgjMpAjE5XT05aRIezb");
+    const bg = htmlCollection[0];
+    r1 = topIntensityCutoff;
+    g1 = topDarknessCutoff;
+    b1 = topDarknessCutoff;
+
+    r2 = bottomIntensityCutoff;
+    g2 = bottomDarknessCutoff;
+    b2 = bottomDarknessCutoff;
+
+    setInterval(changeColor, 30, bg);
+}
+
+function changeColor(bg) {
+    if (!document.hidden) {
+        // Top Half
+
+        //Part 1;
+        if (topIncreaseBlue) {
+            if (b1 === topIntensityCutoff) {
+                topDecreaseRed = true;
+                topIncreaseBlue = false;
+
+            } else {
+                b1++;
+            }
+        }
+        //Part 2;
+        else if (topDecreaseRed) {
+            if (r1 === topDarknessCutoff) {
+                topIncreaseGreen = true;
+                topDecreaseRed = false;
+
+            } else {
+                r1--;
+            }
+        }
+        //Part 3
+        else if (topIncreaseGreen) {
+            if (g1 === topIntensityCutoff) {
+                topDecreaseBlue = true;
+                topIncreaseGreen = false;
+
+            } else {
+                g1++;
+            }
+        }
+        //Part 4
+        else if (topDecreaseBlue) {
+            if (b1 === topDarknessCutoff) {
+                topIncreaseRed = true;
+                topDecreaseBlue = false;
+
+            } else {
+                b1--;
+            }
+        }
+        //Part 5
+        else if (topIncreaseRed) {
+            if (r1 === topIntensityCutoff) {
+                topDecreaseGreen = true;
+                topIncreaseRed = false;
+
+            } else {
+                r1++;
+            }
+        }
+        //Part 6
+        else if (topDecreaseGreen) {
+            if (g1 === topDarknessCutoff) {
+                topIncreaseBlue = true;
+                topDecreaseGreen = false;
+
+            } else {
+                g1--;
+            }
+        }
+
+        // Bottom Half
+
+        //Part 1;
+        if (bottomIncreaseBlue) {
+            if (b2 === bottomIntensityCutoff) {
+                bottomDecreaseRed = true;
+                bottomIncreaseBlue = false;
+
+            } else {
+                b2++;
+            }
+        }
+        //Part 2;
+        else if (bottomDecreaseRed) {
+            if (r2 === bottomDarknessCutoff) {
+                bottomIncreaseGreen = true;
+                bottomDecreaseRed = false;
+
+            } else {
+                r2--;
+            }
+        }
+        //Part 3
+        else if (bottomIncreaseGreen) {
+            if (g2 === bottomIntensityCutoff) {
+                bottomDecreaseBlue = true;
+                bottomIncreaseGreen = false;
+
+            } else {
+                g2++;
+            }
+        }
+        //Part 4
+        else if (bottomDecreaseBlue) {
+            if (b2 === bottomDarknessCutoff) {
+                bottomIncreaseRed = true;
+                bottomDecreaseBlue = false;
+
+            } else {
+                b2--;
+            }
+        }
+        //Part 5
+        else if (bottomIncreaseRed) {
+            if (r2 === bottomIntensityCutoff) {
+                bottomDecreaseGreen = true;
+                bottomIncreaseRed = false;
+
+            } else {
+                r2++;
+            }
+        }
+        //Part 6
+        else if (bottomDecreaseGreen) {
+            if (g2 === bottomDarknessCutoff) {
+                bottomIncreaseBlue = true;
+                bottomDecreaseGreen = false;
+
+            } else {
+                g2--;
+            }
+        }
+
+        bg.style.background = "linear-gradient(rgb(" + r1 + ", " + g1 + ", " + b1 + "),rgba(" + r2 + ", " + g2 + ", " + b2 + ", 0.5)),var(--background-noise)";
+    }
+}
+
+
+//waitForKeyElements
+/*--- waitForKeyElements():  A utility function, for Greasemonkey scripts,
+    that detects and handles AJAXed content.
+
+    Usage example:
+
+        waitForKeyElements (
+            "div.comments"
+            , commentCallbackFunction
+        );
+
+        //--- Page-specific function to do what we want when the node is found.
+        function commentCallbackFunction (jNode) {
+            jNode.text ("This comment changed by waitForKeyElements().");
+        }
+
+    IMPORTANT: This function requires your script to have loaded jQuery.
+*/
+function waitForKeyElements(
+    selectorTxt,    /* Required: The jQuery selector string that
+                        specifies the desired element(s). */
+    actionFunction, /* Required: The code to run when elements are found. It is passed a jNode to the matched
+                        element. */
+    bWaitOnce,      /* Optional: If false, will continue to scan for new elements even after the first match is
+                        found. */
+    iframeSelector  /* Optional: If set, identifies the iframe to search. */
+) {
+    let targetNodes, bTargetsFound;
+
+    if (typeof iframeSelector == "undefined")
+        targetNodes = $(selectorTxt);
+    else
+        targetNodes = $(iframeSelector).contents()
+            .find(selectorTxt);
+
+    if (targetNodes && targetNodes.length > 0) {
+        bTargetsFound = true;
+        /*--- Found target node(s).  Go through each and act if they are new. */
+        targetNodes.each(function () {
+            const jThis = $(this);
+            const alreadyFound = jThis.data('alreadyFound') || false;
+
+            if (!alreadyFound) {
+                //--- Call the payload function.
+                const cancelFound = actionFunction(jThis);
+                if (cancelFound)
+                    bTargetsFound = false;
+                else
+                    jThis.data('alreadyFound', true);
+            }
+        });
+    } else {
+        bTargetsFound = false;
+    }
+
+    //--- Get the timer-control variable for this selector.
+    const controlObj = waitForKeyElements.controlObj || {};
+    const controlKey = selectorTxt.replace(/\W/g, "_");
+    let timeControl = controlObj [controlKey];
+
+    //--- Now set or clear the timer as appropriate.
+    if (bTargetsFound && bWaitOnce && timeControl) {
+        //--- The only condition where we need to clear the timer.
+        clearInterval(timeControl);
+        delete controlObj [controlKey]
+    } else {
+        //--- Set a timer, if needed.
+        if (!timeControl) {
+            timeControl = setInterval(function () {
+                    waitForKeyElements(selectorTxt,
+                        actionFunction,
+                        bWaitOnce,
+                        iframeSelector
+                    );
+                },
+                300
+            );
+            controlObj [controlKey] = timeControl;
+        }
+    }
+    waitForKeyElements.controlObj = controlObj;
+}