senaduka/old-lab_ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed douplicate functions for getting nodes and topics

Browse Source
This commit is contained in:
Glen Turner
2015-06-19 14:41:28 -07:00
parent 82196e461f
commit d146020719
13 changed files with 361 additions and 308 deletions
Download Patch File Download Diff File Expand all files Collapse all files

181
ProjectFiles/js/ros_scripts.js
View File

@@ -1,181 +0,0 @@
var ros = new ROSLIB.Ros();
ros.topics = [];
ros.nodes = [];
ros.recording = false;
ros.connectionName = 'ws://192.168.1.105:9090';
// If there is an error on the backend, an 'error' emit will be emitted.
ros.on('error', function(error) {
document.getElementById("ConnectionIPForm").className = "form-group has-warning has-feedback";
document.getElementById("ConnectionIPInput").value = ros.connectionName;
document.getElementById("ConnectionIPLabel").innerHTML = 'No connection';
document.getElementById("ConnectionButton").className = "btn btn-warning"
document.getElementById("rosbridgeconnection_badge").innerHTML = 'No connection';
document.getElementById("ROSNodes").innerHTML = "";
rosbridgeconnection_badge
console.log(error);192
});
// Find out exactly when we made a connection.
ros.on('connection', function() {
console.log('Connection made!');
document.getElementById("ConnectionIPForm").className = "form-group has-success has-feedback";
document.getElementById("ConnectionIPInput").value = ros.connectionName;
document.getElementById("ConnectionIPLabel").innerHTML = 'Connection made at:';
document.getElementById("rosbridgeconnection_badge").innerHTML = 'Connected';
document.getElementById("ConnectionButton").className = "btn btn-success"
ros.nodes = [];
ros.topics = [];
});
ros.on('close', function() {
console.log('Connection closed.');
document.getElementById("ConnectionIPForm").className = "form-group has-warning has-feedback";
document.getElementById("ConnectionIPLabel").innerHTML = 'Connection closed';
document.getElementById("ConnectionButton").className = "btn btn-warning"
document.getElementById("rosbridgeconnection_badge").innerHTML = 'Connection closed';
ros.nodes = [];
ros.topics = [];
});
// Create a connection to the rosbridge WebSocket server.
ros.connect(ros.connectionName);
///////////////////////////////////////////////////////////////////////////////////
// Publishers
///////////////////////////////////////////////////////////////////////////////////
function publishBagMessage(bagFilename)
{
var bagMessage = new ROSLIB.Message({
data : bagFilename
})
bagPublisher.publish(bagMessage)
}
////////////////////////////////////////////////////////////////
// Topics
////////////////////////////////////////////////////////////////
var bagPublisher = new ROSLIB.Topic({
ros : ros,
name : 'bag_publisher',
messageType : 'std_msgs/String'
});
var bagNotifier = new ROSLIB.Topic({
ros : ros,
name : 'bag_notifier',
messageType : 'std_msgs/String'
});
////////////////////////////////////////////////////////////////
// Subscribers
////////////////////////////////////////////////////////////////
bagNotifier.subscribe(function(message) {
if (message.data === "STARTED") {
document.getElementById("recordButtonText").innerHTML = "Stop"
document.getElementById("recordButton").className = "btn btn-danger"
} else {
document.getElementById("recordButtonText").innerHTML = "Start"
document.getElementById("recordButton").className = "btn btn-primary"
}
});
///////////////////////////////////////////////////////////////////////////////////
// Functions
///////////////////////////////////////////////////////////////////////////////////
// attept to connect to the ros master from the IP given orgrab it from the form
ros.attemptConnection = function(ipAddress)
{
if( typeof ipAddress !== "undefined")
{
ros.connectionName = ipAddress;
}
else
{
ros.connectionName = document.getElementById("ConnectionIPInput").value
}
console.log('Connection = ' + ros.connectionName);
ros.connect(ros.connectionName);
}
function getTopics() {
var topicsClient = new ROSLIB.Service({
ros : ros,
name : '/rosapi/topics',
serviceType : '/rosapi/Topics'
});
var request = new ROSLIB.ServiceRequest();
// ros.topics = [];
topicsClient.callService(request, function(result) {
ros.topics = result.topics;
});
return ros.topics;
};
function getNodes() {
var topicsClient = new ROSLIB.Service({
ros : ros,
name : '/rosapi/nodes',
serviceType : '/rosapi/nodes'
});
var request = new ROSLIB.ServiceRequest();
// ros.nodes = [];
topicsClient.callService(request, function(result) {
ros.nodes = result.nodes;
});
return ros.nodes;
};
function getTime() {
var topicsClient = new ROSLIB.Service({
ros : ros,
name : '/rosapi/get_time',
serviceType : '/rosapi/GetTime'
});
var request = new ROSLIB.ServiceRequest({});
topicsClient.callService(request, function(result) {
console.log("Getting Time...");
console.log(result.time.secs);
});
};
function toggleRecording()
{
document.getElementById("recordButtonText").innerHTML = "Wait"
document.getElementById("recordButton").className = "btn btn-warning"
if (!ros.recording) {
ros.recording = true
publishBagMessage(document.getElementById("recordText").value)
} else {
ros.recording = false
publishBagMessage("STOP")
}
}

