Added configuration option to show metric or imperial units in browser. #74

diff --git a/src/jade/index.jade b/src/jade/index.jade
index 633687d00eaa865f0c5fcae50c230e46548f434b..b7b10999ef710b4f42faad9726474544bb8ec577 100644 (file)
--- a/src/jade/index.jade
+++ b/src/jade/index.jade
@@ -60,6 +60,10 @@ html(lang="en")
         button.save.pure-button.button-success(:disabled="!modified",
           @click="save") Save
 
+        select.units(v-model="config.settings.units", @change="modified = true")
+          option(value="METRIC") Metric
+          option(value="IMPERIAL") Imperial
+
         .pure-menu
           ul.pure-menu-list
             li.pure-menu-heading

diff --git a/src/jade/templates/control-view.jade b/src/jade/templates/control-view.jade
index 1eca81d1f2931236c9a73c548b37c4feffd3d961..fd4a840f35742f61cf206a8f8c5edbe9d04b8076 100644 (file)
--- a/src/jade/templates/control-view.jade
+++ b/src/jade/templates/control-view.jade
@@ -46,9 +46,10 @@ script#control-view-template(type="text/x-template")
           v-if="enabled('#{axis}')")
           th.name #{axis}
           td.position
-            | {{(state.#{axis}p + get_offset('#{axis}')) || 0 | fixed 3}}
-          td.absolute {{state.#{axis}p || 0 | fixed 3}}
-          td.offset {{get_offset('#{axis}') | fixed 3}}
+            unit-value(:value="state.#{axis}p + get_offset('#{axis}')",
+              precision="3")
+          td.absolute: unit-value(:value="state.#{axis}p", precision="3")
+          td.offset: unit-value(:value="get_offset('#{axis}')", precision="3")
           th.actions
             button.pure-button(:disabled="!is_ready",
               title="Set {{'#{axis}' | upper}} axis position.",
@@ -118,24 +119,28 @@ script#control-view-template(type="text/x-template")
         th Message
         td.reason(:class="{attention: highlight_reason}") {{reason}}
         td
-      tr
+      tr(title="Currently active machine units")
         th Units
         td {{state.imperial ? 'IMPERIAL' : 'METRIC'}}
         td
       tr
         th Feed
-        td {{state.feed || 0 | fixed 0}}
-        td mm/min
+        td: unit-value(:value="state.feed", precision="2", unit="", iunit="")
+        td {{metric ? 'mm/min' : 'IPM'}}
       tr
         th Speed
-        td {{state.speed || 0 | fixed 0}} ({{state.s || 0 | fixed 0}})
+        td
+          | {{state.speed || 0 | fixed 0}}
+          span(v-if="!isNaN(state.s)") ({{state.s | fixed 0}})
         td RPM
 
     table.info
-      tr
+      tr(
+        title="Current velocity in {{metric ? 'meters' : 'inches'}} per minute")
         th Velocity
-        td {{state.v || 0 | fixed 2}}
-        td m/min
+        td: unit-value(:value="state.v", precision="2", unit="", iunit="",
+          scale="0.0254")
+        td {{metric ? 'm/min' : 'IPM'}}
       tr
         th Line
         td {{0 <= state.line ? state.line : '-'}}

diff --git a/src/jade/templates/motor-view.jade b/src/jade/templates/motor-view.jade
index 09b72528c4eb171ab4f831bb10c295de4f8d4116..e1440b45084be52b682e1185ad80c03e01e8b575 100644 (file)
--- a/src/jade/templates/motor-view.jade
+++ b/src/jade/templates/motor-view.jade
@@ -39,14 +39,18 @@ script#motor-view-template(type="text/x-template")
           label.extra(v-if="$key == 'max-velocity'", slot="extra",
             title="Revolutions Per Minute") ({{rpm | fixed 0}} RPM)
 
-          label.extra(v-if="$key == 'max-accel'", slot="extra",
+          label.extra(v-if="$key == 'max-accel' && metric", slot="extra",
             title="G-force") ({{gForce | fixed 3}} g)
 
-          label.extra(v-if="$key == 'max-jerk'", slot="extra",
+          label.extra(v-if="$key == 'max-jerk' && metric", slot="extra",
             title="G-force per minute") ({{gForcePerMin | fixed 2}} g/min)
 
           label.extra(v-if="$key == 'step-angle'", slot="extra",
             title="Steps per revolution") ({{stepsPerRev | fixed 0}} steps/rev)
 
-          label.extra(v-if="$key == 'travel-per-rev'", slot="extra",
+          label.extra(v-if="$key == 'travel-per-rev' && metric", slot="extra",
             title="Micrometers per step") ({{umPerStep | fixed 1}} µm/step)
+
+          label.extra(v-if="$key == 'travel-per-rev' && !metric", slot="extra",
+            title="Thousandths of an inch per step")
+            | ({{milPerStep | fixed 2}} mil/step)

diff --git a/src/jade/templates/templated-input.jade b/src/jade/templates/templated-input.jade
index a264f4289c92d8f8e3b22dfb94baa7a75dc1b2a1..0e456ac0ffe01710991522b2d8f5b8946478612d 100644 (file)
--- a/src/jade/templates/templated-input.jade
+++ b/src/jade/templates/templated-input.jade
@@ -30,32 +30,32 @@ script#templated-input-template(type="text/x-template")
     title="Default {{template.default}} {{template.unit || ''}}")
     label(:for="name") {{name}}
 
-    select(v-if="template.type == 'enum' || template.values", v-model="model",
+    select(v-if="template.type == 'enum' || template.values", v-model="view",
       :name="name", @change="change")
       option(v-for="opt in template.values", :value="opt") {{opt}}
 
-    input(v-if="template.type == 'bool'", type="checkbox",
-      v-model="model", :name="name", @change="change")
+    input(v-if="template.type == 'bool'", type="checkbox", v-model="view",
+      :name="name", @change="change")
 
-    input(v-if="template.type == 'float'", v-model="model", number,
+    input(v-if="template.type == 'float'", v-model="view", number,
       :min="template.min", :max="template.max", :step="template.step || 'any'",
         type="number", :name="name", @change="change")
 
-    input(v-if="template.type == 'int' && !template.values", v-model="model",
+    input(v-if="template.type == 'int' && !template.values", v-model="view",
       number, :min="template.min", :max="template.max", type="number",
       :name="name", @change="change")
 
-    input(v-if="template.type == 'string'", v-model="model",
-      type="text", :name="name", @change="change")
-
-    textarea(v-if="template.type == 'text'", v-model="model",
+    input(v-if="template.type == 'string'", v-model="view", type="text",
       :name="name", @change="change")
 
+    textarea(v-if="template.type == 'text'", v-model="view", :name="name",
+      @change="change")
+
     span.range(v-if="template.type == 'percent'")
-      input(type="range", v-model="model", :name="name", number, min="0",
+      input(type="range", v-model="view", :name="name", number, min="0",
         max="100", step="1", @change="change")
-      | {{model}}
+      | {{view}}
 
-    label.units {{template.unit}}
+    label.units {{units}}
 
     slot(name="extra")

diff --git a/src/js/app.js b/src/js/app.js
index a66b99fdc141f4baeb2df32d59ea3d11ddfb80c4..76f9f615e9a08811ad75840daac00c5f1fba1cb2 100644 (file)
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -86,7 +86,11 @@ module.exports = new Vue({
       index: -1,
       modified: false,
       template: {motors: {template: {}}},
-      config: {motors: [{}, {}, {}, {}], version: '<loading>'},
+      config: {
+        settings: {units: 'METRIC'},
+        motors: [{}, {}, {}, {}],
+        version: '<loading>'
+      },
       state: {},
       messages: [],
       errorTimeout: 30,
@@ -128,6 +132,7 @@ module.exports = new Vue({
     'config-changed': function () {this.modified = true;},
     'hostname-changed': function (hostname) {this.hostname = hostname},
 
+
     send: function (msg) {
       if (this.status == 'connected') {
         console.debug('>', msg);
@@ -201,6 +206,9 @@ module.exports = new Vue({
 
 
   methods: {
+    metric: function () {return this.config.settings.units != 'IMPERIAL'},
+
+
     block_error_dialog: function () {
       this.errorTimeoutStart = Date.now();
       this.errorShow = false;

diff --git a/src/js/control-view.js b/src/js/control-view.js
index eb32f221768b1d4e1979f372b57db7259e6c2313..6ff21a3b376da2d63faedb2e212a9b658ff0520b 100644 (file)
--- a/src/js/control-view.js
+++ b/src/js/control-view.js
@@ -82,6 +82,9 @@ module.exports = {
 
 
   computed: {
+    metric: function () {return this.$root.metric()},
+
+
     mach_state: function () {
       var cycle = this.state.cycle;
       var state = this.state.xx;

diff --git a/src/js/main.js b/src/js/main.js
index db409fe5a334e4e434907d25ebabfa1a0f29b940..2a652045b16203d56daaf7ac2b6e1ace0d1ce939 100644 (file)
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -38,6 +38,7 @@ $(function() {
   Vue.component('message', require('./message'));
   Vue.component('indicators', require('./indicators'));
   Vue.component('console', require('./console'));
+  Vue.component('unit-value', require('./unit-value'));
 
   Vue.filter('percent', function (value, precision) {
     if (typeof precision == 'undefined') precision = 2;

diff --git a/src/js/motor-view.js b/src/js/motor-view.js
index 51627aae0239a19d39d44908e6c57d820c45ae17..9e40975fc980f178c8ebf35bf350aa269d2e4012 100644 (file)
--- a/src/js/motor-view.js
+++ b/src/js/motor-view.js
@@ -34,6 +34,9 @@ module.exports = {
 
 
   computed: {
+    metric: function () {return this.$root.metric()},
+
+
     is_slave: function () {
       for (var i = 0; i < this.index; i++)
         if (this.motor.axis == this.config.motors[i].axis)
@@ -58,7 +61,10 @@ module.exports = {
 
     umPerStep: function () {
       return this.motor['travel-per-rev'] * this.motor['step-angle'] / 0.36
-    }
+    },
+
+
+    milPerStep: function () {return this.umPerStep / 25.4}
   },
 
 

diff --git a/src/js/templated-input.js b/src/js/templated-input.js
index db0ce8cc19aa0d09f8f0bc834b753d57c9bca948..750980609188626dd695f4420ff1277e32754c04 100644 (file)
--- a/src/js/templated-input.js
+++ b/src/js/templated-input.js
@@ -34,8 +34,42 @@ module.exports = {
   props: ['name', 'model', 'template'],
 
 
+  data: function () {return {view: ''}},
+
+
+  computed: {
+    metric: function () {return this.$root.metric()},
+
+
+    units: function () {
+      return (this.metric || !this.template.iunit) ?
+        this.template.unit : this.template.iunit;
+    }
+  },
+
+
+  watch: {
+    metric: function () {this.set_view()},
+    model: function () {this.set_view()}
+  },
+
+
+  ready: function () {this.set_view()},
+
+
   methods: {
+    set_view: function () {
+      if (this.template.scale && !this.metric)
+        this.view = (this.model / this.template.scale).toFixed(2);
+      else this.view = this.model;
+    },
+
+
     change: function () {
+      if (this.template.scale && !this.metric)
+        this.model = 1 * (this.view * this.template.scale).toFixed(3);
+      else this.model = this.view;
+
       this.$dispatch('input-changed');
     }
   }

diff --git a/src/js/unit-value.js b/src/js/unit-value.js
new file mode 100644 (file)
index 0000000..a84a61c
--- /dev/null
+++ b/src/js/unit-value.js
@@ -0,0 +1,58 @@
+/******************************************************************************\
+
+                 This file is part of the Buildbotics firmware.
+
+                   Copyright (c) 2015 - 2018, Buildbotics LLC
+                              All rights reserved.
+
+      This file ("the software") is free software: you can redistribute it
+      and/or modify it under the terms of the GNU General Public License,
+       version 2 as published by the Free Software Foundation. You should
+       have received a copy of the GNU General Public License, version 2
+      along with the software. If not, see <http://www.gnu.org/licenses/>.
+
+      The software is distributed in the hope that it will be useful, but
+           WITHOUT ANY WARRANTY; without even the implied warranty of
+       MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+                Lesser General Public License for more details.
+
+        You should have received a copy of the GNU Lesser General Public
+                 License along with the software.  If not, see
+                        <http://www.gnu.org/licenses/>.
+
+                 For information regarding this software email:
+                   "Joseph Coffland" <joseph@buildbotics.com>
+
+\******************************************************************************/
+
+'use strict'
+
+
+module.exports = {
+  replace: true,
+  template: '{{text}}<span class="unit">{{metric ? unit : iunit}}</span>',
+  props: ['value', 'precision', 'unit', 'iunit', 'scale'],
+
+
+  computed: {
+    metric: function () {return this.$root.metric()},
+
+
+    text: function () {
+      var value = this.value;
+      if (typeof value == 'undefined') return '';
+
+      if (!this.metric) value /= this.scale;
+
+      return (1 * value.toFixed(this.precision)).toLocaleString();
+    }
+  },
+
+
+  ready: function () {
+    if (typeof this.precision == 'undefined') this.precision = 0;
+    if (typeof this.unit == 'undefined') this.unit = 'mm';
+    if (typeof this.iunit == 'undefined') this.iunit = 'in';
+    if (typeof this.scale == 'undefined') this.scale = 25.4;
+  }
+}

diff --git a/src/resources/config-template.json b/src/resources/config-template.json
index 6da0be181cb646643ca946eb4cbad366cc692320..93eabf589593b2788aeee7dfd8bd6d22a8ae2d5e 100644 (file)
--- a/src/resources/config-template.json
+++ b/src/resources/config-template.json
@@ -1,4 +1,11 @@
 {
+  "settings": {
+    "units": {
+      "type": "enum",
+      "values": ["METRIC", "IMPERIAL"],
+      "default": "METRIC"
+    }
+  },
   "motors": {
     "type": "list",
     "index": "0123",
@@ -60,6 +67,8 @@
           "type": "float",
           "min": 0,
           "unit": "m/min",
+          "iunit": "IPM",
+          "scale": 0.0254,
           "default": 5,
           "code": "vm"
         },
@@ -67,6 +76,8 @@
           "type": "float",
           "min": 0,
           "unit": "km/min²",
+          "iunit": "g-force",
+          "scale": 35.304,
           "default": 10,
           "code": "am"
         },
@@ -74,6 +85,8 @@
           "type": "float",
           "min": 0,
           "unit": "km/min³",
+          "iunit": "g/min",
+          "scale": 35.304,
           "default": 50,
           "code": "jm"
         },
@@ -89,6 +102,8 @@
         "travel-per-rev": {
           "type": "float",
           "unit": "mm",
+          "iunit": "in",
+          "scale": 25.4,
           "default": 5,
           "code": "tr"
         }
@@ -98,12 +113,16 @@
         "min-soft-limit": {
           "type": "float",
           "unit": "mm",
+          "iunit": "in",
+          "scale": 25.4,
           "default": 0,
           "code": "tn"
         },
         "max-soft-limit": {
           "type": "float",
           "unit": "mm",
+          "iunit": "in",
+          "scale": 25.4,
           "default": 0,
           "code": "tm"
         },
@@ -132,6 +151,8 @@
           "type": "float",
           "min": 0,
           "unit": "m/min",
+          "iunit": "IPM",
+          "scale": 0.0254,
           "default": 0.5,
           "code": "sv"
         },
@@ -139,6 +160,8 @@
           "type": "float",
           "min": 0,
           "unit": "m/min",
+          "iunit": "IPM",
+          "scale": 0.0254,
           "default": 0.1,
           "code": "lv"
         },
@@ -146,6 +169,8 @@
           "type": "float",
           "min": 0,
           "unit": "mm",
+          "iunit": "in",
+          "scale": 25.4,
           "default": 5,
           "code": "lb"
         },
@@ -153,6 +178,8 @@
           "type": "float",
           "min": 0,
           "unit": "mm",
+          "iunit": "in",
+          "scale": 25.4,
           "default": 1,
           "code": "zb"
         }

diff --git a/src/stylus/style.styl b/src/stylus/style.styl
index bf79bf1a5180e71bd431ffe07ee634beffc39740..41495dc5e9f7ff5af5a623423f633327b5c45f42 100644 (file)
--- a/src/stylus/style.styl
+++ b/src/stylus/style.styl
@@ -77,6 +77,9 @@ body
     color #000
     animation attention 2s step-start 0s infinite
 
+span.unit
+  font-size 60%
+
 .status
   color #eee
   text-align center
@@ -111,9 +114,9 @@ body
     top 50%
 
 #menu
-  .save
+  .save, .units
     display block
-    margin 0.25em auto
+    margin 0.25em 0.6em
 
   .pure-menu-heading
     background inherit