From 2a50510771bf874675352c05c841b89108b956a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=83=AD=E8=B4=B5=E6=88=90?= Date: Wed, 5 Aug 2020 19:36:55 +0800 Subject: [PATCH] =?UTF-8?q?style:=E6=9B=B4=E6=96=B0=E6=92=AD=E6=94=BE?= =?UTF-8?q?=E5=99=A8=E5=9B=BE=E6=A0=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build/mxreality.js | 4 +-- examples/vr_hls_live_video.html | 5 +-- src/mxreality.js | 60 ++++++++++++++------------------- 3 files changed, 28 insertions(+), 41 deletions(-) diff --git a/build/mxreality.js b/build/mxreality.js index 1829ff9..e68cd9a 100644 --- a/build/mxreality.js +++ b/build/mxreality.js @@ -1,2 +1,2 @@ -!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e)}(this,function(e){var t=function(e,t,i,o,n){this.scene=e,this.renderer=t,this.container=i,r.initDomStyle(i),r.setCameraPara(this,o,n),this.vrbox={radius:2,widthSegments:180,heightSegments:180,width:2,height:2,depth:2},this.liveSettings={forceUseHls:!1,forceUseVndAppleMpegUrl:!1,forceUseXmpegUrl:!1,usePlugin:!1,loadPlugin:function(e){console.log("load video",e)}},this.hlsConfig={autoStartLoad:!0},this.flvConfig={type:"flv",isLive:!0},this.destoryed=!1,this.video=null,this.audio=null,this.toolBar=null,this.clock=new THREE.Clock,this.VRObject=new THREE.Object3D,this.defaultAutoHideLeftTime=3,this.defaultVoiceHideLeftTime=2,this.defaultVolume=.3,this.sliceSegment=0,this._controlTarget=new THREE.Vector3(0,0,1e-4),this._cubeCameraTimes=.96,this.resType={video:"video",box:"box",slice:"slice",sliceVideo:"sliceVideo",flvVideo:"flvVideo"},this.videoPlayHook=function(){console.log("video play")},this.videoPauseHook=function(){console.log("video pause")},this.asteroidConfig={enable:!1,asteroidFPS:10,asteroidFov:135,asteroidForwardTime:2600,asteroidWaitTime:2e3,asteroidDepressionRate:.5,asteroidTop:1,cubeResolution:2048,rotationAngleOfZ:0},this.VRhint="请取消屏幕翻转锁定后装入VR盒子中",this.camera=new THREE.PerspectiveCamera(this.cameraPara.fov,this.cameraPara.aspect,this.cameraPara.near,this.cameraPara.far),this.camera.lookAt(this._controlTarget),this.cameraEvt={controlGroup:function(){},updatePosition:function(){},hover:function(){},leave:function(){}},this._takeScreenShot=!1,this.timerList={},this.camera.position.set(this.cameraPosition.x,this.cameraPosition.y,this.cameraPosition.z),this.loadProgressManager=new THREE.LoadingManager(function(e){console.log("loaded")},function(e,t,i){console.log("item=",e,"loaded",t,"total=",i)},function(e,t){console.log(e,t)}),this.scene.add(this.camera),this.scene.add(this.VRObject),this.effect=r.stereoEffect(this.renderer),r.bindOrientationEvent(this,this._controlTarget)};t.prototype.destroy=function(){var e=this;e.video&&(e.video.pause(),e.video=null),e.audio&&(e.audio.pause(),e.audio=null),e.hlsPlayer&&e.hlsPlayer.destroy(),e.flvPlayer&&e.flvPlayer.destroy();for(var t in e.timerList)clearInterval(e.timerList[t]);e.destoryed=!0},t.prototype.init=function(e){function t(){f.controls&&f.controls.reset()}function i(e){y.isMouseDown=!0;var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;p.set(t,i),g.set(t,i),f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!0}function o(e){y.isMouseDown=!1}function n(e){if(e.preventDefault(),f.autoHideLeftTime=f.defaultAutoHideLeftTime,f.toolBar.isActive=!0,y.isMouseDown){var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY,r=g.y-i;r>=5&&s(6),r<=-5&&s(-10),g.set(t,i)}}function a(e){if(void 0===f.controls.defaultDampingFactor&&(f.controls.defaultDampingFactor=f.controls.dampingFactor),void 0===f.controls.object.defaultFov&&(f.controls.object.defaultFov=f.controls.object.fov),e){var t=0,i=[];[].forEach.call(e,function(e){var r=b[e.identifier];if(r&&(r.y=e.pageY,r.x=e.pageX,i.push(e.identifier)),t++,t>=2){var o=b[i[0]],n=b[i[1]],a=Math.sqrt(Math.pow(o.x-n.x,2)+Math.pow(o.y-n.y,2)),s=(a-w)/4;return f.controls.object.fov-s<140&&f.controls.object.fov-s>10&&w&&(f.controls.enable=!1,f.controls.object.fov-=s,f.controls.dampingFactor=f.controls.defaultDampingFactor*f.controls.object.defaultFov/f.controls.object.fov),w=a,void(t=0)}})}}function s(e){clearInterval(f.timerList.slideBarAniateTimer),f.timerList.slideBarAniateTimer=animateTimer=setInterval(function(){var t=y.toolbar.clientHeight+e;t>=y.defaultHeight&&t<=y.defaultMaxHeight?(y.toolbar.style.height=t+"px",y.isActive=!0):(clearInterval(animateTimer),e>0?(y.isActive=!0,y.moreBtn.style.transform="rotate(-180deg)",y.moreBtn.style.webkitTransform="rotate(-180deg)",y.toolbar.style.height=y.defaultMaxHeight+"px",y.about.style.display="block"):(y.isActive=!1,y.moreBtn.style.transform="rotate(0deg)",y.moreBtn.style.webkitTransform="rotate(0deg)",y.toolbar.style.height=y.defaultHeight+"px",y.about.style.display="none")),f.autoHideLeftTime=f.defaultAutoHideLeftTime},1)}function c(e){f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!0;var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;y.isMouseDown&&(y.moreList.scrollLeft+=2.5*(g.x-t)),g.set(t,i)}function l(e){f.camera.fov+=.05*e,f.camera.updateProjectionMatrix()}function d(e){if(e.style.borderColor="green",e.style.color="green",f.cameraEvt.controlGroup.length){var t=f.cameraEvt.controlGroup.getObjectByName("__focus");t.visible=!0}}function u(e){if(e.style.borderColor="white",e.style.color="white",f.cameraEvt.controlGroup.length){var t=f.cameraEvt.controlGroup.getObjectByName("__focus");t.visible=!1}}function m(){var e=f.video||f.audio;if(e){var t=r.getBoundingClientRect(f.container);y.voice_bar.style.display="block";var i,o=y.voice_bar,n=o.firstChild,a=n.firstChild,s=(a.firstChild,!1),c=0,l=0;e.volume=f.defaultVolume;var d=y.voice_bar.clientHeight,u=(f.container.clientHeight-d)/2,m=d+u;a.style.height=e.volume*d+"px",o.addEventListener("mousedown",function(e){o.style.opacity=1},!1),n.addEventListener("click",function(i){var r=(i.clientY||i.changedTouches[0].clientY)-t.top;f.voiceHideLeftTime=f.defaultVoiceHideLeftTime;var o=m-r;o/d<=1&&(a.style.height=o+"px",e.volume=o/d)},!1),o.addEventListener("mouseout",function(e){s=!1},!1),o.addEventListener("mousedown",function(e){s=!0},!1),o.addEventListener("mouseup",function(e){s=!1},!1),o.addEventListener("mousemove",function(i){var r=(i.clientY||i.changedTouches[0].clientY)-t.top;if(f.voiceHideLeftTime=f.defaultVoiceHideLeftTime,s){var o=m-r;a.style.height=o+"px",o/d<=1&&(e.volume=o/d)}},!1),o.addEventListener("touchstart",function(e){e.preventDefault(),f.voiceHideLeftTime=f.defaultVoiceHideLeftTime,i=a.clientHeight,c=e.touches[0].pageY,o.style.opacity=1},!1),o.addEventListener("touchmove",function(t){t.preventDefault(),f.voiceHideLeftTime=f.defaultVoiceHideLeftTime,l=t.touches[0].pageY;var r=i+(c-l);r/d<=1&&(a.style.height=r+"px",e.volume=r/d)},!1),o.addEventListener("touchend",function(e){i=0},!1),clearInterval(f.timerList.voiceBarActiveTimer),f.timerList.voiceBarActiveTimer=setInterval(function(){f.voiceHideLeftTime<=0?o.style.opacity=0:f.toolBar.isActive?null:f.voiceHideLeftTime--},1e3)}}function h(){if(!f.destoryed){var t=f.container.offsetWidth,i=f.container.offsetHeight;if(f.camera.aspect=t/i,r.isMobileDevice()&&r.isCrossScreen()?(f.cameraEvt.updatePosition(),f.effect.setSize(t,i),f.effect.render(f.scene,f.camera)):(f.renderer.setSize(t,i),f.renderer.setClearColor(new THREE.Color(16777215)),f.renderer.render(f.scene,f.camera)),f._takeScreenShot){f._takeScreenShot=!1;var o=f.renderer.domElement.toDataURL("image/jpeg");f._takeScreenShotCallback(o)}f.camera.updateProjectionMatrix(),f.controls&&f.controls.update(),e()}}function v(){h(),requestAnimationFrame(v)}var f=this,p=new THREE.Vector2,g=new THREE.Vector2;f.toolBar=r.toolBar(f.container);var E,T,y=f.toolBar,b={},w=0;y.defaultHeight=y.toolbar.clientHeight,y.defaultMaxHeight=5*y.defaultHeight,y.isMouseDown=!1,f.container.addEventListener("click",function(){f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.toolbar.style.display="block"}),y.gyroBtn.addEventListener("click",function(){f.gyroBtnClick()},!1),y.vrBtn.addEventListener("click",function(){f.vrBtnClick()},!1),y.moreBtn.addEventListener("click",function(){f.moreBtnClick()},!1),f.container.addEventListener("touchstart",function(e){f.touchStart(e)},!1),f.container.addEventListener("touchmove",function(e){f.touchMove(e)},!1),f.container.addEventListener("touchend",function(e){f.touchEnd(e)},!1),y.gyroResetBtn.addEventListener("click",t,!1),y.toolbar.addEventListener("mousedown",i,!1),y.toolbar.addEventListener("touchstart",i,!1),y.toolbar.addEventListener("mousemove",n,!1),y.toolbar.addEventListener("touchmove",n,!1),y.toolbar.addEventListener("mouseup",o,!1),y.toolbar.addEventListener("touchend",o,!1),y.toolbar.addEventListener("mouseout",function(e){f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!1},!1),f.renderer.domElement.addEventListener("wheel",function(e){var t=e.deltaY>0?15:-15;f.camera.fov+.05*t>=10&&f.camera.fov+.05*t<=120&&l(t)},!1),y.moreList.addEventListener("mousemove",c,!1),y.moreList.addEventListener("touchmove",c,!1),f.moreBtnClick=function(e){s(y.toolbar.clientHeight>y.defaultHeight?-10:6)},f.vrBtnClick=function(e){var t=f.toolBar.vrBtn;r.isMobileDevice()?r.OS.isWeixin()&&!r.OS.isiOS()?"landscape"==f.video.getAttribute("x5-video-orientation")?(f.video.setAttribute("x5-video-orientation","portraint"),u(t)):(f.video.setAttribute("x5-video-orientation","landscape"),d(t)):r.isCrossScreen()?(d(t),r.fullscreen(f.container)):(u(t),r.msgBox(f.VRhint,5,f.container)):(t.getAttribute("fullscreen")?(u(t),t.removeAttribute("fullscreen")):(d(t),t.setAttribute("fullscreen","true")),r.fullscreen(f.container))},f.gyroBtnClick=function(e){var t=f.toolBar.gyroBtn;"active"==t.getAttribute("active")?(f.controls.gyroFreeze(),u(t),u(y.circle1),u(y.circle2),t.removeAttribute("active")):(f.controls.gyroUnfreeze(),t.setAttribute("active","active"),d(t),d(y.circle1),d(y.circle2))},f.touchStart=function(e){e.targetTouches&&([].forEach.call(e.targetTouches,function(e){b[e.identifier]||(b[e.identifier]=new THREE.Vector2(0,0))}),clearInterval(f.timerList.renderTouchersRimer),f.timerList.renderTouchersRimer=setInterval(function(){a(E)},1))},f.touchEnd=function(e){e.targetTouches&&([].forEach.call(e.changedTouches,function(e){var t=b[e.identifier];t&&delete b[e.identifier]}),0===e.targetTouches.length&&(w=0,f.controls.enable=!0,clearInterval(T)))},f.touchMove=function(e){E=e.touches},f.windowResize=function(){r.isFullscreen()?r.isMobileDevice()?r.isCrossScreen()?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn):d(f.toolBar.vrBtn):r.OS.isWeixin()&&!r.OS.isiOS()?("landscape"==f.video.getAttribute("x5-video-orientation")?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn),r.isCrossScreen()?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn)):(r.isCrossScreen()?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn),u(f.toolBar.vrBtn))},window.addEventListener("resize",function(){m()},!1),f._play=function(){y.btn.style.border="none",y.btn.style.fontWeight=800,y.btn.innerHTML="||"},f._pause=function(){y.btn.innerText="",y.btn.style.borderTop="0.6rem solid transparent",y.btn.style.borderLeft="1rem solid white",y.btn.style.borderBottom="0.6rem solid transparent"},f.bindVolumeBar=m,v(),clearInterval(f.timerList.toolBarAutoHideTimer),f.timerList.toolBarAutoHideTimer=setInterval(function(){y.isActive||(f.autoHideLeftTime<0?(y.toolbar.style.display="none",f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!1):f.autoHideLeftTime--),f.windowResize()},1e3)},t.prototype.takeScreenShot=function(e){this._takeScreenShot=!0,this._takeScreenShotCallback=e},t.prototype.playPanorama=function(e,t){function i(){v.hlsPlayer=new Hls(v.hlsConfig),v.hlsPlayer.loadSource(e),v.hlsPlayer.attachMedia(L),v.hlsPlayer.on(Hls.Events.MANIFEST_PARSED,function(){L.play()})}function o(){var t=r.createTag("source",{src:e,type:"application/x-mpegURL"},null);L.appendChild(t)}function n(){L.src=e,L.addEventListener("loadedmetadata",function(){L.play()})}function a(e){L.paused?(v._play(),L.play(),v.videoPlayHook()):(v._pause(),L.pause(),v.videoPauseHook())}function s(e){rect=r.getBoundingClientRect(v.container);var t=(e.clientX||e.changedTouches[0].clientX)-rect.left;L.currentTime=L.duration*(t/this.clientWidth)}function c(e){v.video.buffTimer||(clearInterval(v.timerList.videoBuffTimer),v.timerList.videoBuffTimer=v.video.buffTimer=setInterval(function(e){var t=0;0!=L.buffered.length&&(t+=L.buffered.end(0)),t>=L.duration&&clearInterval(v.video.buffTimer),f.loadedProgress.style.width=t/L.duration*100+"%"},500))}function l(e,t){t=t||!1,material=new THREE.MeshBasicMaterial({overdraw:!0,map:e});var i=v.VRObject.getObjectByName("__mxrealityDefault");if(i)i.material=material,i.visible=!0;else{var r=-Math.PI/2,o=new THREE.SphereBufferGeometry(v.vrbox.radius,v.vrbox.widthSegments,v.vrbox.heightSegments,r);o.scale(-1,1,1),mesh=new THREE.Mesh(o,material),mesh.visible=!0,mesh.name="__mxrealityDefault",t&&(mesh.matrixAutoUpdate=!1,mesh.updateMatrix(),v.toolBar.timeInfo.style.display="none"),v.VRObject.add(mesh)}v.asteroidConfig.enable&&(v.asteroidForward=function(e){d(e)})}function d(e){v.controls&&(v.controls.reset(),v.controls.enable=!1);var t=v.asteroidConfig,i=v.camera.fov,r=v._containerRadius*(.9*v._cubeCameraTimes);v.camera.position.y=r*t.asteroidTop,v.camera.rotation.x=THREE.Math.degToRad(-90),v.camera.fov=t.asteroidFov;var o=t.asteroidForwardTime*t.asteroidFPS/300,n=r/o,a=v.camera.fov-i,s=a/o,c=(Math.PI/2/o,!1),l=!1,d=new THREE.Vector3(v._controlTarget.x,v._controlTarget.y,v._controlTarget.z);setTimeout(function(){v.timerList.asteroidForwardTimer=asteroidForwardTimer=setInterval(function(){t.asteroidTop*v.camera.position.y-n>=0?(v.camera.position.y-=n*t.asteroidTop,v.camera.lookAt(d),d.z*=1.25):c=!0,v.camera.fov-s>=i?v.camera.fov-=s:l=!0,c&&l&&(clearInterval(asteroidForwardTimer),v.controls.enable=!0,v.camera.position.y=0,v.camera.fov=i,void 0!==e&&e())},t.asteroidFPS)},t.asteroidWaitTime)}var u=["__mxrealitySkybox","__mxrealitySlice","__mxrealityDefault"];for(var m in u){var h=this.VRObject.getObjectByName(u[m]);h&&(h.visible=!1),this.cubeCameraSphere&&(this.cubeCameraSphere.visible=!1)}var v=this,f=v.toolBar;if(v._containerRadius=v.resType.box==t||v.resType.slice==t?v.vrbox.width/2:v.vrbox.radius,v.autoHideLeftTime=v.defaultAutoHideLeftTime,v.voiceHideLeftTime=v.defaultVoiceHideLeftTime,v.resType.box==t){v.toolBar.timeInfo.style.display="none";var p=[],g=[],E=new Image;E.crossOrigin="Anonymous",E.src=e,E.onload=function(){for(var e,t,i=E.height,r=0;r<6;r++)p[r]=new THREE.Texture,e=document.createElement("canvas"),t=e.getContext("2d"),e.height=i,e.width=i,t.drawImage(E,i*r,0,i,i,0,0,i,i),p[r].image=e,p[r].needsUpdate=!0,g.push(new THREE.MeshBasicMaterial({map:p[r]}));var o=v.VRObject.getObjectByName("__mxrealitySkybox");if(o)o.material=g;else{var o=new THREE.Mesh(new THREE.CubeGeometry(v.vrbox.width,v.vrbox.height,v.vrbox.depth),new THREE.MultiMaterial(g));o.applyMatrix((new THREE.Matrix4).makeScale(1,1,-1)),o.visible=!0,o.name="__mxrealitySkybox",o.matrixAutoUpdate=!1,o.updateMatrix(),v.VRObject.add(o),f.btn.addEventListener("click",function(e){v.controls.autoRotate?v._pause():v._play(),v.controls.autoRotate=!v.controls.autoRotate})}v.loadProgressManager.onLoad()}}else if(v.resType.slice==t){v.toolBar.timeInfo.style.display="none";var T=new THREE.TextureLoader(v.loadProgressManager);T.mapping=THREE.UVMapping;for(var g=[],m=0;m=0){if(v.video)for(var L=v.video,P=0;P.499){a=2*Math.atan2(e,r),o=Math.PI/2,n=0;var c=new THREE.Vector3(o,n,a);return c}if(s<-.499){a=-2*Math.atan2(e,r),o=-Math.PI/2,n=0;var c=new THREE.Vector3(o,n,a);return c}var l=e*e,d=t*t,u=i*i;a=Math.atan2(2*t*r-2*e*i,1-2*d-2*u),o=Math.asin(2*s),n=Math.atan2(2*e*r-2*t*i,1-2*l-2*u);var c=new THREE.Vector3(o,n,a);return c}function s(e,t){return 2*Math.PI*e/t*g.rotateSpeed}function c(e,t){return 2*Math.PI*e/t*g.rotateSpeed}function l(e){_=!0;var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;w.set(t,i)}function d(e){var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;x.set(t,i),R.subVectors(x,w);var r=void 0!==g.domElement.clientWidth?g.domElement.clientWidth:window.innerWidth;o(s(R.x,r));var a=void 0!==g.domElement.clientHeight?g.domElement.clientHeight:window.innerHeight;n(c(R.y,a)),w.copy(x)}function u(e){_=!1}function m(e){_=!0,w.set(e.touches[0].pageX,e.touches[0].pageY),g.usingGyro=!1}function h(e){e.preventDefault(),x.set(e.touches[0].pageX,e.touches[0].pageY),R.subVectors(x,w);var t=void 0!=g.domElement.clientWidth?g.domElement.clientWidth:window.innerWidth;o(s(R.x,t));var i=void 0!==g.domElement.clientHeight?g.domElement.clientHeight:window.innerHeight;n(c(R.y,i)),w.copy(x),H.x+=s(R.x,t)+c(R.y,i),g.usingGyro=!1}function v(e){g.usingGyro=!!r.OS.isMobile(),_=!1}function f(e){g.deviceOrientation=e,void 0===g.beginAlpha&&(g.beginAlpha=g.deviceOrientation.alpha)}function p(e){g.screenOrientation=window.orientation||0}this.domElement=void 0!==t?t:document,this.object=e,this.object.rotation.reorder("YXZ"),this.enable=!0,this.target=new THREE.Vector3,this.minPolarAngle=0,this.maxPolarAngle=Math.PI,this.minAzimuthAngle=-(1/0),this.maxAzimuthAngle=1/0,this.enableDamping=!1,this.dampingFactor=.05,this.rotateSpeed=.25,this.autoRotate=!1,this.autoRotateSpeed=1,this.deviceOrientation={},this.screenOrientation=0;var g=this;g.defaultDirectionOfRotation=!0,g.gyroEnable=!1,g.usingGyro=!!r.OS.isMobile(),g._defaultTargetY=g.target.y,g._defaultCameraFov=g.object.fov,g._defaultCameraY=g.object.position.y;var E={type:"change"},T=1e-6,y=new THREE.Spherical,b=new THREE.Spherical,w=new THREE.Vector2,x=new THREE.Vector2,R=new THREE.Vector2,H=new THREE.Vector3(0,0,0),C=0,S=0,L=0,P=0,M=0;this.target0=this.target.clone(),this.position0=this.object.position.clone(),this.rotation0=this.object.rotation.clone(),this.zoom0=this.object.zoom,this.arrowLeft=37,this.arrowUp=38,this.arrowRight=39,this.arrowDown=40,this.arrowSpeed=.05,this.getPolarAngle=function(){return y.phi},this.getAzimuthalAngle=function(){return y.theta},this.saveState=function(){g.target0.copy(g.target),g.position0.copy(g.object.position),g.rotation0.copy(g.object.rotation),g.zoom0=g.object.zoom},this.reset=function(e){this.resetVar(),g.dispatchEvent(E),e&&e.target0?g.target.copy(e.target0):g.target.copy(g.target0),e&&e.position0?g.object.position.copy(e.position0):g.object.position.copy(g.position0),e&&e.rotation0?g.object.rotation.copy(e.rotation0):g.object.rotation.copy(g.rotation0),e&&e.zoom0?g.zoom=zoom0:g.zoom0},this.resetVar=function(){L=0,P=0,M=0,C=0,S=0};var A=function(){var e=new THREE.Vector3(0,0,1),t=new THREE.Euler,i=new THREE.Quaternion,r=new THREE.Quaternion((-Math.sqrt(.5)),0,0,Math.sqrt(.5)); -return function(o,n,a,s,c){t.set(a,n,-s,"YXZ"),o.setFromEuler(t),o.multiply(r),o.multiply(i.setFromAxisAngle(e,-c))}}();this.update=function(){var t=new THREE.Vector3,r=(new THREE.Quaternion).setFromUnitVectors(e.up,new THREE.Vector3(0,1,0)),n=r.clone().inverse(),s=new THREE.Vector3,c=new THREE.Quaternion;return function(e){if(g.enable){e=e||{};var l=g.deviceOrientation.alpha?THREE.Math.degToRad(void 0===g.beginAlpha?g.deviceOrientation.alpha:g.deviceOrientation.alpha-g.beginAlpha):0,d=g.deviceOrientation.beta?THREE.Math.degToRad(g.deviceOrientation.beta):0,u=g.deviceOrientation.gamma?THREE.Math.degToRad(g.deviceOrientation.gamma):0,m=g.screenOrientation?THREE.Math.degToRad(g.screenOrientation):0;g.gyroEnable?(L=l,P=d,M=u):(l=L,d=P,u=M);var h=(new THREE.Quaternion).copy(g.object.quaternion);A(h,l,d,u,m);var v=a(h.x,h.y,h.z,h.w);e.init||o(C-v.z),S=v.y,C=v.z;var f=g.object.position;return t.copy(f).sub(g.target),t.applyQuaternion(r),y.setFromVector3(t),g.autoRotate&&o(i()),y.theta+=b.theta,y.phi+=b.phi,y.theta=Math.max(g.minAzimuthAngle,Math.min(g.maxAzimuthAngle,y.theta)),y.phi=Math.max(g.minPolarAngle,Math.min(g.maxPolarAngle,y.phi)),y.makeSafe(),t.setFromSpherical(y),t.applyQuaternion(n),f.copy(g.target).add(t),g.deviceOrientation&&g.gyroEnable?A(g.object.quaternion,l+Math.PI+H.x,d+H.y,u+H.z,m):g.object.lookAt(g.target),g.enableDamping&&!g.gyroEnable?(b.theta*=1-g.dampingFactor,b.phi*=1-g.dampingFactor):b.set(0,0,0),(s.distanceToSquared(g.object.position)>T||8*(1-c.dot(g.object.quaternion))>T)&&(g.dispatchEvent(E),s.copy(g.object.position),c.copy(g.object.quaternion),!0)}}}();var _=!1,k=null;"undefined"!=typeof DeviceMotionEvent&&(k=DeviceMotionEvent),"undefined"!=typeof DeviceOrientationEvent&&(k=DeviceOrientationEvent),window.addEventListener("orientationchange",p,!1),window.addEventListener("deviceorientation",f,!1),k&&"function"==typeof k.requestPermission&&window.addEventListener("click",function(){k.requestPermission().then(function(e){"granted"===e&&(window.addEventListener("devicemotion",p,!1),window.addEventListener("deviceorientation",f,!1))})["catch"](function(e){r.msgBox(e,3,document.body)})}),this.gyroFreeze=function(){g.gyroEnable=!1},this.gyroUnfreeze=function(){g.gyroEnable=!0},this.rotationLeft=o,this.rotationUp=n;var B=0,I=0;document.addEventListener("keydown",function(e){var t=e||window.event||arguments.callee.caller.arguments[0];t&&(t.keyCode==g.arrowLeft&&(I=1),t.keyCode==g.arrowRight&&(I=-1),t.keyCode==g.arrowUp&&(B=1),t.keyCode==g.arrowDown&&(B=-1),o(I*g.arrowSpeed),n(B*g.arrowSpeed))}),document.addEventListener("keyup",function(e){var t=e||window.event||arguments.callee.caller.arguments[0];t&&(t.keyCode==g.arrowLeft&&(I=0),t.keyCode==g.arrowRight&&(I=0),t.keyCode==g.arrowUp&&(B=0),t.keyCode==g.arrowDown&&(B=0))}),this.domElement.addEventListener("mousedown",l,!1),this.domElement.addEventListener("mousemove",function(e){g.enable&&_&&d(e)},!1),this.domElement.addEventListener("mouseup",u,!1),this.domElement.addEventListener("touchstart",m,!1),this.domElement.addEventListener("touchend",v,!1),this.domElement.addEventListener("touchmove",h,!1);var V=void 0!==this.domElement.clientWidth?this.domElement.clientWidth:window.innerWidth,F=void 0!==this.domElement.clientHeight?this.domElement.clientHeight:window.innerHeight;return w.set(V/2,F/2),setTimeout(function(){g.update({init:!0}),g.saveState()},10),this};return i.prototype=Object.create(THREE.EventDispatcher.prototype),i.prototype.constructor=i,new i(e,t)},setCameraPara:function(e,t,i){if(e.cameraPara={fov:90,aspect:e.container.innerWidth/e.container.innerHeight,near:.001,far:1e3},e.cameraPosition={x:0,y:0,z:0},t)for(var r in t)e.cameraPara[r]=t[r];if(i)for(var r in i)e.cameraPosition[r]=i[r]},formatSeconds:function(e){var t=parseInt(e);if(!t)return"00:00";var i=0,r=0;t>60&&(i=parseInt(t/60),t=parseInt(t%60),i>60&&(r=parseInt(i/60),i=parseInt(i%60)));var o=""+(parseInt(t)<10?"0"+parseInt(t):parseInt(t));return o=i>=0&&r>0?(parseInt(r)<10?"0"+parseInt(r):parseInt(r))+":"+(parseInt(i)<10?"0"+parseInt(i):parseInt(i))+":"+o:i>0&&0==r?60==i?"01:00:"+o:(parseInt(i)<10?"0"+parseInt(i):parseInt(i))+":"+o:60==t?"01:00":"00:"+o},cameraVector:function(e,t){var i=new THREE.Vector3(0,0,(-1)),r=i.applyQuaternion(e.quaternion),o=r.clone(),n=new THREE.Vector3;return t&&(n.x=r.x*t,n.y=r.y*t,n.z=r.z*t),{vector:o,timesVector:n}},bindRaycaster:function(e,t,i){var o=r.screenPosTo3DCoordinate(e,t.container,t.camera),n=new THREE.Raycaster(t.camera.position,o.sub(t.camera.position).normalize()),a=n.intersectObjects(t.scene.children,!0);a.length?i.success(a):i.empty()},bindCameraEvent:function(e,t){t=t||{trigger:function(e){},empty:function(e){},move:function(e){}};var i=this,r=t.scale||.022,o=t.vectorRadius,n=o*r,a=o*(r/6),s=2,c=t.tubularSegments||60,l=t.speed||36,d=new THREE.Group;d.name="__controlHandle";for(var u=new THREE.TorusGeometry(n,a,s,c,2*Math.PI),m=[],h=0;h-1,android:/android/i.test(navigator.userAgent.toLowerCase()),ios:/(iphone|ipad|ipod|ios)/i.test(navigator.userAgent.toLowerCase()),googlePixel:navigator.userAgent.match(/;\sPixel\sBuild\//),MiOS:navigator.userAgent.match(/;\sMI\s\d\sBuild\//),samsungOS:navigator.userAgent.match(/;\sSM\-\w+\sBuild\//),isGooglePixel:function(){return null!=this.googlePixel},isMiOS:function(){return null!=this.MiOS},isSamsung:function(){return null!=this.samsungOS},isMobile:function(){return this.android||this.ios},isAndroid:function(){return this.android},isiOS:function(){return this.ios},isWeixin:function(){return this.weixin}},Broswer:{win:window,nav:window.navigator,REG_APPLE:/^Apple/,ie:navigator.userAgent.match(/MSIE\s([\d.]+)/)||navigator.userAgent.match(/Trident\/[\d](?=[^\?]+).*rv:([0-9.].)/),edge:navigator.userAgent.match(/Edge\/([\d.]+)/),chrome:navigator.userAgent.match(/Chrome\/([\d.]+)/)||navigator.userAgent.match(/CriOS\/([\d.]+)/),webview:!this.chrome&&navigator.userAgent.match(/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/),safari:this.webview||navigator.userAgent.match(/Version\/([\d.]+)([^S](Safari)|[^M]*(Mobile)[^S]*(Safari))/),chromiumType:null,_getChromiumType:function(){if(null!=this.chromiumType)return this.chromiumType;var e=this.win;return this.isIE()||void 0===e.scrollMaxX||this.REG_APPLE.test(this.nav.vendor||"")?"":this._testExternal(/^sogou/i,0)?"sogou":this._testExternal(/^liebao/i,0)?"liebao":this.nav.mimeTypes[30]||!this.nav.mimeTypes.length?"360":e.clientInformation&&e.clientInformation.permissions?"chrome":""},_testExternal:function(e,t){var i=this.win.external||{};for(var r in i)if(e.test(t?i[r]:r))return!0;return!1},isIE:function(){return null!=this.ie},ieVersion:function(){return null!=this.ie&&parseInt(this.ie[1])},isEdge:function(){return null!=this.edge},isSafari:function(){return null!=this.safari},is360:function(){return this.chromiumType=this._getChromiumType(),"360"===this.chromiumType},isSogou:function(){return this.chromiumType=this._getChromiumType(),"sogou"===this.chromiumType},isChromium:function(){return"chrome"===this._getChromiumType()},webglAvailable:function(){try{var e=document.createElement("canvas");return!(!window.WebGLRenderingContext||!e.getContext("webgl")&&!e.getContext("experimental-webgl"))}catch(t){return!1}}},getBoundingClientRect:function(e){var t=e.getBoundingClientRect(),i=t.top-document.documentElement.clientTop+document.documentElement.scrollTop,r=t.bottom,o=t.left-document.documentElement.clientLeft+document.documentElement.scrollLeft,n=t.right,a=t.width||n-o,s=t.height||r-i;return{top:i,right:n,bottom:r,left:o,width:a,height:s}}},o=document.getElementsByTagName("head")[0];o.appendChild(r.createTag("meta",{name:"viewport",content:"width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0,minimal-ui,user-scalable=no"})),o.appendChild(r.createTag("meta",{name:"google",content:"notranslate"})),o.appendChild(r.createTag("meta",{name:"full-screen",content:"yes"})),r.debug&&(window.onerror=function(e,t,i){var o="There was an error on this page.\n\n";return o+="Error: "+e+"\n",o+="URL: "+t+"\n",o+="Line: "+i+"\n\n",r.msgBox(o,36,document.body),!0}),e.VR=t,e.AR=i,e.AVR=r}); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e)}(this,function(e){var t=function(e,t,i,n,r){this.scene=e,this.renderer=t,this.container=i,o.initDomStyle(i),o.setCameraPara(this,n,r),this.vrbox={radius:2,widthSegments:180,heightSegments:180,width:2,height:2,depth:2},this.liveSettings={forceUseHls:!1,forceUseVndAppleMpegUrl:!1,forceUseXmpegUrl:!1,usePlugin:!1,loadPlugin:function(e){console.log("load video",e)}},this.hlsConfig={autoStartLoad:!0},this.flvConfig={type:"flv",isLive:!0},this.destoryed=!1,this.video=null,this.audio=null,this.toolBar=null,this.clock=new THREE.Clock,this.VRObject=new THREE.Object3D,this.defaultAutoHideLeftTime=3,this.defaultVoiceHideLeftTime=2,this.defaultVolume=.3,this.sliceSegment=0,this._controlTarget=new THREE.Vector3(0,0,1e-4),this._cubeCameraTimes=.96,this.resType={video:"video",box:"box",slice:"slice",sliceVideo:"sliceVideo",flvVideo:"flvVideo"},this.videoPlayHook=function(){console.log("video play")},this.videoPauseHook=function(){console.log("video pause")},this.asteroidConfig={enable:!1,asteroidFPS:10,asteroidFov:135,asteroidForwardTime:2600,asteroidWaitTime:2e3,asteroidDepressionRate:.5,asteroidTop:1,cubeResolution:2048,rotationAngleOfZ:0},this.VRhint="请取消屏幕翻转锁定后装入VR盒子中",this.camera=new THREE.PerspectiveCamera(this.cameraPara.fov,this.cameraPara.aspect,this.cameraPara.near,this.cameraPara.far),this.camera.lookAt(this._controlTarget),this.cameraEvt={controlGroup:function(){},updatePosition:function(){},hover:function(){},leave:function(){}},this._takeScreenShot=!1,this.timerList={},this.camera.position.set(this.cameraPosition.x,this.cameraPosition.y,this.cameraPosition.z),this.loadProgressManager=new THREE.LoadingManager(function(e){console.log("loaded")},function(e,t,i){console.log("item=",e,"loaded",t,"total=",i)},function(e,t){console.log(e,t)}),this.scene.add(this.camera),this.scene.add(this.VRObject),this.effect=o.stereoEffect(this.renderer),o.bindOrientationEvent(this,this._controlTarget)};t.prototype.destroy=function(){var e=this;e.video&&(e.video.pause(),e.video=null),e.audio&&(e.audio.pause(),e.audio=null),e.hlsPlayer&&e.hlsPlayer.destroy(),e.flvPlayer&&e.flvPlayer.destroy();for(var t in e.timerList)clearInterval(e.timerList[t]);e.destoryed=!0},t.prototype.init=function(e){function t(){f.controls&&f.controls.reset()}function i(e){y.isMouseDown=!0;var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;p.set(t,i),g.set(t,i),f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!0}function n(e){y.isMouseDown=!1}function r(e){if(e.preventDefault(),f.autoHideLeftTime=f.defaultAutoHideLeftTime,f.toolBar.isActive=!0,y.isMouseDown){var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY,o=g.y-i;o>=5&&s(6),o<=-5&&s(-10),g.set(t,i)}}function a(e){if(void 0===f.controls.defaultDampingFactor&&(f.controls.defaultDampingFactor=f.controls.dampingFactor),void 0===f.controls.object.defaultFov&&(f.controls.object.defaultFov=f.controls.object.fov),e){var t=0,i=[];[].forEach.call(e,function(e){var o=w[e.identifier];if(o&&(o.y=e.pageY,o.x=e.pageX,i.push(e.identifier)),t++,t>=2){var n=w[i[0]],r=w[i[1]],a=Math.sqrt(Math.pow(n.x-r.x,2)+Math.pow(n.y-r.y,2)),s=(a-b)/4;return f.controls.object.fov-s<140&&f.controls.object.fov-s>10&&b&&(f.controls.enable=!1,f.controls.object.fov-=s,f.controls.dampingFactor=f.controls.defaultDampingFactor*f.controls.object.defaultFov/f.controls.object.fov),b=a,void(t=0)}})}}function s(e){clearInterval(f.timerList.slideBarAniateTimer),f.timerList.slideBarAniateTimer=animateTimer=setInterval(function(){var t=y.toolbar.clientHeight+e;t>=y.defaultHeight&&t<=y.defaultMaxHeight?(y.toolbar.style.height=t+"px",y.isActive=!0):(clearInterval(animateTimer),e>0?(y.isActive=!0,y.moreBtn.style.transform="rotate(-180deg)",y.moreBtn.style.webkitTransform="rotate(-180deg)",y.toolbar.style.height=y.defaultMaxHeight+"px",y.about.style.display="block"):(y.isActive=!1,y.moreBtn.style.transform="rotate(0deg)",y.moreBtn.style.webkitTransform="rotate(0deg)",y.toolbar.style.height=y.defaultHeight+"px",y.about.style.display="none")),f.autoHideLeftTime=f.defaultAutoHideLeftTime},1)}function c(e){f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!0;var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;y.isMouseDown&&(y.moreList.scrollLeft+=2.5*(g.x-t)),g.set(t,i)}function l(e){f.camera.fov+=.05*e,f.camera.updateProjectionMatrix()}function d(e){if(e.style.borderBottom="1px solid #ccc",f.cameraEvt.controlGroup.length){var t=f.cameraEvt.controlGroup.getObjectByName("__focus");t.visible=!0}}function u(e){if(e.style.borderBottom="none",f.cameraEvt.controlGroup.length){var t=f.cameraEvt.controlGroup.getObjectByName("__focus");t.visible=!1}}function h(){var e=f.video||f.audio;if(e){var t=o.getBoundingClientRect(f.container);y.voice_bar.style.display="block";var i,n=y.voice_bar,r=n.firstChild,a=r.firstChild,s=(a.firstChild,!1),c=0,l=0;e.volume=f.defaultVolume;var d=y.voice_bar.clientHeight,u=(f.container.clientHeight-d)/2,h=d+u;a.style.height=e.volume*d+"px",n.addEventListener("mousedown",function(e){n.style.opacity=1},!1),r.addEventListener("click",function(i){var o=(i.clientY||i.changedTouches[0].clientY)-t.top;f.voiceHideLeftTime=f.defaultVoiceHideLeftTime;var n=h-o;n/d<=1&&(a.style.height=n+"px",e.volume=n/d)},!1),n.addEventListener("mouseout",function(e){s=!1},!1),n.addEventListener("mousedown",function(e){s=!0},!1),n.addEventListener("mouseup",function(e){s=!1},!1),n.addEventListener("mousemove",function(i){var o=(i.clientY||i.changedTouches[0].clientY)-t.top;if(f.voiceHideLeftTime=f.defaultVoiceHideLeftTime,s){var n=h-o;a.style.height=n+"px",n/d<=1&&(e.volume=n/d)}},!1),n.addEventListener("touchstart",function(e){e.preventDefault(),f.voiceHideLeftTime=f.defaultVoiceHideLeftTime,i=a.clientHeight,c=e.touches[0].pageY,n.style.opacity=1},!1),n.addEventListener("touchmove",function(t){t.preventDefault(),f.voiceHideLeftTime=f.defaultVoiceHideLeftTime,l=t.touches[0].pageY;var o=i+(c-l);o/d<=1&&(a.style.height=o+"px",e.volume=o/d)},!1),n.addEventListener("touchend",function(e){i=0},!1),clearInterval(f.timerList.voiceBarActiveTimer),f.timerList.voiceBarActiveTimer=setInterval(function(){f.voiceHideLeftTime<=0?n.style.opacity=0:f.toolBar.isActive?null:f.voiceHideLeftTime--},1e3)}}function m(){if(!f.destoryed){var t=f.container.offsetWidth,i=f.container.offsetHeight;if(f.camera.aspect=t/i,o.isMobileDevice()&&o.isCrossScreen()?(f.cameraEvt.updatePosition(),f.effect.setSize(t,i),f.effect.render(f.scene,f.camera)):(f.renderer.setSize(t,i),f.renderer.setClearColor(new THREE.Color(16777215)),f.renderer.render(f.scene,f.camera)),f._takeScreenShot){f._takeScreenShot=!1;var n=f.renderer.domElement.toDataURL("image/jpeg");f._takeScreenShotCallback(n)}f.camera.updateProjectionMatrix(),f.controls&&f.controls.update(),e()}}function v(){m(),requestAnimationFrame(v)}var f=this,p=new THREE.Vector2,g=new THREE.Vector2;f.toolBar=o.toolBar(f.container);var E,T,y=f.toolBar,w={},b=0;y.defaultHeight=y.toolbar.clientHeight,y.defaultMaxHeight=5*y.defaultHeight,y.isMouseDown=!1,f.container.addEventListener("click",function(){f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.toolbar.style.display="block"}),y.gyroBtn.addEventListener("click",function(){f.gyroBtnClick()},!1),y.vrBtn.addEventListener("click",function(){f.vrBtnClick()},!1),y.moreBtn.addEventListener("click",function(){f.moreBtnClick()},!1),f.container.addEventListener("touchstart",function(e){f.touchStart(e)},!1),f.container.addEventListener("touchmove",function(e){f.touchMove(e)},!1),f.container.addEventListener("touchend",function(e){f.touchEnd(e)},!1),y.gyroResetBtn.addEventListener("click",t,!1),y.toolbar.addEventListener("mousedown",i,!1),y.toolbar.addEventListener("touchstart",i,!1),y.toolbar.addEventListener("mousemove",r,!1),y.toolbar.addEventListener("touchmove",r,!1),y.toolbar.addEventListener("mouseup",n,!1),y.toolbar.addEventListener("touchend",n,!1),y.toolbar.addEventListener("mouseout",function(e){f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!1},!1),f.renderer.domElement.addEventListener("wheel",function(e){var t=e.deltaY>0?15:-15;f.camera.fov+.05*t>=10&&f.camera.fov+.05*t<=120&&l(t)},!1),y.moreList.addEventListener("mousemove",c,!1),y.moreList.addEventListener("touchmove",c,!1),f.moreBtnClick=function(e){s(y.toolbar.clientHeight>y.defaultHeight?-10:6)},f.vrBtnClick=function(e){var t=f.toolBar.vrBtn;o.isMobileDevice()?o.OS.isWeixin()&&!o.OS.isiOS()?"landscape"==f.video.getAttribute("x5-video-orientation")?(f.video.setAttribute("x5-video-orientation","portraint"),u(t)):(f.video.setAttribute("x5-video-orientation","landscape"),d(t)):o.isCrossScreen()?(d(t),o.fullscreen(f.container)):(u(t),o.msgBox(f.VRhint,5,f.container)):(t.getAttribute("fullscreen")?(u(t),t.removeAttribute("fullscreen")):(d(t),t.setAttribute("fullscreen","true")),o.fullscreen(f.container))},f.gyroBtnClick=function(e){var t=f.toolBar.gyroBtn;"active"==t.getAttribute("active")?(f.controls.gyroFreeze(),u(t),t.removeAttribute("active")):(f.controls.gyroUnfreeze(),t.setAttribute("active","active"),d(t))},f.touchStart=function(e){e.targetTouches&&([].forEach.call(e.targetTouches,function(e){w[e.identifier]||(w[e.identifier]=new THREE.Vector2(0,0))}),clearInterval(f.timerList.renderTouchersRimer),f.timerList.renderTouchersRimer=setInterval(function(){a(E)},1))},f.touchEnd=function(e){e.targetTouches&&([].forEach.call(e.changedTouches,function(e){var t=w[e.identifier];t&&delete w[e.identifier]}),0===e.targetTouches.length&&(b=0,f.controls.enable=!0,clearInterval(T)))},f.touchMove=function(e){E=e.touches},f.windowResize=function(){o.isFullscreen()?o.isMobileDevice()?o.isCrossScreen()?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn):d(f.toolBar.vrBtn):o.OS.isWeixin()&&!o.OS.isiOS()?("landscape"==f.video.getAttribute("x5-video-orientation")?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn),o.isCrossScreen()?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn)):(o.isCrossScreen()?d(f.toolBar.vrBtn):u(f.toolBar.vrBtn),u(f.toolBar.vrBtn))},window.addEventListener("resize",function(){h()},!1),f._play=function(){y.btn.innerHTML=o.playerIcon.pauseSvg},f._pause=function(){y.btn.innerHTML=o.playerIcon.playSvg},f.bindVolumeBar=h,v(),clearInterval(f.timerList.toolBarAutoHideTimer),f.timerList.toolBarAutoHideTimer=setInterval(function(){y.isActive||(f.autoHideLeftTime<0?(y.toolbar.style.display="none",f.autoHideLeftTime=f.defaultAutoHideLeftTime,y.isActive=!1):f.autoHideLeftTime--),f.windowResize()},1e3)},t.prototype.takeScreenShot=function(e){this._takeScreenShot=!0,this._takeScreenShotCallback=e},t.prototype.playPanorama=function(e,t){function i(){v.hlsPlayer=new Hls(v.hlsConfig),v.hlsPlayer.loadSource(e),v.hlsPlayer.attachMedia(C),v.hlsPlayer.on(Hls.Events.MANIFEST_PARSED,function(){C.play()})}function n(){var t=o.createTag("source",{src:e,type:"application/x-mpegURL"},null);C.appendChild(t)}function r(){C.src=e,C.addEventListener("loadedmetadata",function(){C.play()})}function a(e){C.paused?(v._play(),C.play(),v.videoPlayHook()):(v._pause(),C.pause(),v.videoPauseHook())}function s(e){rect=o.getBoundingClientRect(v.container);var t=(e.clientX||e.changedTouches[0].clientX)-rect.left;C.currentTime=C.duration*(t/this.clientWidth)}function c(e){v.video.buffTimer||(clearInterval(v.timerList.videoBuffTimer),v.timerList.videoBuffTimer=v.video.buffTimer=setInterval(function(e){var t=0;0!=C.buffered.length&&(t+=C.buffered.end(0)),t>=C.duration&&clearInterval(v.video.buffTimer),f.loadedProgress.style.width=t/C.duration*100+"%"},500))}function l(e,t){t=t||!1,material=new THREE.MeshBasicMaterial({overdraw:!0,map:e});var i=v.VRObject.getObjectByName("__mxrealityDefault");if(i)i.material=material,i.visible=!0;else{var o=-Math.PI/2,n=new THREE.SphereBufferGeometry(v.vrbox.radius,v.vrbox.widthSegments,v.vrbox.heightSegments,o);n.scale(-1,1,1),mesh=new THREE.Mesh(n,material),mesh.visible=!0,mesh.name="__mxrealityDefault",t&&(mesh.matrixAutoUpdate=!1,mesh.updateMatrix(),v.toolBar.timeInfo.style.display="none"),v.VRObject.add(mesh)}v.asteroidConfig.enable&&(v.asteroidForward=function(e){d(e)})}function d(e){v.controls&&(v.controls.reset(),v.controls.enable=!1);var t=v.asteroidConfig,i=v.camera.fov,o=v._containerRadius*(.9*v._cubeCameraTimes);v.camera.position.y=o*t.asteroidTop,v.camera.rotation.x=THREE.Math.degToRad(-90),v.camera.fov=t.asteroidFov;var n=t.asteroidForwardTime*t.asteroidFPS/300,r=o/n,a=v.camera.fov-i,s=a/n,c=(Math.PI/2/n,!1),l=!1,d=new THREE.Vector3(v._controlTarget.x,v._controlTarget.y,v._controlTarget.z);setTimeout(function(){v.timerList.asteroidForwardTimer=asteroidForwardTimer=setInterval(function(){t.asteroidTop*v.camera.position.y-r>=0?(v.camera.position.y-=r*t.asteroidTop,v.camera.lookAt(d),d.z*=1.25):c=!0,v.camera.fov-s>=i?v.camera.fov-=s:l=!0,c&&l&&(clearInterval(asteroidForwardTimer),v.controls.enable=!0,v.camera.position.y=0,v.camera.fov=i,void 0!==e&&e())},t.asteroidFPS)},t.asteroidWaitTime)}var u=["__mxrealitySkybox","__mxrealitySlice","__mxrealityDefault"];for(var h in u){var m=this.VRObject.getObjectByName(u[h]);m&&(m.visible=!1),this.cubeCameraSphere&&(this.cubeCameraSphere.visible=!1)}var v=this,f=v.toolBar;if(v._containerRadius=v.resType.box==t||v.resType.slice==t?v.vrbox.width/2:v.vrbox.radius,v.autoHideLeftTime=v.defaultAutoHideLeftTime,v.voiceHideLeftTime=v.defaultVoiceHideLeftTime,v.resType.box==t){v.toolBar.timeInfo.style.display="none";var p=[],g=[],E=new Image;E.crossOrigin="Anonymous",E.src=e,E.onload=function(){for(var e,t,i=E.height,o=0;o<6;o++)p[o]=new THREE.Texture,e=document.createElement("canvas"),t=e.getContext("2d"),e.height=i,e.width=i,t.drawImage(E,i*o,0,i,i,0,0,i,i),p[o].image=e,p[o].needsUpdate=!0,g.push(new THREE.MeshBasicMaterial({map:p[o]}));var n=v.VRObject.getObjectByName("__mxrealitySkybox");if(n)n.material=g;else{var n=new THREE.Mesh(new THREE.CubeGeometry(v.vrbox.width,v.vrbox.height,v.vrbox.depth),new THREE.MultiMaterial(g));n.applyMatrix((new THREE.Matrix4).makeScale(1,1,-1)),n.visible=!0,n.name="__mxrealitySkybox",n.matrixAutoUpdate=!1,n.updateMatrix(),v.VRObject.add(n),f.btn.addEventListener("click",function(e){v.controls.autoRotate?v._pause():v._play(),v.controls.autoRotate=!v.controls.autoRotate})}v.loadProgressManager.onLoad()}}else if(v.resType.slice==t){v.toolBar.timeInfo.style.display="none";var T=new THREE.TextureLoader(v.loadProgressManager);T.mapping=THREE.UVMapping;for(var g=[],h=0;h=0){if(v.video)for(var C=v.video,M=0;M',pauseSvg:'',resetLookAtSvg:'',gyroSvg:'',vrSvg:'', +audioPlaySvg:'',audioPauseSvg:''},startGyro:function(e){function t(t){e(t)}window.addEventListener("deviceorientation",t,!1)},stereoEffect:function(e){this.separation=1,this.focalLength=15;var t,i,o,n,r,a,s,c,l,d,u,h,m=new THREE.Vector3,v=new THREE.Quaternion,f=new THREE.Vector3,p=new THREE.PerspectiveCamera,g=new THREE.PerspectiveCamera;return e.autoClear=!1,this.setSize=function(o,n){t=o/2,i=n,e.setSize(o,n)},this.render=function(E,T){E.updateMatrixWorld(),void 0===T.parent&&T.updateMatrixWorld(),T.matrixWorld.decompose(m,v,f),o=THREE.Math.radToDeg(2*Math.atan(Math.tan(.5*THREE.Math.degToRad(T.fov)))),c=T.near/this.focalLength,d=Math.tan(.5*THREE.Math.degToRad(o))*this.focalLength,l=.5*d*T.aspect,a=d*c,s=-a,u=(l+this.separation/2)/(2*l),h=1-u,n=2*l*c*h,r=2*l*c*u,p.projectionMatrix.makePerspective(-n,r,a,s,T.near,T.far),p.position.copy(m),p.quaternion.copy(v),p.translateX(-this.separation/2),g.projectionMatrix.makePerspective(-r,n,a,s,T.near,T.far),g.position.copy(m),g.quaternion.copy(v),g.translateX(this.separation/2),e.setViewport(0,0,2*t,i),e.setViewport(0,0,t,i),e.render(E,p),e.setViewport(t,0,t,i),e.render(E,g)},this},orbitControls:function(e,t){var i=function(e,t){function i(){return 2*Math.PI/60/60*g.autoRotateSpeed}function n(e){g.defaultDirectionOfRotation?g.usingGyro?w.theta-=e:w.theta+=e:w.theta-=e}function r(e){g.defaultDirectionOfRotation?g.usingGyro?w.phi-=e:w.phi+=e:w.phi-=e}function a(e,t,i,o){var n,r,a,s=e*t+i*o;if(s>.499){a=2*Math.atan2(e,o),n=Math.PI/2,r=0;var c=new THREE.Vector3(n,r,a);return c}if(s<-.499){a=-2*Math.atan2(e,o),n=-Math.PI/2,r=0;var c=new THREE.Vector3(n,r,a);return c}var l=e*e,d=t*t,u=i*i;a=Math.atan2(2*t*o-2*e*i,1-2*d-2*u),n=Math.asin(2*s),r=Math.atan2(2*e*o-2*t*i,1-2*l-2*u);var c=new THREE.Vector3(n,r,a);return c}function s(e,t){return 2*Math.PI*e/t*g.rotateSpeed}function c(e,t){return 2*Math.PI*e/t*g.rotateSpeed}function l(e){_=!0;var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;b.set(t,i)}function d(e){var t=e.clientX||e.changedTouches[0].clientX,i=e.clientY||e.changedTouches[0].clientY;x.set(t,i),R.subVectors(x,b);var o=void 0!==g.domElement.clientWidth?g.domElement.clientWidth:window.innerWidth;n(s(R.x,o));var a=void 0!==g.domElement.clientHeight?g.domElement.clientHeight:window.innerHeight;r(c(R.y,a)),b.copy(x)}function u(e){_=!1}function h(e){_=!0,b.set(e.touches[0].pageX,e.touches[0].pageY),g.usingGyro=!1}function m(e){e.preventDefault(),x.set(e.touches[0].pageX,e.touches[0].pageY),R.subVectors(x,b);var t=void 0!=g.domElement.clientWidth?g.domElement.clientWidth:window.innerWidth;n(s(R.x,t));var i=void 0!==g.domElement.clientHeight?g.domElement.clientHeight:window.innerHeight;r(c(R.y,i)),b.copy(x),H.x+=s(R.x,t)+c(R.y,i),g.usingGyro=!1}function v(e){g.usingGyro=!!o.OS.isMobile(),_=!1}function f(e){g.deviceOrientation=e,void 0===g.beginAlpha&&(g.beginAlpha=g.deviceOrientation.alpha)}function p(e){g.screenOrientation=window.orientation||0}this.domElement=void 0!==t?t:document,this.object=e,this.object.rotation.reorder("YXZ"),this.enable=!0,this.target=new THREE.Vector3,this.minPolarAngle=0,this.maxPolarAngle=Math.PI,this.minAzimuthAngle=-(1/0),this.maxAzimuthAngle=1/0,this.enableDamping=!1,this.dampingFactor=.05,this.rotateSpeed=.25,this.autoRotate=!1,this.autoRotateSpeed=1,this.deviceOrientation={},this.screenOrientation=0;var g=this;g.defaultDirectionOfRotation=!0,g.gyroEnable=!1,g.usingGyro=!!o.OS.isMobile(),g._defaultTargetY=g.target.y,g._defaultCameraFov=g.object.fov,g._defaultCameraY=g.object.position.y;var E={type:"change"},T=1e-6,y=new THREE.Spherical,w=new THREE.Spherical,b=new THREE.Vector2,x=new THREE.Vector2,R=new THREE.Vector2,H=new THREE.Vector3(0,0,0),L=0,S=0,C=0,M=0,P=0;this.target0=this.target.clone(),this.position0=this.object.position.clone(),this.rotation0=this.object.rotation.clone(),this.zoom0=this.object.zoom,this.arrowLeft=37,this.arrowUp=38,this.arrowRight=39,this.arrowDown=40,this.arrowSpeed=.05,this.getPolarAngle=function(){return y.phi},this.getAzimuthalAngle=function(){return y.theta},this.saveState=function(){g.target0.copy(g.target),g.position0.copy(g.object.position),g.rotation0.copy(g.object.rotation),g.zoom0=g.object.zoom},this.reset=function(e){this.resetVar(),g.dispatchEvent(E),e&&e.target0?g.target.copy(e.target0):g.target.copy(g.target0),e&&e.position0?g.object.position.copy(e.position0):g.object.position.copy(g.position0),e&&e.rotation0?g.object.rotation.copy(e.rotation0):g.object.rotation.copy(g.rotation0),e&&e.zoom0?g.zoom=zoom0:g.zoom0},this.resetVar=function(){C=0,M=0,P=0,L=0,S=0};var A=function(){var e=new THREE.Vector3(0,0,1),t=new THREE.Euler,i=new THREE.Quaternion,o=new THREE.Quaternion((-Math.sqrt(.5)),0,0,Math.sqrt(.5));return function(n,r,a,s,c){t.set(a,r,-s,"YXZ"),n.setFromEuler(t),n.multiply(o),n.multiply(i.setFromAxisAngle(e,-c))}}();this.update=function(){var t=new THREE.Vector3,o=(new THREE.Quaternion).setFromUnitVectors(e.up,new THREE.Vector3(0,1,0)),r=o.clone().inverse(),s=new THREE.Vector3,c=new THREE.Quaternion;return function(e){if(g.enable){e=e||{};var l=g.deviceOrientation.alpha?THREE.Math.degToRad(void 0===g.beginAlpha?g.deviceOrientation.alpha:g.deviceOrientation.alpha-g.beginAlpha):0,d=g.deviceOrientation.beta?THREE.Math.degToRad(g.deviceOrientation.beta):0,u=g.deviceOrientation.gamma?THREE.Math.degToRad(g.deviceOrientation.gamma):0,h=g.screenOrientation?THREE.Math.degToRad(g.screenOrientation):0;g.gyroEnable?(C=l,M=d,P=u):(l=C,d=M,u=P);var m=(new THREE.Quaternion).copy(g.object.quaternion);A(m,l,d,u,h);var v=a(m.x,m.y,m.z,m.w);e.init||n(L-v.z),S=v.y,L=v.z;var f=g.object.position;return t.copy(f).sub(g.target),t.applyQuaternion(o),y.setFromVector3(t),g.autoRotate&&n(i()),y.theta+=w.theta,y.phi+=w.phi,y.theta=Math.max(g.minAzimuthAngle,Math.min(g.maxAzimuthAngle,y.theta)),y.phi=Math.max(g.minPolarAngle,Math.min(g.maxPolarAngle,y.phi)),y.makeSafe(),t.setFromSpherical(y),t.applyQuaternion(r),f.copy(g.target).add(t),g.deviceOrientation&&g.gyroEnable?A(g.object.quaternion,l+Math.PI+H.x,d+H.y,u+H.z,h):g.object.lookAt(g.target),g.enableDamping&&!g.gyroEnable?(w.theta*=1-g.dampingFactor,w.phi*=1-g.dampingFactor):w.set(0,0,0),(s.distanceToSquared(g.object.position)>T||8*(1-c.dot(g.object.quaternion))>T)&&(g.dispatchEvent(E),s.copy(g.object.position),c.copy(g.object.quaternion),!0)}}}();var _=!1,B=null;"undefined"!=typeof DeviceMotionEvent&&(B=DeviceMotionEvent),"undefined"!=typeof DeviceOrientationEvent&&(B=DeviceOrientationEvent),window.addEventListener("orientationchange",p,!1),window.addEventListener("deviceorientation",f,!1),B&&"function"==typeof B.requestPermission&&window.addEventListener("click",function(){B.requestPermission().then(function(e){"granted"===e&&(window.addEventListener("devicemotion",p,!1),window.addEventListener("deviceorientation",f,!1))})["catch"](function(e){o.msgBox(e,3,document.body)})}),this.gyroFreeze=function(){g.gyroEnable=!1},this.gyroUnfreeze=function(){g.gyroEnable=!0},this.rotationLeft=n,this.rotationUp=r;var I=0,k=0;document.addEventListener("keydown",function(e){var t=e||window.event||arguments.callee.caller.arguments[0];t&&(t.keyCode==g.arrowLeft&&(k=1),t.keyCode==g.arrowRight&&(k=-1),t.keyCode==g.arrowUp&&(I=1),t.keyCode==g.arrowDown&&(I=-1),n(k*g.arrowSpeed),r(I*g.arrowSpeed))}),document.addEventListener("keyup",function(e){var t=e||window.event||arguments.callee.caller.arguments[0];t&&(t.keyCode==g.arrowLeft&&(k=0),t.keyCode==g.arrowRight&&(k=0),t.keyCode==g.arrowUp&&(I=0),t.keyCode==g.arrowDown&&(I=0))}),this.domElement.addEventListener("mousedown",l,!1),this.domElement.addEventListener("mousemove",function(e){g.enable&&_&&d(e)},!1),this.domElement.addEventListener("mouseup",u,!1),this.domElement.addEventListener("touchstart",h,!1),this.domElement.addEventListener("touchend",v,!1),this.domElement.addEventListener("touchmove",m,!1);var V=void 0!==this.domElement.clientWidth?this.domElement.clientWidth:window.innerWidth,F=void 0!==this.domElement.clientHeight?this.domElement.clientHeight:window.innerHeight;return b.set(V/2,F/2),setTimeout(function(){g.update({init:!0}),g.saveState()},10),this};return i.prototype=Object.create(THREE.EventDispatcher.prototype),i.prototype.constructor=i,new i(e,t)},setCameraPara:function(e,t,i){if(e.cameraPara={fov:90,aspect:e.container.innerWidth/e.container.innerHeight,near:.001,far:1e3},e.cameraPosition={x:0,y:0,z:0},t)for(var o in t)e.cameraPara[o]=t[o];if(i)for(var o in i)e.cameraPosition[o]=i[o]},formatSeconds:function(e){var t=parseInt(e);if(!t)return"00:00";var i=0,o=0;t>60&&(i=parseInt(t/60),t=parseInt(t%60),i>60&&(o=parseInt(i/60),i=parseInt(i%60)));var n=""+(parseInt(t)<10?"0"+parseInt(t):parseInt(t));return n=i>=0&&o>0?(parseInt(o)<10?"0"+parseInt(o):parseInt(o))+":"+(parseInt(i)<10?"0"+parseInt(i):parseInt(i))+":"+n:i>0&&0==o?60==i?"01:00:"+n:(parseInt(i)<10?"0"+parseInt(i):parseInt(i))+":"+n:60==t?"01:00":"00:"+n},cameraVector:function(e,t){var i=new THREE.Vector3(0,0,(-1)),o=i.applyQuaternion(e.quaternion),n=o.clone(),r=new THREE.Vector3;return t&&(r.x=o.x*t,r.y=o.y*t,r.z=o.z*t),{vector:n,timesVector:r}},bindRaycaster:function(e,t,i){var n=o.screenPosTo3DCoordinate(e,t.container,t.camera),r=new THREE.Raycaster(t.camera.position,n.sub(t.camera.position).normalize()),a=r.intersectObjects(t.scene.children,!0);a.length?i.success(a):i.empty()},bindCameraEvent:function(e,t){t=t||{trigger:function(e){},empty:function(e){},move:function(e){}};var i=this,o=t.scale||.022,n=t.vectorRadius,r=n*o,a=n*(o/6),s=2,c=t.tubularSegments||60,l=t.speed||36,d=new THREE.Group;d.name="__controlHandle";for(var u=new THREE.TorusGeometry(r,a,s,c,2*Math.PI),h=[],m=0;m-1,android:/android/i.test(navigator.userAgent.toLowerCase()),ios:/(iphone|ipad|ipod|ios)/i.test(navigator.userAgent.toLowerCase()),googlePixel:navigator.userAgent.match(/;\sPixel\sBuild\//),MiOS:navigator.userAgent.match(/;\sMI\s\d\sBuild\//),samsungOS:navigator.userAgent.match(/;\sSM\-\w+\sBuild\//),isGooglePixel:function(){return null!=this.googlePixel},isMiOS:function(){return null!=this.MiOS},isSamsung:function(){return null!=this.samsungOS},isMobile:function(){return this.android||this.ios},isAndroid:function(){return this.android},isiOS:function(){return this.ios},isWeixin:function(){return this.weixin}},Broswer:{win:window,nav:window.navigator,REG_APPLE:/^Apple/,ie:navigator.userAgent.match(/MSIE\s([\d.]+)/)||navigator.userAgent.match(/Trident\/[\d](?=[^\?]+).*rv:([0-9.].)/),edge:navigator.userAgent.match(/Edge\/([\d.]+)/),chrome:navigator.userAgent.match(/Chrome\/([\d.]+)/)||navigator.userAgent.match(/CriOS\/([\d.]+)/),webview:!this.chrome&&navigator.userAgent.match(/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/),safari:this.webview||navigator.userAgent.match(/Version\/([\d.]+)([^S](Safari)|[^M]*(Mobile)[^S]*(Safari))/),chromiumType:null,_getChromiumType:function(){if(null!=this.chromiumType)return this.chromiumType;var e=this.win;return this.isIE()||void 0===e.scrollMaxX||this.REG_APPLE.test(this.nav.vendor||"")?"":this._testExternal(/^sogou/i,0)?"sogou":this._testExternal(/^liebao/i,0)?"liebao":this.nav.mimeTypes[30]||!this.nav.mimeTypes.length?"360":e.clientInformation&&e.clientInformation.permissions?"chrome":""},_testExternal:function(e,t){var i=this.win.external||{};for(var o in i)if(e.test(t?i[o]:o))return!0;return!1},isIE:function(){return null!=this.ie},ieVersion:function(){return null!=this.ie&&parseInt(this.ie[1])},isEdge:function(){return null!=this.edge},isSafari:function(){return null!=this.safari},is360:function(){return this.chromiumType=this._getChromiumType(),"360"===this.chromiumType},isSogou:function(){return this.chromiumType=this._getChromiumType(),"sogou"===this.chromiumType},isChromium:function(){return"chrome"===this._getChromiumType()},webglAvailable:function(){try{var e=document.createElement("canvas");return!(!window.WebGLRenderingContext||!e.getContext("webgl")&&!e.getContext("experimental-webgl"))}catch(t){return!1}}},getBoundingClientRect:function(e){var t=e.getBoundingClientRect(),i=t.top-document.documentElement.clientTop+document.documentElement.scrollTop,o=t.bottom,n=t.left-document.documentElement.clientLeft+document.documentElement.scrollLeft,r=t.right,a=t.width||r-n,s=t.height||o-i;return{top:i,right:r,bottom:o,left:n,width:a,height:s}}},n=document.getElementsByTagName("head")[0];n.appendChild(o.createTag("meta",{name:"viewport",content:"width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0,minimal-ui,user-scalable=no"})),n.appendChild(o.createTag("meta",{name:"google",content:"notranslate"})),n.appendChild(o.createTag("meta",{name:"full-screen",content:"yes"})),o.debug&&(window.onerror=function(e,t,i){var n="There was an error on this page.\n\n";return n+="Error: "+e+"\n",n+="URL: "+t+"\n",n+="Line: "+i+"\n\n",o.msgBox(n,36,document.body),!0}),e.VR=t,e.AR=i,e.AVR=o}); \ No newline at end of file diff --git a/examples/vr_hls_live_video.html b/examples/vr_hls_live_video.html index 1eb06c3..7a8389b 100644 --- a/examples/vr_hls_live_video.html +++ b/examples/vr_hls_live_video.html @@ -57,10 +57,7 @@ } vr.loadProgressManager.onLoad=function () { // 视频静音 - // vr.video.muted=true; - setInterval(function () { - alert("mov:"+vr.video.duration); - },3000) + } //AVR.useGyroscope=false; vr.init(function () { diff --git a/src/mxreality.js b/src/mxreality.js index 65bd3f5..9cba269 100644 --- a/src/mxreality.js +++ b/src/mxreality.js @@ -222,15 +222,11 @@ if (gyroBtn.getAttribute("active") == 'active') { that.controls.gyroFreeze(); btnInactive(gyroBtn); - btnInactive(toolBar.circle1); - btnInactive(toolBar.circle2); gyroBtn.removeAttribute("active"); } else { that.controls.gyroUnfreeze(); gyroBtn.setAttribute("active", "active"); btnActive(gyroBtn); - btnActive(toolBar.circle1); - btnActive(toolBar.circle2); } } @@ -422,8 +418,7 @@ }, false); function btnActive(obj) { - obj.style.borderColor = "green"; - obj.style.color = "green"; + obj.style.borderBottom="1px solid #ccc"; if (that.cameraEvt.controlGroup.length) { var pointObj = that.cameraEvt.controlGroup.getObjectByName("__focus"); @@ -432,8 +427,7 @@ } function btnInactive(obj) { - obj.style.borderColor = "white"; - obj.style.color = "white"; + obj.style.borderBottom="none"; if (that.cameraEvt.controlGroup.length) { var pointObj = that.cameraEvt.controlGroup.getObjectByName("__focus"); @@ -442,16 +436,11 @@ } that._play = function () { - toolBar.btn.style.border = "none"; - toolBar.btn.style.fontWeight = 800; - toolBar.btn.innerHTML = "||"; + toolBar.btn.innerHTML = AVR.playerIcon.pauseSvg; } that._pause = function () { - toolBar.btn.innerText = ""; - toolBar.btn.style.borderTop = "0.6rem solid transparent"; - toolBar.btn.style.borderLeft = "1rem solid white"; - toolBar.btn.style.borderBottom = "0.6rem solid transparent"; + toolBar.btn.innerHTML = AVR.playerIcon.playSvg; } function bindVolumeEvent() { @@ -1420,6 +1409,15 @@ var AVR = { debug: false, + playerIcon:{ + playSvg:'', + pauseSvg:'', + resetLookAtSvg:'', + gyroSvg:'', + vrSvg:'', + audioPlaySvg:'', + audioPauseSvg:'', + }, startGyro: function (callback) { window.addEventListener("deviceorientation", orientationHandler, false); @@ -2299,12 +2297,14 @@ }); var btn = this.createTag('div', { - 'style': 'position:inherit;border-top:0.6rem solid transparent;border-left:1rem solid white;border-bottom:0.6rem solid transparent;bottom:0.25rem;left:1rem;color:#fff;font-weight:800;cursor:pointer', + 'style': 'position:inherit;left:1rem;color:#fff;cursor:pointer;bottom:0rem;line-height:100%;', 'class': pre + 'Btn' + },{ + 'innerHTML':AVR.playerIcon.playSvg, }); toolbar.appendChild(btn); var timeInfo = this.createTag('div', { - 'style': 'position:inherit;bottom:0.25rem;left:2.8rem;color:#fff;font-size:0.75rem' + 'style': 'position:inherit;bottom:0.5rem;left:2.8rem;color:#fff;font-size:0.75rem' }); var curTime = this.createTag('span', null, { 'innerText': "00:00" @@ -2370,29 +2370,21 @@ toolbar.appendChild(about); var gyroResetBtn = this.createTag('div', { - 'style': 'border:0.125rem solid white;border-radius:1rem;width:1rem;height:1rem;position:inherit;right:5.8rem;line-height:1rem;bottom:0.25rem;cursor:pointer' - }); - var gyroResetBtnChild = this.createTag('div', { - 'style': 'border:0.08rem solid white;border-radius:8rem;background:rgba(240,240,240,0.6);width:0.3rem;left:0.26rem;top:0.26rem;height:0.3rem;position:inherit;line-height:0.3rem;cursor:pointer' + 'style': 'position:inherit;right:5.8rem;cursor:pointer;bottom:0.2rem;line-height:100%' + },{ + innerHTML:AVR.playerIcon.resetLookAtSvg, }); - gyroResetBtn.appendChild(gyroResetBtnChild); toolbar.appendChild(gyroResetBtn); var gyroBtn = this.createTag('div', { - 'style': 'border:0.125rem solid white;border-radius:1rem;width:1.4rem;height:1rem;position:inherit;right:3.5rem;line-height:1rem;bottom:0.25rem;cursor:pointer' - }); - var circle1 = this.createTag('div', { - 'style': 'position:inherit;width:1.235rem;height:0.4rem;line-height:0.4rem;border:0.0625rem solid white;border-radius:0.6rem/0.2rem;margin-top:0.25rem;margin-left:0.055rem;' - }); - gyroBtn.appendChild(circle1); - var circle2 = this.createTag('div', { - 'style': 'position:inherit;width:1rem;height:0.4rem;line-height:0.4rem;border:0.0625rem solid white;border-radius:0.6rem/0.2rem;margin-top:0.25rem;margin-left:0.175rem;transform:rotate(90deg)' + 'style': 'position:inherit;right:3.5rem;cursor:pointer;bottom:0.1rem;line-height:100%' + },{ + innerHTML:AVR.playerIcon.gyroSvg }); - gyroBtn.appendChild(circle2); toolbar.appendChild(gyroBtn); var vrBtn = this.createTag('div', { - 'style': "position:inherit;right:1rem;width:1.4rem;height:1rem;line-height:1rem;border:0.125rem solid white;border-radius:0.125rem;bottom:0.25rem;text-align:center;font-weight:800;color:#fff;font-size:0.75rem;cursor:pointer" + 'style': "position:inherit;right:1rem;cursor:pointer;bottom:0.1rem;line-height:100%" }, { - 'innerText': "VR" + 'innerHTML': AVR.playerIcon.vrSvg }); toolbar.appendChild(vrBtn); @@ -2446,8 +2438,6 @@ 'playProgress': play_progress, 'gyroResetBtn': gyroResetBtn, 'gyroBtn': gyroBtn, - "circle1": circle1, - "circle2": circle2, "voice_bar": voice_bar, "about": about };