115
ProjectFiles/js/update_guis.js
View File

@@ -1,115 +0,0 @@
function updateVoltage(voltage)
{
var voltage_min = 9.5;
var voltage_max = 12.5;
var voltage_range = voltage_max - voltage_min;
var voltage_percentage = (voltage - voltage_min) / voltage_range * 100;
var voltage_string = "";
voltage_string = voltage_string.concat(voltage_percentage);
voltage_string = voltage_string.substring(0,4);
voltage_string = voltage_string.concat('%');
document.getElementById("VoltageDisplay").style.width = voltage_string;
document.getElementById("VoltageDisplay").innerHTML = voltage_string;
if (voltage_percentage < 50 && voltage_percentage > 25 ) {
document.getElementById("VoltageDisplay").className = "progress-bar progress-bar-warning"
}
else if ( voltage_percentage <= 25)
{
document.getElementById("VoltageDisplay").className = "progress-bar progress-bar-danger"
var sound = document.getElementById("audio");
sound.play()
console.log("Pay Sound")
}
else
{
document.getElementById("VoltageDisplay").className = "progress-bar progress-bar-success"
}
};
function updateTopicsGUI()
{
topics = getTopics()
topics.sort();
if(topics != null){
var innerHTML = "";
for (var i = 0; i < topics.length; i++ )
{
innerHTML = innerHTML.concat(topics[i]);
innerHTML = innerHTML.concat("<br>");
}
document.getElementById("ROSTopics").innerHTML = innerHTML;
}
};
function updateNodesGUI()
{
nodes = getNodes()
nodes.sort()
if(nodes != null){
var innerHTML = "";
for (var i = 0; i < nodes.length; i++ )
{
innerHTML = innerHTML.concat(nodes[i]);
innerHTML = innerHTML.concat("<br>");
}
document.getElementById("ROSNodes").innerHTML = innerHTML;
}
};
window.setInterval(function(){
updateTopicsGUI()
updateNodesGUI()
}, 500);
function validateForm()
{
ros.attemptConnection();
return false;
};
function addInputsForConnection()
{
var innerHTML = "";
for (var i = 0; i < ros.connectioninfo.length; i ++)
{
console.log(ros.connectioninfo[i])
el = document.getElementById("ConnectionInformation")
innerHTML = innerHTML.concat("<span class=\"col-sm-1\">");
innerHTML = innerHTML.concat("<input type=\"text\" class=\"form-control\" value=\"");
innerHTML = innerHTML.concat(ros.connectioninfo[i])
innerHTML = innerHTML.concat("\"/>")
innerHTML = innerHTML.concat("</span>")
if(i >0 && i < 4)
{
innerHTML = innerHTML.concat("<span class=\"col-sxm-1\">.</span>")
}
}
el.innerHTML = innerHTML;
console.log(innerHTML)
}

BIN
backend/images/D-pad.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.8 KiB

BIN
backend/images/D-pad_blank.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 600 B

BIN
backend/images/D-pad_center.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.5 KiB

BIN
backend/images/D-pad_left.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
backend/images/D-pad_up.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

1
backend/js/custom_nodes.js Normal file
View File

@@ -0,0 +1 @@

55
backend/js/custom_topics.js Normal file
View File

@@ -0,0 +1,55 @@
function Topic(name, type)
{
this.name = name;
this.type = type;
this.includeInBag = false;
this.equals = function (otherTopic)
{
if( this.name == otherTopic.name && this.type == otherTopic.type)
{
return true;
}
return false;
};
};
function containsTopic(obj, list) {
var x;
for (x in list) {
if (obj.equals(list[x])) {
return true;
}
}
return false;
}
function testToics()
{
var topics = [new Topic("a","a_t"), new Topic("b","b_t"), new Topic("c","c_t")];
console.log("Testing Topic");
if (containsTopic(new Topic("a","a_t"),topics) == true)
{
console.log("pass")
}
else
{
console.log(" contains true fail")
}
if (containsTopic(new Topic("d","d_t"),topics) == false)
{
console.log("pass")
}
else
{
console.log(" contains d fail")
}
}
testToics();

124
backend/js/ros_scripts.js Normal file
View File

@@ -0,0 +1,124 @@
var ros = new ROSLIB.Ros();
ros.recording = false;
// ros.connectionName = 'ws://192.168.1.105:9090';
ros.connectionName = 'ws://localhost:9090';
// If there is an error on the backend, an 'error' emit will be emitted.
ros.on('error', function(error) {
document.getElementById("ConnectionIPForm").className = "form-group has-warning has-feedback";
document.getElementById("ConnectionIPInput").value = ros.connectionName;
document.getElementById("ConnectionIPLabel").innerHTML = 'No connection';
document.getElementById("ConnectionButton").className = "btn btn-warning"
document.getElementById("rosbridgeconnection_badge").innerHTML = 'No connection';
document.getElementById("ROSNodes").innerHTML = "No Nodes Detected";
rosbridgeconnection_badge
console.log(error);192
});
// Find out exactly when we made a connection.
ros.on('connection', function() {
console.log('Connection made!');
document.getElementById("ConnectionIPForm").className = "form-group has-success has-feedback";
document.getElementById("ConnectionIPInput").value = ros.connectionName;
document.getElementById("ConnectionIPLabel").innerHTML = 'Connection made at:';
document.getElementById("rosbridgeconnection_badge").innerHTML = 'Connected';
document.getElementById("ConnectionButton").className = "btn btn-success"
ros.nodes = [];
ros.topics = [];
});
ros.on('close', function() {
console.log('Connection closed.');
document.getElementById("ConnectionIPForm").className = "form-group has-warning has-feedback";
document.getElementById("ConnectionIPLabel").innerHTML = 'Connection closed';
document.getElementById("ConnectionButton").className = "btn btn-warning"
document.getElementById("rosbridgeconnection_badge").innerHTML = 'Connection closed';
ros.nodes = [];
ros.topics = [];
});
// Create a connection to the rosbridge WebSocket server.
ros.connect(ros.connectionName);
///////////////////////////////////////////////////////////////////////////////////
// Publishers
///////////////////////////////////////////////////////////////////////////////////
function publishBagMessage(bagFilename)
{
var bagMessage = new ROSLIB.Message({
data : bagFilename
})
bagPublisher.publish(bagMessage)
}
////////////////////////////////////////////////////////////////
// Topics
////////////////////////////////////////////////////////////////
var bagPublisher = new ROSLIB.Topic({
ros : ros,
name : 'bag_publisher',
messageType : 'std_msgs/String'
});
var bagNotifier = new ROSLIB.Topic({
ros : ros,
name : 'bag_notifier',
messageType : 'std_msgs/String'
});
////////////////////////////////////////////////////////////////
// Subscribers
////////////////////////////////////////////////////////////////
bagNotifier.subscribe(function(message) {
if (message.data === "STARTED") {
document.getElementById("recordButtonText").innerHTML = "Stop"
document.getElementById("recordButton").className = "btn btn-danger"
} else {
document.getElementById("recordButtonText").innerHTML = "Start"
document.getElementById("recordButton").className = "btn btn-primary"
}
});
///////////////////////////////////////////////////////////////////////////////////
// Functions
///////////////////////////////////////////////////////////////////////////////////
// attept to connect to the ros master from the IP given orgrab it from the form
ros.attemptConnection = function(ipAddress)
{
if( typeof ipAddress !== "undefined")
{
ros.connectionName = ipAddress;
}
else
{
ros.connectionName = document.getElementById("ConnectionIPInput").value
}
console.log('Connection = ' + ros.connectionName);
ros.connect(ros.connectionName);
}
function toggleRecording()
{
document.getElementById("recordButtonText").innerHTML = "Wait"
document.getElementById("recordButton").className = "btn btn-warning"
if (!ros.recording) {
ros.recording = true
publishBagMessage(document.getElementById("recordText").value)
} else {
ros.recording = false
publishBagMessage("STOP")
}
}

