Merge pull request #3 from supleed2/PIOjc4419

PIOjc4419

Control/data/command.js

@@ -0,0 +1,656 @@
+/* parser generated by jison 0.4.18 */
+/*
+  Returns a Parser object of the following structure:
+
+  Parser: {
+    yy: {}
+  }
+
+  Parser.prototype: {
+    yy: {},
+    trace: function(),
+    symbols_: {associative list: name ==> number},
+    terminals_: {associative list: number ==> name},
+    productions_: [...],
+    performAction: function anonymous(yytext, yyleng, yylineno, yy, yystate, $$, _$),
+    table: [...],
+    defaultActions: {...},
+    parseError: function(str, hash),
+    parse: function(input),
+
+    lexer: {
+        EOF: 1,
+        parseError: function(str, hash),
+        setInput: function(input),
+        input: function(),
+        unput: function(str),
+        more: function(),
+        less: function(n),
+        pastInput: function(),
+        upcomingInput: function(),
+        showPosition: function(),
+        test_match: function(regex_match_array, rule_index),
+        next: function(),
+        lex: function(),
+        begin: function(condition),
+        popState: function(),
+        _currentRules: function(),
+        topState: function(),
+        pushState: function(condition),
+
+        options: {
+            ranges: boolean           (optional: true ==> token location info will include a .range[] member)
+            flex: boolean             (optional: true ==> flex-like lexing behaviour where the rules are tested exhaustively to find the longest match)
+            backtrack_lexer: boolean  (optional: true ==> lexer regexes are tested in order and for each matching regex the action code is invoked; the lexer terminates the scan when a token is returned by the action code)
+        },
+
+        performAction: function(yy, yy_, $avoiding_name_collisions, YY_START),
+        rules: [...],
+        conditions: {associative list: name ==> set},
+    }
+  }
+
+
+  token location info (@$, _$, etc.): {
+    first_line: n,
+    last_line: n,
+    first_column: n,
+    last_column: n,
+    range: [start_number, end_number]       (where the numbers are indexes into the input string, regular zero-based)
+  }
+
+
+  the parseError function receives a 'hash' object with these members for lexer and parser errors: {
+    text:        (matched text)
+    token:       (the produced terminal token, if any)
+    line:        (yylineno)
+  }
+  while parser (grammar) errors will also provide these members, i.e. parser errors deliver a superset of attributes: {
+    loc:         (yylloc)
+    expected:    (string describing the set of expected tokens)
+    recoverable: (boolean: TRUE when the parser has a error recovery rule available for this particular error)
+  }
+*/
+var command = (function(){
+var o=function(k,v,o,l){for(o=o||{},l=k.length;l--;o[k[l]]=v);return o};
+var parser = {trace: function trace () { },
+yy: {},
+symbols_: {"error":2,"command":3,"expr":4,"EOF":5,"move":6,"whitespace":7,"distance":8,"heading_angle":9,"percentage":10,"stop":11,"pstop":12,"stop_duration":13,"charge_to":14,"telemetry_reset":15,"help":16,"$accept":0,"$end":1},
+terminals_: {2:"error",5:"EOF",6:"move",7:"whitespace",8:"distance",9:"heading_angle",10:"percentage",11:"stop",12:"pstop",13:"stop_duration",14:"charge_to",15:"telemetry_reset",16:"help"},
+productions_: [0,[3,2],[4,7],[4,1],[4,3],[4,3],[4,1],[4,1]],
+performAction: function anonymous(yytext, yyleng, yylineno, yy, yystate /* action[1] */, $$ /* vstack */, _$ /* lstack */) {
+/* this == yyval */
+
+var $0 = $$.length - 1;
+switch (yystate) {
+case 2:
+   
+            var inDist = Number(String($$[$0-4]).substr(0, ((String($$[$0-4]).length) - 2)));
+            var inHdg = Number(String($$[$0-2]).substr(0, ((String($$[$0-2]).length) - 3)));
+            var inSpd = Number(String($$[$0]).substr(0, ((String($$[$0]).length) - 1)));
+            moveCmd(inDist,inHdg,inSpd);
+        
+break;
+case 3:
+
+            stpCmd();
+        
+break;
+case 4:
+
+            var inStpDur = Number(String($$[$0]).substr(0, ((String($$[$0]).length) - 1)));
+            pstpCmd(inStpDur);
+        
+break;
+case 5:
+
+            var inChrg = Number(String($$[$0]).substr(0, ((String($$[$0]).length) - 1)));
+            chrgCmd(inChrg);
+        
+break;
+case 6:
+   
+            telRst();
+        
+break;
+case 7:
+
+            printHelpDetails();
+        
+break;
+}
+},
+table: [{3:1,4:2,6:[1,3],11:[1,4],12:[1,5],14:[1,6],15:[1,7],16:[1,8]},{1:[3]},{5:[1,9]},{7:[1,10]},{5:[2,3]},{7:[1,11]},{7:[1,12]},{5:[2,6]},{5:[2,7]},{1:[2,1]},{8:[1,13]},{13:[1,14]},{10:[1,15]},{7:[1,16]},{5:[2,4]},{5:[2,5]},{9:[1,17]},{7:[1,18]},{10:[1,19]},{5:[2,2]}],
+defaultActions: {4:[2,3],7:[2,6],8:[2,7],9:[2,1],14:[2,4],15:[2,5],19:[2,2]},
+parseError: function parseError (str, hash) {
+    if (hash.recoverable) {
+        this.trace(str);
+    } else {
+        var error = new Error(str);
+        error.hash = hash;
+        throw error;
+    }
+},
+parse: function parse(input) {
+    var self = this, stack = [0], tstack = [], vstack = [null], lstack = [], table = this.table, yytext = '', yylineno = 0, yyleng = 0, recovering = 0, TERROR = 2, EOF = 1;
+    var args = lstack.slice.call(arguments, 1);
+    var lexer = Object.create(this.lexer);
+    var sharedState = { yy: {} };
+    for (var k in this.yy) {
+        if (Object.prototype.hasOwnProperty.call(this.yy, k)) {
+            sharedState.yy[k] = this.yy[k];
+        }
+    }
+    lexer.setInput(input, sharedState.yy);
+    sharedState.yy.lexer = lexer;
+    sharedState.yy.parser = this;
+    if (typeof lexer.yylloc == 'undefined') {
+        lexer.yylloc = {};
+    }
+    var yyloc = lexer.yylloc;
+    lstack.push(yyloc);
+    var ranges = lexer.options && lexer.options.ranges;
+    if (typeof sharedState.yy.parseError === 'function') {
+        this.parseError = sharedState.yy.parseError;
+    } else {
+        this.parseError = Object.getPrototypeOf(this).parseError;
+    }
+    function popStack(n) {
+        stack.length = stack.length - 2 * n;
+        vstack.length = vstack.length - n;
+        lstack.length = lstack.length - n;
+    }
+    _token_stack:
+        var lex = function () {
+            var token;
+            token = lexer.lex() || EOF;
+            if (typeof token !== 'number') {
+                token = self.symbols_[token] || token;
+            }
+            return token;
+        };
+    var symbol, preErrorSymbol, state, action, a, r, yyval = {}, p, len, newState, expected;
+    while (true) {
+        state = stack[stack.length - 1];
+        if (this.defaultActions[state]) {
+            action = this.defaultActions[state];
+        } else {
+            if (symbol === null || typeof symbol == 'undefined') {
+                symbol = lex();
+            }
+            action = table[state] && table[state][symbol];
+        }
+                    if (typeof action === 'undefined' || !action.length || !action[0]) {
+                var errStr = '';
+                expected = [];
+                for (p in table[state]) {
+                    if (this.terminals_[p] && p > TERROR) {
+                        expected.push('\'' + this.terminals_[p] + '\'');
+                    }
+                }
+                if (lexer.showPosition) {
+                    errStr = 'Parse error on line ' + (yylineno + 1) + ':\n' + lexer.showPosition() + '\nExpecting ' + expected.join(', ') + ', got \'' + (this.terminals_[symbol] || symbol) + '\'';
+                } else {
+                    errStr = 'Parse error on line ' + (yylineno + 1) + ': Unexpected ' + (symbol == EOF ? 'end of input' : '\'' + (this.terminals_[symbol] || symbol) + '\'');
+                }
+                this.parseError(errStr, {
+                    text: lexer.match,
+                    token: this.terminals_[symbol] || symbol,
+                    line: lexer.yylineno,
+                    loc: yyloc,
+                    expected: expected
+                });
+            }
+        if (action[0] instanceof Array && action.length > 1) {
+            throw new Error('Parse Error: multiple actions possible at state: ' + state + ', token: ' + symbol);
+        }
+        switch (action[0]) {
+        case 1:
+            stack.push(symbol);
+            vstack.push(lexer.yytext);
+            lstack.push(lexer.yylloc);
+            stack.push(action[1]);
+            symbol = null;
+            if (!preErrorSymbol) {
+                yyleng = lexer.yyleng;
+                yytext = lexer.yytext;
+                yylineno = lexer.yylineno;
+                yyloc = lexer.yylloc;
+                if (recovering > 0) {
+                    recovering--;
+                }
+            } else {
+                symbol = preErrorSymbol;
+                preErrorSymbol = null;
+            }
+            break;
+        case 2:
+            len = this.productions_[action[1]][1];
+            yyval.$ = vstack[vstack.length - len];
+            yyval._$ = {
+                first_line: lstack[lstack.length - (len || 1)].first_line,
+                last_line: lstack[lstack.length - 1].last_line,
+                first_column: lstack[lstack.length - (len || 1)].first_column,
+                last_column: lstack[lstack.length - 1].last_column
+            };
+            if (ranges) {
+                yyval._$.range = [
+                    lstack[lstack.length - (len || 1)].range[0],
+                    lstack[lstack.length - 1].range[1]
+                ];
+            }
+            r = this.performAction.apply(yyval, [
+                yytext,
+                yyleng,
+                yylineno,
+                sharedState.yy,
+                action[1],
+                vstack,
+                lstack
+            ].concat(args));
+            if (typeof r !== 'undefined') {
+                return r;
+            }
+            if (len) {
+                stack = stack.slice(0, -1 * len * 2);
+                vstack = vstack.slice(0, -1 * len);
+                lstack = lstack.slice(0, -1 * len);
+            }
+            stack.push(this.productions_[action[1]][0]);
+            vstack.push(yyval.$);
+            lstack.push(yyval._$);
+            newState = table[stack[stack.length - 2]][stack[stack.length - 1]];
+            stack.push(newState);
+            break;
+        case 3:
+            return true;
+        }
+    }
+    return true;
+}};
+/* generated by jison-lex 0.3.4 */
+var lexer = (function(){
+var lexer = ({
+
+EOF:1,
+
+parseError:function parseError(str, hash) {
+        if (this.yy.parser) {
+            this.yy.parser.parseError(str, hash);
+        } else {
+            throw new Error(str);
+        }
+    },
+
+// resets the lexer, sets new input
+setInput:function (input, yy) {
+        this.yy = yy || this.yy || {};
+        this._input = input;
+        this._more = this._backtrack = this.done = false;
+        this.yylineno = this.yyleng = 0;
+        this.yytext = this.matched = this.match = '';
+        this.conditionStack = ['INITIAL'];
+        this.yylloc = {
+            first_line: 1,
+            first_column: 0,
+            last_line: 1,
+            last_column: 0
+        };
+        if (this.options.ranges) {
+            this.yylloc.range = [0,0];
+        }
+        this.offset = 0;
+        return this;
+    },
+
+// consumes and returns one char from the input
+input:function () {
+        var ch = this._input[0];
+        this.yytext += ch;
+        this.yyleng++;
+        this.offset++;
+        this.match += ch;
+        this.matched += ch;
+        var lines = ch.match(/(?:\r\n?|\n).*/g);
+        if (lines) {
+            this.yylineno++;
+            this.yylloc.last_line++;
+        } else {
+            this.yylloc.last_column++;
+        }
+        if (this.options.ranges) {
+            this.yylloc.range[1]++;
+        }
+
+        this._input = this._input.slice(1);
+        return ch;
+    },
+
+// unshifts one char (or a string) into the input
+unput:function (ch) {
+        var len = ch.length;
+        var lines = ch.split(/(?:\r\n?|\n)/g);
+
+        this._input = ch + this._input;
+        this.yytext = this.yytext.substr(0, this.yytext.length - len);
+        //this.yyleng -= len;
+        this.offset -= len;
+        var oldLines = this.match.split(/(?:\r\n?|\n)/g);
+        this.match = this.match.substr(0, this.match.length - 1);
+        this.matched = this.matched.substr(0, this.matched.length - 1);
+
+        if (lines.length - 1) {
+            this.yylineno -= lines.length - 1;
+        }
+        var r = this.yylloc.range;
+
+        this.yylloc = {
+            first_line: this.yylloc.first_line,
+            last_line: this.yylineno + 1,
+            first_column: this.yylloc.first_column,
+            last_column: lines ?
+                (lines.length === oldLines.length ? this.yylloc.first_column : 0)
+                 + oldLines[oldLines.length - lines.length].length - lines[0].length :
+              this.yylloc.first_column - len
+        };
+
+        if (this.options.ranges) {
+            this.yylloc.range = [r[0], r[0] + this.yyleng - len];
+        }
+        this.yyleng = this.yytext.length;
+        return this;
+    },
+
+// When called from action, caches matched text and appends it on next action
+more:function () {
+        this._more = true;
+        return this;
+    },
+
+// When called from action, signals the lexer that this rule fails to match the input, so the next matching rule (regex) should be tested instead.
+reject:function () {
+        if (this.options.backtrack_lexer) {
+            this._backtrack = true;
+        } else {
+            return this.parseError('Lexical error on line ' + (this.yylineno + 1) + '. You can only invoke reject() in the lexer when the lexer is of the backtracking persuasion (options.backtrack_lexer = true).\n' + this.showPosition(), {
+                text: "",
+                token: null,
+                line: this.yylineno
+            });
+
+        }
+        return this;
+    },
+
+// retain first n characters of the match
+less:function (n) {
+        this.unput(this.match.slice(n));
+    },
+
+// displays already matched input, i.e. for error messages
+pastInput:function () {
+        var past = this.matched.substr(0, this.matched.length - this.match.length);
+        return (past.length > 20 ? '...':'') + past.substr(-20).replace(/\n/g, "");
+    },
+
+// displays upcoming input, i.e. for error messages
+upcomingInput:function () {
+        var next = this.match;
+        if (next.length < 20) {
+            next += this._input.substr(0, 20-next.length);
+        }
+        return (next.substr(0,20) + (next.length > 20 ? '...' : '')).replace(/\n/g, "");
+    },
+
+// displays the character position where the lexing error occurred, i.e. for error messages
+showPosition:function () {
+        var pre = this.pastInput();
+        var c = new Array(pre.length + 1).join("-");
+        return pre + this.upcomingInput() + "\n" + c + "^";
+    },
+
+// test the lexed token: return FALSE when not a match, otherwise return token
+test_match:function(match, indexed_rule) {
+        var token,
+            lines,
+            backup;
+
+        if (this.options.backtrack_lexer) {
+            // save context
+            backup = {
+                yylineno: this.yylineno,
+                yylloc: {
+                    first_line: this.yylloc.first_line,
+                    last_line: this.last_line,
+                    first_column: this.yylloc.first_column,
+                    last_column: this.yylloc.last_column
+                },
+                yytext: this.yytext,
+                match: this.match,
+                matches: this.matches,
+                matched: this.matched,
+                yyleng: this.yyleng,
+                offset: this.offset,
+                _more: this._more,
+                _input: this._input,
+                yy: this.yy,
+                conditionStack: this.conditionStack.slice(0),
+                done: this.done
+            };
+            if (this.options.ranges) {
+                backup.yylloc.range = this.yylloc.range.slice(0);
+            }
+        }
+
+        lines = match[0].match(/(?:\r\n?|\n).*/g);
+        if (lines) {
+            this.yylineno += lines.length;
+        }
+        this.yylloc = {
+            first_line: this.yylloc.last_line,
+            last_line: this.yylineno + 1,
+            first_column: this.yylloc.last_column,
+            last_column: lines ?
+                         lines[lines.length - 1].length - lines[lines.length - 1].match(/\r?\n?/)[0].length :
+                         this.yylloc.last_column + match[0].length
+        };
+        this.yytext += match[0];
+        this.match += match[0];
+        this.matches = match;
+        this.yyleng = this.yytext.length;
+        if (this.options.ranges) {
+            this.yylloc.range = [this.offset, this.offset += this.yyleng];
+        }
+        this._more = false;
+        this._backtrack = false;
+        this._input = this._input.slice(match[0].length);
+        this.matched += match[0];
+        token = this.performAction.call(this, this.yy, this, indexed_rule, this.conditionStack[this.conditionStack.length - 1]);
+        if (this.done && this._input) {
+            this.done = false;
+        }
+        if (token) {
+            return token;
+        } else if (this._backtrack) {
+            // recover context
+            for (var k in backup) {
+                this[k] = backup[k];
+            }
+            return false; // rule action called reject() implying the next rule should be tested instead.
+        }
+        return false;
+    },
+
+// return next match in input
+next:function () {
+        if (this.done) {
+            return this.EOF;
+        }
+        if (!this._input) {
+            this.done = true;
+        }
+
+        var token,
+            match,
+            tempMatch,
+            index;
+        if (!this._more) {
+            this.yytext = '';
+            this.match = '';
+        }
+        var rules = this._currentRules();
+        for (var i = 0; i < rules.length; i++) {
+            tempMatch = this._input.match(this.rules[rules[i]]);
+            if (tempMatch && (!match || tempMatch[0].length > match[0].length)) {
+                match = tempMatch;
+                index = i;
+                if (this.options.backtrack_lexer) {
+                    token = this.test_match(tempMatch, rules[i]);
+                    if (token !== false) {
+                        return token;
+                    } else if (this._backtrack) {
+                        match = false;
+                        continue; // rule action called reject() implying a rule MISmatch.
+                    } else {
+                        // else: this is a lexer rule which consumes input without producing a token (e.g. whitespace)
+                        return false;
+                    }
+                } else if (!this.options.flex) {
+                    break;
+                }
+            }
+        }
+        if (match) {
+            token = this.test_match(match, rules[index]);
+            if (token !== false) {
+                return token;
+            }
+            // else: this is a lexer rule which consumes input without producing a token (e.g. whitespace)
+            return false;
+        }
+        if (this._input === "") {
+            return this.EOF;
+        } else {
+            return this.parseError('Lexical error on line ' + (this.yylineno + 1) + '. Unrecognized text.\n' + this.showPosition(), {
+                text: "",
+                token: null,
+                line: this.yylineno
+            });
+        }
+    },
+
+// return next match that has a token
+lex:function lex () {
+        var r = this.next();
+        if (r) {
+            return r;
+        } else {
+            return this.lex();
+        }
+    },
+
+// activates a new lexer condition state (pushes the new lexer condition state onto the condition stack)
+begin:function begin (condition) {
+        this.conditionStack.push(condition);
+    },
+
+// pop the previously active lexer condition state off the condition stack
+popState:function popState () {
+        var n = this.conditionStack.length - 1;
+        if (n > 0) {
+            return this.conditionStack.pop();
+        } else {
+            return this.conditionStack[0];
+        }
+    },
+
+// produce the lexer rule set which is active for the currently active lexer condition state
+_currentRules:function _currentRules () {
+        if (this.conditionStack.length && this.conditionStack[this.conditionStack.length - 1]) {
+            return this.conditions[this.conditionStack[this.conditionStack.length - 1]].rules;
+        } else {
+            return this.conditions["INITIAL"].rules;
+        }
+    },
+
+// return the currently active lexer condition state; when an index argument is provided it produces the N-th previous condition state, if available
+topState:function topState (n) {
+        n = this.conditionStack.length - 1 - Math.abs(n || 0);
+        if (n >= 0) {
+            return this.conditionStack[n];
+        } else {
+            return "INITIAL";
+        }
+    },
+
+// alias for begin(condition)
+pushState:function pushState (condition) {
+        this.begin(condition);
+    },
+
+// return the number of states currently on the stack
+stateStackSize:function stateStackSize() {
+        return this.conditionStack.length;
+    },
+options: {},
+performAction: function anonymous(yy,yy_,$avoiding_name_collisions,YY_START) {
+var YYSTATE=YY_START;
+switch($avoiding_name_collisions) {
+case 0:return 7
+break;
+case 1:return 8
+break;
+case 2:return 9
+break;
+case 3:return 10
+break;
+case 4:return 13
+break;
+case 5:return 6
+break;
+case 6:return 12
+break;
+case 7:return 11
+break;
+case 8:return 16
+break;
+case 9:return 14
+break;
+case 10:return 15
+break;
+case 11:return 5
+break;
+case 12:return 'invalid_command'
+break;
+}
+},
+rules: [/^(?:\s)/,/^(?:\b[0-9]+mm\b)/,/^(?:\b([0-9]|[1-8][0-9]|9[0-9]|[12][0-9]{2}|3[0-4][0-9]|35[0-9])deg\b)/,/^(?:\b([0-9]|[1-8][0-9]|9[0-9]|100)%)/,/^(?:\b[0-9]+s\b)/,/^(?:\bmove\b)/,/^(?:\bpstop\b)/,/^(?:\bstop\b)/,/^(?:\bhelp\b)/,/^(?:\bcharge\sto\b)/,/^(?:\btelemetry\sreset\b)/,/^(?:$)/,/^(?:.)/],
+conditions: {"INITIAL":{"rules":[0,1,2,3,4,5,6,7,8,9,10,11,12],"inclusive":true}}
+});
+return lexer;
+})();
+parser.lexer = lexer;
+function Parser () {
+  this.yy = {};
+}
+Parser.prototype = parser;parser.Parser = Parser;
+return new Parser;
+})();
+
+
+if (typeof require !== 'undefined' && typeof exports !== 'undefined') {
+exports.parser = command;
+exports.Parser = command.Parser;
+exports.parse = function () { return command.parse.apply(command, arguments); };
+exports.main = function commonjsMain (args) {
+    if (!args[1]) {
+        console.log('Usage: '+args[0]+' FILE');
+        process.exit(1);
+    }
+    var source = require('fs').readFileSync(require('path').normalize(args[1]), "utf8");
+    return exports.parser.parse(source);
+};
+if (typeof module !== 'undefined' && require.main === module) {
+  exports.main(process.argv.slice(1));
+}
+}

