Changeset 29634 for other-projects/nz-flag-design/trunk

Timestamp:

2014-12-15T13:07:02+13:00 (9 years ago)

Author:

bmt11

Message:

All weather is now functioning including switching back to fine weather. Weather is now also affected by wind force

Location:

other-projects/nz-flag-design/trunk/render-3d

Files:

• CSS/button.css (modified) (1 diff)
• flag.html (modified) (10 diffs)
• weather/rain.js (modified) (4 diffs)
• weather/snow.js (modified) (4 diffs)
• weather/sun.js (added)
• weather/weather.js (modified) (1 diff)

other-projects/nz-flag-design/trunk/render-3d/CSS/button.css

@@ -4 +4 @@
     -webkit-border-radius:42px;
     border-radius:100%;
-    border:1vh solid #057fd0;
+    border:1vh solid #7F90B9;
     display: block;
     cursor:pointer;

other-projects/nz-flag-design/trunk/render-3d/flag.html

@@ -27 +27 @@
                 transition: right 0.5s;
                 background-image: url("./images/slider.png");
-                background-size: 25vw 150vh;
+                background-size: cover;
                 background-position: center;
             }
@@ -67 +67 @@
                 <!--Toggle: 
                 <a onclick="wind = !wind;">Wind</a> |-->
-                <a class="myButton" style="background-image:url('./images/sunButton.jpg')" onclick="fine = !fine;"></a>
+                <a class="myButton" style="background-image:url('./images/sunButton.jpg')" onclick="sunny = !sunny;"></a>
                 <a class="myButton" style="background-image:url('./images/rainButton.jpg')" onclick="raining = !raining;"></a>
                 <a class="myButton" style="background-image:url('./images/snowButton.jpg')" onclick="snowing = !snowing;"></a>
