Chargeur de jeu Unity WebGL avec prise en charge des publicités

614 argghh

Ouvrir dans l'éditeur Video Publiez votre code

Chargeur de jeu Unity WebGL avec prise en charge des publicités

Recommandé

28 December 2024

Une page d'accueil matricielle créée avec des index

30 September 2025

Animation de chargement CSS avec vagues et ondulations

2 March 2025

Un code par komplex

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>

Recommandé

Une page d'accueil matricielle créée avec des index

Animation de chargement CSS avec vagues et ondulations

Un code par komplex

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS