hopf.js

var LayerMask;(function(a){a[a.Invisible=0]="Invisible";a[a.Left=1]="Left";a[a.Right=2]="Right"})(LayerMask||(LayerMask={}));var Demo=function(a,c,b,d,f,e){this._canvas=document.getElementById(a);this._engine=new BABYLON.Engine(this._canvas,!0);this._scene=new BABYLON.Scene(this._engine);this._loopResolution=c;this._loopDeltaPh=2*Math.PI/this._loopResolution;this._camRadius=b;this._dashLength=d;this._sphereAlpha=f;this._sphereSubdivisions=e};
Demo.prototype.doRender=function(){var a=this;this._engine.runRenderLoop(function(){a._scene.render()});window.addEventListener("resize",function(){a._engine.resize()})};
Demo.prototype.setupDemo=function(){var a=this;this._scene.clearColor=new BABYLON.Color4(0,0,0,1);var c=this._createCamera("rightCamera",LayerMask.Right);c.attachControl(this._canvas,!0);this._scene.activeCameras.push(c);var b=this._createSphere(),d=!1;this._scene.onPointerObservable.add(function(c){var e=a._scene.pick(a._scene.pointerX,a._scene.pointerY,function(a){return a===b});switch(c.type){case BABYLON.PointerEventTypes.POINTERUP:d=!1;break;case BABYLON.PointerEventTypes.POINTERDOWN:d=!0;case BABYLON.PointerEventTypes.POINTERMOVE:e&&
e.pickedMesh===b&&d&&e.pickedPoint&&a._draw(e.pickedPoint)}})};Demo.prototype._unitVectorToFibre=function(a,c){var b=Math.sqrt(.5*(1+a.z)),d=-Math.sqrt(.5*(1-a.z)),f=Math.atan2(-a.x,a.y)-c,e=b*Math.cos(f);e=Math.acos(e)/(Math.PI*Math.sqrt(1-Math.pow(e,2)));return new BABYLON.Vector3(d*Math.cos(c)*e,d*Math.sin(c)*e,b*Math.sin(f)*e)};Demo.prototype._pointToColor=function(a){return new BABYLON.Color4(.5*(1-a.x),.5*(1-a.y),.5*(1-a.z),1)};
Demo.prototype._createPath=function(a){for(var c=[],b=0,d=0;d<=this._loopResolution;d++)c.push(this._unitVectorToFibre(a,b)),b+=this._loopDeltaPh;return c};Demo.prototype._createLoop=function(a,c){var b=this._createPath(a),d=this._pointToColor(a);d=Array(b.length).fill(d);b=BABYLON.MeshBuilder.CreateLines("lines",{points:b,useVertexAlpha:!1,colors:d},this._scene);b.layerMask=c;b.isPickable=!1;return b};
Demo.prototype._createCamera=function(a,c){var b=new BABYLON.ArcRotateCamera(a,0,0,this._camRadius,BABYLON.Vector3.Zero(),this._scene);b.viewport=c===LayerMask.Left?new BABYLON.Viewport(0,0,.5,1):new BABYLON.Viewport(.5,0,.5,1);b.layerMask=c;b.noRotationConstraint=!0;b.lowerRadiusLimit=b.upperRadiusLimit=b.radius=this._camRadius;b.panningAxis=BABYLON.Vector3.Zero();b.angularSensibilityX*=-1;b.angularSensibilityY*=-1;return b};
Demo.prototype._createDash=function(a,c){var b=[a.scale(1-this._dashLength),a.scale(1+this._dashLength)],d=this._pointToColor(a);b=BABYLON.MeshBuilder.CreateLines("dash",{points:b,colors:[d,d],useVertexAlpha:!1},this._scene);b.layerMask=c;return b};
Demo.prototype._createSphere=function(){var a=this._createCamera("leftCamera",LayerMask.Left);a.attachControl(this._canvas,!0);this._scene.activeCameras.push(a);a=new BABYLON.StandardMaterial("material",this._scene);a.alpha=this._sphereAlpha;a.emissiveColor=BABYLON.Color3.White();var c=BABYLON.MeshBuilder.CreateIcoSphere("sphere",{subdivisions:this._sphereSubdivisions,flat:!1},this._scene);c.material=a;c.layerMask=LayerMask.Left;return c};
Demo.prototype._draw=function(a){this._createDash(a,LayerMask.Left);this._createLoop(a,LayerMask.Right)};window.addEventListener("DOMContentLoaded",function(){var a=new Demo("renderCanvas",384,4,.1,.5,8);a.setupDemo();a.doRender()});