Add support for fan and strip

src/Loader.js

@@ -54,6 +54,30 @@ function parseLine(line) {
             );
             return element;
 
+        case "ts":
+            element.type = Element.AddTriangleStrip;
+            element.value = [];
+            for (let i = 1; i < split.length - 2; i++) {
+                element.value.push(new THREE.Face3(
+                    parseInt(split[i]  , 10) - 1,
+                    i % 2 === 1 ? parseInt(split[i+1], 10) - 1 : parseInt(split[i+2], 10) - 1,
+                    i % 2 === 1 ? parseInt(split[i+2], 10) - 1 : parseInt(split[i+1], 10) - 1,
+                ));
+            }
+            return element;
+
+        case "tf":
+            element.type = Element.AddTriangleFan;
+            element.value = [];
+            for (let i = 1; i < split.length - 2; i++) {
+                element.value.push(new THREE.Face3(
+                    parseInt(split[1]  , 10) - 1,
+                    parseInt(split[i+1], 10) - 1,
+                    parseInt(split[i+2], 10) - 1,
+                ));
+            }
+            return element;
+
         case "ev":
             element.type = Element.EditVertex;
             element.id = parseInt(split[1], 10) - 1;
@@ -72,6 +96,7 @@ function parseLine(line) {
                 parseInt(split[3], 10) - 1,
                 parseInt(split[4], 10) - 1,
             );
+            return element;
 
         case "df":
             element.type = Element.DeleteFace;
@@ -91,6 +116,8 @@ function parseLine(line) {
 const Element = {};
 Element.AddVertex = "AddVertex";
 Element.AddFace = "AddFace";
+Element.AddTriangleStrip = "AddTriangleStrip";
+Element.AddTriangleFan = "AddTriangleFan";
 Element.EditVertex = "EditVertex";
 Element.EditFace = "EditFace";
 Element.DeleteFace = "DeleteFace";
@@ -129,7 +156,6 @@ class Loader {
         let upperBound = Math.min(this.currentByte + this.chunkSize, this.dataLength);
 
         if (upperBound <= this.currentByte) {
-            console.log("Loading finished: " + this.currentByte + " / " + this.dataLength);
             return;
         }
 

src/Model.js

@@ -11,6 +11,9 @@ class Model extends THREE.Mesh {
     }
 
     manageElement(element) {
+
+        let vertices = this.geometry.vertices;
+
         switch (element.type) {
             case Element.AddVertex:
                 this.geometry.vertices.push(element.value);
@@ -24,7 +27,6 @@ class Model extends THREE.Mesh {
 
             case Element.AddFace:
 
-                let vertices = this.geometry.vertices;
                 let f = element.value;
                 let normal =
                     vertices[f.b].clone().sub(vertices[f.a])
@@ -37,9 +39,27 @@ class Model extends THREE.Mesh {
                 this.geometry.elementsNeedUpdate = true;
                 break;
 
+            case Element.AddTriangleStrip:
+            case Element.AddTriangleFan:
+
+                for (let f of element.value) {
+                    let normal =
+                        vertices[f.b].clone().sub(vertices[f.a])
+                        .cross(vertices[f.c].clone().sub(vertices[f.a]));
+                    normal.normalize();
+
+                    f.normal = normal;
+                    f.materialIndex = 0;
+                    this.geometry.faces.push(f);
+
+                }
+
+                this.geometry.elementsNeedUpdate = true;
+
+                break;
+
             case Element.EditFace:
 
-                vertices = this.geometry.vertices;
                 f = element.value;
                 normal =
                     vertices[f.b].clone().sub(vertices[f.a])

src/main.js

@@ -5,7 +5,9 @@ animate();
 
 function init() {
 
-    loader = new Loader('assets/bunny_remove.obj', 1024, 20);
+    let url = document.URL.split('?')[1] || "bunny_remove.obj";
+
+    loader = new Loader('assets/' + url, 1024, 20);
     loader.start(function(elements) {
         for (let element of elements) {
             if (element !== undefined) {
@@ -33,6 +35,7 @@ function init() {
     renderer.setSize(window.innerWidth, window.innerHeight);
     document.body.appendChild(renderer.domElement);
 
+    window.addEventListener('resize', onWindowResize, false);
     controls = new THREE.OrbitControls(camera, renderer.domElement);
 
 }
@@ -41,8 +44,15 @@ function animate() {
 
     requestAnimationFrame(animate);
     controls.update();
-    document.getElementById('progressbar').value = Math.floor(100 * loader.percentage());
+    document.getElementById('progressbar').value = Math.floor(100 * loader.percentage()) || 0;
     document.getElementById('percentage').innerHTML = Math.floor(100 * loader.percentage()) / 100 + "%";
     renderer.render(scene, camera);
 
 }
+
+function onWindowResize() {
+    camera.aspect = window.innerWidth / window.innerHeight;
+    camera.updateProjectionMatrix();
+
+    renderer.setSize( window.innerWidth, window.innerHeight );
+}