1.6.0-dev

packages/qjkankan-editor/public/static/template/skin/vtourskin.xml

@@ -1385,5 +1385,12 @@
         <!-- set(global_heading, 180); -->
           calc(plugin[compass1_pointer].rotate, view.hlookat - global_heading);		
     </action>
+    
+	<!-- 底部logo -->
+	<hotspot name="nadirlogo" renderer="css3d"  visible="false" keep="true" url="masking.png" ath="0" atv="90"  width="50%" handcursor="false" zoom="true" height="prop" distorted="true" scale="0.5" rotate="0.0" />
+
+	<!-- 顶部logo -->
+	<hotspot name="peaklogo"  renderer="css3d" visible="true" keep="true" url="https://ossxiaoan.4dage.com/720yun_fd_manage/fodder/20230731_161623348.gif" ath="0" atv="-90" width="50%" height="prop" handcursor="false" zoom="true" distorted="true" scale="0.5" rotate="0.0" />
+
 
 </krpano>

packages/qjkankan-editor/src/config/menu.js

@@ -46,6 +46,15 @@ const PCMenu = [
     hasPreviewArea: true,
     previewAreaExtraLeft: 0,
     hidden: false
+  },
+  {
+    text: i18n.t("edit_page.cover"),
+    icon: "explanation",
+    link: "/cover",
+    name: "cover",
+    hasPreviewArea: true,
+    previewAreaExtraLeft: 0,
+    hidden: false
   }
 ];
 

packages/qjkankan-editor/src/framework/core/index.vue

@@ -105,10 +105,13 @@ export default {
           try {
             let tmp = newVal.initVisual;
             var krpano = document.getElementById("krpanoSWFObject");
-            krpano.set("view.vlookat", tmp.vlookat);
-            krpano.set("view.hlookat", tmp.hlookat);
+            krpano.set("view.vlookat", tmp ? tmp.vlookat : "");
+            krpano.set("view.hlookat", tmp ? tmp.hlookat : "");
+            krpano.set("view.limitview", "lookat");
+            krpano.set("view.vlookatmin", tmp ? tmp.vlookatmin : "-90");
+            krpano.set("view.vlookatmax", tmp ? tmp.vlookatmax : "90");
           } catch (error) {
-            error;
+            console.error(error);
           }
         };
 
