unity-loader.js 2.9 KB

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