Widget / TinyG

This widget shows the TinyG planner buffer so other widgets can limit their flow of sending commands and other specific TinyG features.

by chilipeppr

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://www.chilipeppr.com/js/require.js"></script>
<div id="com-chilipeppr-widget-tinyg" class="panel panel-default">
    <div class="panel-heading">
        <div class="btn-toolbar pull-right" role="toolbar" >
            <div class="btn-group">
                <button type="button" class="btn btn-xs btn-default btn-danger tinyg-feedhold" data-title="Feedhold" data-content="Stop movement immediately. Maintains positional accuracy. Sends ! command to TinyG which jumps past the planner buffer so you get immediate stop. Movement can be resumed with ~ command. If you want to jog you should flush queue with %."><span class="glyphicon glyphicon-stop"></span></button>
                <button type="button" class="btn btn-xs btn-default tinyg-cyclestart" data-title="Cycle Start" data-content="Resume movement from stopping point"><span class="">~</span></button>
                <button type="button" class="btn btn-xs btn-default tinyg-queueflush" data-title="Queue Flush" data-content="Empty planner buffer. Used for jogging and other cycles"><span class="">%</span></button>
            </div>
            <div class="btn-group">
                <div class="dropdown">
                <button type="button" class="btn btn-xs btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
                <ul class="dropdown-menu dropdown-menu-right" role="menu">
                <!-- <li class="divider"></li> -->
                    <!-- <li role="presentation" class="dropdown-header fork-name"></li>
                    <li><a href="" target="_blank" class="standalone">View Widget Standalone</a></li>
                    <li><a href="" target="_blank" class="fork">Fork Widget</a></li> -->
                </ul>
                </div>
            </div>
        </div>
        <span class="panel-title" data-toggle="popover">TinyG</span>
   ...

CSS

#com-chilipeppr-widget-tinyg-body {
    /* padding:0; */
}
.com-chilipeppr-interface-cnccontroller-stat .col {
    padding:0 10px 0 0;
}
.com-chilipeppr-interface-cnccontroller-stat .col:last-child {
    padding:0;
}
.com-chilipeppr-interface-cnccontroller-stat .progress {
    margin-bottom:0;
}
.com-chilipeppr-interface-cnccontroller-stat .stat-row {
    padding-top:2px;
}
.com-chilipeppr-interface-cnccontroller-stat div.col.lblpad {
    padding-left:10px;
}
.com-chilipeppr-interface-cnccontroller-stat  .stat-unit {
    font-size:9px;
    display:none;
}
.com-chilipeppr-interface-cnccontroller-stat  div.col.well {
    margin-bottom:0px;
    padding-left:5px;
}
.com-chilipeppr-interface-cnccontroller-stat  .stat-sm {
    font-size:10px;
}

JavaScript

// Test this element. This code is auto-removed by the chilipeppr.load()
cprequire_test(["inline:com-chilipeppr-widget-tinyg"], function (tinyg) {
    console.log("test running of " + tinyg.id);
    tinyg.init();

    // create a typical test of planner buffer
    // you never want planner buffer with more than 12 items queued, 4 are reserved for pulling
    // from serial buffer, so you want qr to be no less than 12
    var buf = [27, 26, 25, 18, 14, 15, 16, 18, 17, 16, 12, 11, 10, 14, 17, 16, 15, 10, 22, 28];
    var delay = 1000;
    var delayPlus = 500;
    chilipeppr.currentCtr = -1;
    /*
    for (var ctr = 0; ctr < buf.length; ctr++) {
        
        setTimeout(function () {
            chilipeppr.currentCtr++;
            //console.log("chilipeppr.currentCtr:", chilipeppr.currentCtr);
            var cmd = '{"qr":' + buf[chilipeppr.currentCtr] + '}';
            chilipeppr.publish("/com-chilipeppr-widget-serialport/recvline", {dataline: cmd});
            //chilipeppr.currentCtr = chilipeppr.currentCtr + 1;
        }, delay);
        delay = delay + delayPlus;
    }    
    */
    
    // manual test of coordinates and how we publish them to the generic interface
    setTimeout(function () {
        chilipeppr.publish("/com-chilipeppr-widget-serialport/recvline", 
                           {dataline:'{"sr":{"vel":0.02,"mpox":10.474,"dist":1,"stat":1}}'});
    }, 1000);
    setTimeout(function () {
        chilipeppr.publish("/com-chilipeppr-widget-serialport/recvline", 
                           {dataline:'{"sr":{"vel":0.02,"mpox":0.574,"mpoy":32.424,"mpoz":-3.424,"dist":1,"stat":2}}'});
    }, 2000);
    setTimeout(function () {
        chilipeppr.publish("/com-chilipeppr-widget-serialport/recvline", 
                           {dataline: '{"sr":{"vel":0.02,"mpox":940.5744,"mpoz":1.12,"dist":1,"stat":5}}'});
    }, 3000);

    setTimeout(function () {
        chilipeppr.publish("/com-chilipeppr-widget-serialport/recvline", 
                         ...