Skip to content

Instantly share code, notes, and snippets.

@virtuald

virtuald/index.html

Created April 28, 2015 04:35
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save virtuald/6764eaf6bacd5d25c3ae to your computer and use it in GitHub Desktop.
Save virtuald/6764eaf6bacd5d25c3ae to your computer and use it in GitHub Desktop.
Download ZIP
Concept for jQuery extensions for pynetworktables2js
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<!-- This starts the NetworkTables websocket, it can be accessed from multiple
pages simultaneously -->
<script src="/networktables/networktables.js"></script>
<!-- Obviously, you will want to copy this file locally in a real
dashboard, as the Driver Station won't have internet access -->
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<!-- uncomment this is you want to use included utility functions that
implement common functionality that you might find useful. Requires
that d3.js and jQuery are included first -->
<!-- <script src="/networktables/utils.js"></script> -->
<div>
NetworkTables websocket: <span id="connectstate">Unknown state</span><br/>
Robot: <span id="robotstate">Unknown state</span>
</div>
<hr/>
/SmartDashboard/InteractiveBool: <input id="#interactive_bool" type="checkbox" /><br/>
/SmartDashboard/ReadOnlyBool: <span id="#readonly_bool"/>false<br/>
/SmartDashboard/Autonomous: <select id="#autonomous_chooser" />
<script type="text/javascript">
"use strict";
$(document).ready(function(){
// jquery functions for connect/disconnect
// - Not totally sure if 'this' works here, but sounds good?
$('#connectstate').ntWsConnected(function(connected){
this.text(connected ? "Connected!" : "Disconnected");
});
$('#robotstate').ntRobotConnected(function(connected){
this.text(connected ? "Connected!" : "Disconnected");
});
// the ntBoolean figures out that the element is a checkbox and does the right thing
// to make it work interactively
$('#interactive_bool').ntBoolean('/SmartDashboard/InteractiveBool');
// the ntBoolean figures out that the element is a span and does the right thing
// to only show the value
$('#readonly_bool').ntBoolean('/SmartDashboard/ReadOnlyBool');
// just a different way to use the 'attachSelectToSendableChooser' function already
// in the utils.js...
$('#autonomous_chooser').ntChooser('/SmartDasboard/Autonomous');
// TODO: could extend this concept for other things like integers, strings..
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment