gx

hot/src/views/Home.vue

@@ -1,11 +1,33 @@
 <template>
   <div class="home">
+
+    <div
+      v-if="showAudioUnlockTip"
+      class="audioUnlockTip"
+      @click.stop="unlockAudio"
+      @touchstart.stop.passive="unlockAudio"
+    >
+      轻触开启声音
+    </div>
+
     <div class="main">
-      <div class="logo"><img :src="require('@/assets/images/logo.png')" alt="" draggable="false" /></div>
 
       <!-- <div class="myTitle">{{ myTitle }}</div> -->
+      <audio
+        id="myAudio"
+        ref="bgAudio"
+        v-if="audio"
+        v-show="isOneAduio"
+        :src="urlToFitFu(audio)"
+        :muted="needMutedAutoplay"
+        controls
+        autoplay
+        playsinline
+        webkit-playsinline
+        x5-playsinline
+      ></audio>
+
       <div class="mainCon" v-show="!oneTxt">
-        <audio id="myAudio" v-if="audio" v-show="isOneAduio" :src="urlToFitFu(audio)" controls></audio>
         <!-- 如果只有一个模块 -->
         <!-- <div class="oneTabNum" v-if="
           flooTab.length === 1 &&
@@ -20,7 +42,8 @@
 
         <div class="contenBoxMain swiper-container">
           <div class="swiper-wrapper">
-            <div class="contenBox swiper-slide" v-for="(item, index) in data[myType]" :key="myType === 'video' ? item.url : item">
+            <div class="contenBox swiper-slide" v-for="(item, index) in data[myType]"
+              :key="myType === 'video' ? item.url : item">
               <!-- 模型页面 -->
               <div class="modelBox" v-if="myType === 'model'">
                 <iframe :src="urlToFitFu(item)" frameborder="0" v-if="index === myInd"></iframe>
@@ -39,11 +62,24 @@
           </div>
           <!-- 左右箭头 -->
           <template v-if="!isMobile">
-            <div @click="cutMyInd(-1, myInd === 0)" class="leftJJ awccJJ" :class="{ noClick: myInd === 0 }" v-if="data[myType] && data[myType].length > 1"></div>
-            <div @click="cutMyInd(1, myInd === data[myType].length - 1)" class="rightJJ awccJJ" :class="{ noClick: myInd === data[myType].length - 1 }" v-if="data[myType] && data[myType].length > 1"></div>
+            <div @click="cutMyInd(-1, myInd === 0)" class="leftJJ awccJJ" :class="{ noClick: myInd === 0 }"
+              v-if="data[myType] && data[myType].length > 1"></div>
+            <div @click="cutMyInd(1, myInd === data[myType].length - 1)" class="rightJJ awccJJ"
+              :class="{ noClick: myInd === data[myType].length - 1 }" v-if="data[myType] && data[myType].length > 1">
+            </div>
           </template>
         </div>
+
+        
       </div>
+      <div
+        class="musicIcon"
+        v-if="audio"
+        @click="toggleAudio"
+        :title="audioSta ? '关闭音频' : '打开音频'"
+      >
+          <img :src="musicIconSrc" alt="">
+        </div>
 
       <div class="swiper-pagination"></div>
 
@@ -65,11 +101,13 @@
 
     <!-- 底部的tab -->
     <div class="flooTabBox" v-if="flooTab.length > 1">
-      <div @click="myType = item.type" class="tabRow" :class="{ tabRowAc: myType === item.type }" v-for="item in flooTab" :key="item.id">
+      <div @click="myType = item.type" class="tabRow" :class="{ tabRowAc: myType === item.type }"
+        v-for="item in flooTab" :key="item.id">
         <img :src="require(`@/assets/images/pc/icon${item.id}${myType === item.type ? 'Ac' : ''}.png`)" alt="" />
         <div>
           {{ item.name }}
