Add robotiq force display

This commit is contained in:
David Walsh
2019-05-22 14:41:40 -04:00
parent 8af9aecfb0
commit 71f81af9b0
4 changed files with 88 additions and 15 deletions

View File

@@ -97,22 +97,30 @@
Robotiq
</div>
<div class="panel-body text-center">
<div class="col-md-4">
Current Robotiq Values:
<div class="row-md-3">
<h4>X: <span id="robotiqX" class="label label-default">0.0</span></h4>
</div>
<div class="row-md-3">
<h4>Y: <span id="robotiqY" class="label label-default">0.0</span></h4>
</div>
<div class="row-md-3">
<h4>Z: <span id="robotiqZ" class="label label-default">0.0</span></h4>
<div class="row-md-3">
<div class="progress" id="robotiqForce">
<div class="progress-bar bg-success" role="progressbar" id="robotiqForceBar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="200">N/A</div>
</div>
</div>
<div class="row-md-3">
<button id="calibrateButton" type="button" onclick="triggerService('/left/aescape/hardware/calibrateRobotiq')" class="btn btn-primary">
Calibrate Robotiq
</button>
<div class="row">
<div class="col-md-4">
Current Robotiq Values:
<div class="row-md-3">
<h4>X: <span id="robotiqX" class="label label-default">0.0</span></h4>
</div>
<div class="row-md-3">
<h4>Y: <span id="robotiqY" class="label label-default">0.0</span></h4>
</div>
<div class="row-md-3">
<h4>Z: <span id="robotiqZ" class="label label-default">0.0</span></h4>
</div>
</div>
<div class="col-md-4">
<button id="calibrateButton" type="button" onclick="triggerService('/left/aescape/hardware/calibrateRobotiq')" class="btn btn-primary">
Calibrate Robotiq
</button>
</div>
</div>
</div>
</div>

View File

@@ -186,6 +186,15 @@ robotiqDataTopic.subscribe(function(message) {
document.getElementById("robotiqY").innerHTML = force.y.toFixed(1)
document.getElementById("robotiqZ").innerHTML = force.z.toFixed(1)
var totalForce = math.norm([force.x, force.y, force.z]).toFixed(1)
var totalForcePercent = totalForce/2
doc = document.getElementById("robotiqForceBar");
doc.style.width = totalForcePercent + "%";
doc.innerHTML = totalForce + " N";
doc.setAttribute('aria-valuenow', totalForce);
if ((Math.abs(force.x) > 0.5) || (Math.abs(force.y) > 0.5) || (Math.abs(force.z) > 0.5))
{
document.getElementById("calibrateButton").className = "btn btn-danger"

56
include/js/math.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@@ -17,7 +17,7 @@ Tutorials can be found here: http://www.w3schools.com/bootstrap/default.asp
<link rel="stylesheet" href="include/css/bootstrap.min.css">
<script src="include/js/jquery.min.js"></script>
<script src="include/js/bootstrap.min.js"></script>
<script src="include/js/math.min.js"></script>
<script src="include/js/roslib.js"></script>
<script type="text/javascript" src="include/js/roslib.js"></script>