X-Git-Url: https://gitweb.ps.run/cloth_sim/blobdiff_plain/8e3324e4b7f7bc8b59df9ef477e0847165145b8c..eac8eb4ec5115f16fc17b94fb194fdc1c005ddb5:/Scripts/main.js

diff --git a/Scripts/main.js b/Scripts/main.js
index 51d6762..1a30f7a 100644
--- a/Scripts/main.js
+++ b/Scripts/main.js
@@ -82,13 +82,15 @@ function init() {
   const loader = new THREE.TextureLoader();
   //Red color: 0xC70039
 
+  /** Create cloth and generate mesh */
   const cloth = new Cloth(1, 0.5, 20, 20);
   const clothGeometry = cloth.generateGeometry();
-  const clothMaterial = new THREE.MeshStandardMaterial({ map: loader.load('Textures/hsrm2.png'), color: {type: "c", value: new THREE.Color(0xffffff)}, side: THREE.DoubleSide, flatShading: false, transparent: true });
+  const clothMaterial = new THREE.MeshStandardMaterial({ map: loader.load('Textures/hsrm2.png'), color: 0xffffff, side: THREE.DoubleSide, flatShading: false });
   //const clothMaterial = new THREE.MeshStandardMaterial({ color: 0xC70039, side: THREE.DoubleSide, flatShading: false });
   const clothMesh = new THREE.Mesh(clothGeometry, clothMaterial);
   scene.add(clothMesh);
   
+  /** Register wind checkbox */
   document.getElementById("windToggle").checked = options.wind;
   document.getElementById("windToggle").onchange = (e) => {
     options.wind = e.target.checked;
@@ -104,25 +106,31 @@ function init() {
    * @param {number} dt - time passed since last frame in ms
    */
   function animate(dt) {
+    /** run simulation step */
     cloth.simulate(dt / 1000);
 
     cloth.updateGeometry(clothGeometry);
-    
-    raycaster.setFromCamera(new THREE.Vector2((mousePos.x / w) * 2 - 1, ((h - mousePos.y) / h) * 2 - 1), camera);
 
+    /** raycast from camera to cursor */
+    raycaster.setFromCamera(new THREE.Vector2((mousePos.x / w) * 2 - 1, ((h - mousePos.y) / h) * 2 - 1), camera);
     intersects = raycaster.intersectObject(clothMesh);
 
+    /** provide user interaction */
     if (intersects.length > 0) {
       if (windKeyDown)
         cloth.blow(camera.position, intersects);
+      /** "grab" vertex index */
       if (dragKeyDown && draggedIndex == -1)
         draggedIndex = intersects[0].face.a;
     }
     if (dragKeyDown && draggedIndex != -1)
       cloth.drag(calculateMousePosToWorld(mousePos), draggedIndex);
+
+    /** queue next frame */
     setTimeout(() => {
       animate(frameTime);
     }, frameTime);
+
     renderer.render(scene, camera);
   }
 
@@ -163,6 +171,7 @@ function init() {
     evt.preventDefault();
   }, false);
 
+  /** register key events */
   document.onkeydown = (evt) => {
     if (evt.code === "KeyW")
       windKeyDown = true;
@@ -179,6 +188,7 @@ function init() {
     }
   };
 
+  /** helper function to turn mouse position into 3D coordinates */
   function calculateMousePosToWorld(mousePos){
     var vec = new THREE.Vector3(); // create once and reuse
     var pos = new THREE.Vector3(); // create once and reuse