移动端测试

Assets/WebGLTemplates/RPMTemplate/TemplateData.meta

@@ -0,0 +1,8 @@
+fileFormatVersion: 2
+guid: 59524364494c7384b9b13790741cb61d
+folderAsset: yes
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/Global.js

@@ -0,0 +1,11 @@
+var rpmFrame = document.getElementById("rpm-frame");
+var rpmContainer = document.getElementById("rpm-container");
+var container = document.querySelector("#unity-container");
+var canvas = document.querySelector("#unity-canvas");
+var loadingBar = document.querySelector("#unity-loading-bar");
+var progressBarFull = document.querySelector("#unity-progress-bar-full");
+var fullscreenButton = document.querySelector("#unity-fullscreen-button");
+var warningBanner = document.querySelector("#unity-warning");
+var rpmHideButton = document.getElementById("rpm-hide-button");
+var canvasWrapper = document.getElementById("canvas-wrap");
+var unityGame;

Assets/WebGLTemplates/RPMTemplate/TemplateData/Global.js.meta

@@ -0,0 +1,3 @@
+fileFormatVersion: 2
+guid: 8c717cdcb6554552b8486542839867cf
+timeCreated: 1651665786

Assets/WebGLTemplates/RPMTemplate/TemplateData/ReadyPlayerMeFrame.js

@@ -0,0 +1,75 @@
+rpmHideButton.onclick = function () {
+    if (document.fullscreenElement) {
+        canvasWrapper.requestFullscreen();
+    }
+    rpmContainer.style.display = "none";
+};
+
+
+function setupRpmFrame(subdomain) {
+    rpmFrame.src = `https://${subdomain != "" ? subdomain : "demo"}.readyplayer.me/avatar?frameApi`;
+
+    window.addEventListener("message", subscribe);
+    document.addEventListener("message", subscribe);
+    function subscribe(event) {
+        const json = parse(event);
+        if (
+            unityGame == null ||
+            json?.source !== "readyplayerme" ||
+            json?.eventName == null
+        ) {
+            return;
+        }
+        // Send web event names to Unity can be useful for debugging. Can safely be removed
+        unityGame.SendMessage(
+            "DebugPanel",
+            "LogMessage",
+            `Event: ${json.eventName}`
+        );
+
+        // Subscribe to all events sent from Ready Player Me once frame is ready
+        if (json.eventName === "v1.frame.ready") {
+            rpmFrame.contentWindow.postMessage(
+                JSON.stringify({
+                    target: "readyplayerme",
+                    type: "subscribe",
+                    eventName: "v1.**",
+                }),
+                "*"
+            );
+        }
+
+        // Get avatar GLB URL
+        if (json.eventName === "v1.avatar.exported") {
+            rpmContainer.style.display = "none";
+            // Send message to a Gameobject in the current scene
+            unityGame.SendMessage(
+                "WebAvatarLoader", // Target GameObject name
+                "OnWebViewAvatarGenerated", // Name of function to run
+                json.data.url
+            );
+            console.log(`Avatar URL: ${json.data.url}`);
+        }
+
+        // Get user id
+        if (json.eventName === "v1.user.set") {
+            console.log(`User with id ${json.data.id} set: ${JSON.stringify(json)}`);
+        }
+    }
+
+    function parse(event) {
+        try {
+            return JSON.parse(event.data);
+        } catch (error) {
+            return null;
+        }
+    }
+}
+
+function showRpm() {
+    rpmContainer.style.display = "block";
+}
+
+function hideRpm() {
+    rpmContainer.style.display = "none";
+}

Assets/WebGLTemplates/RPMTemplate/TemplateData/ReadyPlayerMeFrame.js.meta

@@ -0,0 +1,3 @@
+fileFormatVersion: 2
+guid: b6a51c32164f4f89bfe48b53b9b277e5
+timeCreated: 1651665285

Assets/WebGLTemplates/RPMTemplate/TemplateData/UnitySetup.js