@@ -80 +80 @@
             function openclose(){
                 if (open){
-                    document.getElementById("menuContainer").style.right = "-20vw";
+                    document.getElementById("menuContainer").style.right = "-19vw";
                     document.getElementById("arrow").style.transform = "rotate(360deg)";
                 }else{document.getElementById("menuContainer").style.right = "0vw";
@@ -101 +101 @@
         <script type="text/javascript" src="./weather/rain.js"></script>
         <script type="text/javascript" src="./weather/snow.js"></script>
+        <script type="text/javascript" src="./weather/sun.js"></script>
         
         <script type="text/javascript" src="./Flag_files/KeyboardState.js"></script>
@@ -161 +162 @@
             /*  Weather variables  */
             var weatherSystem;
+            
             var raining = false;
             var snowing = false;
+            var sunny = false;
+            
             var snowSystem;
             var rainSystem;
+            var sunSystem;
             
             /*  Mouse variables     */
@@ -184 +189 @@
             
             var object, tmpFlag, arrow;
+            
 
             var rotate = false;
@@ -259 +265 @@
                 rainSystem = new rain();
                 snowSystem = new snow();
+                sunSystem = new sun();
                 weatherSystem = new weatherSystem(scene);
             
@@ -285 +292 @@
                 arrow = new THREE.ArrowHelper( new THREE.Vector3( 0, 1, 0 ), new THREE.Vector3( 0, 0, 0 ), 50, 0xff0000 );
                 arrow.position.set( -200, -50, -200 );
+                arrow.setLength( 0 );
+                arrow.setDirection( 0 );
                 //scene.add( arrow );
 
@@ -423 +432 @@
 
                 var time = Date.now();
+                
                 windStrength = Math.cos( time / 7000 ) * 100 + 200;
                 windForce.set( 1000,500,Math.sin( time / 1000 ) ).normalize().multiplyScalar( windStrength );
                 arrow.setLength( windStrength );
                 arrow.setDirection( windForce );
+
                 controls.update();
                 simulate(time);
@@ -468 +479 @@
                 if(raining && weatherSystem.type != rainSystem){
                     snowing = false;
+                    sunny = false;
                     weatherSystem.swap(rainSystem);
                 }else if(snowing && weatherSystem.type != snowSystem){
                     raining = false;
+                    sunny = false;
                     weatherSystem.swap(snowSystem);
+                }else if(sunny && weatherSystem.type != sunSystem){
+                    raining = false;
+                    snowing = false;
+                    weatherSystem.swap(sunSystem);
                 }
                 

other-projects/nz-flag-design/trunk/render-3d/weather/rain.js

@@ -3 +3 @@
     
     this.isInit = false;
+    this.MASS = 0.01;
     
     this.init = function() {
@@ -13 +14 @@
     
         // create the particle variables
-        this.particleCount = 1800,
+        this.particleCount = 3500,
         this.particles = new THREE.Geometry(),
         this.pMaterial = new THREE.ParticleBasicMaterial({
@@ -31 +32 @@
             // create a particle with random
             // position values, -250 -> 250
-            var pX = Math.random() * window.innerWidth * 2 - window.innerWidth,
-                pY = Math.random() * window.innerHeight * 3 - window.innerHeight,
-                pZ = Math.random() * window.innerWidth * 2 - window.innerWidth;
-                this.particle = new THREE.Vector3(pX, pY, pZ);
+            var pX = (Math.random() * 3000) - 1500,
+                pY = Math.random() * window.innerHeight * 3 - window.innerHeight,
+                pZ = (Math.random() * 3000) - 1500;
+                this.particle = new THREE.Vector3(pX, pY, pZ);  
 
             // create a velocity vector
-            this.particle.velocity = new THREE.Vector3(
-                0, // x
-                -Math.random(), // y
-                0); // z
+            this.particle.velocity = new THREE.Vector3(
+                (windForce.x * this.MASS), // x
+                -Math.random() * 0.01, // y
+                (windForce.z * this.MASS)); // z
 
             // add it to the geometry
@@ -70 +71 @@
             
             // check if we need to reset
-            if(this.particle.y < -200) {
-                this.particle.y = Math.random() * window.innerHeight+10;
+            if(this.particle.y < -10) {
+                this.particle.y = (window.innerHeight*2)+(Math.random() * 100);
                 this.particle.velocity.y = 0;
+                this.particle.x = (Math.random() * 4000) - 2000;
+                this.particle.z = (Math.random() * 4000) - 2000;
+
             }
             
             // update the velocity
-            this.particle.velocity.y -= Math.random() * .1;
+            this.particle.velocity.y -= Math.random() * 0.01;
             
             // and the position

other-projects/nz-flag-design/trunk/render-3d/weather/snow.js

@@ -3 +3 @@
     
         this.isInit = false;
-        this.Mass = 0.01;
+        this.MASS = 0.005;
         
         this.init = function() {
@@ -14 +14 @@
         
             // create the particle variables
-            this.particleCount = 2000,
+            this.particleCount = 3000,
             this.particles = new THREE.Geometry(),
             
@@ -32 +32 @@
 
                 // create a particle with random
-                // position values, -250 -> 250
-                var pX = Math.random() * window.innerWidth * 3 - window.innerWidth,
-                    pY = Math.random() * window.innerHeight * 4 - window.innerHeight,
-                    pZ = Math.random() * window.innerWidth * 3 - window.innerWidth;
+                // position values
+                var pX = (Math.random() * 3000) - 1500,
+                    pY = Math.random() * window.innerHeight * 3 - window.innerHeight,
+                    pZ = (Math.random() * 3000) - 1500;
                     this.particle = new THREE.Vector3(pX, pY, pZ);  
                 
                 // create a velocity vector
                 this.particle.velocity = new THREE.Vector3(
-                    0, // x
-                    -Math.random(), // y
-                    0); // z
-
+                    (windForce.x * this.MASS), // x
+                    -Math.random() * 0.01, // y
+                    (windForce.z * this.MASS)); // z
+                
+                //this.particle.velocity.z = arrow.direction.z * this.MASS;
                 // add it to the geometry
                 this.particles.vertices.push(this.particle);
@@ -73 +74 @@
                 
                 // check if we need to reset
-                if(this.particle.y < -200) {
-                    this.particle.y = Math.random() * window.innerHeight+10;
+                if(this.particle.y < -10) {
+                    this.particle.y = (window.innerHeight*2)+(Math.random() * 100);
                     this.particle.velocity.y = 0;
+                    this.particle.x = (Math.random() * 4000) - 2000;
+                    this.particle.z = (Math.random() * 4000) - 2000;
+
                 }
                 
                 // update the velocity
-                this.particle.velocity.y -= Math.random() * this.Mass;
-                
+                this.particle.velocity.y -= Math.random() * 0.001;
+                //this.particle.velocity.x = (windForce.x * this.MASS);
+                //this.particle.velocity.z = (windForce.z * this.MASS);
+
                 // and the position
                 this.particle.addVectors( 

other-projects/nz-flag-design/trunk/render-3d/weather/weather.js

@@ -23 +23 @@
         this.swap = function(w){
             if(this.type != w){
-                if(this.type !== null) this.scene.remove(this.getWeather());
+                if(this.type !== null){
+                    this.scene.remove(this.getWeather());
+                }
                 this.set(w);
             }
         }
-        
-        
         
         this.isSet = function(){