Commit e7de055f authored by Scott Morgan's avatar Scott Morgan

Updated webpage - added buttons for mobile use and altered layout

parent d5be805f
......@@ -4,22 +4,22 @@
<div id="headWrapper"><h1>Robot Control Terminal</h1></div>
<div class="wrapper">
<div class="updownBtn"><button class="btn" onclick="robotMove(1)">Forward</button></div>
<div class="leftrightBtn"><button class="btn" onclick="robotMove(4)">Left</button></div>
<div class="leftrightBtn"><button class="btn" onclick="robotMove(2)">Right</button></div>
<div class="updownBtn"><button class="btn" onclick="robotMove(3)">Reverse</button></div>
<div class="updownBtn"><button class="btn" onmousedown="robotMove(1)">Forward</button></div>
<div class="leftrightBtn"><button class="btn" onmousedown="robotMove(4)">Left</button></div>
<div class="leftrightBtn"><button class="btn" onmousedown="robotMove(2)">Right</button></div>
<div class="updownBtn"><button class="btn" onmousedown="robotMove(3)">Reverse</button></div>
<p class="statustext" id="status">Press a button to control the robot!</p>
</div>
<div class="wrapper">
<button class="btn" id="camBtn" onclick="robotMove(6)">Activate obstacle avoidance!</button>
<button class="btn" id="obsBtn" onclick="robotMove(6)">Activate obstacle avoidance!</button>
<p class="statustext" id="usStatus">Distance: --</p>
</div>
<div class="wrapper">
<button class="btn" onclick="robotMove(5)">Take Photo!</button><img id="camera">
</div>
<button class="btn" id="cambtn" onclick="robotMove(5)">Take Photo!</button><img id="camera">
</div>
<script type="text/javascript">
var config = {
......
......@@ -66,3 +66,8 @@ body {
border: solid 1px black;
float: left;
}
#camBtn {
margin-top: 18%;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment