216 lines
9.4 KiB
HTML
216 lines
9.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Lab UI</title>
|
|
<!--
|
|
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
|
|
-->
|
|
<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>
|
|
|
|
|
|
<script src="include/js/roslib.js"></script>
|
|
<script type="text/javascript" src="include/js/roslib.js"></script>
|
|
|
|
<script type="text/javascript" src="backend/js/ros_scripts.js"></script>
|
|
<script type="text/javascript" src="backend/js/update_guis.js"></script>
|
|
|
|
<script type="text/javascript" src="backend/js/Topic.js"></script>
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
|
|
<script>
|
|
$(function(){
|
|
$("#coordinatorContent").load("coordinator/coordinator.html");
|
|
});
|
|
</script>
|
|
<script type="text/javascript" src="coordinator/js/ros_scripts.js"></script>
|
|
<script type="text/javascript" src="coordinator/js/update_guis.js"></script>
|
|
|
|
|
|
<script>
|
|
$(function(){
|
|
$("#visionContent").load("vision/vision.html");
|
|
});
|
|
</script>
|
|
<script type="text/javascript" src="vision/js/ros_scripts.js"></script>
|
|
<script type="text/javascript" src="vision/js/update_guis.js"></script>
|
|
|
|
|
|
<script>
|
|
$(function(){
|
|
$("#visionContent").load("vision/vision.html");
|
|
});
|
|
</script>
|
|
<script type="text/javascript" src="vision/js/ros_scripts.js"></script>
|
|
<script type="text/javascript" src="vision/js/update_guis.js"></script>
|
|
|
|
<meta content="text/html; charset=UTF-8; X-Content-Type-Options=nosniff" http-equiv="Content-Type" />
|
|
|
|
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div id="jumbotronTitle" class="jumbotron text-center">
|
|
<h1>Lab UI</h1>
|
|
|
|
</div>
|
|
<div class="container">
|
|
<div class="col-md-1">
|
|
Master:
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label id="MasterName"></label>
|
|
<script>
|
|
getMasterName();
|
|
</script>
|
|
</div>
|
|
</div>
|
|
<div class="row-md-3">
|
|
<ul id="tabs" class="nav nav-pills" data-tabs="tabs" >
|
|
<li> <a href="#rosbridgeconnection" data-toggle="tab">
|
|
ROS Bridge Connection
|
|
<span id="rosbridgeconnection_badge" class="badge">
|
|
Not Connected
|
|
</span></a>
|
|
</li>
|
|
<li class="active">
|
|
<a href="#Coordinator" data-toggle="tab">
|
|
Coordinator
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#Vision" data-toggle="tab">
|
|
Vision
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div id="my-tab-content" class="tab-content">
|
|
|
|
<div class="tab-pane active" id="Coordinator">
|
|
<div id="coordinatorContent"></div>
|
|
</div>
|
|
<div class="tab-pane" id="Vision">
|
|
<div id="visionContent"></div>
|
|
</div>
|
|
|
|
|
|
<div class="tab-pane" id="rosbridgeconnection">
|
|
|
|
|
|
<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>
|
|
|
|
<span>
|
|
<div class="input-group">
|
|
<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
|
|
<script type="text/javascript">
|
|
document.getElementById("ConnectionIPInput").value = ros.connectionName;
|
|
</script>
|
|
</button>
|
|
</span>
|
|
</div>
|
|
</span>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
Predefined ROSBridge Connections
|
|
</div>
|
|
<div class="panel-body">
|
|
<!-- <button id="localhostButton" type="button" onclick="ros.attemptConnection('ws://localhost:9090')" class="btn btn-primary">
|
|
localhost
|
|
<script type="text/javascript">
|
|
document.getElementById("ConnectionIPInput").value = ros.connectionName;
|
|
</script>
|
|
</button>
|
|
<button id="PhoebeButton" type="button" onclick="ros.attemptConnection('ws://phoebe.local:9090')" class="btn btn-primary">
|
|
Phoebe
|
|
<script type="text/javascript">
|
|
document.getElementById("ConnectionIPInput").value = ros.connectionName;
|
|
</script>
|
|
</button>
|
|
<button id="TitanButton" type="button" onclick="ros.attemptConnection('ws://titan.local:9090')" class="btn btn-primary">
|
|
Titan
|
|
<script type="text/javascript">
|
|
document.getElementById("ConnectionIPInput").value = ros.connectionName;
|
|
</script>
|
|
</button> -->
|
|
<button id="TitanButton" type="button" onclick="ros.attemptConnection('ws://titan.aescape.co:9090')" class="btn btn-primary">
|
|
Phoebe
|
|
<script type="text/javascript">
|
|
document.getElementById("ConnectionIPInput").value = ros.connectionName;
|
|
</script>
|
|
</button>
|
|
<button id="RheaButton" type="button" onclick="ros.attemptConnection('ws://titan.aescape.co:9091')" class="btn btn-primary">
|
|
Rhea
|
|
<script type="text/javascript">
|
|
document.getElementById("ConnectionIPInput").value = ros.connectionName;
|
|
</script>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
// Create a connection to the rosbridge WebSocket server.
|
|
ros.connect(ros.connectionName);
|
|
</script>
|
|
|
|
<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>
|