thothmod.github.io/index.html at main · 5lackerish/thothmod.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Friday Night Funkin' Thoth Mod v1 Download & Demo Release</title>

    <!-- Tailwind CSS -->
    <script src="https://cdn.tailwindcss.com"></script>

    <!-- Custom CSS (Glass Styles) -->
    <link rel="stylesheet" href="style.css">
</head>

<body class="flex items-center justify-center min-h-screen p-4">

    <!-- Main Glass Container -->
    <div class="glass-container p-8 md:p-12 rounded-xl shadow-2xl w-full max-w-lg text-center">

        <!-- Header -->
        <img src="images/title-shortened.png" class="mx-auto mb-4" />
        <p class="text-white/80 mb-8 text-lg">Mod Assets & Playtest Access</p>

        <!-- Download Button -->
        <button id="downloadButton" onclick="startDownload()"
            class="glass-button w-full mb-4 px-6 py-3 text-xl font-bold rounded-lg shadow-lg
                   transition duration-300 transform hover:scale-[1.02]">
            Download All Mod Files
        </button>

        <!-- Demo Button -->
        <a href="demo.html"
            class="glass-button inline-block w-full px-6 py-3 text-xl font-bold rounded-lg shadow-lg
                   transition duration-300 transform hover:scale-[1.02] text-center">
            Play Test Demo
        </a>

        <!-- Status -->
        <div id="statusMessage"
            class="glass-status mt-6 p-3 rounded-lg text-white/90 text-sm hidden"></div>

    </div>

<!-- JSZip + FileSaver -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
<script>
// Parallax background script
// This script makes the background image move slightly based on mouse movement.

// Adjust these values to change movement intensity
const intensity = 20; // higher = more movement, lower = subtle

window.addEventListener('mousemove', (e) => {
    const x = (e.clientX / window.innerWidth - 0.5) * intensity;
    const y = (e.clientY / window.innerHeight - 0.5) * intensity;

    document.body.style.backgroundPosition = `${50 + x}% ${50 + y}%`;
});

// Ensure background color stays solid red (#ff0000)
document.body.style.backgroundColor = '#ff0000';
</script>
<script>
/* Status message */
function showStatus(msg, cls = "bg-slate-700") {
    const box = document.getElementById("statusMessage");
    box.className = "mt-6 p-3 rounded-lg text-slate-200 text-sm " + cls;
    box.textContent = msg;
    box.classList.remove("hidden");
}

/* Recursively walk GitHub folders and insert files into ZIP */
async function addFolderToZip(zip, apiURL, basePath = "") {
    const res = await fetch(apiURL);
    if (!res.ok) throw new Error("GitHub API error: " + res.status);

    const items = await res.json();

    for (const item of items) {
        const relativePath = item.path.replace("thoth_mod_v1/", "");

        if (item.type === "file") {
            showStatus(`Adding file: ${relativePath}`, "bg-yellow-800");

            const fileRes = await fetch(item.download_url);
            const blob = await fileRes.blob();

            zip.file(relativePath, blob);
        }

        else if (item.type === "dir") {
            showStatus(`Entering folder: ${relativePath}`, "bg-blue-800");

            const sub = zip.folder(relativePath);
            await addFolderToZip(sub, item.url, relativePath);
        }
    }
}

/* Main function */
async function startDownload() {
    const btn = document.getElementById("downloadButton");
    btn.disabled = true;
    btn.innerHTML = "Building ZIP...";

    showStatus("Fetching GitHub folder list...", "bg-yellow-800");

    const zip = new JSZip();

    try {
        await addFolderToZip(
            zip,
            "https://api.github.com/repos/thothmod/thothmod.github.io/contents/thoth_mod_v1"
        );

        showStatus("Generating ZIP file...", "bg-indigo-800");

        const content = await zip.generateAsync({ type: "blob" });

        saveAs(content, "thoth_mod_v1.zip");

        showStatus("ZIP complete! Download should begin now.", "bg-green-800");
    }
    catch (err) {
        console.error(err);
        showStatus("Error: " + err.message, "bg-red-800");
    }

    btn.disabled = false;
    btn.innerHTML = "Download All Mod Files";
}
</script>

<audio id="bgm" src="Thehouseonthehill.mp3" autoplay loop muted></audio>
<script>
// Guaranteed audio unmute & play after first click:
window.addEventListener("click", () => {
    const bgm = document.getElementById("bgm");
    bgm.muted = false;
    bgm.play().catch(e => console.log("Playback blocked:", e));
}, { once: true });
</script>
</body>
</html>