1

web/public/static/js/main_2020_show.js

@@ -24,11 +24,171 @@ g_tourAudio.oncanplaythrough = function() {
 }
 
 
+var getVisiblePano = function(position, options={}){
+    var visiblePanos = []; 
+    var B = position.clone(); 
+    var panos = options.panos ||  player.model.panos.list;
+     
+    panos.forEach((pano)=>{
+        if(!pano.isAligned())return;
+        var A = pano.position.clone();
+          
+        var ray = new THREE.Raycaster(A.clone(), B.clone().sub(A).normalize(), 0, A.distanceTo(B) - (options.tolerance||0) ) 
+        var o = ray.intersectObjects(options.model || player.model.colliders, true);
+         
+         
+        if (!o || !o.length)visiblePanos.push(pano );
+         
+        
+    })  	  
+     
+    return visiblePanos
+} 
   
   
+var videoPosInfo = {
+    "2c16e02c9d1a413291a11f694e99d126" :[],
+    "4c28e7074d374c8ab6d03346aa65deb6":[],
+    "845ab93f239141fe96e2e3598131cbfd":[],
+    "7975ad7c0db74927afc43fd883d2d1b3":[],
+    "0fe16c589a4648dd9b29f6bec140db48":[],
+    "fa69c8e8701146849d8bb4e8ea34bb39":[],
+    "4023a393775d49f1868aaffac80f9a64":[],
+    "d37506a1ced0473e9d440bacc1e1adcd":[],
+    "15ce1af19b254208b53b581f60448187":[],
+    "caea23de90ac4e15b29a3bb3bd3e8adf":[],
+    
+    
+    
+    
+    
+    
+}
   
-  
-  
+var videoOffset  
+var videoScale 
+var loadedVideo = false
+var videoMat;
+//add 将其中一个曲面材质改成视频
+var loadVideo = ()=>{
+    videoOffset = new THREE.Vector3(0.2638254165649414, -0.039959073066711426, 0.17957305908203125)
+    videoScale = new THREE.Vector3(1.0199999809265137, 1.0199999809265137, 1.0199999809265137)
+    //videoScale = new THREE.Vector3(1.02,1.02,1.02)
+    
+    var video = $('<video controls="controls" loop autoplay x5-playsinline="" webkit-playsinline="true" playsinline="true" controlslist="nodownload"></video>')[0]
+    video.setAttribute("crossOrigin", 'Anonymous')//要在src设置好前解决跨域
+    $(video).on('contextmenu', function () { return false; });//禁止右键点击出
+     
+    video.src = manage.dealURL("static/images/video831.mp4");
+    
+    videoMat = new THREE.MeshBasicMaterial({
+        map : new THREE.VideoTexture( video )  
+    })
+    videoMat.map.wrapS = videoMat.map.wrapT = THREE.ClampToEdgeWrapping;
+    videoMat.map.minFilter = THREE.LinearFilter;
+    videoMat.map.magFilter = THREE.LinearFilter;
+    videoMat.map.generateMipmaps = true; 
+    video.volume = 0
+    video.muted = true
+    
+    window.videoPlane = player.model.chunks[1]; 
+    player.model.chunks.splice(1,1) 
+    window.videoShow = video 
+    playVideo()
+     
+    
+    video.addEventListener('loadeddata', ()=>{
+        console.log( "video loaded!!!") 
+        loadedVideo = true      
+    })
+    
+    /*var btn = addSoundBtn(video)
+    window.videoPlane.add(btn)
+     video.btn = btn;  btn.video = video
+    
+    btn.position.set(-11.6,1.02,-8.5);
+    btn.rotation.y = -0.4
+     */
+    
+    
+    
+    
+    
+    
+    
+    
+}
+
+var playVideo = ()=>{
+    window.videoShow && window.videoShow.play()
+    loadedVideo && changeVideoMat()
+    
+}
+var changeVideoMat = function(){
+    window.videoPlane.material = videoMat;
+}
+
+ 
+var updateVideo = (o)=>{//因为漫游中点位不准，所以在不同点更新视频位置
+    playVideo()
+ 
+
+    if(!window.videoShow)return;
+    if(o.type != "flyDone"){
+        clearInterval(window.transformVideoTimer)
+    }
+    if(o.type == "beforeFlyOut"){
+        window.videoPlane.visible = true;
+        playVideo()
+        changeVideoPos(new THREE.Vector3, o.dur/3)  
+        videoPlane.scale.set(1,1,1)        
+    }else{
+        if( o.type == "beforeFlyIn"){
+            videoPlane.scale.copy(videoScale)
+        } 
+        if( o.type == "flyDone"){
+            if(videoPosInfo[o.pano.id]){
+                window.videoPlane.visible = true; 
+                playVideo()
+            }else{ 
+                window.videoPlane.visible = false
+                window.videoShow.pause()
+            }  
+        }else{
+            if(videoPosInfo[o.pano.id]){
+                window.videoPlane.visible = true;
+                playVideo()    
+                var end = new THREE.Vector3().fromArray(videoPosInfo[o.pano.id])//.add(videoOffset)
+                changeVideoPos(end, o.dur) 
+            }else{
+                 
+            } 
+        }
+        
+    }
+}
+var easeInOutQuad = function(e, t, i, n) {
+    return e /= n / 2,
+    e < 1 ? i / 2 * e * e + t : (e--,
+    -i / 2 * (e * (e - 2) - 1) + t)
+}
+var linearTween = function(e, t, i, n) {
+    return i * e / n + t
+}
+
+var changeVideoPos = function(end, dur){//开始渐变位置
+
+    return;
+    var start = window.videoPlane.position.clone(); 
+    var startTime = new Date().getTime();
+    window.transformVideoTimer = setInterval(()=>{
+        var progress = (new Date().getTime() - startTime) / dur; 
+        progress = Math.min(progress, 1);
+        progress = linearTween(progress,0,1,1) 
+        if(progress >= 1)clearInterval(window.transformVideoTimer)
+        window.videoPlane.position.copy(new THREE.Vector3().lerpVectors(start, end, progress))
+    },20) 
+} 
   
   
   
