background_changer.js

mod-list.html

@@ -131,6 +131,7 @@
 
 <!----><tr><td class="modCat" colspan="3">Official</td></tr><!---->
 <tr><td>alchemy.js</td><td>Start with only 4 elements and unlock more by reacting them together (Most are not possible)</td><td><a href="https://R74n.com" class="R74nLink">R74n</a></td></tr>
+<tr><td>background_changer.js</td><td>Press 'B' to change canvas background to a URL</td><td><a href="https://R74n.com" class="R74nLink">R74n</a></td></tr>
 <tr><td>building.js</td><td>Building generators and materials</td><td><a href="https://R74n.com" class="R74nLink">R74n</a></td></tr>
 <tr><td>classic_explosives.js</td><td>Re-adds 4 explosives removed in v1.9.3</td><td><a href="https://R74n.com" class="R74nLink">R74n</a></td></tr>
 <tr><td>classic_textures.js</td><td>Use textures from early versions of the game</td><td><a href="https://R74n.com" class="R74nLink">R74n</a></td></tr>

mods/background_changer.js

@@ -0,0 +1,40 @@
+function setCanvasBG(url) {
+    delete settings.bg;
+
+    let canvas = document.getElementById("game");
+    canvas.style.backgroundColor = "";
+    canvas.style.backgroundImage = `url(${url})`;
+    canvas.style.backgroundRepeat = "no-repeat";
+    canvas.style.backgroundSize = "cover";
+    canvas.style.backgroundPosition = "bottom";
+
+    settings.bgimg = url;
+
+    saveSettings()
+}
+
+keybinds.KeyB = () => {
+    promptInput("Enter an image URL. Leave blank to clear background.", (url) => {
+        if (!url) {
+            delete settings.bgimg;
+            let canvas = document.getElementById("game");
+            canvas.style.backgroundImage = "";
+            canvas.style.backgroundRepeat = "";
+            canvas.style.backgroundSize = "";
+            canvas.style.backgroundPosition = "";
+        }
+        setCanvasBG(url);
+    }, "Background")
+}
+
+document.addEventListener("load", () => {
+    if (settings.bgimg) {
+        setCanvasBG(settings.bgimg)
+    }
+})
+
+runAfterReset(() => {
+    if (settings.bgimg) {
+        setCanvasBG(settings.bgimg)
+    }
+})