3D Stunt Car Racing WebGL Game in HTML and JavaScript

44 Jayace

<html lang="en-us">
  <base href="https://cdn.jsdelivr.net/gh/bubbls/UGS-Assets@79091a3feb921044b3597bd32cea7357b43e2d9c/madalin-stunt-cars-2-main/">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Madalin Stunt Cars 2 - Unblcoked Games 76</title>
	<meta name="description" content="" />
    <link rel="shortcut icon" href="TemplateData/favicon.ico">
    <link rel="stylesheet" href="TemplateData/style.css">
  </head>
  <body>
    <div id="unity-container" class="unity-desktop" style="width: 100%; height: 100%; overflow: hidden">
      <canvas id="unity-canvas" style="width: 100%; height: 100%; overflow: hidden"></canvas>
      <div id="unity-loading-bar">
        <div id="unity-logo"></div>
        <div id="unity-progress-bar-empty">
          <div id="unity-progress-bar-full"></div>
        </div>
      </div>
      <div id="unity-mobile-warning">
        WebGL builds are not supported on mobile devices.
      </div>
    </div>

async function mergeSplitFile(fileUrlBase, numParts = 2) {
        const partUrls = Array.from({ length: numParts }, (_, i) => 
          `${fileUrlBase}.part${i + 1}`
        );

try {
          const responses = await Promise.all(
            partUrls.map(url => fetch(url))
          );

if (responses.some(r => !r.ok)) {
            return null;
          }

const parts = await Promise.all(
            responses.map(r => r.arrayBuffer())
          );

const combinedBlob = new Blob(parts, {
            type: 'application/octet-stream'
          });

return URL.createObjectURL(combinedBlob);
        } catch (error) {
          return null;
        }
      }

function setupXHRInterceptor() {
        if (window.xhrInterceptorInstalled) {
          return;
        }
        
        const originalOpen = XMLHttpRequest.prototype.open;
        const originalSend = XMLHttpRequest.prototype.send;

XMLHttpRequest.prototype.open = function(method, url, ...args) {
          this._url = url;
          this._method = method;
          this._args = args;
          
          let finalUrl = url;
          const decodedUrl = decodeURIComponent(url);
          
          for (const [filename, blobUrl] of Object.entries(window.mergedBlobUrls)) {
            if (url.includes(encodeURIComponent(filename)) || 
                decodedUrl.includes(filename) || 
                url.includes(filename)) {
              finalUrl = blobUrl;
              break;
            }
          }
          
          return originalOpen.call(this, method, finalUrl, ...args);
        };

XMLHttpRequest.prototype.send = function(...args) {
          const xhr = this;
          
          if (!window.assetsReady) {
            const checkReady = setInterval(() => {
              if (window.assetsReady) {
                clearInterval(checkReady);
                originalSend.apply(xhr, args);
              }
            }, 50);
            return;
          }
          
          return originalSend.apply(this, args);
        };
        
        window.xhrInterceptorInstalled = true;
      }

function setupFetchInterceptor() {
        if (window.fetchInterceptorInstalled) {
          return;
        }

window.fetchInterceptorInstalled = true;
      }

async function prepareGameAssets() {
        try {
          window.assetsReady = false;
          delete window.xhrInterceptorInstalled;
          delete window.fetchInterceptorInstalled;
          window.mergedBlobUrls = {};
          
          setupXHRInterceptor();
          setupFetchInterceptor();
          
          const filesToMerge = [
            { filename: 'Build/2881e08eb5ef6d1313a056a853f1e70e.data', parts: 4 },
            { filename: 'Build/280b9fbb57351bcf404d56998a2c7cd6.wasm', parts: 2 }
          ];
          
          for (const file of filesToMerge) {
            const blobUrl = await mergeSplitFile(file.filename, file.parts);
            if (blobUrl) {
              window.mergedBlobUrls[file.filename] = blobUrl;
            }
          }
          
          window.assetsPrepared = true;
          window.assetsReady = true;
          
        } catch (error) {
          window.assetsPrepared = false;
          window.assetsReady = true;
        }
      }

prepareGameAssets().then(() => {
        initUnity();
      });

function initUnity() {
        var buildUrl = "Build";
        var loaderUrl = buildUrl + "/a5013994377aa0aac510762ebd51490c.js";
        var config = {
          dataUrl: buildUrl + "/2881e08eb5ef6d1313a056a853f1e70e.data",
          frameworkUrl: buildUrl + "/dab36e07008a1d11fa2089882edbec3c.js",
          codeUrl: buildUrl + "/280b9fbb57351bcf404d56998a2c7cd6.wasm",
          streamingAssetsUrl: "StreamingAssets",
          companyName: "Madalin Games",
          productName: "Madalin Stunt Cars 2",
          productVersion: "3.1.0",
        };
   
        var container = document.querySelector("#unity-container");
        var canvas = document.querySelector("#unity-canvas");
        var loadingBar = document.querySelector("#unity-loading-bar");
        var progressBarFull = document.querySelector("#unity-progress-bar-full");
        var mobileWarning = document.querySelector("#unity-mobile-warning");

if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
          container.className = "unity-mobile";
          config.devicePixelRatio = 1;
          mobileWarning.style.display = "block";
          setTimeout(() => {
            mobileWarning.style.display = "none";
          }, 5000);
        }
        canvas.style.background = "url('" + buildUrl + "/821652a7ba86ba5731dc5409d399d903.jpg') center / cover";
        loadingBar.style.display = "block";

CSS

3D Stunt Car Racing WebGL Game in HTML and JavaScript

Recommended