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_MASTER_URI=http://<Host computer IP>:11311
export ROS_IP=<your IP> 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. Then run the bash file in the working directory by running the following in the terminal.
bash launch.bash 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 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 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. By using ROSBridge, this GUI will attempt to display relevant information over the web for any device.
TODO: TODO:

148
index.html
View File

@@ -29,13 +29,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <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> </head>
<body> <body>
@@ -91,6 +84,10 @@
</div> </div>
</div> </div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<!-- ##################################### Example Progress Bar ######################################### -->
<div class="panel panel-default"> <div class="panel panel-default">
@@ -124,91 +121,96 @@
</div> </div>
</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>
</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> </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 panel-default">
<div class="panel-body"> <div class="panel-body">
<form class="form-inline" role="form" onsubmit="return validateForm()"> <form class="form-inline" role="form" onsubmit="return validateForm()">
<div id="ConnectionIPForm" class="form-group has-warning" align="center"> <div id="ConnectionIPForm" class="form-group has-warning" align="center">
<span> <span>
<label id="ConnectionIPLabel" class="control-label" for="inputWarning"> <label id="ConnectionIPLabel" class="control-label" for="inputWarning">
Connection Warning Connection Warning
</label> </label>
</span> </span>
<span> <span>
<div class="input-group"> <div class="input-group">
<input type="text" id="ConnectionIPInput" class="form-control" placeholder="bag_filename" value="No IP Address yet"> <input type="text" id="ConnectionIPInput" class="form-control" placeholder="bag_filename" placeholder="No IP Address yet">
<span class="input-group-btn"> <span class="input-group-btn">
<button id="ConnectionButton" type="button" onclick="ros.attemptConnection()"> <button id="ConnectionButton" type="button" onclick="ros.attemptConnection()">
Connect Connect
<script type="text/javascript"> <script type="text/javascript">
document.getElementById("ConnectionIPInput").value = ros.connectionName; document.getElementById("ConnectionIPInput").value = ros.connectionName;
</script> </script>
</button> </button>
</span> </span>
</div> </div>
</span> </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>
</div>
</form>
</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 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>
</div> </div>
</div>
</body> </body>
</html> </html>