X-Git-Url: https://gitweb.ps.run/cloth_sim/blobdiff_plain/e05a5c0a7aa891179af219eff0df34647acc8eb3..590349d576668595128e2d15bbd72e9391a97fc1:/Scripts/cloth.js

diff --git a/Scripts/cloth.js b/Scripts/cloth.js
index 9389ef6..266af16 100644
--- a/Scripts/cloth.js
+++ b/Scripts/cloth.js
@@ -6,9 +6,9 @@
  */
 function vectorLength(a, b) {
   let v1 = new THREE.Vector3();
-  v1.set(a.x, a.y, a.z);
+  v1.copy(a);
   let v2 = new THREE.Vector3();
-  v2.set(b.x, b.y, b.z);
+  v2.copy(b);
 
   return v1.sub(v2).length();
 }
@@ -65,17 +65,19 @@ export class Spring {
   }
 
   getDirection(vertices) {
-    let direction = new THREE.Vector3(
-      vertices[this.index1].x,
-      vertices[this.index1].y,
-      vertices[this.index1].z
-    );
+    let direction = new THREE.Vector3();
+    direction.copy(vertices[this.index1]);
 
     direction.sub(vertices[this.index2]);
     direction.divideScalar(vectorLength(vertices[this.index1], vertices[this.index2]));
 
     return direction;
   }
+
+  update(vertices) {
+    let length = vectorLength(vertices[this.index1], vertices[this.index2]);
+    this.currentLength = length;
+  }
 }
 
 /**
@@ -94,7 +96,7 @@ export class Cloth {
 
   vertexWeights = [];
 
-
+  vertexRigidness = [];
 
   /**
    * creates a rectangular piece of cloth
@@ -154,12 +156,12 @@ export class Cloth {
           getVertexIndex(x + 1, y + 1),
         );
 
-        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y), getVertexIndex(x + 1, y)));
-        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y), getVertexIndex(x, y + 1)));
-        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y), getVertexIndex(x + 1, y + 1)));
-        newFace.springs.push(new Spring(vertices, getVertexIndex(x + 1, y), getVertexIndex(x, y + 1)));
-        newFace.springs.push(new Spring(vertices, getVertexIndex(x + 1, y), getVertexIndex(x + 1, y + 1)));
-        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y + 1), getVertexIndex(x + 1, y + 1)));
+        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y), getVertexIndex(x + 1, y)));         // oben
+        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y), getVertexIndex(x, y + 1)));         // links
+        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y), getVertexIndex(x + 1, y + 1)));     // oben links  -> unten rechts diagonal
+        newFace.springs.push(new Spring(vertices, getVertexIndex(x + 1, y), getVertexIndex(x, y + 1)));     // oben rechts -> unten links diagonal
+        newFace.springs.push(new Spring(vertices, getVertexIndex(x + 1, y), getVertexIndex(x + 1, y + 1))); // rechts
+        newFace.springs.push(new Spring(vertices, getVertexIndex(x, y + 1), getVertexIndex(x + 1, y + 1))); // unten
 
         faces.push(newFace);
       }
@@ -170,6 +172,12 @@ export class Cloth {
      * with generated vertices and faces
      */
     this.createExplicit(vertices, faces);
+
+    /**
+     * hand cloth from left and right upper corners
+     */
+    this.vertexRigidness[0] = true;
+    this.vertexRigidness[numPointsWidth-1] = true;
   }
 
   /**
@@ -186,9 +194,12 @@ export class Cloth {
      * Copy vertices and initialize vertex weights to 0
      */
     for (let i in vertices) {
-      this.geometry.vertices.push(vertices[i]);
-      this.previousPositions.push(vertices[i]);
+      this.geometry.vertices.push(vertices[i].clone());
+      this.previousPositions.push(vertices[i].clone());
+      // this.geometry.vertices.push(vertices[i]);
+      // this.previousPositions.push(vertices[i]);
       this.vertexWeights.push(0);
+      this.vertexRigidness.push(false);
     }
     /**
      * copy faces,
@@ -236,6 +247,7 @@ export class Cloth {
      * needed for View Frustum Culling internally
      */
     this.geometry.computeBoundingSphere();