@@ -0,0 +1,88 @@
+
+// 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) {
+    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 + "/{{{ LOADER_FILENAME }}}";
+var config = {
+    dataUrl: buildUrl + "/{{{ DATA_FILENAME }}}",
+    frameworkUrl: buildUrl + "/{{{ FRAMEWORK_FILENAME }}}",
+    codeUrl: buildUrl + "/{{{ CODE_FILENAME }}}",
+    #if MEMORY_FILENAME
+    memoryUrl: buildUrl + "/{{{ MEMORY_FILENAME }}}",
+    #endif
+    #if SYMBOLS_FILENAME
+    symbolsUrl: buildUrl + "/{{{ SYMBOLS_FILENAME }}}",
+    #endif
+    streamingAssetsUrl: "StreamingAssets",
+    companyName: "{{{ COMPANY_NAME }}}",
+    productName: "{{{ PRODUCT_NAME }}}",
+    productVersion: "{{{ PRODUCT_VERSION }}}",
+    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 (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
+    container.className = "unity-mobile";
+    // Avoid draining fillrate performance on mobile devices,
+    // and default/override low DPI mode on mobile browsers.
+    config.devicePixelRatio = 1;
+    unityShowBanner('WebGL builds are not supported on mobile devices.');
+} else {
+    canvas.style.width = "{{{ WIDTH }}}px";
+    canvas.style.height = "{{{ HEIGHT }}}px";
+}
+
+#if BACKGROUND_FILENAME
+canvas.style.background = "url('" + buildUrl + "/{{{ BACKGROUND_FILENAME.replace(/'/g, '%27') }}}') center / cover";
+#endif
+
+loadingBar.style.display = "block";
+
+var script = document.createElement("script");
+script.src = loaderUrl;
+script.onload = () => {
+    createUnityInstance(canvas, config, (progress) => {
+        progressBarFull.style.width = 100 * progress + "%";
+    })
+        .then((unityInstance) => {
+            unityGame = unityInstance;
+            loadingBar.style.display = "none";
+            fullscreenButton.onclick = () => {
+                canvasWrapper.requestFullscreen();
+            };
+        })
+        .catch((message) => {
+            alert(message);
+        });
+};
+document.body.appendChild(script);

Assets/WebGLTemplates/RPMTemplate/TemplateData/UnitySetup.js.meta

@@ -0,0 +1,3 @@
+fileFormatVersion: 2
+guid: 0268448dd5524e8089931246aa6dfad9
+timeCreated: 1651665297

Assets/WebGLTemplates/RPMTemplate/TemplateData/favicon.ico.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 24f1cb2136d6a5b4b81e7a0882c4425d
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/fullscreen-button.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: c331354f3276c3443877be9e566e88a3
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/progress-bar-empty-dark.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 0ac1209ef262e6a45804ceb348f9ea1f
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/progress-bar-empty-light.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 27062929d252c1043ae1ec108ac42fde
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/progress-bar-full-dark.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 9d9f7ad707259b7418dc87440bdcde3c
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/progress-bar-full-light.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 9195c7b59e9aca248be3b023ca9c0093
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/style.css

@@ -0,0 +1,94 @@
+#canvas-wrap {
+  padding: 0;
+  margin: 0;
+  position: relative;
+  margin-bottom: 4px;
+  width: {{{WIDTH}}}px;
+  height: {{{HEIGHT}}}px;
+}
+
+#rpm-container
+{
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  position:absolute;
+  display:none;
+  pointer-events: inherit;
+}
+
+.rpm-frame {
+  width: 100%;
+  height: 95%;
+  margin: 0;
+  padding: 0;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans,
+  Droid Sans, Helvetica Neue, sans-serif;
+  font-size: 14px;
+  border: none;
+  display:block;
+  pointer-events: inherit;
+}
+
+#rpm-hide-button {
+  cursor: pointer;
+  width: 100%;
+  height: 5%;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans,
+  Droid Sans, Helvetica Neue, sans-serif;
+  font-size: 14px;
+  border: none;
+  color:#000;
+  background-color: #e2e3ec;
+  padding: 0;
+  margin: 0;
+  box-shadow: inset 0px 0px 8px 2px rgba(0,0,0,0.2);
+  pointer-events: inherit;
+}
+
+#rpm-hide-button:hover {
+  background-color: #f1f2fa;
+}
+
+#rpm-hide-button:Active {
+  background-color: #e2e3ec;
+}
+
+.warning {
+  background-color: #b4b6c5;
+  padding: 3px;
+  border-radius: 5px;
+  color: white;
+}
+
+#page-title {
+  padding: 20px;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans,
+  Droid Sans, Helvetica Neue, sans-serif;
+  font-size: 24px;
+  line-height: 30px;
+  text-align: center;
+  margin: auto;
+}
+
+#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
+#unity-container.unity-mobile { width: 100%!important; height: 100%!important; }
+
+/*Default Unity styles*/
+body { padding: 0; margin: 0 }
+#unity-container { position: absolute;pointer-events: inherit; }
+#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
+#unity-container.unity-mobile { width: 100%; height: 100% }
+#unity-canvas { background: #231F20;pointer-events: inherit; display:block; width: 100%!important ; height: 100%!important  }
+.unity-mobile #unity-canvas { width: 100%; height: 100% }
+#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
+#unity-logo { width: 154px; height: 130px; background: url('unity-logo-dark.png') no-repeat center }
+#unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; background: url('progress-bar-empty-dark.png') no-repeat center }
+#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center }
+#unity-footer { position: relative }
+.unity-mobile #unity-footer { display: none }
+#unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
+#unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
+#unity-fullscreen-button { float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
+#unity-mobile-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }

Assets/WebGLTemplates/RPMTemplate/TemplateData/style.css.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: a61b99cf63526d045b79f61b50f6c927
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/unity-logo-dark.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: e8ac035b577d99747be32a3d53e5dc34
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/unity-logo-light.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: ed698e94e0340ee4db5f8df788f83edc
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/TemplateData/webgl-logo.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 19fbb4a019413b748bb04c2d46f95c3c
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/index.html

@@ -0,0 +1,51 @@
+<!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 | {{{ PRODUCT_NAME }}}</title>
+    <link rel="stylesheet" href="TemplateData/style.css">
+    <link rel="shortcut icon" href="TemplateData/favicon.ico" />
+    <style>
+      #unity-wrapper {
+        position: relative;
+        width: 100%;
+        height: 0;
+        padding-bottom: 56.25%; /* 16:9 aspect ratio */
+      }
+
+      #unity-wrapper iframe,
+      #unity-wrapper canvas {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="unity-wrapper">
+      <div id="unity-container" class="unity-desktop">
+        <div id="canvas-wrap">
+          <div id="rpm-container">
+            <iframe id="rpm-frame" class="rpm-frame" allow="camera *; microphone *"></iframe>
+            <button id="rpm-hide-button" onclick="hideRpm()">Hide</button>
+          </div>
+          <canvas id="unity-canvas"></canvas>
+        </div>
+        <div id="unity-loading-bar">
+          <div id="unity-logo"></div>
+          <div id="unity-progress-bar-empty">
+            <div id="unity-progress-bar-full"></div>
+          </div>
+        </div>
+        <div id="unity-warning"></div>
+        <div id="unity-footer" style=""></div>
+      </div>
+    </div>
+    <script src="TemplateData/Global.js"></script>
+    <script src="TemplateData/UnitySetup.js"></script>
+    <script src="TemplateData/ReadyPlayerMeFrame.js"></script>
+  </body>
+</html>

Assets/WebGLTemplates/RPMTemplate/index.html.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: fff559cd71c523e4e8dc2789cda60da3
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Assets/WebGLTemplates/RPMTemplate/thumbnail.png.meta

@@ -0,0 +1,7 @@
+fileFormatVersion: 2
+guid: 782887ed67f6e494bbc52ba795812eda
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: