fix: sometime scene is created but krpanoDom is undefined

src/assets/scss/reset-for-custom-projects.css

@@ -4,7 +4,8 @@
 .titieSlide {
   display: none !important;
 }
-.bar-list {
+.bar-list,
+.btn-style {
   display: none !important;
 }
 ul.control {

src/pages/show.vue

@@ -62,13 +62,13 @@ const skyMask = computed(() => store.getters["scene/skyMask"]);
 const isShowOpeningAnimation = ref(0);
 
 onMounted(async () => {
-  if (browser.isMobile()) {
-    window.location.href = window.location.href.replace(
-      "show.html",
-      "showMobile.html"
-    );
-    return;
-  }
+  // if (browser.isMobile()) {
+  //   window.location.href = window.location.href.replace(
+  //     "show.html",
+  //     "showMobile.html"
+  //   );
+  //   return;
+  // }
   // let res = await checkWork();
 
   // if (!res.data) {
@@ -208,49 +208,52 @@ onMounted(async () => {
 
       if (isHavePano) {
         app.Scene.on("sceneReady", () => {
-          if (app.krpanoDom) {
-            let defaultMask = `%SWFPATH%/skin/masking_${lang}.png`;
+          // FIX: sometime scene is created but krpanoDom is undefined
+          setTimeout(() => {
+            if (app.krpanoDom) {
+              let defaultMask = `%SWFPATH%/skin/masking_${lang}.png`;
 
-            if (earthMask.value) {
-              app.krpanoDom.set(`hotspot[nadirlogo].url`, defaultMask);
-              app.krpanoDom.set(
-                `hotspot[nadirlogo].visible`,
-                earthMask.value.isShow
-              );
+              if (earthMask.value) {
+                app.krpanoDom.set(`hotspot[nadirlogo].url`, defaultMask);
+                app.krpanoDom.set(
+                  `hotspot[nadirlogo].visible`,
+                  earthMask.value.isShow
+                );
 
-              if (earthMask.value.icon) {
+                if (earthMask.value.icon) {
+                  app.krpanoDom.set(
+                    `hotspot[nadirlogo].url`,
+                    earthMask.value.icon
+                  );
+                }
+              }
+
+              if (skyMask.value) {
+                app.krpanoDom.set(`hotspot[peaklogo].url`, defaultMask);
                 app.krpanoDom.set(
-                  `hotspot[nadirlogo].url`,
-                  earthMask.value.icon
+                  `hotspot[peaklogo].visible`,
+                  skyMask.value.isShow
                 );
+                if (skyMask.value.icon) {
+                  app.krpanoDom.set(`hotspot[peaklogo].url`, skyMask.value.icon);
+                }
               }
-            }
 
-            if (skyMask.value) {
-              app.krpanoDom.set(`hotspot[peaklogo].url`, defaultMask);
               app.krpanoDom.set(
-                `hotspot[peaklogo].visible`,
-                skyMask.value.isShow
+                `layer[webvr_exitbutton].html`,
+                t("common.exit_vr")
               );
-              if (skyMask.value.icon) {
-                app.krpanoDom.set(`hotspot[peaklogo].url`, skyMask.value.icon);
-              }
             }
-
-            app.krpanoDom.set(
-              `layer[webvr_exitbutton].html`,
-              t("common.exit_vr")
-            );
-          }
-          let hotspots = [];
-          if (currentScene.value.someData) {
-            hotspots =
-              typeof currentScene.value.someData == "string"
-                ? JSON.parse(currentScene.value.someData).hotspots
-                : currentScene.value.someData.hotspots;
-          }
-          console.log(hotspots, "hotspots");
-          app.Tags.initHotspot(hotspots, false);
+            let hotspots = [];
+            if (currentScene.value.someData) {
+              hotspots =
+                typeof currentScene.value.someData == "string"
+                  ? JSON.parse(currentScene.value.someData).hotspots
+                  : currentScene.value.someData.hotspots;
+            }
+            console.log(hotspots, "hotspots");
+            app.Tags.initHotspot(hotspots, false);
+          })
         });
       }
 

src/pages/showMobile.js

@@ -11,6 +11,7 @@ import browser from "../utils/browser";
 import Deferred from "@/utils/Deferred";
 import store from '../store'
 import VueLazyLoad from 'vue3-lazyload'
+import '@/assets/scss/reset-for-custom-projects.css'
 
 
 let App;