161
backend/js/update_guis.js Normal file
View File

@@ -0,0 +1,161 @@
ros.topics = [];
ros.nodes = [];
$("#myImage").click ( function (evt) {
var jThis = $(this);
var offsetFromParent = jThis.position ();
var topThickness = (jThis.outerHeight(true) - jThis.height() ) / 2;
var leftThickness = (jThis.outerWidth (true) - jThis.width () ) / 2;
//--- (x,y) coordinates of the mouse click relative to the image.
var x = evt.pageX - offsetFromParent.left - leftThickness;
var y = evt.pageY - offsetFromParent.top - topThickness;
ReportDims ();
$('#rez').append ('<p>User clicked at: ' + x + ', ' + y + ' (x,y).</p>')
} );
function ReportDims () {
w = $("#myImage").width ();
h = $("#myImage").height ();
$('#rez').text ('The image is ' + w + ' by ' + h + ' (w by h).');
}
ReportDims ();
function updateVoltage(voltage)
{
var voltage_min = 9.5;
var voltage_max = 12.5;
var voltage_range = voltage_max - voltage_min;
var voltage_percentage = (voltage - voltage_min) / voltage_range * 100;
var voltage_string = "";
voltage_string = voltage_string.concat(voltage_percentage);
voltage_string = voltage_string.substring(0,4);
voltage_string = voltage_string.concat('%');
document.getElementById("VoltageDisplay").style.width = voltage_string;
document.getElementById("VoltageDisplay").innerHTML = voltage_string;
if (voltage_percentage < 50 && voltage_percentage > 25 ) {
document.getElementById("VoltageDisplay").className = "progress-bar progress-bar-warning"
}
else if ( voltage_percentage <= 25)
{
document.getElementById("VoltageDisplay").className = "progress-bar progress-bar-danger"
var sound = document.getElementById("audio");
sound.play()
console.log("Pay Sound")
}
else
{
document.getElementById("VoltageDisplay").className = "progress-bar progress-bar-success"
}
};
function updateTopicsGUI()
{
ros.getTopics(function(result)
{
ros.topics = result;
}
);
var topics = ros.topics;
topics.sort();
if(topics != null){
var innerHTML = "";
for (var i = 0; i < topics.length; i++ )
{
innerHTML = innerHTML.concat(generateCheckbox(topics[i]));
}
document.getElementById("ROSTopics").innerHTML = innerHTML;
}
};
function generateCheckbox(name)
{
var str = "<div class=\"checkbox\"> <label><input type=\"checkbox\" value=\"\">";
str = str.concat(name);
str = str.concat("</label></div>");
return str;
};
function updateNodesGUI()
{
ros.getNodes(function(result)
{
ros.nodes = result;
});
var nodes = ros.nodes;
nodes.sort()
if(nodes != null){
var innerHTML = "";
for (var i = 0; i < nodes.length; i++ )
{
innerHTML = innerHTML.concat(nodes[i]);
innerHTML = innerHTML.concat("<br>");
}
document.getElementById("ROSNodes").innerHTML = innerHTML;
}
};
window.setInterval(function(){
updateTopicsGUI()
updateNodesGUI()
}, 500);
function validateForm()
{
ros.attemptConnection();
return false;
};
function addInputsForConnection()
{
var innerHTML = "";
for (var i = 0; i < ros.connectioninfo.length; i ++)
{
console.log(ros.connectioninfo[i])
el = document.getElementById("ConnectionInformation")
innerHTML = innerHTML.concat("<span class=\"col-sm-1\">");
innerHTML = innerHTML.concat("<input type=\"text\" class=\"form-control\" value=\"");
innerHTML = innerHTML.concat(ros.connectioninfo[i])
innerHTML = innerHTML.concat("\"/>")
innerHTML = innerHTML.concat("</span>")
if(i >0 && i < 4)
{
innerHTML = innerHTML.concat("<span class=\"col-sxm-1\">.</span>")
}
}
el.innerHTML = innerHTML;
console.log(innerHTML)
}

