Webleb - UI Elements - Boom Slingers ReBoom Game HTML Loader

HTML

<!DOCTYPE html>
<html lang="en-us">
  <head>
    <base href="https://cdn.jsdelivr.net/gh/genizy/cg-rip@main/boom-slingers-reboom/">
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  </head>
  <body style="margin:0;padding:0" class="noselect">
    <div id="loading-text" style="color: black; font-size: 48px; font-family: cursive; text-align: center; margin-top: 20px;">LOADING...</div>
    <canvas id="unity-canvas"
      style="position:fixed;top:0;left:0;width:100%;height:100%;outline:none"></canvas>

const buffers = await Promise.all(parts.map(async (u) => {
        const r = await fetch(u);
        if (!r.ok) throw new Error("Failed part " + u);
        return new Uint8Array(await r.arrayBuffer());
      }));

const total = buffers.reduce((a, b) => a + b.length, 0);
      const merged = new Uint8Array(total);
      let offset = 0;
      for (const b of buffers) { merged.set(b, offset); offset += b.length; }

return URL.createObjectURL(new Blob([merged]));
    }

async function preMergeAll() {
      const map = {};
      const files = Object.entries(SPLIT_MAP);
      const total = files.length;
      let done = 0;

const loadingText = document.getElementById("loading-text");

for (const [file, _] of files) {
        const merged = await mergeParts("Build/" + file);
        map[file] = merged;
        done++;
        const percent = Math.floor((done / total) * 100);
        loadingText.innerText = `LOADING... ${percent}%`;
        console.log("Premerged:", file, "→", merged);
      }

loadingText.style.display = "none";

return map;
    }

(async () => {
      const mergedMap = await preMergeAll();
      window.SPLIT_MAP = mergedMap;
      const origFetch = window.fetch;
      window.fetch = async function(resource, options) {
        if (typeof resource === "string") {
          const key = resource.split("/").pop();
          if (mergedMap[key]) {
            console.log("Redirect fetch:", key);
            return origFetch(mergedMap[key], options);
          }
        }
        return origFetch(resource, options);
      };

const canvas = document.querySelector("#unity-canvas");
      const loaderUrl = "Build/d37667e316197a45bf53aa3fdcc6dee6.loader.js";
      const config = {
        dataUrl: "Build/3b03bb7182763a41817b795e550d8412.data",
        frameworkUrl: "Build/8ff9826371bd14e0e81ec413c9e15bb1.framework.js",
        codeUrl: "Build/2cbda98ae67d1b28f920398806093415.wasm",
        streamingAssetsUrl: "StreamingAssets",
        companyName: "Boom Slingers ReBoom",
        productName: "Boom Slingers ReBoom",
        productVersion: "1.0.0"
      };

CSS

JS