Commits

Brian McKenna committed 5ea64a7

Separate 'floaters'

  • Participants
  • Parent commits 21a241e

Comments (0)

Files changed (1)

           #121212 100%
         );
       }
-      #floater {
-        position: absolute;
-      }
-      #floater .background {
+      .floater {
         position: absolute;
         width: 200px;
         height: 200px;
   </head>
   <body>
     <div id="content"></div>
-    <div id="floater">
-      <div class="background" id="devday">&nbsp;</div>
-      <div class="background" id="operahouse">&nbsp;</div>
+    <div class="floater" id="devday">&nbsp;</div>
+    <div class="floater" id="operahouse">&nbsp;</div>
     </div>
     <script>
       (function() {
         camera.position.z = 17;
 
         var scene = new THREE.Scene();
-        scene.fog = new THREE.FogExp2( 0xffffff, 0.025 );
 
         var light = new THREE.DirectionalLight(0xFFFFFF);
         light.position.set(0, 0.1, 1);
           camera.position.y = ratioY * 20;
         }, false);
 
+        var floaters = document.getElementsByClassName('floater');
+
         // Render function
         var render = function() {
           requestAnimationFrame(render);
 
           if(mesh) {
             var i;
+
             for(i = 0; i < mesh.morphTargetInfluences.length; i++) {
 	      mesh.morphTargetInfluences[i] = 0;
             }
-            var clampedRatio = Math.min(Math.max(ratioX + 0.4, 0), 0.8) / 0.8;
+            var clampedRatio = Math.min(Math.max(ratioX + 0.3, 0), 0.6) / 0.6;
 
-            document.getElementById('floater').style.top = 50 + (Math.sin(new Date().getTime() / 1000) * 25) + 'px';
-            document.getElementById('floater').style.left = (((new Date().getTime() % 10000) / 10000) * (window.innerWidth + 200)) - 200 + 'px';
+            for(i = 0; i < floaters.length; i++) {
+              floaters[i].style.top = 50 + (Math.sin(new Date().getTime() / 1000) * 25) + 'px';
+              floaters[i].style.left = ((((new Date().getTime() + 2000 * i) % 10000) / 10000) * (window.innerWidth + 200)) - 200 + 'px';
+            }
 
             document.getElementById('devday').style.opacity = 1 - clampedRatio;
             document.getElementById('operahouse').style.opacity = clampedRatio;