@@ -119,7 +122,7 @@ export default {
         if (newVal) {
           removepano("#pano");
           $waiting.show();
-  
+          // debugger;
           embedpano({
             // http://ossxiaoan.4dage.com/720yun_fd_manage/fd720_Va0LrkXW3/vtour/tour.xml
             // xml: "%HTMLPATH%/static/template/tour.xml",
@@ -151,7 +154,6 @@ export default {
     this.$bus.on("addhotspot", (data) => {
       this.addhotspot(data);
     });
-   
   },
 };
 </script>

packages/qjkankan-editor/src/framework/play/pano/components/list.vue

@@ -291,7 +291,7 @@ export default {
     },
     initMainSwiper() {
       this.$nextTick(() => {
-        console.warn("initMainSwiper");
+        // console.warn("initMainSwiper");
         if (window.mainNatSwiper) {
           window.mainNatSwiper = null;
         }
@@ -303,10 +303,10 @@ export default {
     },
     mainNatSwiperFocus() {
       this.$nextTick(() => {
-        console.warn(
-          "catalogRoot-mainNatSwiperFocus",
-          this.metadata.catalogRoot
-        );
+        // console.warn(
+        //   "catalogRoot-mainNatSwiperFocus",
+        //   this.metadata.catalogRoot
+        // );
         const current = Array.from(this.metadata.catalogRoot).findIndex(
           (item) => item.id === this.currentCatalogRoot.id
         );

packages/qjkankan-editor/src/framework/play/pano/index.vue

@@ -131,10 +131,13 @@ export default {
         window.vrViewFn = () => {
           try {
             let tmp = newVal.initVisual;
-            this.$getKrpano().set("view.vlookat", tmp.vlookat);
-            this.$getKrpano().set("view.hlookat", tmp.hlookat);
+            this.$getKrpano().set("view.vlookat", tmp ? tmp.vlookat : "");
+            this.$getKrpano().set("view.hlookat", tmp ? tmp.hlookat : "");
+            this.$getKrpano().set("view.limitview", "lookat");
+            this.$getKrpano().set("view.vlookatmin", tmp ? String(tmp.vlookatmin) : "-90");
+            this.$getKrpano().set("view.vlookatmax", tmp ? String(tmp.vlookatmax) : "90");
           } catch (error) {
-            error;
+            console.error(error);
           }
         };
 
@@ -142,10 +145,11 @@ export default {
           "events[skin_events].onxmlcomplete": "js(window.vrViewFn());",
           "events[skin_events].onloadcomplete": "js(window.vrInitFn());",
         };
-
         if (newVal) {
           removepano("#pano");
           $waiting.show();
+
+          console.log("embedpano", settings);
           embedpano({
             // http://oss-xiaoan.oss-cn-shenzhen.aliyuncs.com/720yun_fd_manage/fd720_Va0LrkXW3/vtour/tour.xml
             // xml: "%HTMLPATH%/static/template/tour.xml",
@@ -160,28 +164,6 @@ export default {
           });
         }
       }
-
-      // var settings = {
-      //   "events[skin_events].onxmlcomplete": "js(window.vrViewFn());",
-      //   "events[skin_events].onloadcomplete": "js(window.vrInitFn());",
-      // };
-
-      // if (newVal) {
-      //   removepano("#pano");
-      //   $waiting.show();
-      //   embedpano({
-      //     // http://ossxiaoan.4dage.com/720yun_fd_manage/fd720_Va0LrkXW3/vtour/tour.xml
-      //     // xml: "%HTMLPATH%/static/template/tour.xml",
-      //     xml: `${this.$cdn}/720yun_fd_manage/${newVal.sceneCode}/vtour/tour.xml`,
-      //     swf: "%HTMLPATH%/static/template/tour.swf",
-      //     target: "pano",
-      //     html5: "auto",
-      //     mobilescale: 1,
-      //     vars: settings,
-      //     webglsettings: { preserveDrawingBuffer: true },
-      //     passQueryParameters: true,
-      //   });
-      // }
     },
     isConfirmingPosi(newVal) {
       this.inter && clearInterval(this.inter);

packages/qjkankan-editor/src/lang/_en.json

@@ -662,6 +662,7 @@
     "viewpoint": "Starting Screen",
     "hotspot": "Hotspots",
     "explanation": "Voice Guide",
+    "cover": "遮罩",
     "save": "Save"
   },
   "edit_settings": {

packages/qjkankan-editor/src/lang/_zh.json

@@ -662,6 +662,7 @@
     "viewpoint": "视角",
     "hotspot": "热点",
     "explanation": "讲解",
+    "cover": "遮罩",
     "save": "保存"
   },
   "edit_settings": {

packages/qjkankan-editor/src/views/cover/index.vue

@@ -0,0 +1,24 @@
+<template>
+  <!-- 编辑器-初始 -->
+  <div class="cover-screen"></div>
+</template>
+<script>
+export default {
+  name: "cover-setting",
+  components: {},
+};
+</script>
+
+<style lang="less" scoped>
+.cover-screen {
+  height: 100%;
+  position: relative;
+  .panel {
+    position: absolute;
+    top: 0;
+    height: 100%;
+    right: 0;
+    width: 274px;
+  }
+}
+</style>

packages/qjkankan-editor/src/views/screen/Setting.vue

@@ -1,56 +1,130 @@
 <template>
   <div class="view-setting" app-border dir-left>
     <div class="title">
-      {{$i18n.t('screen.init_screen')}}
-      <i class="iconfont icon-help_i tool-tip-for-editor" v-tooltip="$i18n.t('screen.screen_tips')"/>
+      {{ $i18n.t("screen.init_screen") }}
+      <i
+        class="iconfont icon-help_i tool-tip-for-editor"
+        v-tooltip="$i18n.t('screen.screen_tips')"
+      />
     </div>
     <template v-if="currentScene.type !== '4dkk'">
-      <img class="preview" v-if="initImg" :src="`${initImg}?${Math.random()}`" alt="">
-      <img class="placeholder" v-else src="@/assets/images/pano-image-placeholder.png" alt="">
+      <img
+        class="preview"
+        v-if="initImg"
+        :src="`${initImg}?${Math.random()}`"
+        alt=""
+      />
+      <img
+        class="placeholder"
+        v-else
+        src="@/assets/images/pano-image-placeholder.png"
+        alt=""
+      />
+      <div class="item">
+        <div class="">垂直视角限制</div>
+        <slider v-model="vlookat" range show-stops :min="-90" :max="90">
+        </slider>
+      </div>
+
+      <div class="col">
+        <span>应用到全部全景图</span>
+        <Switcher :value="applyToAll" @change="onSwitcherChange"></Switcher>
+      </div>
     </template>
 
     <div class="goto-4dkk-tip" v-if="currentScene.type === '4dkk'">
       <div class="img-wrap">
-        <img class="" src="@/assets/images/default/goto-4dage.png" alt="" draggable="false">
+        <img
+          class=""
+          src="@/assets/images/default/goto-4dage.png"
+          alt=""
+          draggable="false"
+        />
         <div class="tip-text">
-          {{$i18n.t('screen.goto_4dkk_edit_tips')}}
+          {{ $i18n.t("screen.goto_4dkk_edit_tips") }}
         </div>
       </div>
-      <button class="ui-button submit" @click="onClickGo4dkk">{{$i18n.t('navigation.go_scene_editor')}}</button>
+      <button class="ui-button submit" @click="onClickGo4dkk">
+        {{ $i18n.t("navigation.go_scene_editor") }}
+      </button>
     </div>
-
   </div>
 </template>
 <script>
 import { mapGetters } from "vuex";
-
+import { Slider } from "element-ui";
+import Switcher from "@/components/shared/Switcher";
 export default {
+  components: {
+    Slider,
+    Switcher,
+  },
   computed: {
     ...mapGetters({
       currentScene: "scene/currentScene",
-    })
+    }),
   },
-  data(){
+  data() {
     return {
-      initImg:''
-    }
+      initImg: "",
+      vlookat: null,
+      applyToAll: false,
+    };
   },
-  methods:{
+  watch: {
+    "currentScene.initVisual": {
+      handler(val) {
+        const { vlookatmin, vlookatmax } = val;
+        if (vlookatmin && vlookatmax) {
+          this.vlookat = [vlookatmin, vlookatmax];
+        }
+      },
+      deep: true,
+      immediate: true,
+    },
+    vlookat: {
+      handler: function (val) {
+        this.handleVlootAt(val);
+      },
+    },
+  },
+  methods: {
     onClickGo4dkk() {
-      window.open('/#/scene')
-    }
+      window.open("/#/scene");
+    },
+    onSwitcherChange(value) {
+      this.applyToAll = value;
+    },
+    handleVlootAt(val) {
+      if (val) {
+        const min = Math.min(...val);
+        const max = Math.max(...val);
+        this.currentScene.initVisual.vlookatmin = min;
+        this.currentScene.initVisual.vlookatmax = max;
+        this.handleKrAction(min, max);
+      }
+    },
+    handleKrAction(min, max) {
+      const kr = this.$getKrpano();
+      if (kr) {
+        kr.set("view.limitview", "lookat");
+        const mid = min + max;
+        kr.set("view.vlookat", mid);
+        kr.set("view.vlookatmin", String(min));
+        kr.set("view.vlookatmax", String(max));
+      }
+    },
   },
-  mounted(){
-    this.$bus.on('initView', data => {
-      this.initImg = data
-    })
+  mounted() {
+    this.$bus.on("initView", (data) => {
+      this.initImg = data;
+    });
 
     if (!this.initImg) {
-      this.initImg = this.currentScene.icon
+      this.initImg = this.currentScene.icon;
     }
-    
-  }
-}
+  },
+};
 </script>
 
 <style lang="less" scoped>
@@ -79,6 +153,18 @@ export default {
     height: 132px;
     margin-bottom: 16px;
   }
+  .item {
+    .el-slider {
+      padding: 0 5px;
+    }
+  }
+  .col {
+    width: 100%;
+    margin: 15px 0;
+    display: inline-flex;
+    justify-content: space-between;
+    align-items: center;
+  }
 
   .goto-4dkk-tip {
     > .img-wrap {
@@ -104,4 +190,4 @@ export default {
     }
   }
 }
-</style>
+</style>

packages/qjkankan-view/public/showviewer/lib/krpano/skin/vtourskin.xml

@@ -1271,8 +1271,7 @@
      <include url="%SWFPATH%/tooltip.xml" />
 
 	<!-- 底部logo -->
-	<hotspot name="nadirlogo" renderer="css3d"  visible="false" keep="true" url="masking.png" ath="0" atv="90" handcursor="false" zoom="true" width="26%" height="prop" distorted="true" scale="0.5" rotate="0.0" />
-
+	<hotspot name="nadirlogo" renderer="css3d"  visible="false" keep="true" url="masking.png" ath="0" atv="90" width="26%" handcursor="false" zoom="true" height="prop" distorted="true" scale="0.5" rotate="0.0" />
 
 	<!-- 顶部logo -->
 	<hotspot name="peaklogo" renderer="css3d"	visible="false" keep="true" url="masking.png" ath="0" atv="-90" width="26%" height="prop" handcursor="false" zoom="true" distorted="true" scale="0.5" rotate="0.0" />