Team2890/PhotonVision
4
0
Fork 0
mirror of https://github.com/PhotonVision/photonvision synced 2026-07-06 03:31:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added sidenav and random logo

Browse Source
This commit is contained in:
Sagi Frimer
2019-03-02 21:17:48 +02:00
parent 81e6a917c4
commit 34a8def31f
5 changed files with 59 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
Python/app/ChameleonVisionApp.py
View File

@@ -14,7 +14,8 @@ class ChameleonApplication(tornado.web.Application):
handlers = [(r"/", MainHandler), handlers = [(r"/", MainHandler),
(r"/websocket", ChameleonWebSocket), (r"/websocket", ChameleonWebSocket),
(r"/CSS/(.*)", tornado.web.StaticFileHandler, {'path': os.path.join(os.path.dirname(__file__), "../../Site/CSS")}), (r"/CSS/(.*)", tornado.web.StaticFileHandler, {'path': os.path.join(os.path.dirname(__file__), "../../Site/CSS")}),
(r"/JS/(.*)", tornado.web.StaticFileHandler, {'path': os.path.join(os.path.dirname(__file__), "../../Site/JS")})] (r"/JS/(.*)", tornado.web.StaticFileHandler, {'path': os.path.join(os.path.dirname(__file__), "../../Site/JS")}),
(r"/assets/(.*)", tornado.web.StaticFileHandler, {'path': os.path.join(os.path.dirname(__file__), "../../Site/assets")})]
settings = dict( settings = dict(
template_path=os.path.join(os.path.dirname(__file__), "../../Site") template_path=os.path.join(os.path.dirname(__file__), "../../Site")

35
Site/CSS/Main.css
View File

@@ -1,16 +1,41 @@
body{ body {
background: #212121; background: #212121;
} }
.nav{
.nav {
background: #343334; background: #343334;
box-shadow: 0 8px 5px #383838; box-shadow: 0 3px 5px #343334;
} }
.nav > a{
.nav > a, .sidenav a {
color: whitesmoke; color: whitesmoke;
font-family:Verdana; font-family:Verdana;
font-weight: 500; font-weight: 500;
} }
.nav > a:hover{
.nav > a:hover, .sidenav a:hover {
color: #17a2b8; color: #17a2b8;
} }
.sidenav {
height: 100%;
width: 80px;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: #111;
overflow-x: hidden;
padding-top: 20px;
box-shadow: 3px 0px 5px #111;
}
.main {
margin-left: 80px;
}
#logo {
width: 100%;
height: 80px;
}

45
Site/Index.html
View File

@@ -1,28 +1,23 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Chameleon Vision</title> <title>Chameleon Vision</title>
<link rel="stylesheet" type="text/css" href="CSS/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="CSS/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="CSS/Main.css" > <link rel="stylesheet" type="text/css" href="CSS/main.css" >
</head> </head>
<body> <body>
<div> <div class="sidenav">
<nav class="nav"> <a href="#"><img id="logo" src="assets/logo.png"></a>
<a class="nav-link active" href="#">Input</a> </div>
<a class="nav-link" href="#">Filter</a> <div class="main">
<a class="nav-link" href="#">Thresholds</a> <nav class="nav">
<a class="nav-link" href="#">3D</a> <a class="nav-link active" href="#">Input</a>
</nav> <a class="nav-link" href="#">Filter</a>
</div> <a class="nav-link" href="#">Thresholds</a>
<script> <a class="nav-link" href="#">3D</a>
var ws = new WebSocket("ws://localhost:8888/websocket"); </nav>
ws.onopen = function () { </div>
ws.send("hello"); <script src="JS/main.js"></script>
} </body>
ws.onmessage = function (ev) {
alert(ev.data);
}
</script>
</body>
</html> </html>

7
Site/JS/main.js Normal file
View File

@@ -0,0 +1,7 @@
let ws = new WebSocket("ws://localhost:8888/websocket");
ws.onopen = function () {
ws.send("hello");
}
ws.onmessage = function (ev) {
alert(ev.data);
}

BIN
Site/assets/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB