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

ros_display now seperated into it's own file

Browse Source
This commit is contained in:
Glen Turner
2015-06-18 19:04:57 -04:00
parent a132a14d3e
commit c66b0645a2
2 changed files with 159 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
index.html
View File

@@ -1,18 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<head>
<meta charset="utf-8" />
<!--
Link to included files. These are typically done by fetching from the web.
Because this needs to run without an internet conection, the files were saved
locally
-->
<!--
Link to included files. These are typically done by fetching from the web.
Because this needs to run without an internet conection, the files were saved
locally
-->
<script type="text/javascript" src="include/js/eventemitter2.min.js"></script>
<!-- Bootstrap is a beatuful and usefull library of GUIs. Docs can be found here: http://getbootstrap.com/
Tutorials can be found here: http://www.w3schools.com/bootstrap/default.asp
-->
<!-- Bootstrap is a beatuful and usefull library of GUIs. Docs can be found here: http://getbootstrap.com/
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>
@@ -29,9 +29,15 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
$(function(){
$("#includedContent").load("ros_display.html");
});
</script>
</head>
<body>
</head>
<body>
<div class="container">
<div id="jumbotronTitle" class="jumbotron">
<h1>Example GUI</h1>
@@ -54,10 +60,6 @@
<div class="tab-pane active" id="RobotInfo">
<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>
<!-- ##################################### ROS BAG PANEL ######################################### -->
<!-- ROS Bag Panel -->
@@ -86,66 +88,15 @@
</div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<!-- ##################################### Example Progress Bar ######################################### -->
<div class="panel panel-default">
<div class="panel-heading">
Example Pannel Heading
</div>
<!-- ##################################### ROBOT DISPLAT PANEL ######################################### -->
<div id="includedContent"></div>
<!-- ##################################### END ROS BAG PANEL ######################################### -->
<div class="panel-body">
<div class="row">
<label class="col-sm-2">
Bar Title
</label>
<div class="progress">
<div id="progressBar1" class="progress-bar progress-bar-striped active" role="progressbar"
aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width:100%" >
No data recieved yet. </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>
<!-- ##################################### 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>
@@ -212,5 +163,5 @@
</div>
</div>
</body>
</html>
</body>
</html>

57
ros_display.html Normal file
View File

@@ -0,0 +1,57 @@
<!-- ##################################### Example Progress Bar ######################################### -->
<div class="panel panel-default">
<div class="panel-heading">
Example Pannel Heading
</div>
<div class="panel-body">
<div class="row">
<label class="col-sm-2">
Bar Title
</label>
<div class="progress">
<div id="progressBar1" class="progress-bar progress-bar-striped active" role="progressbar"
aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width:100%" >
No data recieved yet. </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>
<!-- ##################################### END Example Progress Bar ######################################### -->
<!-- ##################################### 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>
<!-- ##################################### END Example Image ######################################### -->