Home Explore Help
Register Sign In
chenzhiguang
/
zhengzhou_university
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

0707

chenzhiguang 4 years ago
parent
9dcfeaf6ce
commit
de20ed1984
11 changed files with 107 additions and 57 deletions
Unified View Show Diff Stats
  1. 1 0
      hotspot/package.json
  2. 1 1
      hotspot/public/index.html
  3. 4 0
      hotspot/src/main.js
  4. 93 51
      hotspot/src/views/Home.vue
  5. BIN
      web/public/static/audio/6.mp3
  6. 1 1
      web/public/static/js/main_2020_show.js
  7. 2 2
      web/public/static/js/myShow.js
  8. 1 1
      web/public/static/js/overlay.js
  9. BIN
      web/src/assets/images/video1.jpg
  10. BIN
      web/src/assets/video/video.webm
  11. 4 1
      web/src/components/longvideo/index.vue

+ 1 - 0
hotspot/package.json
View File 

@@ -12,6 +12,7 @@
 
     "core-js": "^3.6.5",
 
     "core-js": "^3.6.5",
 
     "swiper": "^5.4.5",
 
     "swiper": "^5.4.5",
 
     "v-viewer": "^1.5.1",
 
     "v-viewer": "^1.5.1",
 
+    "video.js": "^7.13.3",
 
     "vue": "^2.6.11",
 
     "vue": "^2.6.11",
 
     "vue-awesome-swiper": "^4.1.1",
 
     "vue-awesome-swiper": "^4.1.1",
 
     "vue-router": "^3.2.0"
 
     "vue-router": "^3.2.0"

+ 1 - 1
hotspot/public/index.html
View File 

@@ -4,7 +4,7 @@
 
     <meta charset="utf-8">
 
     <meta charset="utf-8">
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
-    <title><%= htmlWebpackPlugin.options.title %></title>
 
+    <title>信息工程大学</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
     <noscript>
 
     <noscript>

+ 4 - 0
hotspot/src/main.js
View File 

@@ -4,6 +4,10 @@ import router from './router'
 
 import axios from 'axios'
 
 import axios from 'axios'
 
 import 'viewerjs/dist/viewer.css'
 
 import 'viewerjs/dist/viewer.css'
 
 import Viewer from 'v-viewer'
 
 import Viewer from 'v-viewer'
 
+
 
+import Videojs from 'video.js'
 
+import 'video.js/dist/video-js.css'
 
+Vue.prototype.$video = Videojs
 
  
  
 
 
 Vue.config.productionTip = false
 
 Vue.config.productionTip = false

+ 93 - 51
hotspot/src/views/Home.vue
View File 

@@ -36,10 +36,17 @@
 
         </li>
 
         </li>
 
       </ul>
 
       </ul>
 
       <div class="title" v-html="data.title"></div>
 
       <div class="title" v-html="data.title"></div>
 
-      <div @click="slideto('slidePrev')" v-if="data[active].length>1" class="swiper-button-prev"></div>
 
+      <div
 
+        @click="slideto('slidePrev')"
 
+        v-if="data[active].length > 1"
 
+        class="swiper-button-prev"
 
+      ></div>
 
       <swiper class="warpper" ref="mySwiper" :options="swiperOptions">
 
       <swiper class="warpper" ref="mySwiper" :options="swiperOptions">
 
         <swiper-slide v-for="(item, i) in data[active]" :key="i">
 
         <swiper-slide v-for="(item, i) in data[active]" :key="i">
 
           <div class="slide">
 
           <div class="slide">
 
+          <div class="tips" v-if="active === 'video'">
 
+            如遇视频抖动，请点击“新窗口打开”观看。<span class="btn" @click="openVideo(item.url)">新窗口打开</span>
 
+          </div>
 
             <img
 
             <img
 
               style="cursor: pointer"
 
               style="cursor: pointer"
 
               v-viewer
 
               v-viewer
 
