Carregador WebGL do Unity em HTML: Exemplo de Zombieshooter

5 iroger7

Abrir no Editor Video Publique Seu Código

Carregador WebGL do Unity em HTML: Exemplo de Zombieshooter

Recomendado

22 August 2025

Comentário de espaço reservado para código HTML

10 December 2025

Jogo retrô de pingue-pongue em JavaScript no Canvas HTML5

1 October 2025

Animação de ondas cerebrais CSS

HTML

<!DOCTYPE html>

html, body {
            /* Убираем отступы */
            padding: 0;
            margin: 0;
            /* Отключаем скролл и лонгтап на IOS */
            overflow: hidden;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            -webkit-tap-highlight-color: rgba(0,0,0,0);
            /* Ставим высоту на 100% */
            height: 100%;
        }
    </style>

</head>
<body class="dark">
<div id="unity-container" class="unity-desktop">
<canvas id="unity-canvas" tabindex="-1"></canvas>
</div>
<div id="loading-cover" style="display:none;">
<div id="unity-loading-bar">
<div id="unity-logo"><img src="https://cdn.jsdelivr.net/gh/awaiblecomponent/575@main/logo.png"/></div>
<div id="unity-progress-bar-empty" style="display: none;">
<div id="unity-progress-bar-full"></div>
</div>
<div class="spinner"></div>
</div>
</div>

<script>
    const hideFullScreenButton = "";
    const buildUrl = "https://cdn.jsdelivr.net/gh/awaiblecomponent/575@main/Build";
    const loaderUrl = buildUrl + "/zombieshooterdone.loader.js";
    const config = {
        dataUrl: buildUrl + "/zombieshooterdone.data.br",
        frameworkUrl: buildUrl + "/zombieshooterdone.framework.js",
        streamingAssetsUrl: "StreamingAssets",
        companyName: "OnHitDev",
        productName: "They Are Coming",
        productVersion: "1.19"
    };

const wasmParts = [
        `${buildUrl}/zombieshooterdone.wasm.br.part0`,
        `${buildUrl}/zombieshooterdone.wasm.br.part1`,
        `${buildUrl}/zombieshooterdone.wasm.br.part2`,
        `${buildUrl}/zombieshooterdone.wasm.br.part3`
    ];

async function fetchAndMergeWasm() {
        const parts = await Promise.all(wasmParts.map(url =>
            fetch(url).then(r => {
                if (!r.ok) throw new Error(`Failed to load ${url}`);
                return r.arrayBuffer();
            })
        ));
        const totalLength = parts.reduce((sum, part) => sum + part.byteLength, 0);
        const merged = new Uint8Array(totalLength);
        let offset = 0;
        for (const part of parts) {
            merged.set(new Uint8Array(part), offset);
            offset += part.byteLength;
        }
        const blob = new Blob([merged], { type: "application/wasm+br" });
        return URL.createObjectURL(blob);
    }

fetchAndMergeWasm().then(blobUrl => {
    config.codeUrl = blobUrl;

const container = document.querySelector("#unity-container");
        const canvas = document.querySelector("#unity-canvas");
        const loadingCover = document.querySelector("#loading-cover");
        const progressBarEmpty = document.querySelector("#unity-progress-bar-empty");
        const progressBarFull = document.querySelector("#unity-progress-bar-full");
        const spinner = document.querySelector('.spinner');

if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
            container.className = "unity-mobile";
            
        }

// Фоновое изображение при загрузке игры. При сборке билда код меняется взависимости от настроек проекта.
        
        loadingCover.style.background = "url('background.png') center / cover";

loadingCover.style.display = "";

// Выключаем появление меню при правом клике мыши
          document.addEventListener('contextmenu', event => event.preventDefault());

function FocusGame() {
            window.focus();
            canvas.focus();
        }

window.addEventListener('pointerdown', FocusGame);
        window.addEventListener('touchstart', FocusGame);

let StartUnityInstance;
        let myGameInstance;
        let ysdk = null; // Yandex SDK pasif

// 
        let environmentData = {
            language: "en",
            domain: "default_domain",
            deviceType: "desktop",
            isMobile: false,
            isDesktop: true,
            isTablet: false,
            isTV: false,
            appID: "default_app_id",
            browserLang: navigator.language || "en",
            payload: null,
            promptCanShow: false,
            reviewCanShow: false,
            platform: navigator.platform,
            browser: (function() {
                let userAgent = navigator.userAgent;
                if (userAgent.includes("YaBrowser")) return "Yandex";
                if (userAgent.includes("OPR") || userAgent.includes("Opera")) return "Opera";
                if (userAgent.includes("Firefox")) return "Firefox";
                if (userAgent.includes("MSIE") || userAgent.includes("Trident")) return "IE";
                if (userAgent.includes("Edge")) return "Edge";
                if (userAgent.includes("Chrome")) return "Chrome";
                if (userAgent.includes("Safari")) return "Safari";
                return "Other";
            })()
        };
        
        let cloudSaves = 'noData';
        let paymentsData = 'none';
        let playerData = 'noData'; // Varsayılan playerData tanımı
        let player = null;
        let payments = null;
        let initGame = false;
        let nowFullAdOpen = false;

// 
        function GetPayments() { console.warn("GetPayments is not implemented"); return Promise.resolve("none"); }
        function SaveCloud() { console.warn("SaveCloud is not implemented"); }
        function LoadCloud() { console.warn("LoadCloud is not implemented"); return Promise.resolve("noData"); }
        function InitPlayer() { console.warn("InitPlayer is not implemented"); return Promise.resolve("noData"); }

function FullAdShow() {
    try {
        // Prevent multiple fullscreen ads from opening simultaneously
        if (!nowFullAdOpen) {
            nowFullAdOpen = true;

// If the game is initialized, notify Unity to open the fullscreen ad
            if (initGame) {
                myGameInstance.SendMessage("YandexGame", "OpenFullAd");
            }

// Simulate ad duration (500ms) and then close it
            setTimeout(() => {
                nowFullAdOpen = false;
                if (initGame) {
                    myGameInstance.SendMessage("YandexGame", "CloseFullAd", "true");
                }
                FocusGame(); // Refocus the game after ad closes
            }, 500);
        }
    } catch (error) {
        // Silently handle any errors
    }
}

function RewardedShow(rewardId) {
    try {
        // Notify Unity to open the rewarded video with the given reward ID
        myGameInstance.SendMessage("YandexGame", "RewardVideo", rewardId);

// After the ad, close it and refocus the game
        function closeRewardedAd() {
            myGameInstance.SendMessage("YandexGame", "CloseRewardVideo");
            FocusGame();
        }
        closeRewardedAd(); // Immediate closure for simplicity; in practice, this might be delayed or conditional
    } catch (error) {
        // Silently handle any errors
    }
}

// 
        window.addEventListener("unhandledrejection", function(event) {
            console.warn("Hata es geçildi:", event.reason);
            event.preventDefault();
        });
    </script>
</body>
</html>

Recomendado

Comentário de espaço reservado para código HTML

Jogo retrô de pingue-pongue em JavaScript no Canvas HTML5

Animação de ondas cerebrais CSS

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS