New: FAQ page

build-faq.js

@@ -0,0 +1,157 @@
+import { readFileSync, writeFileSync } from 'fs';
+
+let faqPage = readFileSync('src/faq/index.html').toString();
+let questionsHtml = "";
+let discordInvite = `https://discord.gg/9e43WMKzhp`;
+let codeblockOpen = `<code class="one-line-code-block">`;
+let codeblockClose = `</code>`;
+let hyperlinkCSS = `class="underline text-yellow hover:text-cyan"`;
+let helpChannel = `and drop by the ${codeblockOpen}#help${codeblockClose} channel`;
+
+const faq = [
+    {
+        question: `I can't find the Geode button.`,
+        answer: `
+        <span>All users:</span>
+        <li>Make sure you've followed the installation instructions for your specifc platform.
+        If you would like to re-download the installer for your specifc platform, check <a ${hyperlinkCSS} href="/install">here</a>.</li>
+        <span>Linux users <b>from Steam</b>:</span>
+        <li>In your launch options for Geometry Dash, put in ${codeblockOpen}WINEDLLOVERRIDES="xinput9_1_0=n,b" %command%${codeblockClose}.</li>
+        <span>Linux users <b>from Lutris</b>:</span>
+        <li>Go into ${codeblockOpen}Properties -> Runner Options${codeblockClose} and enter the following:<br>Key: ${codeblockOpen}xinput9_1_0.dll${codeblockClose}<br>
+        Value: ${codeblockOpen}n,b${codeblockClose}</li>
+        <span>Android users:</span>
+        <li>Make sure your Geometry Dash is on version 2.205. Paths should cost 25000 mana orbs,
+        and levels such as ONETheLegendOf1000 by JuNiOr202 (Level ID <e>99566839</em>)
+        shouldn't be broken.</li>
+        <li>Make sure you're loading Geometry Dash from the Geode launcher. You should see the "Loading loader resources" text for a brief moment on the loading screen.</li>
+        `
+    },
+    {
+        question: `When will Geode be available for iOS?`,
+        answer: `
+        There are several issues with iOS that make it very difficult
+        for Geode to work as smoothly on iOS as it does compared to other platforms
+        that Geode supports, such as being unable to modify apps just before being loaded.
+        More technical responses exist on GitHub
+        <a ${hyperlinkCSS} href="https://github.com/geode-sdk/geode/issues/598#issuecomment-1983810283">here</a>
+        and <a ${hyperlinkCSS} href="https://github.com/geode-sdk/geode/discussions/548#discussioncomment-8551752">here</a>.<br><br>
+        iCreate Pro is only possible on iOS because it patches the game once, as explained on GitHub
+        <a ${hyperlinkCSS} href="https://github.com/geode-sdk/geode/discussions/548#discussioncomment-9095508">here</a>.<br><br>
+        Despite these barriers, there are still ongoing efforts to find a sliver of hope to get
+        Geode working on iOS, with a higher priority on jailbroken iOS devices.
+        `
+    },
+    {
+        question: `Is Geode only available on GitHub?`,
+        answer: `
+        Yes.<br><br>
+        As Geode is a mod loader, it is impossible to distribute Geode through app stores
+        or similar platforms without violating their respective guidelines.<br><br>
+        While mod loaders for other video games may exist in any given app store, Geode will
+        remain on GitHub.
+        `
+    },
+    // for the rust beggars
+    /*
+    {
+        question: `Will Geode use something besides C++?`,
+        answer: `
+        <em>No.</em><br><br>
+        Much like how mods for Minecraft: Java Edition are written in Java (or Kotlin) in order
+        to easily interact with the Minecraft source code, anything from Geode that
+        directly interacts with Geometry Dash's C++ source code will also be written in C++.<br><br>
+        Technical explanations on the difficulty in implementing
+        Geode in other progamming languages can be found
+        <a ${hyperlinkCSS} href="https://github.com/geode-sdk/geode/issues/602#issuecomment-1984367223">here</a>
+        and
+        <a ${hyperlinkCSS} href="https://github.com/geode-sdk/geode/issues/602#issuecomment-2005286510">here</a>.<br><br>
+        There's nothing stopping you from attempting to rewrite Geode in a different programming language,
+        but the time investment necessary to make it usable for the general public outweighs any probable benefits from doing so.
+        `
+    },
+    */
+    {
+        question: `What happens when GD updates?`,
+        answer: `
+        Windows + Android users:<br>
+        Geode will be put into a forward compatibility mode.
+        All of Geode's ingame features and all your installed mods will be disabled.
+        Don't worry though, as Geode will still auto-update to any newly available version.<br><br>
+        macOS users:<br>
+        Curl up into a fetal position and cry.
+        `
+    },
+    {
+        question: `A mod has failed loading.`,
+        answer: `
+        Install the latest version of Geode
+        <a ${hyperlinkCSS} href="/install">here</a>, then try again.<br>
+        If you still see the same error, download and install that specific mod again.<br>
+        If the issue still persists after that, join our Discord server
+        <a ${hyperlinkCSS} href="${discordInvite}">here</a>
+        ${helpChannel}.
+        `
+    },
+    {
+        question: `A mod has failed unzipping.`,
+        answer: `
+        <span>Windows/macOS/Linux users:</span>
+        <li>Check if there are any more instances of Geometry Dash running
+        in Task Manager/Activity Monitor (or your OS's equivalent) and close them.
+        Restart your computer if all else fails.</li>
+        <span>Android users:</span>
+        <li>Please try uninstalling and reinstalling the mod. If you've already attempted this,
+        <a ${hyperlinkCSS} href="${discordInvite}">join the Discord server</a>
+        ${helpChannel}.
+        </li>
+        `
+    },
+    {
+        question: `The mod index is still loading.`,
+        answer: `
+        <span>All users:</span>
+        <li>Please find a stronger Internet connection. After that, it should be far smoother sailing if you're not on Android.</li>
+        <span>Android users:</span>
+        <li>Unzipping the entire mod index is a far slower process on Android compared to other platforms. Please wait until
+        <a ${hyperlinkCSS} href="https://twitter.com/geode_sdk/status/1772932163513545204">the new Geode mod index</a>
+        is complete, as it eliminates this problem through an entirely different approach.</li>
+        `
+    },
+    {
+        question: `I can't open the game!`,
+        answer: `
+        <span>macOS users:</span>
+        <li>Join our Discord server
+        <a ${hyperlinkCSS} href="${discordInvite}">here</a>
+        ${helpChannel}. If lucky enough, someone from the Geode Team will give you further instructions.</li>
+        <span>Windows users:</span>
+        <li>Hold the ${codeblockOpen}SHIFT${codeblockClose} key, and without letting go of it, launch Geometry Dash.
+        Confirm that you wish to launch Geode in Safe Mode.</li>
+        <span>Android users:</span>
+        <li>Press and hold the ${codeblockOpen}Launch${codeblockClose} button from the Geode launcher.
+        Confirm that you wish to launch Geode in Safe Mode.</li>
+        <span>Once you've followed the instructions depending on your platform,
+        find the mod causing Geometry Dash to crash on startup and disable/uninstall it.</span>
+        `
+    }
+]
+
+// everything is inside a <p> tag to suppress all line breaks besides manual <br> tags
+const addQuestion = (question, answer) => {
+    questionsHtml += `<section class="bg-gray-darker flex flex-col gap-4 items-center max-w-txt-or-vw">
+        <h1 class="font-head text-2xl self-center">${question}</h1>
+        <p>${answer}</p>
+    </section>`;
+};
+
+async function main() {
+    for (const item of faq) {
+        addQuestion(item.question, item.answer);
+    }
+
+    faqPage = faqPage.replace("$FAQS_HTML", questionsHtml);
+
+    writeFileSync("gen/faq/index.html", faqPage);
+}
+main();

