Add photonic3d.js and test retrieving config values and initializing …
…them

…them
Load default STL file and fix geometry error temporarily
lautr3k · Wilbur Shi · Wilbur Shi · angela-ko · angela-ko · wilbur-shi
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,28 @@
+{
+    "env": {
+        "browser": true,
+        "es6": true
+    },
+    "extends": "eslint:recommended",
+    "parserOptions": {
+        "sourceType": "module"
+    },
+    "rules": {
+        "indent": [
+            "error",
+            4
+        ],
+        "linebreak-style": [
+            "error",
+            "unix"
+        ],
+        "quotes": [
+            "error",
+            "single"
+        ],
+        "semi": [
+            "error",
+            "always"
+        ]
+    }
+}
diff --git a/.gitignore b/.gitignore
@@ -1 +1,4 @@
 _*.*
+node_modules
+dist
+build
diff --git a/css/main.css → app/css/main.css b/css/main.css → app/css/main.css
diff --git a/index.html → app/index.html b/index.html → app/index.html
@@ -5,10 +5,10 @@
         <meta http-equiv="X-UA-Compatible" content="IE=edge" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <title>SLAcer.js (bêta)</title>
-        <link rel="stylesheet" type="text/css" href="vendor/jquery-ui/jquery-ui.min.css" />
-        <link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css" />
-        <link rel="stylesheet" type="text/css" href="vendor/bootstrap-slider/css/bootstrap-slider.min.css" />
-        <link rel="stylesheet" type="text/css" href="vendor/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css" />
+        <link rel="stylesheet" type="text/css" href="/vendor/jquery-ui/themes/base/all.css" />
+        <link rel="stylesheet" type="text/css" href="/vendor/bootstrap/dist/css/bootstrap.min.css" />
+        <link rel="stylesheet" type="text/css" href="/vendor/bootstrap-slider/dist/css/bootstrap-slider.min.css" />
+        <link rel="stylesheet" type="text/css" href="/vendor/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css" />
         <link rel="stylesheet" type="text/css" href="css/main.css" />
     </head>
     <body>
@@ -210,7 +210,7 @@ <h3 class="panel-title">Slicer</h3>
                         </div>
                         <div class="form-group">
                             <label for="slicer-speed-delay">Speed mode<br />delay <small>(ms)</small></label>
-                            <input type="number" id="slicer-speed-delay" class="form-control input-sm" placeholder="100" min="1" />
+                            <input type="number" id="slicer-speed-delay" class="form-control input-sm" placeholder="100" min="0" />
                         </div>
                     </div>
                 </div><!-- #slicer -->
@@ -339,26 +339,23 @@ <h3 class="panel-title">Colors</h3>
             <p class="message">Alert message empty...</p>
         </div>
 
