Skip to content

Commit

Permalink
Implement Manual Control layout
Browse files Browse the repository at this point in the history 
Current Features

*User can open Drive page from the navigation menu
*The Drive page is divided into different grids
*buttons are added for manually controling the car
*the App is relatively responsive to the size of window.

Further improvements planned

*Add content to the grids
*Pulish the buttons
*connect the camera block to the car camera (life stream)
*Print the information about the movements of the car into the Info container.
Contributes to #2  , #6 , #8
Additional Authors:
@ramadi-a , @OneMoreOreo
  • Loading branch information
@kam56
kamila yosofi authored and kam56 committed Apr 11, 2021
1 parent 7386e8c commit e51f9f5
Show file tree
Hide file tree
Showing 4 changed files with 5,421 additions and 0 deletions.
131 changes: 131 additions & 0 deletions frontendApp/Drive.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,131 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type = "text/css" href="style.css">
<title>Drive</title>
</head>
<body>
<div class="grid">
<div class="menu">
<side class="main-nav">


<label for="logo" class= "logoDisplay">
<label for="logo">SmartRover</label>

</label>

<ul>

<li><a href= "index.html">Home</a></li>
<li><a class= "active" href= "#">Drive</a></li>
<li><a href= "#">Mission</a></li>
<li><a href= "#">Settings</a></li>
<li><a href= "#">Help</a></li>

</ul>
</side>

</div>
<div class="middle">
<div class="controller">
<div class="camera">
camera
</div>

<div>
<b>
<input class="up" type="button" >
</b>
</div>
<div>
Kamila
</div>
<div>
<b>
<input class="left" type="button">
</b>
</div>


<div>
<b>
<input class="stop" type="button">
</b>
</div>


<div>
<b>
<input class="right" type="button">
<label for="check" class= "checkbtn">
<i class="angle-double-right fa-3x"></i>
</label>

</b>
</div>
<div>
Markus
</div>

<div>
<b>
<input class="down" type="button">
</b>
</div>
<div>
Anwer
</div>




</div>
<div class="info">
<div class="infoBoard">
<li>Traveled Distance: </li>
<li>Speed:</li>
<li>Current Position:</li>

</div>
<div class="Example">
Lorem ipsum dolor sit, amet consectetur
adipisicing elit. Necessitatibus odit
consequuntur quam? In repudiandae vitae
illum laudantium quis adipisci nemo aspernatur architecto voluptatum? Pariatur similique placeat,
ex excepturi tenetur consequatur.


</div>
</div>


</div>
<div class="LastCalumn">


<div class="status">
status


</div>
<div class="message">
Lorem ipsum dolor sit, amet consectetur
adipisicing elit. Necessitatibus odit
consequuntur quam? In repudiandae vitae
illum laudantium quis adipisci nemo aspernatur architecto voluptatum? Pariatur similique placeat,
ex excepturi tenetur consequatur.


</div>


</div>

</div>
</body>
</html>
Binary file added frontendApp/images/kaktos.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit e51f9f5

Please sign in to comment.