max/icl-iot-weather
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
Max 2020-10-21 11:25:13 +01:00
parent 406ee88938
commit f7e607f06e
6 changed files with 114 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
site/views/404.ejs
View File

File diff suppressed because one or more lines are too long

69
site/views/css/style.css
View File

@ -1,17 +1,62 @@
* {
margin: 0;
padding: 0;
text-decoration: none;
}
@font-face{
font-family: os;
src: url(../fonts/ops.ttf);
}
@font-face{
font-family: osl;
src: url(../fonts/opsl.ttf);
}
:root {
--background: whitesmoke;
}
body {
background: var(--background);
margin-left: auto;
margin-right: auto;
font-family: os;
/* max-width: 1200px; */
padding: 1rem;
}
.container {
background-color: dodgerblue;
color: white;
padding: 1rem;
height: 400px;
}
.containers {
max-width: 1300px;
margin: 0 auto;
display: grid;
grid-gap: 1rem;
}
.chart {
height: 400px;
}
@media (min-width: 900px) {
.containers { grid-template-columns: repeat(2, 1fr); }
}
@media only screen and (max-device-width: 480px) {
.containers { grid-template-columns: repeat(1, 1fr); }
}
main svg {
position: relative;
left: 50%;
transform: translate(-50%);
}
footer {
position: absolute;
left: 0;
right: 0;
bottom: 0;
background-color: #D8D8D8;
text-align: center;
height: 50px;
font-size: 25px;
padding-top: 5px;
}

BIN
site/views/fonts/ops.ttf Normal file
View File

Binary file not shown.

BIN
site/views/fonts/opsl.ttf Normal file
View File

Binary file not shown.

72
site/views/index.ejs
View File

@ -1,19 +1,57 @@
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<script src="https://www.gstatic.com/firebasejs/7.24.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.24.0/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.24.0/firebase-firestore.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="temp_chart"></div>
<div id="humidity_chart"></div>
<div id="wind_chart"></div>
<div id="rain_chart"></div>
<div id="cloud_chart"></div>
<script defer src="js/main.js"></script>
<script src="js/fInit.js"></script>
</body>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script src="https://www.gstatic.com/firebasejs/7.24.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.24.0/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.24.0/firebase-firestore.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>IoT plant watering project</title>
<base href="https://weather.maxhunt.design/" target="_blank">
</head>
<body>
<div class="containers">
<div class="container">ONE</div>
<div class="container">TWO</div>
<div class="container chart_container">
<div id="temp_chart" class="chart"></div>
</div>
<div class="container chart_container">
<div id="humidity_chart" class="chart"></div>
</div>
<div class="container chart_container">
<div id="wind_chart" class="chart"></div>
</div>
<div class="container chart_container">
<div id="rain_chart" class="chart"></div>
</div>
<div class="container chart_container">
<div id="cloud_chart" class="chart"></div>
</div>
<div class="container">EIGHT</div>
<div class="container">NINE</div>
<div class="container">TEN</div>
<div class="container">ELEVEN</div>
<div class="container">TWELVE</div>
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<script defer src="js/main.js"></script>
<script src="js/fInit.js"></script>
</body>
</html>

30
site/views/js/main.js
View File

@ -99,7 +99,7 @@ function createGraph_2() {
}
plot_graphs();
// plot_graphs();
@ -121,31 +121,3 @@ plot_graphs();
// })
// }
// })
// function draw_temp_graph() {
// var trace = {
// type: 'line',
// y: temperatures,
// x: formatted_datetimes,
// text: "Air temperature",
// marker: { color: '#00FFFF', line: {width: 5}}
// }
// var data = [trace]
// var layout = {
// title: 'Air temperature',
// font: { size: 15, color: '#AAAAAA' },
// paper_bgcolor: '#111111',
// plot_bgcolor: '#111111',
// title: {text: "Air tempereature",font: {color: '#FFFFFF'}},
// xaxis: {title: {text: 'Date',font: {color: '#FFFFFF'}}},
// yaxis: {title: {text: 'Temperature in ºC',font: {color: '#FFFFFF'}}}
// }
// var config = { responsive: true, scrollZoom: true, displaylogo: false}
// Plotly.newPlot('temp_chart', data, layout, config)
// }