Spaces:
Running
Running
| <html lang="en-us"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
| <title>Splatterbox</title> | |
| <link rel="shortcut icon" href="TemplateData/favicon.ico" /> | |
| <link rel="stylesheet" href="TemplateData/style.css" /> | |
| </head> | |
| <body> | |
| <div id="unity-container"> | |
| <canvas id="unity-canvas" tabindex="-1"></canvas> | |
| <div id="unity-loading-bar"> | |
| <div id="unity-progress-bar-empty"> | |
| <div id="unity-progress-bar-full"></div> | |
| </div> | |
| </div> | |
| <div id="unity-warning"></div> | |
| </div> | |
| <script> | |
| var canvas = document.querySelector("#unity-canvas"); | |
| // Shows a temporary message banner/ribbon for a few seconds, or | |
| // a permanent error message on top of the canvas if type=='error'. | |
| // If type=='warning', a yellow highlight color is used. | |
| // Modify or remove this function to customize the visually presented | |
| // way that non-critical warnings and error messages are presented to the | |
| // user. | |
| function unityShowBanner(msg, type) { | |
| var warningBanner = document.querySelector("#unity-warning"); | |
| function updateBannerVisibility() { | |
| warningBanner.style.display = warningBanner.children.length ? 'block' : 'none'; | |
| } | |
| var div = document.createElement('div'); | |
| div.innerHTML = msg; | |
| warningBanner.appendChild(div); | |
| if (type == 'error') div.style = 'background: red; padding: 10px;'; | |
| else { | |
| if (type == 'warning') div.style = 'background: yellow; padding: 10px;'; | |
| setTimeout(function() { | |
| warningBanner.removeChild(div); | |
| updateBannerVisibility(); | |
| }, 5000); | |
| } | |
| updateBannerVisibility(); | |
| } | |
| var buildUrl = "Build"; | |
| var loaderUrl = buildUrl + "/Build.loader.js"; | |
| var config = { | |
| arguments: [], | |
| dataUrl: buildUrl + "/Build.data", | |
| frameworkUrl: buildUrl + "/Build.framework.js", | |
| codeUrl: buildUrl + "/Build.wasm", | |
| streamingAssetsUrl: "StreamingAssets", | |
| companyName: "Hugging Face", | |
| productName: "Splatterbox", | |
| productVersion: "0.1.0", | |
| showBanner: unityShowBanner, | |
| }; | |
| // By default, Unity keeps WebGL canvas render target size matched with | |
| // the DOM size of the canvas element (scaled by window.devicePixelRatio) | |
| // Set this to false if you want to decouple this synchronization from | |
| // happening inside the engine, and you would instead like to size up | |
| // the canvas DOM size and WebGL render target sizes yourself. | |
| // config.matchWebGLToCanvasSize = false; | |
| // If you would like all file writes inside Unity Application.persistentDataPath | |
| // directory to automatically persist so that the contents are remembered when | |
| // the user revisits the site the next time, uncomment the following line: | |
| // config.autoSyncPersistentDataPath = true; | |
| // This autosyncing is currently not the default behavior to avoid regressing | |
| // existing user projects that might rely on the earlier manual | |
| // JS_FileSystem_Sync() behavior, but in future Unity version, this will be | |
| // expected to change. | |
| if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) { | |
| // Mobile device style: fill the whole browser client area with the game canvas: | |
| var meta = document.createElement('meta'); | |
| meta.name = 'viewport'; | |
| meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes'; | |
| document.getElementsByTagName('head')[0].appendChild(meta); | |
| } | |
| document.querySelector("#unity-loading-bar").style.display = "block"; | |
| var script = document.createElement("script"); | |
| script.src = loaderUrl; | |
| script.onload = () => { | |
| createUnityInstance(canvas, config, (progress) => { | |
| document.querySelector("#unity-progress-bar-full").style.width = 100 * progress + "%"; | |
| }).then((unityInstance) => { | |
| document.querySelector("#unity-loading-bar").style.display = "none"; | |
| }).catch((message) => { | |
| alert(message); | |
| }); | |
| }; | |
| document.body.appendChild(script); | |
| </script> | |
| </body> | |
| </html> | |