Fix #9 - mm and inch mode preview 3d

app/js/main.js

@@ -101,6 +101,7 @@ function readFile(evt) {
   for (var i = 0; i < files.length; i++) {
     loadFile(files[i]);
   }
+  document.getElementById('file').value = '';
 }
 
 // load file

app/js/viewer-ruler.js

@@ -1,4 +1,11 @@
-function drawRuler(xmin, xmax, ymin, ymax) {
+function drawRuler(xmin, xmax, ymin, ymax, inches) {
+
+  if (inches) {
+    xmin = Math.floor(xmin * 0.0393701);
+    xmax = Math.ceil(xmax * 0.0393701);
+    ymin = Math.floor(ymin * 0.0393701);
+    ymax = Math.ceil(ymax * 0.0393701);
+  }
   var ruler = new THREE.Group();
   var material = new THREE.LineBasicMaterial({
     color: 0x888888
@@ -117,5 +124,9 @@ function drawRuler(xmin, xmax, ymin, ymax) {
   var line = new THREE.Line(geometry, material);
   ruler.add(line);
 
+  if (inches) {
+    ruler.scale.multiplyScalar(25.4);
+  }
+
   return (ruler)
 }

app/js/viewer.js

@@ -149,8 +149,14 @@ function drawWorkspace(xmin, xmax, ymin, ymax) {
   scene.add(workspace)
 }
 
-function redrawGrid(xmin, xmax, ymin, ymax) {
+function redrawGrid(xmin, xmax, ymin, ymax, inches) {
 
+  if (inches) {
+    xmin = Math.floor(xmin * 25.4);
+    xmax = Math.ceil(xmax * 25.4);
+    ymin = Math.floor(ymin * 25.4);
+    ymax = Math.ceil(ymax * 25.4);
+  }
 
   sizexmax = xmax;
   sizeymax = ymax;
@@ -168,31 +174,47 @@ function redrawGrid(xmin, xmax, ymin, ymax) {
   var axesgrp = new THREE.Object3D();
   axesgrp.name = "Axes Markers"
 
+  if (inches) {
+    var unitsval = "in"
+    var offset = 5 * 25.4
+    var size = 5 * 25.4
+  } else {
+    var unitsval = "mm"
+    var offset = 5
+    var size = 5
+  }
+
   // add axes labels
   var xlbl = this.makeSprite(this.scene, "webgl", {
-    x: parseInt(xmax) + 5,
+    x: parseInt(xmax) + offset,
     y: 0,
     z: 0,
     text: "X",
-    color: "#ff0000"
+    color: "#ff0000",
+    size: size
   });
   var ylbl = this.makeSprite(this.scene, "webgl", {
     x: 0,
-    y: parseInt(ymax) + 5,
+    y: parseInt(ymax) + offset,
     z: 0,
     text: "Y",
-    color: "#006600"
-  });
-  var zlbl = this.makeSprite(this.scene, "webgl", {
-    x: 0,
-    y: 0,
-    z: 125,
-    text: "Z",
-    color: "#0000ff"
+    color: "#006600",
+    size: size
   });
 
+
   axesgrp.add(xlbl);
   axesgrp.add(ylbl);
+
+  var unitslabel = this.makeSprite(this.scene, "webgl", {
+    x: xmin - offset,
+    y: ymin - offset,
+    z: 0,
+    text: unitsval,
+    color: "#888888",
+    size: size
+  });
+  axesgrp.add(unitslabel);
   //axesgrp.add(zlbl); Laser don't have Z - but CNCs do
 
   var materialX = new THREE.LineBasicMaterial({
@@ -220,9 +242,20 @@ function redrawGrid(xmin, xmax, ymin, ymax) {
   axesgrp.add(line1);
   axesgrp.add(line2);
 
+  // if (inches) {
+  //   axesgrp.scale.multiplyScalar(2.5);
+  // }
+
   grid.add(axesgrp);
 
-  helper = new THREE.GridHelper(xmax, ymax, 10, 0x888888);
+  var step10 = 10;
+  var step100 = 100;
+  if (inches) {
+    step10 = 25.4;
+    step100 = 254;
+  }
+
+  helper = new THREE.GridHelper(xmax, ymax, step10, 0x888888);
   helper.position.y = 0;
   helper.position.x = 0;
   helper.position.z = 0;
@@ -231,7 +264,7 @@ function redrawGrid(xmin, xmax, ymin, ymax) {
   helper.receiveShadow = false;
   helper.name = "GridHelper10mm"
   grid.add(helper);
-  helper = new THREE.GridHelper(xmax, ymax, 100, 0x666666);
+  helper = new THREE.GridHelper(xmax, ymax, step100, 0x666666);
   helper.position.y = 0;
   helper.position.x = 0;
   helper.position.z = 0;
@@ -243,10 +276,14 @@ function redrawGrid(xmin, xmax, ymin, ymax) {
   grid.name = "Grid"
 
   gridsystem.children.length = 0
-  var ruler = drawRuler(xmin, xmax, ymin, ymax)
+  var ruler = drawRuler(xmin, xmax, ymin, ymax, inches)
   gridsystem.add(grid);
   gridsystem.add(ruler);
 
+  if (inches) {
+    gridsystem.scale.multiplyScalar(0.0393701);
+  }
+
 }
 
 function setBullseyePosition(x, y, z) {

app/lib/3dview/3dview.js

@@ -14,7 +14,7 @@ worker.addEventListener('message', function(e) {
   object = loader.parse(JSON.parse(e.data));
   if (object) {
     scene.add(object);
-    redrawGrid(parseInt(object.userData.bbbox2.min.x), parseInt(object.userData.bbbox2.max.x), parseInt(object.userData.bbbox2.min.y), parseInt(object.userData.bbbox2.max.y))
+    redrawGrid(parseInt(object.userData.bbbox2.min.x), parseInt(object.userData.bbbox2.max.x), parseInt(object.userData.bbbox2.min.y), parseInt(object.userData.bbbox2.max.y), object.userData.inch)
     // animate();
     setTimeout(function() {
       clearSceneFlag = true;

app/lib/3dview/workers/gcodeparser.js

@@ -288,7 +288,7 @@ GCodeParser = function(handlers, modecmdhandlers) {
       var units = "mm";
       if (!this.isUnitsMm) units = "inch";
       // $('.com-chilipeppr-widget-3dviewer-units-indicator').text(units);
-      // console.log("USING UNITS:" + units)
+      console.log("USING UNITS:" + units)
 
     }
     // these are extra Object3D elements added during
@@ -1238,6 +1238,12 @@ GCodeParser = function(handlers, modecmdhandlers) {
     // scene.add(object);
     // viewObject();
 
+    if (!isUnitsMm) {
+      gcobject.userData.inch = true;
+    } else {
+      gcobject.userData.inch = false;
+    }
+
     return gcobject;
   } // end of createObjectFromGCode()
 

index.js

@@ -19,6 +19,8 @@ var path = require("path");
 const join = require('path').join;
 var mkdirp = require('mkdirp');
 
+app.use(express.static(path.join(__dirname, "app")));
+
 var httpsOptions = {
   key: fs.readFileSync(path.join(__dirname, 'domain-key.key')),
   cert: fs.readFileSync(path.join(__dirname, 'domain-crt.cer'))
@@ -456,8 +458,6 @@ var PortCheckinterval = setInterval(function() {
   }
 }, 500);
 
-// Static Webserver
-app.use(express.static(path.join(__dirname, "app")));
 
 // JSON API
 app.get('/api/version', (req, res) => {