@@ -49,21 +56,32 @@
 
             />
 
             />
 
             <video
 
             <video
 
               v-else-if="active === 'video'"
 
               v-else-if="active === 'video'"
 
-              :src="fixUrl(item.url)"
 
               controls
 
               controls
 
               autoplay
 
               autoplay
 
-            ></video>
 
-            <iframe
 
-              v-else
 
-              :src="fixUrl(item)"
 
-              frameborder="0"
 
-            ></iframe>
 
+              :id="'video'+ (i + 1)"
 
+            >
 
+              <source :src="fixUrl(item.url)" type="video/mp4" />
 
+            </video>
 
+            <iframe v-else :src="fixUrl(item)" frameborder="0"></iframe>
 
           </div>
 
           </div>
 
         </swiper-slide>
 
         </swiper-slide>
 
-        <div class="swiper-pagination"  v-if="data[active].length>1" slot="pagination"></div>
 
+        <div
 
+          class="swiper-pagination"
 
+          v-if="data[active].length > 1"
 
+          slot="pagination"
 
+        ></div>
 
       </swiper>
 
       </swiper>
 
-      <div @click="slideto('slideNext')"  v-if="data[active].length>1" class="swiper-button-next"></div>
 
-      <p class="desc" ref="desc" :class="{'desc-duo':data.content&&data.content.length>60}" v-html="data.content"></p>
 
+      <div
 
+        @click="slideto('slideNext')"
 
+        v-if="data[active].length > 1"
 
+        class="swiper-button-next"
 
+      ></div>
 
+      <p
 
+        class="desc"
 
+        ref="desc"
 
+        :class="{ 'desc-duo': data.content && data.content.length > 60 }"
 
+        v-html="data.content"
 
+      ></p>
 
     </div>
 
     </div>
 
 
 
     <div class="content" v-if="fixIcon.length <= 0 && hadLoad">
 
     <div class="content" v-if="fixIcon.length <= 0 && hadLoad">
 
@@ -101,9 +119,9 @@ export default {
 
   data() {
 
   data() {
 
     return {
 
     return {
 
       // http://8.135.106.227:8009
 
       // http://8.135.106.227:8009
 
-      server:"",
 
+      server: "http://192.168.1.101",
 
       loadAuto: false,
 
       loadAuto: false,
 
-      hadLoad:false,
 
+      hadLoad: false,
 
       audio: "",
 
       audio: "",
 
       m: this.$route.query.m,
 
       m: this.$route.query.m,
 
       id: this.$route.query.id,
 
       id: this.$route.query.id,
 
@@ -125,7 +143,7 @@ export default {
 
           },
 
           },
 
       data: {},
 
       data: {},
 
       iconArr,
 
       iconArr,
 
-      active: ""
 
+      active: "",
 
     };
 
     };
 
   },
 
   },
 
   watch: {
 
   watch: {
 
@@ -156,7 +174,7 @@ export default {
 
     fixIcon() {
 
     fixIcon() {
 
       let arr = this.iconArr.filter((item) => !!item.display);
 
       let arr = this.iconArr.filter((item) => !!item.display);
 
       return arr;
 
       return arr;
 
-    }
 
+    },
 
   },
 
   },
 
   components: {
 
   components: {
 
     Swiper,
 
     Swiper,
 
@@ -174,6 +192,15 @@ export default {
 
         error;
 
         error;
 
       }
 
       }
 
     },
 
     },
 
+    openVideo(url){
 
+        if (this.active == "video") {
 
+          for (let i = 0; i < this.data[this.active].length; i++) {
 
+            console.log(document.querySelector("#video" + (i + 1)));
 
+            document.querySelector("#video" + (i + 1)).pause()
 
+          }
 
+        }
 
+        window.open(this.fixUrl(url),'_blank')
 
+    },
 
     async getData() {
 
     async getData() {
 
       // http://super.4dage.com
 
       // http://super.4dage.com
 
       let url = `${this.server}/data/${
 
       let url = `${this.server}/data/${
 
@@ -196,12 +223,11 @@ export default {
 
           item.display = true;
 
           item.display = true;
 
         }
 
         }
 
       });
 
       });
 
