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

added subscription to image topics

Browse Source
This commit is contained in:
GLEN TURNER (8GT6)
2015-06-01 16:47:54 -04:00
parent d5282805da
commit a8a272919b
2 changed files with 79 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@@ -11,6 +11,10 @@ If you are connecting to a remote computer that is running the roscore, you need
export ROS_MASTER_URI=http://<Host computer IP>:11311
export ROS_IP=<your IP>
Make sure you have the web_video_server installed:
sudo apt-get install ros-indigo-web-video-server
Then run the bash file in the working directory by running the following in the terminal.
bash launch.bash
@@ -24,8 +28,6 @@ You can easily customise the "Robot Display" pannel by changing the HTML "index.
All ROS related Javascript should go in the "ProjectFiles/js/ros_scripts.js" file.
All functions that are used to update the GUI should go in the "ProjectFiles/js/update_guis.js" file
By using ROSBridge, this GUI will attempt to display relevant information over the web for any device.
TODO:

148
index.html
View File

@@ -29,13 +29,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--<script>
$(function(){
$("#RobotInfo").load("ProjectFiles/HTML/RobotDisplayPanel.html");});
</script>
<link rel="import" href="ProjectFiles/HTML/RobotDisplayPanel.html"> -->
</head>
<body>
@@ -91,6 +84,10 @@
</div>
</div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<!-- ##################################### Example Progress Bar ######################################### -->
<div class="panel panel-default">
@@ -124,91 +121,96 @@
</div>
</div>
<div class="row">
<label class="col-sm-2">
Up Time (s):
</label>
<div class="col-sm-1" id="UpTime">
N/A
</div>
</div>
</div>
</div>
<!-- ##################################### Example Image ######################################### -->
<div class="panel panel-default">
<div class="panel-heading">
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>
</div>
</div>
</div>
</div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<div class="tab-pane" id="rosbridgeconnection">
<div class="tab-pane" id="rosbridgeconnection">
<div class="panel panel-default">
<div class="panel-body">
<div class="panel panel-default">
<div class="panel-body">
<form class="form-inline" role="form" onsubmit="return validateForm()">
<div id="ConnectionIPForm" class="form-group has-warning" align="center">
<span>
<label id="ConnectionIPLabel" class="control-label" for="inputWarning">
Connection Warning
</label>
</span>
<form class="form-inline" role="form" onsubmit="return validateForm()">
<div id="ConnectionIPForm" class="form-group has-warning" align="center">
<span>
<label id="ConnectionIPLabel" class="control-label" for="inputWarning">
Connection Warning
</label>
</span>
<span>
<div class="input-group">
<input type="text" id="ConnectionIPInput" class="form-control" placeholder="bag_filename" value="No IP Address yet">
<span class="input-group-btn">
<button id="ConnectionButton" type="button" onclick="ros.attemptConnection()">
Connect
<script type="text/javascript">
document.getElementById("ConnectionIPInput").value = ros.connectionName;
</script>
</button>
</span>
</div>
</span>
<span>
<div class="input-group">
<input type="text" id="ConnectionIPInput" class="form-control" placeholder="bag_filename" placeholder="No IP Address yet">
<span class="input-group-btn">
<button id="ConnectionButton" type="button" onclick="ros.attemptConnection()">
Connect
<script type="text/javascript">
document.getElementById("ConnectionIPInput").value = ros.connectionName;
</script>
</button>
</span>
</div>
</span>
</div>
</form>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
ROS Topics
</div>
<div class="panel-body">
<div class="col-sm-1" id="ROSTopics">
N/A
</div>
</div>
</form>
</div>
<div class="panel panel-default">
<div class="panel-heading">
ROS Nodes
</div>
<div class="panel-body">
<div class="col-sm-1" id="ROSNodes">
N/A
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
ROS Topics
</div>
<div class="panel-body">
<div class="col-sm-1" id="ROSTopics">
N/A
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
ROS Nodes
</div>
<div class="panel-body">
<div class="col-sm-1" id="ROSNodes">
N/A
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
</body>
</html>