-          <span v-if="data[item.type] && data[item.type].length && data[item.type].length > 1">{{ item.type === myType ? myInd + 1 + "/" : null }}{{ data[item.type].length }}</span>
+          <span v-if="data[item.type] && data[item.type].length && data[item.type].length > 1">{{ item.type === myType ?
+            myInd + 1 + "/" : null }}{{ data[item.type].length }}</span>
         </div>
       </div>
       <!-- 音频图标 -->
@@ -84,13 +122,22 @@
 <script>
 import Swiper from "swiper";
 import "swiper/css/swiper.min.css";
+import musicOn from "@/assets/images/pc/music_on.png";
+import musicOff from "@/assets/images/pc/music_off.png";
 
 export default {
   name: "Home",
   components: {},
   data() {
+    const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);
+    const isInIframe = window.self !== window.top;
     return {
       isMobile: /iPhone|iPad|iPod|Android/i.test(navigator.userAgent),
+      isIOS,
+      isInIframe,
+      // iOS iframe 下先静音自动播放，用户触摸后再开声
+      needMutedAutoplay: isIOS && isInIframe,
+      showAudioUnlockTip: false,
       m: this.$route.query.m,
       id: this.$route.query.id,
       // 音频地址
@@ -138,18 +185,101 @@ export default {
     },
     // 音频的开启和关闭
     audioSta(val) {
-      const dom = document.querySelector("#myAudio");
+      const dom = this.getAudioDom();
+      if (!dom) return;
       if (val) {
-        dom.play();
         dom.onended = () => {
-          // console.log("----音频播放完毕");
           this.audioSta = false;
         };
-      } else dom.pause();
+        this.playAudio(dom);
+      } else {
+        dom.pause();
+        this.showAudioUnlockTip = false;
+        this.removeAudioUnlock();
+      }
+    },
+  },
+  computed: {
+    musicIconSrc() {
+      return this.audioSta ? musicOn : musicOff;
     },
   },
