mirror of
https://gitee.com/cv_team/uestc-careye.git
synced 2024-11-29 18:28:42 +08:00
Modify:修改前端显示界面
This commit is contained in:
parent
9a2daa9d1b
commit
e5a8cac80d
6
robot_client/html/css/bootstrap.min.css
vendored
6
robot_client/html/css/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1,4 +0,0 @@
|
||||
.controller_button{
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
}
|
@ -1,143 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>RoboCar</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
|
||||
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
<script src="js/index.js"></script>
|
||||
<link rel="stylesheet" href="css/index.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse"
|
||||
data-target="#example-navbar-collapse">
|
||||
<span class="sr-only">切换导航</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="index.html">控制面板</a>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="example-navbar-collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="active"><a href="state.html">系统状态</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="content">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">
|
||||
运动控制
|
||||
</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="col-md-6">
|
||||
<p id="image_title">图像标题</p>
|
||||
<img id="image_stream" src="https://static.runoob.com/images/mix/img_avatar.png" width="100%" height="100%">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_ac" class="bs-example">
|
||||
<button onclick="button_ac_click()" type="button" class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">左旋
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_front" class="bs-example ">
|
||||
<button onclick="button_front_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">前进
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_cw" class="bs-example">
|
||||
<button onclick="button_cw_click()" type="button" class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">右旋
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_left" class="bs-example ">
|
||||
<button onclick="button_left_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">左转
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_stop" class="bs-example ">
|
||||
<button onclick="button_stop_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">停止
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_right" class="bs-example">
|
||||
<button onclick="button_right_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">右转
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_follow" class="bs-example ">
|
||||
<button onclick="button_follow_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">跟随
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_line" class="bs-example ">
|
||||
<button onclick="button_back_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">后退
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-4 col-xs-4">
|
||||
<div id="button_control" class="bs-example">
|
||||
<button onclick="button_control_click()" type="button"
|
||||
class="btn btn-primary controller_button"
|
||||
data-loading-text="Loading...">遥控
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
setInterval("video()", 200);
|
||||
|
||||
function video() {
|
||||
$.ajax({
|
||||
url: '/video',
|
||||
async: true,
|
||||
dataType: "html",
|
||||
type: 'get',
|
||||
success: function (data) {
|
||||
$('#image_stream').attr("src","data:image/png;base64,"+data);
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
7
robot_client/html/js/bootstrap.min.js
vendored
7
robot_client/html/js/bootstrap.min.js
vendored
File diff suppressed because one or more lines are too long
@ -1,54 +0,0 @@
|
||||
function button_ac_click() {
|
||||
send_command('/move/ac')
|
||||
}
|
||||
|
||||
function button_cw_click() {
|
||||
send_command('/move/cw')
|
||||
}
|
||||
|
||||
function button_control_click() {
|
||||
send_command('/move/control')
|
||||
}
|
||||
function button_back_click() {
|
||||
send_command('/move/back')
|
||||
}
|
||||
|
||||
function button_front_click() {
|
||||
send_command('/move/front')
|
||||
}
|
||||
|
||||
function button_left_click() {
|
||||
send_command('/move/left')
|
||||
}
|
||||
|
||||
function button_right_click() {
|
||||
send_command('/move/right')
|
||||
}
|
||||
|
||||
function button_stop_click() {
|
||||
send_command('/move/stop')
|
||||
}
|
||||
|
||||
function button_follow_click() {
|
||||
send_command('/move/follow')
|
||||
}
|
||||
|
||||
function send_command(urlpath) {
|
||||
$.ajax({
|
||||
type : "GET",
|
||||
url : urlpath,
|
||||
success : function(result) {
|
||||
console.log(result);
|
||||
},
|
||||
error : function(e){
|
||||
console.log(e.status);
|
||||
console.log(e.responseText);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function button_line_click() {
|
||||
send_command('/move/line')
|
||||
}
|
||||
|
||||
|
5
robot_client/html/js/jquery.min.js
vendored
5
robot_client/html/js/jquery.min.js
vendored
File diff suppressed because one or more lines are too long
@ -1,107 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>RoboCar</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
|
||||
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse"
|
||||
data-target="#example-navbar-collapse">
|
||||
<span class="sr-only">切换导航</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="index.html">控制面板</a>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="example-navbar-collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="active"><a href="state.html">系统状态</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="content">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">
|
||||
队列状态
|
||||
</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>队列</th>
|
||||
<th>状态</th>
|
||||
<th>当前大小</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>图像队列</td>
|
||||
<td>启用</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">
|
||||
设备状态
|
||||
</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>设备名</th>
|
||||
<th>状态</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>雷达</td>
|
||||
<td>启用</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">
|
||||
配置文件
|
||||
</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<table class="table table-striped">
|
||||
<caption>雷达</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>配置名</th>
|
||||
<th>值</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>路径</td>
|
||||
<td>/dev/ttyUSB0</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user