Control/data/index.html

@@ -12,82 +12,91 @@
             box-sizing: border-box;
         }
 
-        .section_container {
-            float: left;
-            width: 50%;
-            padding: 10px;
-        }
-
         .flex-container {
             display: flex;
             flex-wrap: nowrap;
         }
 
-        ul {
-            list-style-type: none;
-            margin: 0;
-            padding: 0;
-        }
-
-        li {
-            padding: 0px;
-            margin-bottom: 0px;
-        }
-
         :is(h1, h2, h3, h4, h5, h6, label, strong, meter) {
             font-family: Arial, Helvetica, sans-serif;
         }
 
-        .movement_control {
+        h2{
-            text-align: center;
+            margin: 0px;
         }
 
-        .sensor_data {
+        .slider {
-            text-align: center;
+        -webkit-appearance: none;
+        width: 100%;
+        height: 25px;
+        background: #d3d3d3;
+        outline: none;
+        opacity: 0.7;
+        -webkit-transition: .2s;
+        transition: opacity .2s;
+        }
+
+        .slider:hover {
+        opacity: 1;
+        }
+
+        .slider::-webkit-slider-thumb {
+        -webkit-appearance: none;
+        appearance: none;
+        width: 25px;
+        height: 25px;
+        background: #000000;
+        cursor: pointer;
+        }
+
+        #command_space {
+            width:100%; 
+            height: 200px; 
+            line-height: normal; 
+            overflow: auto; 
+            background-color: rgb(248, 248, 248);
+            color: black;
+            border: 1px solid black;
         }
 
         meter {
             width: 100%;
             height: 40px;
-            transform: translateY(-8px);
+            transform: translateY(8px);
         }
 
         meter::after {
             content: attr(value) attr(title);
             top: -28px;
-            left: 0px;
+            left: 45%;
             position: relative;
         }
 
-        .button {
+        button {
+            width: 100%;
             display: inline-block;
-            padding: 15px 25px;
+            padding: 7px 7px;
-            font-size: 24px;
+            font-size: 12px;
             cursor: pointer;
             text-align: center;
             text-decoration: none;
             outline: none;
             color: rgb(255, 255, 255);
-            background-color: #161616;
+            background-color: #222222;
             border: none;
-            border-radius: 15px;
+            border-radius: 5px;
-            box-shadow: 0 9px rgb(161, 161, 161);
+            box-shadow: 0 3px rgb(161, 161, 161);
+            -webkit-transition: .2s;
+            transition: background-color .2s;
         }
 
-        .button:hover {
+        button:hover {
             background-color: #585858
         }
 
-        .button:active {
+        button:active {
-            background-color: #107C10;
+            box-shadow: 0 3px rgb(161, 161, 161);
-            box-shadow: 0 5px rgb(161, 161, 161);
+            transform: translateY(1px);
-            transform: translateY(4px);
-        }
-
-        .pressed {
-            background-color: #107C10;
-            box-shadow: 0 5px rgb(161, 161, 161);
-            transform: translateY(4px);
         }
 
         .clearfix::after {
@@ -96,203 +105,337 @@
             display: table;
         }
     </style>
-    <script>
 
+</head>
+
+<body>
+    <h1 style="text-align:center;">ROVER COMMAND CENTER</h1>
+
+    <div class="clearfix">
+        <table style="width:1100px; border-spacing: 10px; margin-left: auto; margin-right: auto;">
+            <tr>
+                <th style="width: 33%;"><h2>Control Panel</h2></th>
+                <th style="width: 33%;"><h2>Telemetry</h2></th>
+                <th style="width: 33%;"><h2>Command Console</h2></th>
+            </tr>
+            <tr><hr></tr>
+
+            <!-- Control Panel Section -->
+            <tr>
+                <td style="vertical-align: top;">
+                    <table style="width:100%; border-spacing: 5px;">
+                        <tr><td colspan="6"><hr></td></tr>
+                        <tr>
+                            <td style="text-align: center;" colspan="6"><strong>Main</strong></td>
+                        </tr>
+                        
+                        <tr>
+                            <td style="text-align: center;" colspan="2"><button style="color: red;">Emergency <br> Stop</button></td>
+                            <td style="text-align: center;" colspan="2"><button>Telemetry Reset</button></td>
+                            <td style="text-align: center;" colspan="2"><button>Full <br> Charge</button></td>
+                        </tr>
+                        <tr><td colspan="6"><hr></td></tr>
+                        <tr>
+                            <td style="text-align: center;" colspan="6"><strong> Set Heading to: </strong><strong id="SetHeading" style="font-size: 18px;">270</strong><strong>&#176;</strong></td>
+                        </tr>
+                        <tr>
+                            <td colspan="6"><input type ="range" min="0" max="359" value="270" class="slider" id="HdgSlider"></td>
+                        </tr>
+                        <tr>
+                            <td style="text-align: center;" colspan="6"><strong>Set Translation to: </strong><strong id="SetTrans" style="font-size: 18px;">180</strong><strong>mm</strong></td>
+                        </tr>
+                        <tr>
+                            <td colspan="6"><input type ="range" min="0" max="1000" value="100" class="slider" id="TranSlider"></td>
+                        </tr>
+                        <tr>
+                            <td style="text-align: center;" colspan="6"><strong>Set Speed to: </strong><strong id="SetSpd" style="font-size: 18px;">50</strong><strong>%</strong></td>
+                        </tr>
+                        <tr>
+                            <td colspan="6"><input type ="range" min="0" max="100" value="50" class="slider" id="SpdSlider"></td>
+                        </tr>
+                        <tr>
+                            <td colspan="6"><button onclick="setCmdMode(1); moveCmd(setTransto, setHdgto, setSpdto);">Send<br>Command</button></td>
+                        </tr>
+                        <tr><td colspan="6"><hr></td></tr>
+                    </table>
+                </td>
+
+                <!-- Telemetry Section -->
+
+                <td style="vertical-align: top;">
+                <table style="width:100%; border-spacing: 5px; ">
+                    <tr><td colspan="2"><hr></td></tr>
+                    <tr>
+                        <td style="width:50%;"><label>Rover Status</label></td>
+                        <td style="width:50%;"><strong id="Rov_status">X</strong>
+                    </tr>
+                    <tr><td colspan="2"><hr></td></tr>
+                    <tr>
+                        <td style="width:50%;"><label>Signal Strength</label></td>
+                        <td style="width:50%;"><meter id="SigStr" min="-80" max="-30" low="-70" high="-50" optimum="-40"  value="-XX"
+                            title="dB"></meter></td>
+                    </tr>
+                    <tr><td colspan="2"><hr></td></tr>
+                    <tr>
+                        <td style="width:50%;"><label>Position</label></td>
+                        <td style="width:50%;"><strong id="PosX">X</strong><strong>,</strong><strong id="PosY">Y</strong></td>
+                    </tr>
+                    <tr>
+                        <td style="width:50%;"><label>Heading</label></td>
+                        <td style="width:50%;"><strong id="Hdg">H</strong><strong>&#176;</strong></td>
+                    </tr>
+                    <tr>
+                        <td style="width:50%;"><label>Trip Distance</label></td>
+                        <td style="width:50%;"><strong id="TrpDist">X</strong><strong> mm</strong></td>
+                    </tr>
+                    <tr><td colspan="2"><hr></td></tr>
+                    <tr>
+                        <td style="width:50%;"><label>Battery Voltage</label></td>
+                        <td style="width:50%;"><strong id="btry_volt">X</strong><strong>V</strong></td>
+                    </tr>
+                    <tr>
+                        <td style="width:50%;"><label>Battery Level</label></td>
+                        <td style="width:50%;"><strong id="btry_lvl">X</strong><strong>%</strong></td>
+                    </tr>
+                    <tr>
+                        <td style="width:50%;"><label>Battery Cycles</label></td>
+                        <td style="width:50%;"><strong id="btry_cycls">X</strong></td>
+                    </tr>
+                    <tr><td colspan="2"><hr></td></tr>
+                    
+                </table>
+                </td>
+                
+                <!-- Command Buffer Section -->
+                <td style="vertical-align: top;">
+                    <table style="width:100%; border-spacing: 5px; ">
+                        <tr><td colspan="2"><hr></td></tr>
+                        <tr><td colspan="2"><div id="command_space"><p id="command_buffer" style="padding-left: 5px; font-size: 12px; font-family: 'Courier New', Courier, monospace;"></p></div></td></tr>
+                        <tr>
+                            <td><input type="text" placeholder="Type a command or 'help'." id="commandInput" value="" onkeyup="if(event.keyCode == 13){document.getElementById('commandEnter').click();}" style="width: 100%; font-size: 14px; font-family: 'Courier New', Courier, monospace;"></td>
+                            <td style="width: 7%; "><button onclick="setCmdMode(0); RunParser();" id="commandEnter" style="height: 20px; width: 20px; padding: 3px 2px;">&crarr;</button></td>
+                        </tr>
+                    </table>
+                    
+                </td>
+            </tr>
+        </table>
+
+    </div>
+    
+</body>
+<script src="command.js"></script>
+<script>
     var connection = new WebSocket('ws://' + location.hostname + ':81/');
 
-        var MVM_F_status = 0;
+    var command_id = 1;
-        var MVM_L_status = 0;
+    var mode = 0;
-        var MVM_R_status = 0;
+    var reqHeading = 0;
-        var MVM_B_status = 0;
+    var reqDistance = 0;
+    var reqSpeed = 0;
+    var reqCharge = 0;
+    var pstop_time = 0;
+
+    var state = 0;
+    var batteryVoltage = 0;
+    var batteryLevel = 0;
+    var totalTripDistance = 0;
+    var currentHeading = 0;
+    var current_pos = [,];
+    var current_x = 0;
+    var current_y = 0;
+    var signal_strength = 0;
+    var lastCompletedCommand_id = 0;
+    var batteryCycles = 0;
 
-        var BTRY_VOLT = 0;
-        var ODO_DIST = 0;
 
     connection.onmessage = function (event) {
         var raw_data = event.data;
         console.log(raw_data);
         var data = JSON.parse(raw_data);
-            BTRY_VOLT = data.BTRY_VOLT;
+        
-            ODO_DIST = data.ODO_DIST;
+        state = data.st;
-            document.getElementById("btry_meter").value = BTRY_VOLT;
+        batteryLevel = data.bV;
-            document.getElementById("Odometer").innerHTML = ODO_DIST;
+        batteryVoltage = data.bV;
+        batteryCycles = data.bC;
+        totalTripDistance = data.tD;
+        currentHeading = data.cH;
+        current_pos = data.pos;
+        current_x = current_pos[0];
+        current_y = current_pos[1];
+        signal_strength = data.rssi;
+        lastCompletedCommand_id = data.LCCid;
+        
+        var rStatus = ""
+        if(state == -1){
+            rStatus = "Error";
+        }else if(state == 0){
+            rStatus = "Idle";
+        }else if(state == 1){
+            rStatus = "Moving";
+        }else if(state == 2){
+            rStatus = "Charging";
+        }else{
+            rStatus = "Undefined";
+        }
+
+        document.getElementById("Rov_status").innerHTML = rStatus;
+        document.getElementById("SigStr").value = signal_strength;
+        document.getElementById("PosX").innerHTML = current_x;
+        document.getElementById("PosY").innerHTML = current_y;
+        document.getElementById("Hdg").innerHTML = currentHeading;
+        document.getElementById("TrpDist").innerHTML = totalTripDistance;
+        document.getElementById("btry_volt").innerHTML = batteryVoltage;
+        document.getElementById("btry_lvl").innerHTML = batteryLevel;
+        document.getElementById("btry_cycls").innerHTML = batteryCycles; 
     }
 
     function send_data() {
-            var raw_data = '{"MVM_F":' + MVM_F_status + ',"MVM_L":' + MVM_L_status + ',"MVM_R":' + MVM_R_status + ',"MVM_B":' + MVM_B_status + '}';
+        var raw_data = '{"Cid":' + command_id + ',"mode":' + mode + ',"rH":' + reqHeading + ',"rD":' + reqDistance + ',"rS":' + reqSpeed + ',"rC":' + reqCharge + ',"pSt":' + pstop_time + '}';
         connection.send(raw_data);
         console.log(raw_data);
     }
 
-        function left_pressed() {
+    function setCmdMode(mode){
-            MVM_L_status = 1;
+        cmdMode = mode;
+    }
+
+    function updateCommandBuffer(){
+        var bufferOutput = "";
+        if(cmdMode == 0){
+            bufferOutput = document.getElementById("commandInput").value;
+        }else if(cmdMode == 1){
+            bufferOutput = "move " + reqDistance + "mm " + reqHeading + "deg " + reqSpeed + "%";
+        }
+        if((mode == 1) || (mode == -1) || (mode == 2) || (mode == 3)){
+            document.getElementById("command_buffer").innerHTML += '[' + command_id + '] ' + bufferOutput + "<br>";
+            document.getElementById("commandInput").value = ""
+        }else if(mode == 0){
+            document.getElementById("command_buffer").innerHTML = "Rover Emergency Stop." + "<br>" +"Command buffer cleared." + "<br>";
+            document.getElementById("commandInput").value = "";
+        }
+    }
+    
+    function printHelpDetails(){
+        document.getElementById("command_buffer").innerHTML = 
+        ("------------------------------------------" + "<br>" + "<br>" +
+        "Types of commands available:" + "<br>" + "<br>" +
+        "'move' moves rover along a given vector" + "<br>" +
+        "> move [distance]mm [heading]deg [speed]%" + "<br>" + "<br>" +
+        "'pstop' short for planned stop it stops the rover without reseting the command buffer" + "<br>" +
+        "> pstop" + "<br>" + "<br>" +
+        "'charge' stops the rover and recharges to a set battery level" + "<br>" +
+        "> charge to [percentage]%" + "<br>" + "<br>" +
+        "'telemetry reset' resets X,Y coordinates and Trip Distance" + "<br>" +
+        "> telemetry reset" + "<br>" + "<br>" +
+        "'stop' and emergency stop that stops the rover and resets the command buffer" + "<br>" +
+        "> stop" + "<br>" + "<br>" +
+        "------------------------------------------"
+        )
+        document.getElementById("commandInput").value = "";
+    }
+
+    function moveCmd(dist,hdg,spd){
+        mode = 1;
+        reqDistance = dist;
+        reqHeading = hdg;
+        reqSpeed = spd;
+        reqCharge = 0;
+        pstop_time = 0;
+        tel_rst = 0;
         send_data();
+        updateCommandBuffer();
+        command_id++;
     }
-        function left_unpressed() {
+
-            MVM_L_status = 0;
+    function stpCmd(){
+        mode = 0;
+        reqDistance = 0;
+        reqHeading = 0;
+        reqSpeed = 0;
+        reqCharge = 0;
+        pstop_time = 0;
+        tel_rst = 0;
         send_data();
+        command_id = 1;
+        updateCommandBuffer();
     }
-        function up_pressed() {
+
-            MVM_F_status = 1;
+    function pstpCmd(pstp_tme){
+        mode = 3;
+        reqDistance = 0;
+        reqHeading = 0;
+        reqSpeed = 0;
+        reqCharge = 0;
+        pstop_time = pstp_tme;
+        tel_rst = 0;
         send_data();
+        updateCommandBuffer();
+        command_id++;
     }
-        function up_unpressed() {
+
-            MVM_F_status = 0;
+    function chrgCmd(chrglvl){
+        mode = 2;
+        reqDistance = 0;
+        reqHeading = 0;
+        reqSpeed = 0;
+        reqCharge = chrglvl;
+        pstop_time = 0;
+        tel_rst = 0;
         send_data();
+        updateCommandBuffer();
+        command_id++;
     }
-        function right_pressed() {
+
-            MVM_R_status = 1;
+    function telRst(){
+        mode = -1;
+        reqDistance = 0;
+        reqHeading = 0;
+        reqSpeed = 0;
+        reqCharge = 0;
+        pstop_time = 0;
         send_data();
-        }
+        updateCommandBuffer();
-        function right_unpressed() {
+        command_id++;
-            MVM_R_status = 0;
-            send_data();
-        }
-        function down_pressed() {
-            MVM_B_status = 1;
-            send_data();
-        }
-        function down_unpressed() {
-            MVM_B_status = 0;
-            send_data();
-        }
-
-        var timer = null;
-
-        function up_mouseDown() {
-            timer = setInterval(up_pressed, 100);
-        }
-        function up_mouseUp() {
-            clearInterval(timer);
-            up_unpressed();
-        }
-
-        function down_mouseDown() {
-            timer = setInterval(down_pressed, 100);
-        }
-        function down_mouseUp() {
-            clearInterval(timer);
-            down_unpressed();
-        }
-
-        function right_mouseDown() {
-            timer = setInterval(right_pressed, 100);
-        }
-        function right_mouseUp() {
-            clearInterval(timer);
-            right_unpressed();
-        }
-
-        function left_mouseDown() {
-            timer = setInterval(left_pressed, 100);
-        }
-        function left_mouseUp() {
-            clearInterval(timer);
-            left_unpressed();
     }
 
 
-        document.onkeydown = function (e) {
+    function RunParser(){
-            switch (e.keyCode) {
+        var commandstring = document.getElementById("commandInput").value;
-                case 37:
+        try{
-                    document.getElementById("left_arrow").className = "button pressed";
+            command.parse(commandstring);
-                    left_pressed();
+        } catch(err){
-                    break;
+            alert(err);
-                case 38:
-                    document.getElementById("up_arrow").className = "button pressed";
-                    up_pressed();
-                    break;
-                case 39:
-                    document.getElementById("right_arrow").className = "button pressed";
-                    right_pressed();
-                    break;
-                case 40:
-                    document.getElementById("down_arrow").className = "button pressed";
-                    down_pressed();
-                    break;
         }
-        };
-        document.onkeyup = function (e) {
-            switch (e.keyCode) {
-                case 37:
-                    document.getElementById("left_arrow").className = "button";
-                    left_unpressed();
-                    break;
-                case 38:
-                    document.getElementById("up_arrow").className = "button";
-                    up_unpressed();
-                    break;
-                case 39:
-                    document.getElementById("right_arrow").className = "button";
-                    right_unpressed();
-                    break;
-                case 40:
-                    document.getElementById("down_arrow").className = "button";
-                    down_unpressed();
-                    break;
     }
-        };
 
-    </script>
+    var setHdgto = 270;
-</head>
+    var hdg_slider = document.getElementById("HdgSlider");
+    var hdg_output = document.getElementById("SetHeading");
+    hdg_output.innerHTML = hdg_slider.value;
+    hdg_slider.oninput = function() {
+        hdg_output.innerHTML = this.value;
+        setHdgto = this.value;
+    }
 
-<body>
+    var setTransto = 100;
+    var tran_slider = document.getElementById("TranSlider");
+    var tran_output = document.getElementById("SetTrans");
+    tran_output.innerHTML = tran_slider.value;
+    tran_slider.oninput = function() {
+        tran_output.innerHTML = this.value;
+        setTransto = this.value;
+    }
 
-    <h1 style="text-align:center;">ROVER COMMAND CENTER</h1>
+    var setSpdto = 50;
+    var spd_slider = document.getElementById("SpdSlider");
+    var spd_output = document.getElementById("SetSpd");
+    spd_output.innerHTML = spd_slider.value;
+    spd_slider.oninput = function() {
+        spd_output.innerHTML = this.value;
+        setSpdto = this.value;
+    }
 
-    <div class="clearfix">
+</script>
-
-        <div class="section_container">
-            <div class="movement_control">
-                <h2>Movement Control</h2>
-                <div style="transform: translateY(0px);">
-                    <button id="up_arrow" onmousedown="up_mouseDown()" onmouseup="up_mouseUp()"
-                        class="button"><span>&#8679;</span></button>
-                </div>
-                <div style="transform: translateY(13px);">
-                    <button id="left_arrow" onmousedown="left_mouseDown()" onmouseup="left_mouseUp()"
-                        class="button"><span>&#8678;</span></button>
-                    <button id="down_arrow" onmousedown="down_mouseDown()" onmouseup="down_mouseUp()"
-                        class="button"><span>&#8681;</span></button>
-                    <button id="right_arrow" onmousedown="right_mouseDown()" onmouseup="right_mouseUp()"
-                        class="button"><span>&#8680;</span></button>
-                </div>
-
-            </div>
-        </div>
-
-        <div class="section_container">
-            <div id="bleh" class="sensor_data">
-                <h2>Sensor Data</h2>
-                <ul>
-
-                    <li>
-                        <div class="section_container">
-                            <label>Battery Voltage</label>
-                        </div>
-                        <div class="section_container">
-                            <meter id="btry_meter" min="4.0" max="6.0" low="4.5" optimum="5.0" high="4.8" value="5.8"
-                                title="V"></meter>
-                        </div>
-                    </li>
-
-
-                    <li>
-                        <div class="section_container">
-                            <label>Odometer</label>
-                        </div>
-                        <div class="section_container">
-                            <strong id="Odometer">28</strong><strong>mm</strong>
-                        </div>
-                    </li>
-
-                </ul>
-            </div>
-
-        </div>
-
-    </div>
-
-</body>
 
 </html>

Control/platformio.ini

@@ -13,7 +13,6 @@ platform = espressif32
 board = esp32dev
 framework = arduino
 monitor_speed = 115200
-upload_port = COM13
 monitor_filters =
 	send_on_enter
 	esp32_exception_decoder

Control/src/command.jison

@@ -0,0 +1,59 @@
+%lex
+%%
+
+\s                      return 'whitespace'
+\b[0-9]+"mm"\b                return 'distance'
+\b([0-9]|[1-8][0-9]|9[0-9]|[12][0-9]{2}|3[0-4][0-9]|35[0-9])"deg"\b  return 'heading_angle'
+\b([0-9]|[1-8][0-9]|9[0-9]|100)"%"   return 'percentage'
+\b[0-9]+"s"\b           return 'stop_duration'
+\bmove\b                  return 'move'
+\bpstop\b                 return 'pstop'
+\bstop\b                  return 'stop'
+\bhelp\b                return 'help'
+\bcharge\sto\b                return 'charge_to'
+\btelemetry\sreset\b      return 'telemetry_reset'
+<<EOF>>                 return 'EOF'
+.                       return 'invalid_command'
+
+/lex
+
+%start command
+
+%%
+
+command
+    : expr EOF
+    ;
+
+expr
+    : move whitespace distance whitespace heading_angle whitespace percentage
+        {   
+            var inDist = Number(String($3).substr(0, ((String($3).length) - 2)));
+            var inHdg = Number(String($5).substr(0, ((String($5).length) - 3)));
+            var inSpd = Number(String($7).substr(0, ((String($7).length) - 1)));
+            moveCmd(inDist,inHdg,inSpd);
+        }
+    | stop
+        {
+            stpCmd();
+        }
+    | pstop whitespace stop_duration
+        {
+            var inStpDur = Number(String($3).substr(0, ((String($3).length) - 1)));
+            pstpCmd(inStpDur);
+        }
+    | charge_to whitespace percentage
+        {
+            var inChrg = Number(String($3).substr(0, ((String($3).length) - 1)));
+            chrgCmd(inChrg);
+        }
+    | telemetry_reset
+        {   
+            telRst();
+        }
+    | help
+        {
+            printHelpDetails();
+        }
+    ;
+