-  computed: {},
   methods: {
+    getAudioDom() {
+      return this.$refs.bgAudio || document.querySelector("#myAudio");
+    },
+    playAudio(dom) {
+      const audioDom = dom || this.getAudioDom();
+      if (!audioDom) return;
+      const playPromise = audioDom.play();
+      if (!playPromise || !playPromise.then) return;
+      playPromise
+        .then(() => {
+          if (this.needMutedAutoplay) {
+            this.showAudioUnlockTip = true;
+          } else {
+            this.showAudioUnlockTip = false;
+            this.removeAudioUnlock();
+          }
+        })
+        .catch(() => {
+          if (this.isIOS && this.isInIframe) {
+            this.showAudioUnlockTip = true;
+          }
+          this.bindAudioUnlock();
+        });
+    },
+    unlockAudio() {
+      const dom = this.getAudioDom();
+      if (!dom) return;
+      this.needMutedAutoplay = false;
+      dom.muted = false;
+      this.showAudioUnlockTip = false;
+      if (this.audioSta) {
+        this.playAudio(dom);
+      }
+      this.removeAudioUnlock();
+    },
+    bindAudioUnlock() {
+      if (this._audioUnlockHandler || !this.audioSta) return;
+      this._audioUnlockHandler = () => {
+        this.unlockAudio();
+      };
+      document.addEventListener("touchstart", this._audioUnlockHandler, { passive: true });
+      document.addEventListener("click", this._audioUnlockHandler, { passive: true });
+    },
+    removeAudioUnlock() {
+      if (!this._audioUnlockHandler) return;
+      document.removeEventListener("touchstart", this._audioUnlockHandler);
+      document.removeEventListener("click", this._audioUnlockHandler);
+      this._audioUnlockHandler = null;
+    },
+    tryStartAudio() {
+      if (!this.audio) return;
+      this.audioSta = true;
+    },
+    notifyParentLoaded() {
+      if (typeof window.loaddingSuccess === "function") {
+        window.loaddingSuccess();
+      }
+      if (this.isInIframe) {
+        window.parent.postMessage({ type: "HOT_PAGE_READY" }, "*");
+      }
+    },
+    onParentMessage(event) {
+      if (!event.data || event.data.type !== "PLAY_BACKGROUND_AUDIO") return;
+      this.tryStartAudio();
+    },
+    toggleAudio() {
+      if (!this.audioSta) {
+        this.needMutedAutoplay = false;
+        const dom = this.getAudioDom();
+        if (dom) dom.muted = false;
+        this.showAudioUnlockTip = false;
+      }
+      this.audioSta = !this.audioSta;
+    },
+
     // 本地化 url 适配
     urlToFitFu(url) {
       return url;
@@ -189,12 +319,13 @@ export default {
         // let url = `/data/${
         //本地化部署
         this.id
-      }/hot/js/data.js?time=${Math.random()}`;
+        }/hot/js/data.js?time=${Math.random()}`;
       let result = (await this.$http.get(url)).data;
       const resData = result[this.m];
       // console.log("----", resData);
       if (resData) {
         this.audio = resData.backgroundMusic;
+        console.log(this.audio);
         // 只有单独的音频上传
         if (resData.backgroundMusic && !resData.model && !resData.video && !resData.images) {
           this.isOneAduio = true;
@@ -228,11 +359,15 @@ export default {
         this.imgTxt = resData.imagesDesc || [];
 
         // 只有 标题和 文字介绍（没有视频，没有模型，没有图片）
-        if (!obj.model && !obj.video && !obj.img && !resData.backgroundMusic) {
+        if (!obj.model && !obj.video && !obj.img) {
           this.oneTxt = true;
         }
 
         this.$nextTick(() => {
+          if (this.audio) {
+            this.tryStartAudio();
+          }
+          this.notifyParentLoaded();
           const _this = this;
           this.swiper = new Swiper(".contenBoxMain", {
             on: {
@@ -249,16 +384,43 @@ export default {
     },
   },
   mounted() {
+    window.addEventListener("message", this.onParentMessage);
     this.getData();
   },
+  beforeDestroy() {
+    window.removeEventListener("message", this.onParentMessage);
+    this.removeAudioUnlock();
+  },
 };
 </script>
 
 <style lang="less" scoped>
 .home {
-  background-color: rgba(rgba(248, 242, 232, 0.8));
-  background-size: 100% 100%;
+  width: 100%;
+  height: 100%;
   color: #9d0800;
+  background-image: url(../assets/images/pc/hot_bg.png);
+  background-size: 100% 100%; 
+  background-repeat: no-repeat;
+  position: relative;
+}
+
+.audioUnlockTip {
+  position: fixed;
+  inset: 0;
+  z-index: 999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(0, 0, 0, 0.35);
+  color: #fff;
+  font-size: 16px;
+  letter-spacing: 1px;
+}
+
+.home {
+
+
   .swiper-pagination {
     margin: 10px 0 0;
     position: relative;
@@ -280,45 +442,54 @@ export default {
       }
     }
   }
+
   .viewerCla img {
     display: none;
   }
+
   height: 100%;
   position: relative;
+
   #myAudio {
     z-index: 11;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
-    width: 500px;
-    height: 60px;
+    width: 0;
+    height: 0;
   }
+
   .main {
     width: 100%;
     margin: 0 auto;
     height: 100%;
-    padding: 30px 0 20px 0;
+    padding: 35px 0 45px 0;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
+
     .myTitle {
       font-size: 22px;
       font-weight: 700;
       margin-bottom: 20px;
     }
+
     .logo {
       position: fixed;
       top: 30px;
       left: 30px;
     }
+
     .mainCon {
       position: relative;
       border-radius: 6px;
       overflow: hidden;
       width: 100%;
-      height: calc(100% - 320px);
+      height: fit-content;
+      max-height: 70%;
+
       .oneTabNum {
         z-index: 10;
         position: absolute;
@@ -330,36 +501,42 @@ export default {
 
       .contenBoxMain {
         position: relative;
-        width: 100%;
+        width: 101%;
         height: 100%;
       }
+      
       .contenBox {
+
         .modelBox,
         .videoBox,
         .imgBox {
           width: 100%;
           height: 100%;
         }
+
         .modelBox {
           iframe {
             width: 100%;
             height: 100%;
           }
         }
+
         .videoBox {
-          padding: 0px 350px;
+
           video {
             width: 100%;
             height: 100%;
           }
         }
+
         .imgBox {
-          padding: 0px 350px;
+padding: 0 20px;
           .smImgBox {
             width: 100%;
             height: 100%;
+
             // cursor: zoom-in;
-            & > img {
+            &>img {
               width: 100%;
               height: 100%;
               object-fit: contain;
@@ -367,36 +544,54 @@ export default {
           }
         }
       }
+
       .awccJJ {
         cursor: pointer;
         position: absolute;
         top: 50%;
         transform: translateY(-50%);
-        left: 16%;
-        width: 40px;
-        height: 40px;
+        left: 2px;
+        width: 30px;
+        height: 50px;
         background-image: url("../assets/images/pc/left.png");
-        background-size: 100% 100%;
+        background-size: contain;
+        background-repeat: no-repeat;
         z-index: 1;
+
         &:focus {
           outline: none;
         }
       }
+
       .rightJJ {
         left: auto;
-        right: 16%;
+        right: 0;
         background-image: url("../assets/images/pc/right.png");
       }
+
       .noClick {
         cursor: default;
         opacity: 0.4;
       }
     }
+
+    .musicIcon {
+        position: absolute;
+        bottom: 20px;
+        right: 20px;
+        width: 30px;
+        height: 30px;
+        z-index: 10;
+        cursor: pointer;
+      }
+
     .flooTxt {
       margin: 0 auto;
       margin-top: 10px;
-      width: 70%;
-      max-height: 120px;
+      width: 90%;
+      height: 0;
+      flex: 1;
+
       .flooTxtBox {
         width: 100%;
         height: 100%;
@@ -408,18 +603,21 @@ export default {
           color: #333333;
           line-height: 24px;
         }
+
         &::-webkit-scrollbar {
           /*滚动条整体样式*/
           width: 3px;
           /*高宽分别对应横竖滚动条的尺寸*/
           height: 1px;
         }
+
         &::-webkit-scrollbar-thumb {
           /*滚动条里面小方块*/
           border-radius: 10px;
           -webkit-box-shadow: inset 0 0 5px transparent;
           background: rgb(192, 166, 126);
         }
+
         &::-webkit-scrollbar-track {
           /*滚动条里面轨道*/
           -webkit-box-shadow: inset 0 0 5px transparent;
@@ -428,6 +626,7 @@ export default {
         }
       }
     }
+
     .flooTxtOne {
       height: 600px;
     }
@@ -440,6 +639,7 @@ export default {
     bottom: 20px;
     right: 20px;
     display: flex;
+
     .tabRow {
       width: 60px;
       cursor: pointer;
@@ -450,16 +650,19 @@ export default {
       // background-color: #dedede;
       color: black;
       border-radius: 18px;
-      & > img {
+
+      &>img {
         width: 40px;
         display: inline-block;
         margin-bottom: 3px;
       }
-      & > div {
+
+      &>div {
         min-width: 40px;
         text-align: center;
       }
     }
+
     .tabRowAc {
       // background-color: #c8aa7d;
       pointer-events: none;
@@ -467,116 +670,23 @@ export default {
     }
   }
 }
-// 移动端
-@media screen and (max-width: 1000px) {
+
+
+
+
+
+@media screen and (max-width: 700px) {
   .home {
-    background-color: rgba(rgba(248, 242, 232, 0.9));
-    .swiper-pagination {
-      margin: 10px 0 0;
-      gap: 4px;
-
-      ::v-deep .swiper-pagination-bullet {
-        width: 15px;
-        height: 3px;
-      }
-    }
-    #myAudio {
-      width: 90vw;
-      max-width: 500px;
-    }
     .main {
-      width: 100%;
-      height: 100%;
-      padding: 0;
-      position: absolute;
-      justify-content: end;
-      .myTitle {
-        font-size: 16px;
-      }
       .logo {
-        display: none;
-      }
-      .mainCon {
-        border-radius: 0;
-        height: calc(100% - 195px);
-        margin: 92px 0 20px;
-        .contenBox {
-          .videoBox {
-            padding: 0 30px;
-            position: relative;
-            video {
-              width: calc(100% - 60px);
-              max-height: 100%;
-              height: auto;
-              position: absolute;
-              top: 50%;
-              left: 50%;
-              transform: translate(-50%, -50%);
-            }
-          }
-          .imgBox {
-            // padding: 60px 50px 80px;
-            padding: 0 15px;
-            .smImgBox {
-              cursor: default;
-            }
-          }
-        }
-        .awccJJ {
-          left: 0;
-          width: 28px;
-          height: 57px;
-          cursor: default;
-          background-image: url("../assets/images/pc/icon-left.png");
-        }
-        .rightJJ {
-          left: auto;
-          right: 0;
-          background-image: url("../assets/images/pc/icon-right.png");
-        }
-      }
-      .flooTxt {
-        margin-top: -5px;
-        width: 100%;
-        padding: 10px 15px 0px 15px;
-        max-height: 200px;
-        padding-bottom: 20px;
-        background: url("../assets/images/textBg.png") no-repeat;
-        background-size: 100% 100%;
-        border-radius: 30px 30px 0 0;
-        .flooTxtBox {
-          padding: 0;
-          height: 92%;
-          margin-top: 20px;
-          .myTitle {
-            color: #e1bd83;
-          }
-          .myTxt {
-            color: #fff;
-            font-size: 14px;
-            line-height: 22px;
-          }
-        }
-      }
-      .flooTxtOne {
-        height: 100%;
-      }
-    }
-    .flooTabBox {
-      width: 100%;
-      bottom: 220px;
-      right: 0;
-      justify-content: center;
-      .tabRow {
-        cursor: default;
-        // margin: 0 6px;
-        // padding: 0 10px;
-        height: 32px;
-        & > img {
-          width: 30px;
+        height: 100px;
+        &>img{
+          height: 100%;
+          object-fit: contain;
         }
       }
     }
   }
 }
+
 </style>

scene/public/css/oldVer/main0.css

@@ -58,14 +58,18 @@ iframe {
 
 #popup {
   position: absolute;
-  top: 0;
-  left: 0;
+  top: 50%;
+  left: 50%;
   right: 0;
+  transform: translate(-50%, -50%);
   bottom: 0;
-  background: rgba(0, 0, 0, 0.6);
+  background: rgba(0, 0, 0, 0.3);
   /* margin: 80px auto; */
   display: none;
   z-index: 999999;
+  width: 100%;
+  height: 100%;
+  backdrop-filter: blur(10px) !important;
 }
 .popup-wrap {
   display: flex;
@@ -75,11 +79,12 @@ iframe {
   gap: 30px;
   width: 100%;
   height: 100%;
+  backdrop-filter: blur(10px) !important;
 }
 .popup-content {
   position: relative;
-  width: 100%;
-  height: 100%;
+  width: 46%;
+  height: 70%;
   overflow: hidden;
 }
 #id1 {
@@ -91,8 +96,9 @@ iframe {
 }
 #closepop {
   position: fixed;
-  top: 40px;
-  right: 30px;
+  top: 30%;
+  right: 28%;
+  transform: translate(-54%, -50%);
   background: url(../../images/close1.png) no-repeat;
   width: 40px;
   height: 40px;
@@ -196,6 +202,8 @@ a {
 
 @media screen and (max-width: 1200px) {
   #closepop {
+    top: 10%;
+    right: 3%;
     width: 45px;
     height: 45px;
   }
@@ -206,8 +214,8 @@ a {
 }
 @media screen and (max-width: 1000px) {
   .popup-content {
-    width: 100%;
-    height: 100%;
+    width: 100% !important;
+    height: 100% !important;
   }
 }
 @media screen and (max-width: 768px) {

scene/public/js/Hot.js

@@ -1071,10 +1071,11 @@ window.initHot = function (model) {
         //瞬间过渡 1到固定方位 2到和普通过渡一样的位置，也就是最适合的位置
         let info = this.info.cameraData
         if (info) {
-          player.blackToPano({
-            pano: player.model.panos.index[info.pano.uuid],
-            quaternion: new THREE.Quaternion().fromArray(info.camera.quaternion)
-          })
+            player.blackToPano({
+                pano: player.model.panos.index[info.pano.uuid],
+                quaternion: new THREE.Quaternion().fromArray(info.camera.quaternion),
+                zoom: info.camera.zoom
+            }) 
         }
       }
 
@@ -1117,8 +1118,14 @@ window.initHot = function (model) {
           myElement.style.position = 'absolute'
           myElement.style.width = myElement.style.height = '100%'
           myElement.style.left = myElement.style.top = '0'
+          myElement.setAttribute('allow', 'autoplay')
 
           myElement.src = src
+          myElement.onload = function () {
+            try {
+              myElement.contentWindow.postMessage({ type: 'PLAY_BACKGROUND_AUDIO' }, '*')
+            } catch (err) {}
+          }
 
           $('body').append(div)
           div.appendChild(exit)
@@ -1143,6 +1150,12 @@ window.initHot = function (model) {
         var src = getLink(this.info.link)
         n.src = src
         ;(n.id = 'id1'), (n.allowTransparency = 'true')
+        n.setAttribute('allow', 'autoplay')
+        n.onload = function () {
+          try {
+            n.contentWindow.postMessage({ type: 'PLAY_BACKGROUND_AUDIO' }, '*')
+          } catch (err) {}
+        }
         var a = document.getElementById('id1')
         if (void 0 === a || null == a) {
           document.querySelector('.popup-content').appendChild(n)

scene/public/js/main_2020_show.js

@@ -22046,7 +22046,7 @@ window.Modernizr = (function (n, e, t) {
                 )
               }
             })()),
-            (n.prototype.switchCameraMode = function (e, t) {
+            (n.prototype.switchCameraMode = function (e, t, {zoomLevel}) {
               var i = this.cameraControls.controls[e],
                 n = i.camera
               switch (e) {
@@ -22054,6 +22054,10 @@ window.Modernizr = (function (n, e, t) {
                   n.position.copy(this.currentPano.position)
                   var o = t ? d.FORWARD.clone().applyQuaternion(t) : this.getDirection().setY(0).normalize()
                   i.lookAt(o.add(n.position))
+                  if(zoomLevel != void 0 && zoomLevel != this.zoomLevel){
+                        this.zoomTo(zoomLevel, false, n)
+                    }
+                  
                   break
                 case u.DOLLHOUSE:
                   /* var a = this.position.clone();
@@ -22825,7 +22829,8 @@ window.Modernizr = (function (n, e, t) {
                 mode: u.PANORAMA,
                 pano,
                 duration: o.duration,
-                quaternion: o.quaternion
+                quaternion: o.quaternion,
+                zoomLevel: o.zoom,
                 //callback: t
               })
             }
@@ -22850,8 +22855,11 @@ window.Modernizr = (function (n, e, t) {
               position: pano.position,
               quaternion: o.quaternion || this.quaternion.clone()
             }
-
-            this.path.warpTravel_BLACK(null, 1500, 1, () => {
+            let dur = 1500
+            if(o.zoom && o.zoom != this.zoomLevel){
+                this.smoothZoomFovTo(null, o.zoom, dur)
+            }
+            this.path.warpTravel_BLACK(null, dur, 1, () => {
               pano != this.currentPano && this.currentPano.exit()
               pano.enter()
               this.currentPano = pano
@@ -23295,6 +23303,9 @@ window.Modernizr = (function (n, e, t) {
                 s = e.callback,
                 l = e.force,
                 c = e.quaternion
+                , zoomLevel = e.zoomLevel;
+                
+                
               if (((t = t || $.Deferred()), this.isWarping()))
                 return F.warn('Player.flyToNewMode() -> Cannot fly when warping'), s && s(!1), t.reject('Cannot change mode during tour transition').promise()
               if (this.mode === u.TRANSITIONING) return s && s(!1), t.reject('Cannot change mode during mode transition').promise()
@@ -23330,7 +23341,7 @@ window.Modernizr = (function (n, e, t) {
                 C = this.cameraControls.cameras[i]
               e = g.deepExtend({}, f[i], f[p + '-' + i])
               var I = void 0 !== o ? o : e.transitionTime
-              this.emit(w.ModeChanging, p, i, n, I), n && (this.currentPano = n), this.switchCameraMode(i, c), y.cancelById(V.LookTransition)
+              this.emit(w.ModeChanging, p, i, n, I), n && (this.currentPano = n), this.switchCameraMode(i, c, {zoomLevel }), y.cancelById(V.LookTransition)
 
               //before fly---------------------
 
@@ -23759,19 +23770,23 @@ window.Modernizr = (function (n, e, t) {
             (n.prototype.zoomOut = function () {
               this.zoomBy(1 - this.zoomSpeed)
             }),
-            (n.prototype.zoomTo = function (e, t) {
-              if (t || (f.zoom.enabled && this.mode === u.PANORAMA && this.zoomEnabled)) {
-                if (
-                  (e < f.zoom.min && (e = f.zoom.min),
-                  e > f.zoom.max && (e = f.zoom.max),
-                  e > this.zoomLevel ? (this.emit(O.ZoomIn), e === f.zoom.max && this.emit(O.ZoomMax)) : e < this.zoomLevel && (this.emit(O.ZoomOut), e === f.zoom.min && this.emit(O.ZoomMin)),
-                  this.cameraControls.activeControl)
-                ) {
-                  var i = this.cameraControls.activeControl.camera
-                  ;(this.zoomLevel = e), (i.fov = this.baseFov * (1 / this.zoomLevel)), i.updateProjectionMatrix(), (this.zoomFov = i.fov)
+            n.prototype.zoomTo = function(e, t, camera) {//xzw add camera
+                if (t || f.zoom.enabled && this.mode === u.PANORAMA && this.zoomEnabled || camera) {
+                    if (e < f.zoom.min && (e = f.zoom.min),
+                    e > f.zoom.max && (e = f.zoom.max),
+                    e > this.zoomLevel ? (this.emit(O.ZoomIn),
+                    e === f.zoom.max && this.emit(O.ZoomMax)) : e < this.zoomLevel && (this.emit(O.ZoomOut),
+                    e === f.zoom.min && this.emit(O.ZoomMin)),
+                    this.cameraControls.activeControl || camera) {
+                        var i = camera || this.cameraControls.activeControl.camera;
+                        this.zoomLevel = e,
+                        i.fov = this.baseFov * (1 / this.zoomLevel),
+                        i.updateProjectionMatrix(),
+                        this.zoomFov = i.fov
+                    }
                 }
-              }
-            }),
+            }
+            ,
             (n.prototype.increaseZoomSpeed = function () {
               this.zoomSpeed = this.clampZoomSpeed(this.zoomSpeed + this.zoomSpeedAdjust)
             }),

scene/src/pages/A1home/index.module.scss

@@ -12,5 +12,29 @@
       padding: 3px 10px 3px 10px;
       font-size: 100%;
     }
+    .popup-wrap{
+      width: 100%;
+      height: 100%;
+
+    }
+    .logo{
+      position: fixed;
+      top: 30px;
+      left: 30px;
+    }
+    .popup-content{
+      padding: 30px;
+      width: 48%;
+    height: 75%;
+    box-sizing: 3px 3px 3px 3px rgba(71, 71, 71, 0.40);
+    }
+    #closepop{
+      position: absolute;
+      top: 15px;
+      right: 15px;
+      width: 40px;
+      height: 40px;
+      transform: none;
+    }
   }
 }

scene/src/pages/A1home/index.tsx

@@ -24,8 +24,11 @@ function A1home() {
       <div className='widgets-doll-labels'> </div>
       <div id='popup'>
         <div className='popup-wrap'>
-          <div className='popup-content'></div>
+          <div className="logo"><img src={require('@/assets/img/logo.png')} alt='' /></div>
+          <div className='popup-content'>
           <div id='closepop'>close</div>
+          </div>
+          
         </div>
       </div>
 

scene/src/pages/A2main/index.module.scss

@@ -49,6 +49,7 @@
       #next,
       #pullTab,
       .A2hotIcon,
+      .A2_share_box,
       #gui-modes-inside,
       #gui-modes-dollhouse,
       #gui-modes-floorplan {
@@ -273,6 +274,7 @@
         #pullTab,
         .A2hotIcon,
         #gui-modes-inside,
+        .A2_share_box,
         #gui-modes-dollhouse,
         #gui-modes-floorplan {
           margin: 0;

scene/src/pages/A2main/index.tsx

@@ -10,6 +10,7 @@ import classNames from 'classnames'
 import A3hotList from '../A3hotList'
 import { message } from 'antd'
 import http from '@/utils/http'
+import { isMobileFu } from '@/utils/history'
 const imgArrTemp = ['like.png', 'likeAc.png']
 const imgArr = imgArrTemp.map(item => require(`@/assets/img/${item}`))
 
@@ -44,13 +45,14 @@ function A2main() {
     return copyTXT
   }
   const handleShareClick = () => {
-    if (navigator.clipboard && typeof navigator.clipboard.writeText === 'function') {
-      navigator.clipboard.writeText(window.location.href)
+    // if (navigator.clipboard && typeof navigator.clipboard.writeText === 'function') {
+    //   navigator.clipboard.writeText(window.location.href)
+    //   message.success('链接已复制到剪贴板')
+    // } else {
+      copyWithTextarea(window.parent?.window.location.href)
+      console.log(window.parent?.window.location.href, '-------------------------')
       message.success('链接已复制到剪贴板')
-    } else {
-      copyWithTextarea(window.location.href)
-      message.success('链接已复制到剪贴板')
-    }
+    // }
   }
 
   const hiddenMap = (isShow: boolean) => {
@@ -218,6 +220,7 @@ function A2main() {
                   window.player.director.stopTour()
                   setHotListShow(true)
                   hiddenMap(true)
+                  if(isMobileFu()) window?.parent?.setShowBack(false)
                 }}
               >
                 <img src={`images/hotlist${hotListShow ? '_active' : ''}.png`} alt='' />
@@ -240,6 +243,10 @@ function A2main() {
                 {/* 鼠标移入 */}
                 <div className='hoveImg'>顶部视图</div>
               </div>
+              <div className='A2_share_box' rel='tooltip' onClick={handleShareClick}>
+              <img src={require('@/assets/img/share.png')} alt='' />
+              <div className='hoveImg'>分享</div>
+            </div>
               {/* <div
                 data-original-title='VR'
                 id='vr'
@@ -279,6 +286,8 @@ function A2main() {
               <div className='hoveImg'>音乐开关</div>
             </div>
 
+            
+
             <div id='back' onClick={() => {
               window.TourRotTime = 0.5
               window.stepAcc = 0.6
@@ -348,6 +357,7 @@ function A2main() {
         closeFu={() => {
           setHotListShow(false)
           hiddenMap(false)
+          if(isMobileFu()) window?.parent?.setShowBack(true)
         }}
       />
     </div>

scene/src/types/function.d.ts

@@ -4,6 +4,7 @@ declare global {
     setBeisuShow: (b: boolean) => void
     TourRotTime: number
     stepAcc: number
+    setShowBack: (b: boolean) => void
   }
 }