+    this.geometry.computeFaceNormals();
   }
 
   /**
@@ -303,25 +315,34 @@ export class Cloth {
   time = 0;
   /**
    * 
-   * @param {number} dt 
+   * @param {number} dt time in seconds since last frame
    */
   simulate(dt) {
-
-
-
     for (let i in this.geometry.vertices) {
-      let currentPosition;
       let acceleration = this.getAcceleration(i, dt);
+
+      //acceleration.clampLength(0, 10);
+
+      if (Math.abs(acceleration.length()) <= 10e-4) {
+        acceleration.set(0, 0, 0);
+      }
  
-      currentPosition = this.verlet(this.geometry.vertices[i], this.previousPositions[i], acceleration, dt/2000);
+      let currentPosition = this.verlet(this.geometry.vertices[i].clone(), this.previousPositions[i].clone(), acceleration, dt);
+      //let currentPosition = this.euler(this.geometry.vertices[i], acceleration, dt);
      
-      this.previousPositions[i] = currentPosition;
-      this.geometry.vertices[i] = currentPosition;
-      
+      this.previousPositions[i].copy(this.geometry.vertices[i]);
+      this.geometry.vertices[i].copy(currentPosition);
     }
-    console.log(this.geometry.vertices[0]);
+    //console.log(this.getAcceleration(1, dt));
+    
     this.time += dt;
 
+    for (let face of this.faces) {
+      for (let spring of face.springs) {
+        spring.update(this.geometry.vertices);
+      }
+    }
+
     /**
      * let THREE JS compute bounding sphere around generated mesh
      * needed for View Frustum Culling internally
@@ -330,6 +351,7 @@ export class Cloth {
     this.geometry.verticesNeedUpdate = true;
     this.geometry.elementsNeedUpdate = true;
     this.geometry.computeBoundingSphere();
+    this.geometry.computeFaceNormals();
 
   }
 
@@ -341,20 +363,22 @@ export class Cloth {
  *  @param {number} dt The time passed since last frame
  */
 getAcceleration(vertexIndex, dt) {
+  if (this.vertexRigidness[vertexIndex])
+    return new THREE.Vector3(0, 0, 0);
 
   let vertex = this.geometry.vertices[vertexIndex];
 
   // Mass of vertex
   let M = this.vertexWeights[vertexIndex];
   // constant gravity
-  let g = new THREE.Vector3(0, -1.8, 0);
+  let g = new THREE.Vector3(0, -9.8, 0);
   // stiffness
-  let k = 5;
+  let k = 1000;
 
   // Wind vector
   let fWind = new THREE.Vector3(
     Math.sin(vertex.x * vertex.y * this.time),
-    Math.cos(vertex.z* this.time),
+    Math.cos(vertex.z * this.time),
     Math.sin(Math.cos(5 * vertex.x * vertex.y * vertex.z))
   );
 
@@ -362,49 +386,94 @@ getAcceleration(vertexIndex, dt) {
    * constant determined by the properties of the surrounding fluids (air)
    * achievement of cloth effects through try out
    * */
-  let a = 1;
-
+  let a = 0.1;
+  
   let velocity = new THREE.Vector3(
-    (vertex.x - this.previousPositions[vertexIndex].x) / dt,
-    (vertex.y - this.previousPositions[vertexIndex].y) / dt,
-    (vertex.z - this.previousPositions[vertexIndex].z) / dt
+    (this.previousPositions[vertexIndex].x - vertex.x) / dt,
+    (this.previousPositions[vertexIndex].y - vertex.y) / dt,
+    (this.previousPositions[vertexIndex].z - vertex.z) / dt
   );
 
+  //console.log(velocity, vertex, this.previousPositions[vertexIndex]);
 
-  let fAirResistance = velocity.multiplyScalar(-a);
-
+  let fAirResistance = velocity.multiply(velocity).multiplyScalar(-a);
+  
   let springSum = new THREE.Vector3(0, 0, 0);
 
   // Get the bounding springs and add them to the needed springs
-  for (let i in this.faces) {
-    if (this.faces[i].a == vertexIndex || this.faces[i].b == vertexIndex || this.faces[i].c == vertexIndex || this.faces[i].d == vertexIndex) {
-      for (let j in this.faces[i].springs) {
-        if (this.faces[i].springs[j].index1 == vertexIndex || this.faces[i].springs[j].index2 == vertexIndex) {
+  // TODO: optimize
 
-          let spring = this.faces[i].springs[j];
-          let springDirection = spring.getDirection(this.geometry.vertices);
+  const numPointsX = 10;
+  const numPointsY = 10;
+  const numFacesX = numPointsX - 1;
+  const numFacesY = numPointsY - 1;
 
+  function getFaceIndex(x, y) {
+    return y * numFacesX + x;
+  }
+
+  let indexX = vertexIndex % numPointsX;
+  let indexY = Math.floor(vertexIndex / numPointsX);
+
+  let springs = [];
+
+  // 0  oben
+  // 1  links
+  // 2  oben links  -> unten rechts diagonal
+  // 3  oben rechts -> unten links diagonal
+  // 4  rechts
+  // 5  unten
+
+  let ul = indexX > 0 && indexY < numPointsY - 1;
+  let ur = indexX < numPointsX - 1 && indexY < numPointsY - 1;
+  let ol = indexX > 0 && indexY > 0;
+  let or = indexX < numPointsX - 1 && indexY > 0;
+
+  if (ul) {
+    let faceUL = this.faces[getFaceIndex(indexX - 1, indexY)];
+    springs.push(faceUL.springs[3]);
+    if (!ol)
+      springs.push(faceUL.springs[0]);
+    springs.push(faceUL.springs[4]);
+  }
+  if (ur) {
+    let faceUR = this.faces[getFaceIndex(indexX, indexY)];
+    springs.push(faceUR.springs[2]);
+    if (!or)
+      springs.push(faceUR.springs[0]);
+    if (!ul)
+      springs.push(faceUR.springs[1]);
+  }
+  if (ol) {
+    let faceOL = this.faces[getFaceIndex(indexX - 1, indexY - 1)];
+    springs.push(faceOL.springs[2]);
+    springs.push(faceOL.springs[4]);
+    springs.push(faceOL.springs[5]);
+  }
+  if (or) {
+    let faceOR = this.faces[getFaceIndex(indexX , indexY - 1)];
+    springs.push(faceOR.springs[3]);
+    if (!ol)
+      springs.push(faceOR.springs[1]);
+    springs.push(faceOR.springs[5]);
+  }
 
-          if (this.faces[i].springs[j].index1 == vertexIndex)
-            springDirection.multiplyScalar(-1);
+  for (let spring of springs) {
+    let springDirection = spring.getDirection(this.geometry.vertices);
 
-          springSum.add(springDirection.multiplyScalar(k * (spring.currentLength - spring.restLength)));
+    if (spring.index1 == vertexIndex)
+      springDirection.multiplyScalar(-1);
 
-        }
-      }
-    }
+    springSum.add(springDirection.multiplyScalar(k * (spring.restLength - spring.currentLength)));
   }
-
   
   let result = new THREE.Vector3(1, 1, 1);
 
-  
-  result.multiplyScalar(M).multiply(g).add(fWind).add(fAirResistance).sub(springSum);
-  
+  let temp = result.multiplyScalar(M).multiply(g).add(fWind).add(fAirResistance).clone();
+  result.sub(springSum);
+  document.getElementById("Output").innerText = "SpringSum: " + Math.floor(springSum.y) + "\nTemp: " + Math.floor(temp.y);
 
   return result;
-
-
 }
 
 /**
@@ -420,16 +489,38 @@ verlet(currentPosition, previousPosition, acceleration, passedTime) {
   // next position = 2 * current Position - previous position + acceleration * (passed time)^2
   // acceleration (dv/dt) = F(net)
   // Dependency for one vertex: gravity, fluids/air, springs
+  const DRAG = 0.97;
+  let nextPosition = new THREE.Vector3(
+    (currentPosition.x - previousPosition.x) * DRAG + currentPosition.x + acceleration.x * (passedTime * passedTime),
+    (currentPosition.y - previousPosition.y) * DRAG + currentPosition.y + acceleration.y * (passedTime * passedTime),
+    (currentPosition.z - previousPosition.z) * DRAG + currentPosition.z + acceleration.z * (passedTime * passedTime),
+  );
 
+  // let nextPosition = new THREE.Vector3(
+  //   (2 * currentPosition.x) - previousPosition.x + acceleration.x * (passedTime * passedTime),
+  //   (2 * currentPosition.y) - previousPosition.y + acceleration.y * (passedTime * passedTime),
+  //   (2 * currentPosition.z) - previousPosition.z + acceleration.z * (passedTime * passedTime),
+  // );
+
+  return nextPosition;
+}
+
+euler(currentPosition, acceleration, passedTime) {
   let nextPosition = new THREE.Vector3(
-    2 * currentPosition.x - previousPosition.x + acceleration.x * (passedTime * passedTime),
-    2 * currentPosition.y - previousPosition.y + acceleration.y * (passedTime * passedTime),
-    2 * currentPosition.z - previousPosition.z + acceleration.z * (passedTime * passedTime),
+    currentPosition.x + acceleration.x * passedTime,
+    currentPosition.y + acceleration.y * passedTime,
+    currentPosition.z + acceleration.z * passedTime,
   );
 
   return nextPosition;
 }
 
+wind(intersects) {
+  let intersect = intersects[0];
+  this.geometry.vertices[intersect.face.a].z -= 0.05;
+  this.geometry.vertices[intersect.face.b].z -= 0.05;
+  this.geometry.vertices[intersect.face.c].z -= 0.05;
+}
 
 }