[28897] | 1 | var scene = new THREE.Scene();
|
---|
| 2 | var camera = new THREE.PerspectiveCamera(HorToVertFOV(90, (window.innerWidth / window.innerHeight)), window.innerWidth / window.innerHeight, 0.1, 10000);
|
---|
| 3 | //var camera = new THREE.PerspectiveCamera( 90, 1, 0.1, 1000 );
|
---|
| 4 |
|
---|
| 5 | var renderer = new THREE.WebGLRenderer({
|
---|
| 6 | alpha: true
|
---|
| 7 | });
|
---|
| 8 |
|
---|
| 9 | var panoGeometry = new THREE.SphereGeometry(.25, 16, 16);
|
---|
| 10 | panoGeometry.applyMatrix(new THREE.Matrix4().makeScale(-1, 1, 1));
|
---|
| 11 |
|
---|
| 12 | /*var testMaterial = new THREE.MeshBasicMaterial( { color: 0x22cc22 } );
|
---|
| 13 | var testMaterial2 = new THREE.MeshBasicMaterial( { color: 0x111111 } );*/
|
---|
| 14 |
|
---|
| 15 | var pathGeometry = new THREE.CubeGeometry(1, 1, 1);
|
---|
| 16 |
|
---|
| 17 | var materials = {};
|
---|
| 18 | var curSpheres = [];
|
---|
| 19 |
|
---|
| 20 | var animatedSpheres = [];
|
---|
| 21 |
|
---|
| 22 | $(document).ready(function() {
|
---|
| 23 | renderer.setSize(window.innerWidth, window.innerHeight);
|
---|
| 24 | ///renderer.setSize( 500, 500 );
|
---|
| 25 | document.body.appendChild(renderer.domElement);
|
---|
| 26 |
|
---|
| 27 | renderer.domElement.id = "WebGL";
|
---|
| 28 |
|
---|
| 29 | //createTestSphere( 0, 1000, 0 );
|
---|
| 30 | render();
|
---|
| 31 | });
|
---|
| 32 |
|
---|
| 33 | function createTestSphere(heading, distance) {
|
---|
| 34 | var testMesh = new THREE.Mesh(panoGeometry, testMaterial);
|
---|
| 35 |
|
---|
| 36 | var hRad = heading * Math.PI / 180;
|
---|
| 37 |
|
---|
| 38 | testMesh.position.y = -2;
|
---|
| 39 | testMesh.position.z = Math.cos(hRad) * -distance;
|
---|
| 40 | testMesh.position.x = Math.sin(hRad) * distance;
|
---|
| 41 |
|
---|
| 42 |
|
---|
| 43 | scene.add(testMesh);
|
---|
| 44 | //console.log("Added Sphere at h:"+heading+" d:"+distance+ " "+testMesh.position.x + ", " + testMesh.position.z);
|
---|
| 45 | }
|
---|
| 46 |
|
---|
| 47 | function createPanoSphere(heading, distance, panoLink, rot) {
|
---|
| 48 | var m = materials[panoLink.pano];
|
---|
| 49 | //console.log("val of m: " + m);
|
---|
| 50 | if (m === undefined) {
|
---|
| 51 | m = null;
|
---|
| 52 |
|
---|
| 53 | getPanoImage(panoLink.pano, function(dataUrl) {
|
---|
| 54 | var tex = THREE.ImageUtils.loadTexture(dataUrl);
|
---|
| 55 | materials[panoLink.pano] = new THREE.MeshBasicMaterial({
|
---|
| 56 | map: tex
|
---|
| 57 | });
|
---|
| 58 | materials[panoLink.pano].jumpUnused = 0;
|
---|
| 59 | panoLink.sphere = createSphere(heading, distance, materials[panoLink.pano], rot);
|
---|
| 60 | });
|
---|
| 61 | } else {
|
---|
| 62 | if (m)
|
---|
| 63 | m.jumpUnused = 0;
|
---|
| 64 | panoLink.sphere = createSphere(heading, distance, m, rot);
|
---|
| 65 | return;
|
---|
| 66 | }
|
---|
| 67 | panoLink.sphere = null;
|
---|
| 68 | }
|
---|
| 69 |
|
---|
| 70 | function createSphere(heading, distance, material, rot) {
|
---|
| 71 | var testMesh = new THREE.Mesh(panoGeometry, material);
|
---|
| 72 |
|
---|
| 73 | var hRad = heading * Math.PI / 180;
|
---|
| 74 |
|
---|
| 75 |
|
---|
| 76 | testMesh.position.z = Math.cos(hRad) * -distance;
|
---|
| 77 | testMesh.position.x = Math.sin(hRad) * distance;
|
---|
| 78 |
|
---|
| 79 | testMesh.distance = distance;
|
---|
| 80 |
|
---|
| 81 | testMesh.position.y = -2;
|
---|
| 82 | testMesh.rotation.y = (-rot - 90) * Math.PI/180;
|
---|
| 83 | testMesh.heading = hRad;
|
---|
| 84 |
|
---|
| 85 | testMesh.startPos = testMesh.position.clone();
|
---|
| 86 |
|
---|
| 87 | scene.add(testMesh);
|
---|
| 88 | //console.log("Added Sphere at h:"+heading+" d:"+distance+ " "+testMesh.position.x + ", " + testMesh.position.z);
|
---|
| 89 |
|
---|
| 90 | curSpheres.push(testMesh);
|
---|
| 91 | return testMesh;
|
---|
| 92 | }
|
---|
| 93 |
|
---|
| 94 | function getHipCameraPoint(){
|
---|
| 95 | return new THREE.Vector3(Math.sin(panorama.getPov().heading * Math.PI / 180), 0, -Math.cos(panorama.getPov().heading * Math.PI / 180 )).multiplyScalar(2);
|
---|
| 96 | }
|
---|
| 97 |
|
---|
| 98 | function SyncThreeCamera(heading, pitch) {
|
---|
| 99 | var rot = new THREE.Matrix4().makeRotationY(-heading * Math.PI / 180).multiply(new THREE.Matrix4().makeRotationX(pitch * Math.PI / 180));
|
---|
| 100 |
|
---|
| 101 | camera.matrixWorld = rot;
|
---|
| 102 | camera.matrixAutoUpdate = false;
|
---|
| 103 | }
|
---|
| 104 |
|
---|
| 105 | function render() {
|
---|
| 106 | requestAnimationFrame(update);
|
---|
| 107 | renderer.render(scene, camera);
|
---|
| 108 | }
|
---|
| 109 |
|
---|
| 110 | function update(time){
|
---|
| 111 | //console.log(spheros);
|
---|
| 112 | for (var i = 0; i < curSpheres.length; ++i){
|
---|
| 113 | if(curSpheres[i].anim){
|
---|
| 114 |
|
---|
| 115 | console.log(curSpheres[i].anim);
|
---|
| 116 | curSpheres[i].position = curSpheres[i].anim.animate();
|
---|
| 117 | }
|
---|
| 118 | }
|
---|
| 119 | render();
|
---|
| 120 | }
|
---|
| 121 |
|
---|
| 122 | function HorToVertFOV(horFOV, aspectRatio) {
|
---|
| 123 |
|
---|
| 124 | var horFOV = horFOV * Math.PI / 180;
|
---|
| 125 | var vfov = 2 * Math.atan(Math.tan(horFOV / 2) / aspectRatio);
|
---|
| 126 | return vfov * 180 / Math.PI;
|
---|
| 127 | }
|
---|
| 128 |
|
---|
| 129 | function nukeSpheres() {
|
---|
| 130 | for (var i = 0; i < curSpheres.length; ++i) {
|
---|
| 131 | scene.remove(curSpheres[i]);
|
---|
| 132 | };
|
---|
| 133 | curSpheres = [];
|
---|
| 134 | incrementAndClean(4);
|
---|
| 135 | }
|
---|
| 136 |
|
---|
| 137 | function incrementAndClean(limit) {
|
---|
| 138 | for (var mat in materials) {
|
---|
| 139 |
|
---|
| 140 | var actualmat = materials[mat];
|
---|
| 141 |
|
---|
| 142 | if (actualmat) {
|
---|
| 143 | actualmat.jumpUnused += 1;
|
---|
| 144 | if (actualmat.jumpUnused > limit) {
|
---|
| 145 | actualmat.dispose();
|
---|
| 146 | delete materials[mat];
|
---|
| 147 | if (materials[mat])
|
---|
| 148 | alert("deletion failed!");
|
---|
| 149 | }
|
---|
| 150 | }
|
---|
| 151 | }
|
---|
| 152 | }
|
---|
| 153 |
|
---|
| 154 | function Ease(startPosition, endPosition, animLength){
|
---|
| 155 | this.timeStart = performance.now();
|
---|
| 156 | this.startPosition = startPosition.clone();
|
---|
| 157 | this.endPosition = endPosition.clone();
|
---|
| 158 | this.path = endPosition.clone().sub(startPosition);
|
---|
| 159 | this.animLength = animLength;
|
---|
| 160 | this.time = 0;
|
---|
| 161 |
|
---|
| 162 | this.animate = function(){
|
---|
| 163 | this.time = performance.now() - this.timeStart;
|
---|
| 164 | return this.startPosition.clone().add(this.path.clone().multiplyScalar(THREE.Math.smootherstep(this.time / this.animLength, 0 ,1)));
|
---|
| 165 | }
|
---|
| 166 | }
|
---|
| 167 |
|
---|
| 168 | function cameraFromGoogleZoom(zoom){
|
---|
| 169 | var fov = 180 / Math.pow(2, zoom);
|
---|
| 170 | return new THREE.PerspectiveCamera(HorToVertFOV(fov, (window.innerWidth / window.innerHeight)), window.innerWidth / window.innerHeight, 0.1, 10000);
|
---|
| 171 |
|
---|
| 172 | } |
---|