1 |
- var n,e,l,t,o;let a=!1;var i={idx:0,nextId:null,texture:{id:-1,curr:null,next:null,isloading:!1},src:[{id:1,name:"01frontGate",home:{T:50,R:70},image:"panos/01frontGate.png",L:{id:14,angle:{lat:-10,lon:16.3},offset:180},R:{id:25,angle:{lat:-13.7,lon:75.3},offset:-70},F:null,B:null,LF:null,LB:null,RF:null,RB:null},{id:2,name:"02masterBedroom",home:{T:83,R:45},image:"panos/02masterBedroom.png",L:null,R:{id:4,angle:{lat:-9.5,lon:50},offset:180},F:{id:6,angle:{lat:-4,lon:-77},offset:-90},B:{id:3,angle:{lat:-3.7,lon:.5},offset:0},LF:null,LB:null,RF:null,RB:null},{id:3,name:"03masterBedroom",home:{T:85,R:36},image:"panos/03masterBedroom.png",L:null,R:{id:4,angle:{lat:-13.6,lon:54},offset:180},F:{id:2,angle:{lat:2.7,lon:16.7},offset:90},B:null,LF:null,LB:null,RF:null,RB:null},{id:4,name:"04masterBedroom",home:{T:75,R:30},image:"panos/04masterBedroom.png",L:null,R:{id:3,angle:{lat:0,lon:13.5},offset:0},F:null,B:{id:2,angle:{lat:3,lon:17.1},offset:90},LF:null,LB:null,RF:null,RB:null},{id:5,name:"05masterBedroomToilet ",home:{T:60,R:30},image:"panos/05masterBedroomToilet.png",L:null,R:null,F:{id:7,angle:{lat:-13,lon:50},offset:0},B:null,LF:null,LB:null,RF:null,RB:null},{id:6,name:"06masterBedroomPorch",home:{T:66,R:45},image:"panos/06masterBedroomPorch.png",L:null,R:{id:25,angle:{lat:-10,lon:150},offset:-75},F:{id:2,angle:{lat:-6.5,lon:-86},offset:90},B:{id:7,angle:{lat:-2,lon:146},offset:35},LF:null,LB:null,RF:null,RB:null},{id:7,name:"07masterBedroomCloakroom",home:{T:60,R:48},image:"panos/07masterBedroomCloakroom.png",L:{id:6,angle:{lat:1.9,lon:86},offset:-90},R:null,F:null,B:null,LF:null,LB:{id:6,angle:{lat:1.9,lon:86},offset:-90},RF:null,RB:{id:5,angle:{lat:-3.2,lon:-80},offset:0}},{id:8,name:"08AguestRoom",home:{T:90,R:100},image:"panos/08AguestRoom.png",L:null,R:{id:9,angle:{lat:-4.5,lon:-48},offset:-90},F:null,B:null,LF:null,LB:null,RF:null,RB:null},{id:9,name:"09guestRoomA",home:{T:80,R:90},image:"panos/09guestRoomA.png",L:null,R:null,F:{id:8,angle:{lat:-5.7,lon:-25},offset:30},B:{id:10,angle:{lat:-6.4,lon:187},offset:-90},LF:null,LB:null,RF:null,RB:null},{id:10,name:"10guestRoomAToilet ",home:{T:70,R:100},image:"panos/10guestRoomAToilet.png",L:null,R:null,F:{id:25,angle:{lat:3.8,lon:-15},offset:-90},B:null,LF:null,LB:null,RF:null,RB:null},{id:11,name:"11guestRoomB",home:{T:85,R:70},image:"panos/11guestRoomB.png",L:null,R:{id:12,angle:{lat:-2.8,lon:17},offset:180},F:{id:25,angle:{lat:-7,lon:-118},offset:-60},B:null,LF:null,LB:{id:13,angle:{lat:-1.4,lon:-172},offset:160},RF:null,RB:null},{id:12,name:"12guestRoomB",home:{T:80,R:60},image:"panos/12guestRoomB.png",L:null,R:{id:11,angle:{lat:-10,lon:-43},offset:90},F:null,B:null,LF:null,LB:null,RF:null,RB:null},{id:13,name:"13guestRoomB",home:{T:95,R:70},image:"panos/13guestRoomB.png",L:{id:11,angle:{lat:-6,lon:120},offset:60},R:null,F:null,B:null,LF:null,LB:null,RF:null,RB:null},{id:14,name:"14livingRoom",home:{T:20,R:70},image:"panos/14livingRoom.png",L:null,R:null,F:{id:16,angle:{lat:1.4,lon:80},offset:180},B:null,LF:{id:17,angle:{lat:-2.4,lon:36},offset:150},LB:null,RF:{id:15,angle:{lat:-6,lon:148},offset:130},RB:{id:1,angle:{lat:-2.1,lon:187},offset:180}},{id:15,name:"15livingRoom",home:{T:30,R:50},image:"panos/15livingRoom.png",L:null,R:null,F:null,B:null,LF:{id:16,angle:{lat:-7.2,lon:-13},offset:180},LB:{id:14,angle:{lat:0,lon:-57},offset:150},RF:{id:22,angle:{lat:-1.4,lon:73},offset:180},RB:{id:20,angle:{lat:0,lon:0},offset:0}},{id:16,name:"16livingRoom",home:{T:20,R:50},image:"panos/16livingRoom.png",L:{id:19,angle:{lat:-2,lon:-3},offset:180},R:{id:15,angle:{lat:-3,lon:230},offset:120},F:{id:22,angle:{lat:4.5,lon:119},offset:180},B:{id:14,angle:{lat:2.5,lon:-80},offset:160},LF:{id:18,angle:{lat:-10,lon:-20},offset:-130},LB:{id:17,angle:{lat:0,lon:0},offset:160},RF:null,RB:null},{id:17,name:"17livingRoom",home:{T:8,R:60},image:"panos/17livingRoom.png",L:{id:23,angle:{lat:-1,lon:-236},offset:30},R:{id:16,angle:{lat:-8.2,lon:178},offset:180},F:null,B:null,LF:{id:23,angle:{lat:-1.4,lon:-210},offset:80},LB:null,RF:{id:19,angle:{lat:-2,lon:75},offset:180},RB:{id:14,angle:{lat:-6.3,lon:221},offset:150}},{id:18,name:"18livingRoom",home:{T:8,R:40},image:"panos/18livingRoom.png",L:null,R:null,F:null,B:null,LF:null,LB:{id:24,angle:{lat:-3,lon:-52},offset:-120},RF:{id:16,angle:{lat:5.2,lon:179},offset:180},RB:{id:19,angle:{lat:-1.2,lon:-81},offset:180}},{id:19,name:"19livingRoom",home:{T:8,R:50},image:"panos/19livingRoom.png",L:null,R:{id:16,angle:{lat:-8.2,lon:178},offset:180},F:{id:18,angle:{lat:-2,lon:75},offset:180},B:{id:17,angle:{lat:-1.2,lon:-81},offset:180},LF:null,LB:{id:23,angle:{lat:-1,lon:-236},offset:0},RF:null,RB:{id:14,angle:{lat:-7,lon:251},offset:120}},{id:20,name:"20livingRoom",home:{T:40,R:45},image:"panos/20livingRoom.png",L:{id:21,angle:{lat:-.6,lon:-117},offset:150},R:{id:15,angle:{lat:2,lon:55},offset:120},F:null,B:{id:22,angle:{lat:-1,lon:70},offset:180},LF:null,LB:null,RF:{id:14,angle:{lat:-1.8,lon:-44},offset:180},RB:null},{id:21,name:"21livingRoom",home:{T:42,R:55},image:"panos/21livingRoom.png",L:null,R:null,F:{id:20,angle:{lat:0,lon:-179},offset:0},B:null,LF:{id:20,angle:{lat:-1.1,lon:-190},offset:0},LB:null,RF:null,RB:null},{id:22,name:"22livingRoom",home:{T:23,R:20},image:"panos/22livingRoom.png",L:null,R:null,F:null,B:null,LF:null,LB:null,RF:null,RB:{id:20,angle:{lat:-2,lon:84},offset:0}},{id:23,name:"23kitchen",home:{T:-5,R:65},image:"panos/23kitchen.png",L:null,R:null,F:null,B:{id:17,angle:{lat:0,lon:165},offset:180},LF:null,LB:{id:17,angle:{lat:-5.7,lon:197},offset:160},RF:null,RB:null},{id:24,name:"24laundry",home:{T:-5,R:40},image:"panos/24laundry.png",L:null,R:null,F:null,B:null,LF:null,LB:null,RF:{id:18,angle:{lat:1.3,lon:152},offset:230},RB:null},{id:25,name:"25frontGatePorch",home:{T:65,R:75},image:"panos/25frontGatePorch.jpg",L:{id:6,angle:{lat:-6,lon:47},offset:-90},R:{id:10,angle:{lat:2.2,lon:-85},offset:180},F:{id:11,angle:{lat:-5,lon:-67},offset:60},B:{id:1,angle:{lat:1.7,lon:17},offset:180},LF:null,LB:null,RF:{id:9,angle:{lat:-10,lon:-230},offset:-90},RB:{id:1,angle:{lat:0,lon:0},offset:180}}],direction:[{id:1,name:"B",at:{x:0,y:0,z:-1}},{id:2,name:"F",at:{x:0,y:0,z:1}},{id:3,name:"R",at:{x:-1,y:0,z:0}},{id:4,name:"L",at:{x:1,y:0,z:0}},{id:5,name:"down",at:{x:0,y:1,z:0}},{id:6,name:"up",at:{x:0,y:-1,z:0}},{id:1,name:"LF",at:{x:1,y:0,z:1}},{id:2,name:"RF",at:{x:-1,y:0,z:1}},{id:3,name:"LB",at:{x:1,y:0,z:-1}},{id:4,name:"RB",at:{x:-1,y:0,z:-1}}]},d=!1,s=0,r=0,u=0,f=0,c=0,m=0,g=0,R=0;function B(t){var a,d;a=document.getElementById("container"),(n=new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,1,1100)).target=new THREE.Vector3(0,0,0),e=new THREE.Scene;var s=new THREE.SphereBufferGeometry(500,60,40);if(s.scale(-1,1,1),!t){const n=i.src[i.idx].image;t=(new THREE.TextureLoader).load(n);z()}o=new THREE.MeshBasicMaterial({map:t}),d=new THREE.Mesh(s,o),e.add(d),(l=new THREE.WebGLRenderer).setPixelRatio(window.devicePixelRatio),l.setSize(window.innerWidth,window.innerHeight),a.appendChild(l.domElement),n.position.set(0,0,10),window.camera=n,document.addEventListener("mousedown",F,!1),document.addEventListener("mousemove",h,!1),document.addEventListener("mouseup",E,!1),document.addEventListener("wheel",x,!1),document.addEventListener("touchstart",F,!1),document.addEventListener("touchmove",h,!1),document.addEventListener("touchend",E,!1),document.addEventListener("dblclick",v,!1),document.addEventListener("dragover",(function(n){n.preventDefault(),n.dataTransfer.dropEffect="copy"}),!1),document.addEventListener("dragenter",(function(){document.body.style.opacity=.5}),!1),document.addEventListener("dragleave",(function(){document.body.style.opacity=1}),!1),document.addEventListener("drop",(function(n){n.preventDefault();var e=new FileReader;e.addEventListener("load",(function(n){o.map.image.src=n.target.result,o.map.needsUpdate=!0}),!1),e.readAsDataURL(n.dataTransfer.files[0]),document.body.style.opacity=1}),!1),document.addEventListener("keyup",p),window.addEventListener("resize",L,!1)}function p(e){let l=0;switch(console.log(e.key),e.key){case"ArrowUp":I(2);break;case"ArrowDown":I(1);break;case"ArrowLeft":I(3);break;case"ArrowRight":I(4);break;case"Enter":y(T());break;case"0":a=!a,n.fov=a?75:45,n.updateProjectionMatrix();for(var t=document.getElementById("redPoints");t.firstChild;)t.removeChild(t.firstChild);break;case"1":l=n.fov+5,l=THREE.MathUtils.clamp(l,10,75),l!==n.fov&&H(l);break;case"2":l=n.fov-5,l=THREE.MathUtils.clamp(l,10,75),l!==n.fov&&H(l)}}function L(){n.aspect=window.innerWidth/window.innerHeight,n.updateProjectionMatrix(),l.setSize(window.innerWidth,window.innerHeight)}function F(n){d=!0;var e=n.clientX||n.touches[0].clientX,l=n.clientY||n.touches[0].clientY;s=e,r=l,f=u,m=c}function h(n){if(!0===d){var e=n.clientX||n.touches[0].clientX,l=n.clientY||n.touches[0].clientY;u=.1*(s-e)+f,c=.1*(l-r)+m}}function E(){d=!1}function x(e){var l=n.fov+.05*e.deltaY;n.fov=THREE.MathUtils.clamp(l,10,75),n.updateProjectionMatrix()}function v(n){y(T())}function T(){let e=Math.PI,l="";const t=n.target.normalize();for(const n in i.direction){const o=new THREE.Vector3(i.direction[n].at.x,i.direction[n].at.y,i.direction[n].at.z).normalize(),a=t.angleTo(o);e>a&&(e=a,l=i.direction[n].name)}return l}function y(n){let e=null;switch(n){case"L":e=i.src[i.idx].L;break;case"R":e=i.src[i.idx].R;break;case"F":e=i.src[i.idx].F;break;case"B":e=i.src[i.idx].B;break;case"LF":e=i.src[i.idx].LF;break;case"LB":e=i.src[i.idx].LB;break;case"RF":e=i.src[i.idx].RF;break;case"RB":e=i.src[i.idx].RB}e?w(e):W()}function w(n){const e=G(n.id);k(i.src[e].image,n,e)}function k(n,e,l){(new THREE.TextureLoader).load(n,(function(n){P(n,e,l)}),void 0,(function(n){console.error("An error happened.")}))}function M(n){var e=new THREE.TextureLoader;const l=i.src[n].image;i.texture.isloading=!0,e.load(l,(function(e){i.texture.id=n,i.texture.next=e,i.texture.isloading=!1}),void 0,(function(n){console.error("An error happened.")}))}function b(){i.texture.next&&(i.texture.curr=i.texture.next.clone(),o.map=i.texture.curr,o.map.needsUpdate=!0,z()),M(i.idx)}function P(e,l,t){const a={x:n.fov,y:0},d=n.fov;new TWEEN.Tween(a).to({x:2*n.fov/3,y:0},500).easing(TWEEN.Easing.Quadratic.Out).onUpdate((e,l)=>{n.fov=a.x,n.updateProjectionMatrix()}).onComplete(()=>{o.map=e,o.map.needsUpdate=!0,i.nextId=l,i.idx=t,c=l.angle.lat,u=l.angle.lon,n.fov=d,n.updateProjectionMatrix(),z(l)}).start()}function H(e){const l={x:n.fov,y:0};new TWEEN.Tween(l).to({x:e,y:0},600).easing(TWEEN.Easing.Quadratic.Out).delay(300).onUpdate((e,t)=>{n.fov=l.x,n.updateProjectionMatrix()}).onComplete(()=>{}).start()}function z(){const n=i.src[i.idx].home.T,e=i.src[i.idx].home.R;document.getElementById("cam").style.top=n+"px",document.getElementById("cam").style.right=e+"px",a||N()}function C(){const n=null!==i.nextId?i.nextId.offset:180,e=u+n;document.getElementById("cam").style.transform="rotate("+e+"deg)"}function W(){const e={x:n.fov,y:0},l=n.fov-5;new TWEEN.Tween(e).to({x:l,y:0},400).easing(TWEEN.Easing.Quadratic.Out).onUpdate((l,t)=>{n.fov=e.x,n.updateProjectionMatrix()}).onComplete(()=>{A()}).start()}function A(){U(5,400)}function U(e=5,l=600){const t={x:n.fov,y:0},o=n.fov+e;new TWEEN.Tween(t).to({x:o,y:0},l).easing(TWEEN.Easing.Quadratic.Out).onUpdate((e,l)=>{n.fov=t.x,n.updateProjectionMatrix()}).start()}function I(n=1){const e={x:1===n||2===n?c:u,y:0},l=1===n?c-10:2===n?c+10:3===n?u-10:u+10;new TWEEN.Tween(e).to({x:l,y:0},600).easing(TWEEN.Easing.Quadratic.Out).onUpdate((l,t)=>{1===n||2===n?c=e.x:u=e.x}).start()}function N(){const n=i.idx;let e=-1;for(var l=document.getElementById("redPoints");l.firstChild;)l.removeChild(l.firstChild);i.src[n].L&&(e=i.src[n].L.id-1,j(e)),i.src[n].R&&(e=i.src[n].R.id-1,j(e)),i.src[n].F&&(e=i.src[n].F.id-1,j(e)),i.src[n].B&&(e=i.src[n].B.id-1,j(e)),i.src[n].LF&&(e=i.src[n].LF.id-1,j(e)),i.src[n].LB&&(e=i.src[n].LB.id-1,j(e)),i.src[n].RF&&(e=i.src[n].RF.id-1,j(e)),i.src[n].RB&&(e=i.src[n].RB.id-1,j(e))}function j(n){const e=i.src[n].home.T,l=i.src[n].home.R,t=document.createElement("img");t.src="panos/redPoint.png",t.style.position="absolute",t.style.top=e+15+"px",t.style.right=l-5+"px",t.style.width="8px",t.style.height="8px";document.getElementById("redPoints").appendChild(t)}function G(n){let e=-1;for(const l in i.src)if(i.src[l].id===n){e=l;break}return e}function S(){requestAnimationFrame(S),D()}function D(){a&&(u>360&&!i.texture.isloading?(u=0,i.idx++,i.idx>=i.src.length&&(i.idx=0),b()):u+=.2),c=Math.max(-85,Math.min(85,c)),g=THREE.MathUtils.degToRad(90-c),R=THREE.MathUtils.degToRad(u),n.target.x=500*Math.sin(g)*Math.cos(R),n.target.y=500*Math.cos(g),n.target.z=500*Math.sin(g)*Math.sin(R),C(),n.lookAt(n.target),TWEEN.update(),l.render(e,n)}function O(){window.location.href="pano_object_scenne_test.html"}B(),S();var Q=new tvSysBtnBind({id:"Jdoc",className:"ctrlBtn",currentClass:"current",keyRemoveDefault:!1,effect:"base",currentIndex:0,onLoad:function(n){console.log(n)},onPress:function(){var n=this.event.keyCode;alert("tvSysBtnBind:"+n+" - "+this.event.key)},onEnterPress:function(){console.log(12321)},onBack:function(){}});
|