-      this.hadLoad = true
 
-      
+      this.hadLoad = true;
 
     },
 
     },
 
 
 
     colseParent() {
 
     colseParent() {
 
-        window.parent.document.getElementById("closepop").click();
 
+      window.parent.document.getElementById("closepop").click();
 
     },
 
     },
 
     fixUrl(item) {
 
     fixUrl(item) {
 
       return this.server + item;
 
       return this.server + item;
 
@@ -212,7 +238,7 @@ export default {
 
   },
 
   },
 
   mounted() {
 
   mounted() {
 
     this.getData();
 
     this.getData();
 
-    
+
 
     document.addEventListener(
 
     document.addEventListener(
 
       "WeixinJSBridgeReady",
 
       "WeixinJSBridgeReady",
 
       () => {
 
       () => {
 
@@ -232,9 +258,10 @@ export default {
 
   opacity: 0;
 
   opacity: 0;
 
 }
 
 }
 
 
 
-.swiper-button-prev, .swiper-button-next{
 
-  background: none!important;
 
-  padding: 10px 30px!important;
 
+.swiper-button-prev,
 
+.swiper-button-next {
 
+  background: none !important;
 
+  padding: 10px 30px !important;
 
 }
 
 }
 
 
 
 .mb-intro {
 
 .mb-intro {
 
@@ -262,11 +289,11 @@ export default {
 
     height: 86%;
 
     height: 86%;
 
     margin: 2% auto;
 
     margin: 2% auto;
 
     position: relative;
 
     position: relative;
 
-    .norecord{
 
+    .norecord {
 
       position: absolute;
 
       position: absolute;
 
       top: 50%;
 
       top: 50%;
 
       left: 50%;
 
       left: 50%;
 
-      transform: translate(-50%,-50%);
 
+      transform: translate(-50%, -50%);
 
       color: #fff;
 
       color: #fff;
 
     }
 
     }
 
     .warpper {
 
     .warpper {
 
@@ -278,6 +305,24 @@ export default {
 
         width: 100%;
 
         width: 100%;
 
         height: calc(100% - 180px);
 
         height: calc(100% - 180px);
 
         position: relative;
 
         position: relative;
 
+        .tips{
 
+          top: 10px;
 
+          left: 100px;
 
+          z-index: 999;
 
+          font-size: 16px;
 
+          color: #fff;
 
+          position: absolute;
 
+          .btn{
 
+              font-size: 16px;
 
+              color: #fcd67b;
 
+              background-color: #a01c26;
 
+              border-radius: 36px;
 
+              display: inline-block;
 
+              cursor: pointer;
 
+              letter-spacing: 2px;
 
+              padding: 10px 20px;
 
+          }
 
+        }
 
         img,
 
         img,
 
         video,
 
         video,
 
         iframe {
 
         iframe {
 
@@ -285,12 +330,12 @@ export default {
 
           max-width: calc(100% - 220px);
 
           max-width: calc(100% - 220px);
 
           border-radius: 14px;
 
           border-radius: 14px;
 
           box-shadow: 0 0 16px rgba(0, 0, 0, 0.6);
 
           box-shadow: 0 0 16px rgba(0, 0, 0, 0.6);
 
-          transform: translate(-50%,-50%);
 
+          transform: translate(-50%, -50%);
 
           top: 50%;
 
           top: 50%;
 
           left: 50%;
 
           left: 50%;
 
           position: absolute;
 
           position: absolute;
 
         }
 
         }
 
-        iframe{
 
+        iframe {
 
           width: calc(100% - 220px);
 
           width: calc(100% - 220px);
 
           height: 100%;
 
           height: 100%;
 
         }
 
         }
 
@@ -299,7 +344,7 @@ export default {
 
         }
 
         }
 
       }
 
       }
 
     }
 
     }
 
-    .desc{
 
+    .desc {
 
       color: #fff;
 
       color: #fff;
 
       width: 76%;
 
       width: 76%;
 
       margin: -40px auto 0;
 
       margin: -40px auto 0;
 
@@ -310,7 +355,7 @@ export default {
 
       position: relative;
 
       position: relative;
 
       z-index: 999;
 
       z-index: 999;
 
     }
 
     }
 
-    .desc-duo{
 
+    .desc-duo {
 
       text-indent: 32px;
 
       text-indent: 32px;
 
       text-align: left;
 
       text-align: left;
 
     }
 
     }
 
@@ -368,7 +413,7 @@ export default {
 
       border: none;
 
       border: none;
 
     }
 
     }
 
   }
 
   }
 
-  .title{
 
+  .title {
 
     color: rgba(252, 214, 123, 1);
 
     color: rgba(252, 214, 123, 1);
 
     width: 100%;
 
     width: 100%;
 
     text-align: center;
 
     text-align: center;
 
@@ -474,7 +519,7 @@ export default {
 
 </style>
 
 </style>
 
 
 
 <style>
 
 <style>
 
-*{
 
+* {
 
   word-break: break-all;
 
   word-break: break-all;
 
 }
 
 }
 
 .swiper-container {
 
 .swiper-container {
 
@@ -487,7 +532,7 @@ export default {
 
 }
 
 }
 
 
 
 .swiper-pagination-bullets {
 
 .swiper-pagination-bullets {
 
-  bottom: 40px!important;
 
+  bottom: 40px !important;
 
 }
 
 }
 
 
 
 .swiper-slide {
 
 .swiper-slide {
 
@@ -528,24 +573,21 @@ export default {
 
   }
 
   }
 
 }
 
 }
 
 
 
-
 
-
 
-::-webkit-scrollbar-track-piece {  
-	background-color:#ffffff;  
-}  
-::-webkit-scrollbar {  
-	width:8px;  
+::-webkit-scrollbar-track-piece {
 
+  background-color: #ffffff;
 
+}
 
+::-webkit-scrollbar {
 
+  width: 8px;
 
   overflow: hidden;
 
   overflow: hidden;
 
-	height:13px;  
-}  
-::-webkit-scrollbar-thumb {  
-	background-color:#ccc;  
-	background-clip:padding-box;  
-	min-height:10px;  
-	border-radius: 4px;
 
-}  
-::-webkit-scrollbar-thumb:hover {  
-	background-color:#929292;  
-}  
-
 
-</style>
 
+  height: 13px;
 
+}
 
+::-webkit-scrollbar-thumb {
 
+  background-color: #ccc;
 
+  background-clip: padding-box;
 
+  min-height: 10px;
 
+  border-radius: 4px;
 
+}
 
+::-webkit-scrollbar-thumb:hover {
 
+  background-color: #929292;
 
+}
 
+</style>

BIN
web/public/static/audio/6.mp3
View File


+ 1 - 1
web/public/static/js/main_2020_show.js
View File 

@@ -28251,7 +28251,7 @@ window.Modernizr = function(n, e, t) {
 
             //if(settings.mobileNavHigh)return r.HIGH  //改
 
             //if(settings.mobileNavHigh)return r.HIGH  //改
 
             //else return this.useHighResolutionPanos ? a.isMobile() ? r.STANDARD : $("#player").height() < this.highQualityThreshold ? r.STANDARD : r.HIGH : r.STANDARD
 
             //else return this.useHighResolutionPanos ? a.isMobile() ? r.STANDARD : $("#player").height() < this.highQualityThreshold ? r.STANDARD : r.HIGH : r.STANDARD
 
             //cause配置不高 卡顿
 
             //cause配置不高 卡顿
 
-            if(window.fps && window.fps.aveFps>48){
 
+            if(window.fps && window.fps.aveFps>27){
 
                 return r.HIGH
 
                 return r.HIGH
 
             } 
             } 
             else return r.STANDARD
 
             else return r.STANDARD

+ 2 - 2
web/public/static/js/myShow.js
View File 

@@ -1,7 +1,7 @@
 
 var g_ProjectName=window.location.pathname.substring(window.location.pathname.indexOf("/")+1,window.location.pathname.lastIndexOf("/"));
 
 var g_ProjectName=window.location.pathname.substring(window.location.pathname.indexOf("/")+1,window.location.pathname.lastIndexOf("/"));
 
-// var g_Prefix="http://192.168.1.101/";
 
+var g_Prefix="http://192.168.1.101/";
 
 // https://super.4dage.com/
 
 // https://super.4dage.com/
 
-var g_Prefix=window.location.origin+'/';
 
+// var g_Prefix=window.location.origin+'/';
 
 
 
 var s = window.location.href.split('/');
 
 var s = window.location.href.split('/');
 
 s.pop();
 
 s.pop();

+ 1 - 1
web/public/static/js/overlay.js
View File 

@@ -104,7 +104,7 @@ var initOverlay = function(THREE){
 
         
         
         if(info.media){ 
         if(info.media){ 
             if(info.media.includes('video')){
 
             if(info.media.includes('video')){
 
-                var video = $('<video controls="controls" loop x5-playsinline="" webkit-playsinline="true" playsinline="true" controlslist="nodownload"></video>')[0]
 
+                var video = $('<video controls="controls" loop controlslist="nodownload"></video>')[0]
 
                 video.setAttribute("crossOrigin", 'Anonymous')//要在src设置好前解决跨域
 
                 video.setAttribute("crossOrigin", 'Anonymous')//要在src设置好前解决跨域
 
                 $(video).on('contextmenu', function () { return false; });//禁止右键点击出
 
                 $(video).on('contextmenu', function () { return false; });//禁止右键点击出

BIN
web/src/assets/images/video1.jpg
View File


BIN
web/src/assets/video/video.webm
View File


+ 4 - 1
web/src/components/longvideo/index.vue
View File 

@@ -3,7 +3,10 @@
 
     <audio preload autoplay ref="changjuan" :src="require('@/assets/audio/redianchangjuan.mp3')"></audio>
 
     <audio preload autoplay ref="changjuan" :src="require('@/assets/audio/redianchangjuan.mp3')"></audio>
 
     <img class="close" @click="$bus.$emit('toggleLongVideo',false)" :src="require('@/assets/images/icon/close.png')" alt="">
 
     <img class="close" @click="$bus.$emit('toggleLongVideo',false)" :src="require('@/assets/images/icon/close.png')" alt="">
 
     <div class="longbody">
 
     <div class="longbody">
 
-      <video @click="autoplay" :style="{left:translate.x + 'px'}" ref="layout" autoplay loop :src="require('@/assets/video/video.mp4')"></video>
 
+      <video @click="autoplay" :style="{left:translate.x + 'px'}" ref="layout" autoplay loop :poster="require('@/assets/images/video1.jpg')">
 
+        <source :src="require('@/assets/video/video.webm')" type="video/webm">
 
+        <source :src="require('@/assets/video/video.mp4')" type="video/mp4">
 
+      </video>
 
     </div>
 
     </div>
 
     <div class="scorll-bar" :style="{width:barW+'px'}">
 
     <div class="scorll-bar" :style="{width:barW+'px'}">
 
       <span @click="autoplay" class="k" ref="scro" :style="{left: -translate.x * (((barW-100)/wLimit)) + 'px'}"></span>
 
       <span @click="autoplay" class="k" ref="scro" :style="{left: -translate.x * (((barW-100)/wLimit)) + 'px'}"></span>