-        <script src="vendor/jquery-2.1.4.min.js" type="text/javascript"></script>
-        <script src="vendor/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
-        <script src="vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
-        <script src="vendor/bootstrap-slider/bootstrap-slider.min.js" type="text/javascript"></script>
-        <script src="vendor/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js" type="text/javascript"></script>
-        <script src="vendor/lodash.min.js" type="text/javascript"></script>
-        <script src="vendor/three.min.js" type="text/javascript"></script>
-        <script src="vendor/earcut.js" type="text/javascript"></script>
-        <script src="vendor/triangulation.js" type="text/javascript"></script>
-        <script src="js/slacer/settings.js" type="text/javascript"></script>
-        <script src="js/slacer/mesh.js" type="text/javascript"></script>
-        <script src="js/slacer/viewer.js" type="text/javascript"></script>
-        <script src="vendor/OrbitControls.js" type="text/javascript"></script>
-        <script src="js/slacer/viewcontrols.js" type="text/javascript"></script>
-        <script src="js/slacer/viewer3d.js" type="text/javascript"></script>
-        <script src="js/slacer/viewer2d.js" type="text/javascript"></script>
-        <script src="js/slacer/slicer.js" type="text/javascript"></script>
-        <script src="js/loader/stl.js" type="text/javascript"></script>
-        <script src="vendor/FileSaver.min.js" type="text/javascript"></script>
-        <script src="vendor/jszip.min.js" type="text/javascript"></script>
-        <script src="js/main.js" type="text/javascript"></script>
+        <script src="/vendor/jquery/dist/jquery.min.js" type="text/javascript"></script>
+        <script src="/vendor/jquery-ui/ui/widget.js" type="text/javascript"></script>
+        <script src="/vendor/jquery-ui/ui/widgets/mouse.js" type="text/javascript"></script>
+        <script src="/vendor/jquery-ui/ui/widgets/sortable.js" type="text/javascript"></script>
+        <script src="/vendor/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
+        <script src="/vendor/bootstrap-slider/dist/bootstrap-slider.min.js" type="text/javascript"></script>
+        <script src="/vendor/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js" type="text/javascript"></script>
+        <script src="/vendor/lodash/lodash.js" type="text/javascript"></script>
+        <script src="/vendor/three/three.js" type="text/javascript"></script>
+        <script src="/vendor/earcut/dist/earcut.min.js" type="text/javascript"></script>
+        <!-- <script src="/vendor-old/triangulation.js" type="text/javascript"></script> -->
+        <script src="/vendor/three/examples/js/controls/OrbitControls.js" type="text/javascript"></script>
+        <script src="/vendor/file-saver/FileSaver.min.js" type="text/javascript"></script>
+        <script src="/vendor/jszip/dist/jszip.js" type="text/javascript"></script>
+        <script src="/js/meshes.js" type="text/javascript"></script>
+        <script src="/js/slacer.js"  type="text/javascript"></script>
+        <script src="/js/main.js" type="text/javascript"></script>
+        <!-- <script src="js/photonic3d.js" type="text/javascript"></script> -->
     </body>
 </html>
diff --git a/stl/Octocat-v2.stl → app/stl/Octocat-v2.stl b/stl/Octocat-v2.stl → app/stl/Octocat-v2.stl
diff --git a/stl/SLAcer.stl → app/stl/SLAcer.stl b/stl/SLAcer.stl → app/stl/SLAcer.stl
diff --git a/stl/StressTest.stl → app/stl/StressTest.stl b/stl/StressTest.stl → app/stl/StressTest.stl
diff --git a/stl/cube.center.stl → app/stl/cube.center.stl b/stl/cube.center.stl → app/stl/cube.center.stl
diff --git a/stl/cube_hole.stl → app/stl/cube_hole.stl b/stl/cube_hole.stl → app/stl/cube_hole.stl
diff --git a/viewer2d.html → app/viewer2d.html b/viewer2d.html → app/viewer2d.html
@@ -25,8 +25,9 @@
     </head>
     <body>
         <div id="slice"></div>