16
index.html
View File

@@ -19,10 +19,12 @@ Tutorials can be found here: http://www.w3schools.com/bootstrap/default.asp
<script src="include/js/roslib.js"></script>
<script type="text/javascript" src="include/js/roslib.min.js"></script>
<script type="text/javascript" src="include/js/roslib.js"></script>
<script type="text/javascript" src="ProjectFiles/js/ros_scripts.js"></script>
<script type="text/javascript" src="ProjectFiles/js/update_guis.js"></script>
<script type="text/javascript" src="backend/js/custom_topics.js"></script>
<script type="text/javascript" src="backend/js/ros_scripts.js"></script>
<script type="text/javascript" src="backend/js/update_guis.js"></script>
<audio id="audio" src="audio/beep-04.mp3" autostart="false" ></audio>
@@ -88,9 +90,9 @@ Tutorials can be found here: http://www.w3schools.com/bootstrap/default.asp
</div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<!-- ##################################### ROBOT DISPLAT PANEL ######################################### -->
<!-- ##################################### ROBOT DISPLAY PANEL ######################################### -->
<div id="includedContent"></div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<!-- ##################################### END DISPLAY PANEL ######################################### -->
@@ -114,7 +116,7 @@ Tutorials can be found here: http://www.w3schools.com/bootstrap/default.asp
<span>
<div class="input-group">
<input type="text" id="ConnectionIPInput" class="form-control" placeholder="bag_filename" placeholder="No IP Address yet">
<input type="text" id="ConnectionIPInput" class="form-control" placeholder="ROS Bridge Master IP" placeholder="No IP Address yet">
<span class="input-group-btn">
<button id="ConnectionButton" type="button" onclick="ros.attemptConnection()" class="btn btn-warning">
Connect
@@ -137,7 +139,7 @@ Tutorials can be found here: http://www.w3schools.com/bootstrap/default.asp
</div>
<div class="panel-body">
<div class="col-sm-1" id="ROSTopics">
<div id="ROSTopics">
N/A
</div>
</div>

16
robot_display.html
View File

@@ -1,3 +1,14 @@
<!-- ##################################### D-PAD ######################################### -->
<p>Click in the actual image. Relative coordinates will be displayed.</p>
<p id="rez"></p>
<div>
<img id="myImage" src="http://animalia-life.com/data_images/dog/dog4.jpg">
<!-- ##################################### END D-PAD ######################################### -->
<!-- ##################################### Example Progress Bar ######################################### -->
<div class="panel panel-default">
@@ -43,11 +54,6 @@
Camera Image
</div>
<div class="panel-body">
<div class="row" >
<div class="col-lg-4">
<img height="350" alt="No Camera Image" id="imageStream" src="http://localhost:8080/stream?topic=/camera/image">
</img>
</div>
<div class="col-lg-4">
<img height="350" alt="No Camera Image" id="imageStream" src="http://localhost:8080/stream?topic=/camera/image"></img>
</div>