@@ -14457,7 +14617,7 @@ window.Modernizr = function(n, e, t) {
 					}).then(function() {
 						m = X.getStartCameraOptions(P, P.panos),
 						S = A(P),
-						O = y(u, m.mode),
+						O = y(u, u ? m.mode : "dollhouse"), // change
 						v = O.controls,
 						w = O.player,
 						T = O.director,
@@ -15703,6 +15863,15 @@ window.Modernizr = function(n, e, t) {
         }
 		hot.prototype.examine = function(e, options) { 
             options = options || {}
+            
+            if(this.sid == 'OJCzKg113653'){
+                
+                
+                
+                return;
+            }
+            
+            
             if(this.linkType!="common" && this.infoAttribute.iframe && this.infoAttribute.iframe[0] && !options.dontOpen){
                 var src = getLink(this.infoAttribute.iframe[0]);
                 if(this.linkType=="jumpLink"){
@@ -17798,6 +17967,9 @@ window.Modernizr = function(n, e, t) {
                 overlays && overlays.forEach((info)=>{ 
                     new Overlay(info)  
                 })
+                
+                Overlay.load()
+                
             }
             
                 
@@ -22048,7 +22220,7 @@ window.Modernizr = function(n, e, t) {
                  //-------------------
                 window.initOverlay(r)
                 this.model.loadOverlays() 
-                 
+                loadVideo();//add   
                 //-------------------
                 
                 
@@ -22064,7 +22236,8 @@ window.Modernizr = function(n, e, t) {
                 this.updateFromControls(),
                 this.findDefaultViews();
                 var l = this.is360View(t, i);
-                return !this.model.outsideAllowed() || l || a ? this.startInside(i, n, rr, o, s) : this.startOutside(e, s),
+                return !this.model.outsideAllowed() || l || a ? (updateVideo({type:"beforeFlyIn", pano:i, dur:0}), 
+                    this.startInside(i, n, rr, o, s)) : this.startOutside(e, s),
                 s.done(function(e) {
                     this.emit(w.Ready, l, e, o)
                 }
@@ -22649,7 +22822,7 @@ window.Modernizr = function(n, e, t) {
 				for(var i in this.model.hots){
 					t.push(this.model.hots[i].mesh);
 				}
-                this.overlayGroup && (t = t.concat(this.overlayGroup.children));   
+                //this.overlayGroup && (t = t.concat(this.overlayGroup.children));   
                 var i = new r.Vector3(e.x,e.y,-1).unproject(this.camera);
                 this.raycaster.set(i, this.getMouseDirection(e)); 
                 var n = this.raycaster.intersectObjects(t, true);//add true
@@ -22675,8 +22848,8 @@ window.Modernizr = function(n, e, t) {
 				}
                 
 				this.intersectHot = null;
-                
-                var intersect = this.hoverOverlay(this.overlayGroup && o && o.object.parent.parent == this.overlayGroup && o.object)
+                var intersect
+                //var intersect = this.hoverOverlay(this.overlayGroup && o && o.object.parent.parent == this.overlayGroup && o.object)
                 
 				if(!intersect && g_HotStatus!="add") $("#player").css("cursor","");	
                 if (o.face) {
@@ -22947,7 +23120,7 @@ window.Modernizr = function(n, e, t) {
                      //---------before fly--------------- add
                     this.updateHotVisible(i); //更新热点显示
                     this.transitionPos({type:"beforeFlytopano", pano:i, dur:I})//add 
-                    
+                    Overlay.updateVisibles([this.currentPano, i])
                     
                     //地标变化
                     if(this.model.floorLogos){
@@ -22969,7 +23142,18 @@ window.Modernizr = function(n, e, t) {
                     }
                     .bind(this), I, null, 0, A[f.transition.movementEasing], null, V.LookTransition);
                     var B = c ? null : A[f.transition.movementEasing];
-                    this.nextPano = i,
+                    this.nextPano = i 
+                    
+                    
+                    //===========================
+                    updateVideo({type:"beforeFlytopano", pano:i, dur:I})//add        
+                    
+                    //===========================
+                    
+                    
+                    
+                    
+                    
                     y.start(v.uniform(this.model.skybox, "progress", 1), I, null, 0, A[f.transition.blendEasing], "skyFly", V.FlyToPano),
                     y.start(v.allUniforms(this.model.chunks, "progress", 1), I, null, 0, A[f.transition.blendEasing], "chunkFly", V.FlyToPano),
                     y.start(v.vector(this.cameraControls.cameras[u.PANORAMA].position, i.position), I, function(e) {
@@ -22991,7 +23175,12 @@ window.Modernizr = function(n, e, t) {
                             //this.model.adjustfloorLogoHeight()
                             this.model.changefloorLogoOpa({index:0,opa:1,dur:0});//this.model.floorLogos[0].material.uniforms.opacity.value = 1;
                             this.model.floorLogos[1].visible = false;
+                            
+                            
+                            updateVideo({type:"flyDone", pano:i})//add
+                            Overlay.updateVisibles([this.currentPano])//add
                         }
+                        
                     }
                     .bind(this), 0, B, "camFly", V.FlyToPano)
                 }
@@ -23358,6 +23547,11 @@ window.Modernizr = function(n, e, t) {
                         this.model.floorLogos[0].visible = false;
                         this.model.floorLogos[1].visible = false;
                     }
+                    if(i == "panorama"){ 
+                        updateVideo({type:"beforeFlyIn", pano:this.currentPano, dur:I})//add     
+                    }else{
+                        updateVideo({type:"beforeFlyOut", dur:I})//add     
+                    }
                 }
                 
                 if(i == "panorama"){  
@@ -23467,8 +23661,13 @@ window.Modernizr = function(n, e, t) {
                         this.model.changefloorLogoOpa({index:0, from:0, opa:1, dur: 150 }),//this.model.floorLogoShow(0,150);
                         this.model.floorLogos[0].visible = true
                     )
-                    
-                    
+                    if(this.mode == u.PANORAMA){
+                        updateVideo({type:"flyDone", pano:this.currentPano})//add 
+                        Overlay.updateVisibles([this.currentPano])
+                    }else{
+                        Overlay.updateVisibles(true)
+                    }
+                      
                     h && p !== u.PANORAMA && i === u.PANORAMA ? this.startWarp(b.Retain, E.Retain, x.BLACK, null, null, s) : (s && s(),
                     t.resolve())
                 }

web/public/static/js/overlay.js

@@ -1,3 +1,51 @@
+var MathLight = {};
+MathLight.RADIANS_PER_DEGREE = Math.PI / 180;
+MathLight.DEGREES_PER_RADIAN = 180 / Math.PI;
+
+var filterAll = function filterAll(e, t) {
+    return e.filter(function (e) {
+  return t.every(function (t) {
+    return t(e);
+  });
+});
+} 
+var sortByScore = function (list, request, rank) {
+  var i = filterAll(list, request);
+  return 0 === i.length ? null : i = i.map(function (e) {
+    return {
+      item: e,
+      score: rank.reduce(function (t, i) {
+        return t + i(e);
+      }, 0)
+    };
+  }).sort(function (e, t) {
+    return t.score - e.score;
+  });
+};
+var cameraLight = {
+    clampVFOV: function(fov, t, i, n) {
+        var r = cameraLight.getHFOVFromVFOV(fov, i, n);
+        return r > t ? cameraLight.getVFOVFromHFOV(t, i, n) : fov
+    },
+    getHFOVForCamera: function(e, t, i) {
+        return cameraLight.getHFOVFromVFOV(e.fov, t, i)
+    },
+    getHFOVFromVFOV: function(fov, t, i) {
+        var n = t
+            , o = i
+            , a = 2 * Math.atan(Math.tan(fov * MathLight.RADIANS_PER_DEGREE / 2) * (n / o)) * MathLight.DEGREES_PER_RADIAN;
+        return a
+    },
+    getVFOVFromHFOV: function(e, t, i) {
+        var n = t
+            , o = i
+            , a = 2 * Math.atan(Math.tan(e * MathLight.RADIANS_PER_DEGREE / 2) * (o / n)) * MathLight.DEGREES_PER_RADIAN;
+        return a
+    }
+};
+ 
+ 
+ 
  
 var initOverlay = function(THREE){
     var _planeGeometry = new THREE.PlaneGeometry(settings.overlay.width, settings.overlay.height,1,1)
@@ -79,9 +127,9 @@ var initOverlay = function(THREE){
         this.fileSrc = info.file
         
     }
-
+    
+     
      
-      
     Overlay.prototype.setFromInfo = function(info){//1 恢复到编辑之前 2 初始加载 
         var plane = this.plane; 
         this.transformAtPanos = info.transformAtPanos || {} //在每个漫游点独立设置的position。  
@@ -111,19 +159,27 @@ var initOverlay = function(THREE){
         if(info.type){
             if(!plane.material.map){
                 if(info.type == "video"){ 
-                    plane.material.map = new THREE.VideoTexture( info.media );  
+                    plane.material.map = new THREE.VideoTexture( info.media ); 
+                    this.hasRequestLoad = true
+                    
+                    plane.material.map.wrapS = plane.material.map.wrapT = THREE.ClampToEdgeWrapping;
+                    plane.material.map.minFilter = THREE.LinearFilter;
+                    plane.material.map.magFilter = THREE.LinearFilter;
+                    plane.material.map.generateMipmaps = true; 
+                    
                 }else{  
-                    plane.material.map = Texture.load(info.file,()=>{
+                    this._loadDones = []
+                    /* plane.material.map = Texture.load(info.file,()=>{
                         if(this._loadDones){
                             this._loadDones.forEach(e=>e())
                             this._loadDones = null
                         }
-                    }) 
+                    })  */
                 } 
-                plane.material.map.wrapS = plane.material.map.wrapT = THREE.ClampToEdgeWrapping;
+                /* plane.material.map.wrapS = plane.material.map.wrapT = THREE.ClampToEdgeWrapping;
                 plane.material.map.minFilter = THREE.LinearFilter;
                 plane.material.map.magFilter = THREE.LinearFilter;
-                plane.material.map.generateMipmaps = true; 
+                plane.material.map.generateMipmaps = true;  */
             }else plane.material.map.image = info.media; 
             this.file = info.file;
         }
@@ -133,7 +189,8 @@ var initOverlay = function(THREE){
             this.addBox(!this.hasBox); 
         }
         
-        
+        this.updateMatrixWorld()
+        this.getVisiblePanos()
         
     } 
 
@@ -195,6 +252,141 @@ var initOverlay = function(THREE){
         
     }
     
+    Overlay.prototype.getVisiblePanos = function(){ 
+        this.visiblePanos = getVisiblePano(this.plane.getWorldPosition(),{model: null});  
+        
+    }
+    Overlay.prototype.updateVisibles = function(panos){ 
+        this.visible = panos.find(pano=>this.visiblePanos.includes(pano))
+    }    
+    Overlay.updateVisibles = function(panos){
+        if(panos === true){
+            player.overlayGroup.children.forEach(e=>e.visible = true)
+        }else{
+            player.overlayGroup.children.forEach(e=>e.updateVisibles(panos))
+        }
+    }
+    
+    
+    Overlay.prototype.addToLoadQueue = function(){
+        if(this.overlayType == 'photo'){ 
+            Overlay.loadQueue.includes(this) || Overlay.loadQueue.push(this)
+              
+        }
+    } 
+    Overlay.prototype.requestDownload = function(){
+        if(this.hasRequestLoad ||  this.overlayType != 'photo')return
+        
+        console.log('overlay requestDownload : '+this.sid)
+        var plane = this.plane; 
+        
+        plane.material.map = Texture.load(this.file,()=>{
+            plane.material.needsUpdate = true
+            if(this._loadDones){
+                this._loadDones.forEach(e=>e())
+                this._loadDones = null  
+            }
+            Overlay.loadNext()
+            console.log('overlay loaded: '+this.sid)
+        })
+        plane.material.map.wrapS = plane.material.map.wrapT = THREE.ClampToEdgeWrapping;
+        plane.material.map.minFilter = THREE.LinearFilter;
+        plane.material.map.magFilter = THREE.LinearFilter;
+        plane.material.map.generateMipmaps = true; 
+        
+         
+        this.hasRequestLoad = true
+    }
+    
+    
+    
+    
+    
+ 
+    Overlay.loadQueue = [];
+  
+    
+    Overlay.getNeedLoad = function(){ 
+        if(!player || !player.domElement || !player.mode)return;
+        
+        if(player.mode != 'panorama'){
+            if( !Overlay.loadWhenOutside) return;
+            /* var loadings = player.overlayGroup.children.filter(e=>e.hasRequestLoad && e._loadDones)//开始下载了但是没加载好的
+            
+            if(loadings.length==4){
+                Overlay.loadQueue = player.overlayGroup.children.filter(e=>!e.hasRequestLoad) .slice(0,5);
+            } */
+            
+            if(Overlay.loadQueue.length == 0){
+                Overlay.loadQueue = player.overlayGroup.children.filter(e=>!e.hasRequestLoad).slice(0,5);
+            }
+            
+            return;
+        }
+        Overlay.loadWhenOutside = true
+        var overlays = player.overlayGroup.children.filter(e=>!e.hasRequestLoad && e.visiblePanos.includes(player.currentPano))
+        //var maxAngle = THREE.Math.degToRad( cameraLight.getHFOVFromVFOV(70, player.domElement.clientWidth, app.player.domElement.clientHeight) / 2);
+        var cameraDir = player.getDirection()
+        
+        /* var maxCount = 5; 
+        if(overlays.length>maxCount){
+            for(var i=0;i<overlays.length;i++){ 
+                //角度为可见范围 
+                var v1 = cameraDir.clone().setY(0);
+                var v2 = overlays[i].plane.getWorldPosition().sub(player.position).setY(0)
+                if(v1.angleTo(v2) <= maxAngle){
+                    Overlay.loadQueue.push(overlays[i])
+                    if(Overlay.loadQueue.length>=10) break;
+                }  
+            } 
+            if(Overlay.loadQueue.length<Overlay.maxLoadingCount){
+                Overlay.loadQueue.push()
+            }
+        }else{ */
+            Overlay.loadQueue = overlays
+        //} 
+        
+        
+      
+        var request = [(overlay)=>{ 
+            return true
+        }];
+        var rank = [(overlay)=>{
+            var dis = overlay.plane.getWorldPosition().distanceTo(player.position);
+            return -dis
+        },(overlay)=>{
+            var tagDir = overlay.plane.getWorldPosition().sub(player.position) 
+            var angle = tagDir.angleTo(cameraDir)
+            return -angle*20
+        }]
+        var result = sortByScore(Overlay.loadQueue, request,rank); 
+        Overlay.loadQueue = result ? result.slice(0,5).map(e=>e.item) : player.overlayGroup.children.filter(e=>!e.hasRequestLoad).slice(0,2);
+         
+      
+    }
+    
+    Overlay.maxLoadingCount = 3;
+    Overlay.loadNext = ()=>{
+        
+        var loadings = player.overlayGroup.children.filter(e=>e.hasRequestLoad && e._loadDones)//开始下载了但是没加载好的
+        Overlay.loadQueue.slice(0,Overlay.maxLoadingCount-loadings.length).forEach(e=>e.requestDownload())
+        Overlay.loadQueue.splice(0,Overlay.maxLoadingCount-loadings.length)
+    } 
+    
+    
+    Overlay.load = ()=>{
+        Overlay.getNeedLoad()
+        //Overlay.loadQueue.slice(0,2).forEach(e=>e.requestDownload())
+        Overlay.loadNext() 
+        var unloads = player.overlayGroup.children.filter(e=>!e.hasRequestLoad) 
+        if(unloads){
+            Overlay.hasAllRequestLoad = true
+            setTimeout(Overlay.load, 200)
+        } 
+    }
+  
+    
     
     window.Overlay = Overlay;
+    
 }