-        <script src="vendor/lodash.min.js" type="text/javascript"></script>
-        <script src="js/slacer/settings.js" type="text/javascript"></script>
+        <script src="/vendor/lodash.min.js" type="text/javascript"></script>
+        <script src="/vendor/three.min.js" type="text/javascript"></script>
+        <script src="/js/slacer.js" type="text/javascript"></script>
         <script>
                 function storageListener() {
                     var settings = new SLAcer.Settings();
diff --git a/js/loader/stl.js b/js/loader/stl.js
@@ -1,187 +0,0 @@
-// namespace
-var MeshesJS = MeshesJS || {};
-
-;(function() {
-
-    // Constructor
-    function STLLoader(dropTarget) {
-        this.dropTarget = dropTarget || null;
-        this.addDropListener();
-    }
-
-    // methods
-    STLLoader.prototype.onDragLeave = function(e) {
-        e.stopPropagation();
-        e.preventDefault();
-    }
-
-    STLLoader.prototype.onDrop = function(e) {
-        this.onDragLeave(e);
-        this.loadFile((e.target.files || e.dataTransfer.files)[0]);
-    }
-
-    STLLoader.prototype.addDropListener = function(dropTarget) {
-        var dropTarget = dropTarget || this.dropTarget;
-        if (dropTarget) {
-            var self = this;
-            dropTarget.addEventListener('drop'     , function(e) { self.onDrop(e); }     , false);
-            dropTarget.addEventListener('dragover' , function(e) { self.onDragLeave(e); }, false);
-            dropTarget.addEventListener('dragleave', function(e) { self.onDragLeave(e); }, false);
-        }
-    };
-
-    STLLoader.prototype.removeDropListener = function(dropTarget) {
-        var dropTarget = dropTarget || this.dropTarget;
-        if (dropTarget) {
-            var self = this;
-            dropTarget.removeEventListener('drop'     , function(e) { self.onDrop(e); }     , false);
-            dropTarget.removeEventListener('dragover' , function(e) { self.onDragLeave(e); }, false);
-            dropTarget.removeEventListener('dragleave', function(e) { self.onDragLeave(e); }, false);
-        }
-    };
-
-    STLLoader.prototype.onGeometry = function(geometry) {};
-    STLLoader.prototype.onError = function(error) {};
-
-    STLLoader.prototype.loadFile = function(file) {
-        // self alias
-        var self = this;
-
-        // file reader instance
-        var reader = new FileReader();
-
-        // on file loaded
-        reader.onloadend = function(event) {
-            // if error/abort
-            if (this.error) {
-                self.onError(this.error);
-                return;
-            }
-
-            // Parse ASCII STL
-            if (typeof this.result === 'string' ) {
-                self.loadString(this.result);
-                return;
-            }
-
-            // buffer reader
-            var view = new DataView(this.result);
-
-            // get faces number
-            try {
-                var faces = view.getUint32(80, true);
-            }
-            catch(error) {
-                self.onError(error);
-                return;
-            }
-
-            // is binary ?
-            var binary = view.byteLength == (80 + 4 + 50 * faces);
-
-            if (! binary) {
-                // get the file contents as string
-                // (faster than convert array buffer)
-                reader.readAsText(file);
-                return;
-            }
-
-            // parse binary STL
-            self.loadBinaryData(view, faces);
-        };
-
-        // start reading file as array buffer
-        reader.readAsArrayBuffer(file);
-    };
-
-    STLLoader.prototype.loadString = function(data) {
-        var length, normal, patternNormal, patternVertex, result, text;
-        var geometry = new THREE.Geometry();
-        var patternFace = /facet([\s\S]*?)endfacet/g;
-
-        while((result = patternFace.exec(data)) !== null) {
-            text = result[0];
-
-            patternNormal = /normal[\s]+([\-+]?[0-9]+\.?[0-9]*([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+/g;
-            patternVertex = /vertex[\s]+([\-+]?[0-9]+\.?[0-9]*([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+/g;
-
-            while((result = patternNormal.exec(text)) !== null) {
-                normal = new THREE.Vector3(
-                    parseFloat(result[1]),
-                    parseFloat(result[3]),
-                    parseFloat(result[5])
-                );
-            }
-
-            while((result = patternVertex.exec(text)) !== null) {
-                geometry.vertices.push(new THREE.Vector3(
-                    parseFloat(result[1]),
-                    parseFloat(result[3]),
-                    parseFloat(result[5])
-                ));
-            }
-
-            length = geometry.vertices.length;
-
-            geometry.faces.push(new THREE.Face3(length-3, length-2, length-1, normal));
-        }
-
-        geometry.computeBoundingBox();
-        geometry.computeBoundingSphere();
-
-        this.onGeometry(geometry);
-    };
-
-    STLLoader.prototype.loadBinaryData = function(view, faces) {
-        if (! view instanceof DataView) {
-            var view = new DataView(view);
-        }
-
-        if (! faces) {
-            try {
-                var faces = view.getUint32(80, true);
-            }
-            catch(error) {
-                this.onError(error);
-                return;
-            }
-        }
-
-        var dataOffset = 84;
-        var faceLength = 12 * 4 + 2;
-        var offset = 0;
-        var geometry = new THREE.BufferGeometry();
-        var vertices = new Float32Array( faces * 3 * 3 );
-        var normals = new Float32Array( faces * 3 * 3 );
-
-        for ( var face = 0; face < faces; face ++ ) {
-            var start = dataOffset + face * faceLength;
-            var normalX = view.getFloat32( start, true );
-            var normalY = view.getFloat32( start + 4, true );
-            var normalZ = view.getFloat32( start + 8, true );
-
-            for (var i = 1; i <= 3; i ++) {
-                var vertexstart = start + i * 12;
-
-                normals[ offset ] = normalX;
-                normals[ offset + 1 ] = normalY;
-                normals[ offset + 2 ] = normalZ;
-
-                vertices[ offset ] = view.getFloat32( vertexstart, true );
-                vertices[ offset + 1 ] = view.getFloat32( vertexstart + 4, true );
-                vertices[ offset + 2 ] = view.getFloat32( vertexstart + 8, true );
-
-                offset += 3;
-            }
-        }
-
-        geometry.addAttribute('position', new THREE.BufferAttribute(vertices, 3));
-        geometry.addAttribute('normal', new THREE.BufferAttribute(normals, 3));
-
-        this.onGeometry(geometry);
-    };
-
-    // export module
-    MeshesJS.STLLoader = STLLoader;
-
-})();
diff --git a/js/slacer/mesh.js b/js/slacer/mesh.js
@@ -1,76 +0,0 @@
-// namespace
-var SLAcer = SLAcer || {};
-
-;(function() {
-
-    // Constructor
-    function Mesh(geometry, material) {
-        // normalize geometry
-        if (geometry instanceof THREE.BufferGeometry) {
-            geometry = new THREE.Geometry().fromBufferGeometry(geometry);
-        }
-
-        // center geometry
-        geometry.center();
-
-        // bounding box min coords
-        //var min = geometry.boundingBox.min;
-
-        // set geometry origin to [0, 0]
-        //geometry.translate(-min.x, -min.y, -min.z);
-
-        // call parent constructor
-        THREE.Mesh.call(this, geometry, material || new THREE.MeshNormalMaterial());
-
-        // get geometry volume
-        this.getVolume();
-    }
-
-    // extends
-    Mesh.prototype = Object.create(THREE.Mesh.prototype);
-    Mesh.prototype.constructor = Mesh;
-
-    // -------------------------------------------------------------------------
-
-    Mesh.prototype.getSize = function() {
-        return this.geometry.boundingBox.size();
-    };
-
-    // http://stackoverflow.com/questions/23279521
-    Mesh.prototype.getVolume = function(update) {
-        if (! update && this.userData.volume !== undefined) {
-            return this.userData.volume;
-        }
-
-        var volume   = 0;
-        var faces    = this.geometry.faces;
-        var vertices = this.geometry.vertices;
-
-        var face, v1, v2, v3;
-
-        for (var i = 0; i < faces.length; i++) {
-            face = faces[i];
-
-            v1 = vertices[face.a];
-            v2 = vertices[face.b];
-            v3 = vertices[face.c];
-
-            volume += (
-                -(v3.x * v2.y * v1.z)
-                +(v2.x * v3.y * v1.z)
-                +(v3.x * v1.y * v2.z)
-                -(v1.x * v3.y * v2.z)
-                -(v2.x * v1.y * v3.z)
-                +(v1.x * v2.y * v3.z)
-            ) / 6;
-        }
-
-        return (this.userData.volume = volume);
-    };
-
-    // -------------------------------------------------------------------------
-
-    // export module
-    SLAcer.Mesh = Mesh;
-
-})();