Caricatore di giochi Unity WebGL con supporto per annunci pubblicitari

611 argghh

Apri nell'Editor Video Pubblica il Tuo Codice

Caricatore di giochi Unity WebGL con supporto per annunci pubblicitari

Consigliato

28 August 2025

Esempio di codice HTML della pagina di accesso turca

5 December 2024

CocaCola | Digitazione automatica

12 December 2025

Interfaccia utente CSS Chatbox: interfaccia di messaggistica reattiva

HTML

<!DOCTYPE html>

<html lang="en-us">
<head>
<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"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/bubbls/99itf@main/style.css"/>

<style>
        /* Убираем выделение по нажатию клавиш */
        canvas:focus { 
            outline: none;
        }

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-progress-bar-empty" style="display: none;">
<div id="unity-progress-bar-full"></div>
</div>
<div class="spinner"></div> 
</div>
</div>

<!DOCTYPE html>
<html lang="en-us">
<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Unity WebGL Player | 99Days</title>
    <style>
        /* CSS stilleri (orijinal kodunuzdan alınabilir, burada yer kaplamaması için çıkarılmıştır) */
    </style>
</head>
<body>
    <div id="unity-container" class="unity-desktop">
        <canvas id="unity-canvas"></canvas>
        <div id="loading-cover">
            <div id="unity-progress-bar-empty">
                <div id="unity-progress-bar-full"></div>
            </div>
            <div class="spinner"></div>
        </div>
    </div>
    <script>
        const hideFullScreenButton = "";
        const buildUrl = "https://cdn.jsdelivr.net/gh/bubbls/99itf@main/Build";
        const loaderUrl = buildUrl + "/Build.loader.js";
        const cdnBaseUrl = "https://cdn.jsdelivr.net/gh/bubbls/99itf@main/"; // jsDelivr URL'sini kendi reponuza göre düzenleyin

// Part dosyalarının listesi
        const dataParts = [
            cdnBaseUrl + "Build.data.br.part0",
            cdnBaseUrl + "Build.data.br.part1",
          cdnBaseUrl + "Build.data.br.part2",
          cdnBaseUrl + "Build.data.br.part3",
        ];
        const wasmParts = [
             cdnBaseUrl + "Build.wasm.br.part0",
            cdnBaseUrl + "Build.wasm.br.part1",
          cdnBaseUrl + "Build.wasm.br.part2",
          cdnBaseUrl + "Build.wasm.br.part3",
          cdnBaseUrl + "Build.wasm.br.part4",
        ];

// Dosya birleştirme fonksiyonu
        async function fetchAndCombineParts(partUrls) {
            const buffers = [];
            for (const url of partUrls) {
                const response = await fetch(url);
                if (!response.ok) throw new Error(`Failed to fetch ${url}`);
                const buffer = await response.arrayBuffer();
                buffers.push(buffer);
            }
            const totalLength = buffers.reduce((sum, buf) => sum + buf.byteLength, 0);
            const combined = new Uint8Array(totalLength);
            let offset = 0;
            for (const buffer of buffers) {
                combined.set(new Uint8Array(buffer), offset);
                offset += buffer.byteLength;
            }
            return new Blob([combined], { type: 'application/octet-stream' });
        }

// Unity konfigürasyonu
        const config = {
            dataUrl: "", // Blob URL dinamik olarak ayarlanacak
            frameworkUrl: buildUrl + "/Build.framework.js",
            codeUrl: "", // Blob URL dinamik olarak ayarlanacak
            streamingAssetsUrl: "StreamingAssets",
            companyName: "DefaultCompany",
            productName: "99Days",
            productVersion: "0.1"
        };

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('') center / cover";
        loadingCover.style.display = "";

document.addEventListener('contextmenu', event => event.preventDefault());

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

function auth() {
            initPlayer(); 
        }

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

let StartUnityInstance;
        let myGameInstance;
        let ysdk = null;

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';
        let player = null;
        let payments = null;
        let initGame = false;
        let nowFullAdOpen = false;