build.js

@@ -10,6 +10,7 @@ const commands = [
     "node copy-html-files.js",
     "node build-mods-pages.js",
     "node build-install.js",
+    "node build-faq.js",
     "tailwindcss -i gen/index.css -o dist/index.css",
     "tailwindcss -i gen/mods/index.css -o dist/mods/index.css",
     "html-minifier --input-dir ./gen --output-dir ./dist --file-ext html",

deploy.js

@@ -11,6 +11,7 @@ const commands = [
     "node copy-html-files.js",
     "node build-mods-pages.js",
     "node build-install.js",
+    "node build-faq.js",
     "tailwindcss -i gen/index.css -o dist/index.css --minify",
     "tailwindcss -i gen/mods/index.css -o dist/mods/index.css --minify",
     "html-minifier --input-dir ./gen --output-dir ./dist --collapse-whitespace --file-ext html",

src/faq/index.html

@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>Geode FAQ</title>
+    <meta name="description" content="FAQ page for the Geode mod loader">
+
+    <meta property="og:url" content="https://geode-sdk.org/">
+    <meta property="og:type" content="website">
+    <meta property="og:title" content="Geode FAQ">
+    <meta property="og:description" content="FAQ page for the Geode mod loader">
+    <meta property="og:image" content="https://docs.geode-sdk.org/icon.png">
+    <meta property="og:image:width" content="80">
+    <meta property="og:image:height" content="80">
+
+    <meta name="twitter:card" content="summary">
+    <meta property="twitter:url" content="https://geode-sdk.org/">
+    <meta name="twitter:title" content="Geode FAQ">
+    <meta name="twitter:description" content="FAQ page for the Geode mod loader">
+    <meta property="twitter:image:src" content="https://docs.geode-sdk.org/icon.png">
+
+    <link href="/favicon.ico" rel="icon" type="image/x-icon">
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Open+Sans&family=Varela+Round&display=swap" rel="stylesheet"> 
+    <link rel="stylesheet" href="../index.css"> 
+    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
+</head>
+<body class="bg-gray font-text text-white items-center p-0 m-0">
+
+    <div class="svg-bg-top"></div>
+
+    <div class="fixed w-full top-4 left-4">
+        <a
+            class="
+                button
+                flex items-center justify-center
+                bg-gray-darker
+            "
+            href=".."
+        >
+            <i data-feather="home"></i>
+        </a>
+    </div>
+
+    <main class="flex flex-col items-center sm:p-20 max-sm:p-6 pt-0 m-0">
+
+        <section class="w-full max-w-3xl flex flex-col items-center gap-4">
+            <div class="flex justify-center items-center gap-6">
+                <div class="max-md:hidden">
+                    <img alt="The Geode logo" class="w-auto h-28" src="../geode-circle.webp">
+                </div>
+                <div class="h-full flex flex-col justify-center items-start max-md:items-center">
+                    <h1 class="text-white font-head text-6xl mb-3 max-md:text-center">Geode FAQ</h1>
+                    <h3 class="text-green font-head text-2xl max-md:text-center" id="current-version">
+                        Frequent questions about the Geode mod loader
+                    </h3>
+                </div>
+            </div>
+        </section>
+        <section class="bg-gray-darker flex flex-col gap-4 items-center max-w-txt-or-vw">
+            <h1 class="font-head text-2xl self-center">How do I install Geode?</h1>
+            <p>
+                Please visit the "Install" page below.
+            </p>
+            <div class="mt-6 w-full flex max-sm:flex-col sm:flex-row gap-4 items-center" style="align-items: self-center">
+                <a
+                    class="button wide border-solid border-2 border-gray-light"
+                    href="/install">
+                <i data-feather="download"></i>
+                    Install
+                </a>
+            </div>
+        </section>
+        <section class="bg-gray-darker flex flex-col gap-4 items-center max-w-txt-or-vw">
+            <h1 class="font-head text-2xl self-center">My game is crashing!</h1>
+            <p>
+                Join our Discord server below,<br>and get help at the <code class="one-line-code-block">#help</code> channel.
+            </p>
+            <div class="mt-6 w-full flex max-sm:flex-col sm:flex-row gap-4 items-center" style="align-items: self-center">
+                <a
+                    class="button wide border-solid border-2 border-gray-light"
+                    href="https://discord.gg/9e43WMKzhp">
+                <i data-feather="message-circle"></i>
+                    Discord
+                </a>
+            </div>
+        </section>
+        <!-- This code is now entirely generated by build-faq.js -->
+        $FAQS_HTML
+
+        <footer class="flex flex-col mt-10 mb-0 items-center gap-10">
+            <div>
+                Site by Geode Team.
+                Icons from <a href="https://feathericons.com/" class="underline">Feather</a> and <a href="https://github.com/simple-icons/simple-icons" class="underline">Simple Icons</a>.
+                Thank you to <a href="https://github.com/nekitdev" class="underline">nekit</a> for the domain!
+            </div>
+            <a
+                class="button wide border-solid border-2 border-light border-opacity-25 bg-opacity-0 hover:bg-opacity-0 hover:border-cyan"
+                href="https://github.com/geode-sdk/website"
+            >
+                <i data-feather="github"></i>
+                View Site Source
+            </a>
+        </footer>
+
+    </main>
+
+</body>
+</html>

src/index.css

@@ -271,3 +271,7 @@ em.tag {
         text-cyan 
         p-1;
 }
+
+.one-line-code-block {
+    font-size: 10.75pt !important;
+}

src/index.html

@@ -59,6 +59,10 @@ <h1 class="sm:text-7xl max-sm:text-5xl">Geode</h1>
                 <i data-feather="package"></i>
                 Mods
             </a>
+            <a class="button bg-gray-darker" href="./faq">
+                <i data-feather="help-circle"></i>
+                FAQ
+            </a>
             <a class="button bg-gray-darker" href="https://docs.geode-sdk.org">
                 <i data-feather="book"></i>
                 Documentation
@@ -67,9 +71,9 @@ <h1 class="sm:text-7xl max-sm:text-5xl">Geode</h1>
                 <i data-feather="message-circle"></i>
                 Discord
             </a>
-            <a class="button bg-gray-darker md:col-span-2" href="https://github.com/geode-sdk/geode">
+            <a class="button bg-gray-darker" href="https://github.com/geode-sdk/geode">
                 <i data-feather="github"></i>
-                Github
+                GitHub
             </a>
         </div>
     </header>

src/mods/[mod.id]/index.html

@@ -5,21 +5,21 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-    <title>$MOD_NAME - Geode</title>
-    <meta name="description" content="View the $MOD_NAME mod for Geode">
+    <title>$MOD_NAME by $MOD_DEVELOPER - Geode</title>
+    <meta name="description" content="View $MOD_DEVELOPER's $MOD_NAME mod for Geode">
 
     <meta property="og:url" content="https://geode-sdk.org/mods/$MOD_ID">
     <meta property="og:type" content="website">
-    <meta property="og:title" content="$MOD_NAME - Geode">
-    <meta property="og:description" content="View the $MOD_NAME mod for Geode">
+    <meta property="og:title" content="$MOD_NAME by $MOD_DEVELOPER - Geode">
+    <meta property="og:description" content="View $MOD_DEVELOPER's $MOD_NAME mod for Geode">
     <meta property="og:image" content="$MOD_ICON_URL">
     <meta property="og:image:width" content="80">
     <meta property="og:image:height" content="80">
 
     <meta name="twitter:card" content="summary">
     <meta property="twitter:url" content="https://geode-sdk.org/mods/$MOD_ID">
-    <meta name="twitter:title" content="$MOD_NAME - Geode">
-    <meta name="twitter:description" content="View the $MOD_NAME mod for Geode">
+    <meta name="twitter:title" content="$MOD_NAME by $MOD_DEVELOPER - Geode">
+    <meta name="twitter:description" content="View $MOD_DEVELOPER's $MOD_NAME mod for Geode">
     <meta property="twitter:image:src" content="$MOD_ICON_URL">
 
     <link href="/favicon.ico" rel="icon" type="image/x-icon">