unity-loader.js 2.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. var container = document.querySelector("#unity-container");
  2. var canvas = document.querySelector("#unity-canvas");
  3. var loadingBar = document.querySelector("#unity-loading-bar");
  4. var progressBarFull = document.querySelector("#unity-progress-bar-full");
  5. var warningBanner = document.querySelector("#unity-warning");
  6. var unityName = "C3Dev";
  7. function unityShowBanner(msg, type) {
  8. function updateBannerVisibility() {
  9. warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
  10. }
  11. var div = document.createElement('div');
  12. div.innerHTML = msg;
  13. warningBanner.appendChild(div);
  14. if (type == 'error') div.style = 'background: red; padding: 10px;';
  15. else {
  16. if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
  17. setTimeout(function() {
  18. warningBanner.removeChild(div);
  19. updateBannerVisibility();
  20. }, 5000);
  21. }
  22. updateBannerVisibility();
  23. }
  24. var buildUrl = unityName + "/Build";
  25. var loaderUrl = buildUrl + "/" + unityName +".loader.js";
  26. var config = {
  27. dataUrl: buildUrl + "/" + unityName + ".data.unityweb",
  28. frameworkUrl: buildUrl + "/" + unityName + ".framework.js.unityweb",
  29. codeUrl: buildUrl + "/" + unityName + ".wasm.unityweb",
  30. streamingAssetsUrl: "StreamingAssets",
  31. companyName: "DefaultCompany",
  32. productName: "C3Monitor",
  33. productVersion: "0.1",
  34. showBanner: unityShowBanner,
  35. };
  36. if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
  37. // Mobile device style: fill the whole browser client area with the game canvas:
  38. var meta = document.createElement('meta');
  39. meta.name = 'viewport';
  40. meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
  41. document.getElementsByTagName('head')[0].appendChild(meta);
  42. container.className = "unity-mobile";
  43. // To lower canvas resolution on mobile devices to gain some
  44. // performance, uncomment the following line:
  45. // config.devicePixelRatio = 1;
  46. canvas.style.width = '100%';
  47. canvas.style.height = '610px';
  48. unityShowBanner('WebGL builds are not supported on mobile devices.');
  49. } else {
  50. // Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
  51. //canvas.style.width = '600px';
  52. canvas.style.height = '610px';
  53. canvas.style.width = '100%';
  54. }
  55. loadingBar.style.display = "block";
  56. var myGameInstance = null;
  57. var script = document.createElement("script");
  58. script.src = loaderUrl;
  59. script.onload = () => {
  60. createUnityInstance(canvas, config, (progress) => {
  61. progressBarFull.style.width = Math.round(100 * progress) + "%";
  62. progressBarFull.innerHTML = Math.round(100 * progress) + "%";
  63. }).then((unityInstance) => {
  64. loadingBar.style.display = "none";
  65. myGameInstance = unityInstance;
  66. }).catch((message) => {
  67. alert(message);
  68. });
  69. };
  70. document.body.appendChild(script);