// Unity başlatma ve dosya birleştirme
        try {
            const script = document.createElement("script");
          
            script.src = loaderUrl;
            script.onload = async () => {
                // Part dosyalarını birleştir
                const dataBlob = await fetchAndCombineParts(dataParts);
                const wasmBlob = await fetchAndCombineParts(wasmParts);
                config.dataUrl = URL.createObjectURL(dataBlob);
                config.codeUrl = URL.createObjectURL(wasmBlob);

StartUnityInstance = function () {
                    createUnityInstance(canvas, config, (progress) => {
                        spinner.style.display = "none";
                        progressBarEmpty.style.display = "";
                        progressBarFull.style.width = `${100 * progress}%`;
                    }).then((unityInstance) => {
                        myGameInstance = unityInstance;
                        loadingCover.style.display = "none";
                    }).catch((message) => {
                        console.error("Unity yükleme hatası:", message);
                    });
                };
                StartUnityInstance();
            };
            document.body.appendChild(script);
        } catch (error) {
            console.error("Başlatma sırasında hata:", error);
        }

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

<style>
  /* Container: Top center, fixed, with overflow hidden */
  #ad-container {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: min(728px, calc(100% - 20px)); /* 728px, 10px margin on mobile */
    height: 90px;
    background: rgba(0, 0, 0, 0.90);
    display: none;
    z-index: 99999;
    border-radius: 0; /* Sharp corners */
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
    box-sizing: border-box;
    transition: transform 0.5s ease-in-out; /* Smooth slide-in/out animation */
  }

/* Slide-out animation */
  #ad-container.hidden {
    transform: translate(-50%, -100%); /* Slide up out of view */
  }

#ad-iframe {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 745px; /* Updated width */
    height: 90px; /* Updated height */
    border: 0;
    display: block;
    overflow: hidden;
    pointer-events: auto;
    box-sizing: content-box;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  #ad-iframe::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

/* Close button with arrow */
  #close-ad {
    position: absolute;
    top: 6px;
    right: 8px;
    background: #ff4d4d;
    color: #fff;
    border: none;
    padding: 5px 9px;
    font-size: 13px;
    border-radius: 4px;
    cursor: not-allowed;
    opacity: 0.72;
    z-index: 100000;
    display: flex;
    align-items: center;
  }
  #close-ad.enabled {
    cursor: pointer;
    opacity: 1;
  }
  #close-ad::before {
    content: '↑'; /* Up arrow */
    margin-right: 4px;
  }

/* Right mask for scrollbar */
  #ad-right-mask {
    position: absolute;
    top: 0;
    right: 0;
    width: 12px;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9));
    z-index: 99999;
  }

/* Mobile adjustments */
  @media (max-width: 440px) {
    #ad-container {
      width: calc(100% - 12px);
      left: 50%;
      transform: translateX(-50%);
      border-radius: 0; /* Sharp corners on mobile */
    }
    #ad-iframe {
      width: 708px;
    }
  }
</style>

<div id="ad-container" aria-hidden="true" role="dialog" aria-label="Advertisement">
  <iframe
    id="ad-iframe"
    src=""
    width="768px"
    height="95px"
    scrolling="no"
    frameborder="0"

sandbox="allow-scripts allow-popups allow-same-origin"
  ></iframe>
  <button id="close-ad" disabled>Close (12)</button>
  <div id="ad-right-mask"></div>
</div>

function showAd() {
      // Show ad with smooth slide-in
      adContainer.style.display = 'block';
      adContainer.classList.remove('hidden');
      adContainer.setAttribute('aria-hidden', 'false');

// Start countdown
      let timeLeft = countdownStart;
      closeBtn.textContent = `Close (${timeLeft})`;
      closeBtn.disabled = true;
      closeBtn.classList.remove('enabled');

// Initial ad show
    setTimeout(showAd, showDelay);

// Close with animation and schedule reappearance
    closeBtn.addEventListener('click', () => {
      if (closeBtn.disabled) return;
      adContainer.classList.add('hidden');
      adContainer.setAttribute('aria-hidden', 'true');
      // Schedule reappearance without removing or reloading iframe
      setTimeout(showAd, reappearDelay);
    });
  })();
</script>

</body>
</html>

Consigliato

Esempio di codice HTML della pagina di accesso turca

CocaCola | Digitazione automatica

Interfaccia utente CSS Chatbox: interfaccia di messaggistica reattiva

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS