Skip to content

Commit

Permalink
modified: .gitignore
Browse files Browse the repository at this point in the history 
	modified:   crypto.js
	modified:   index.js
	new file:   public/utils.ejs -- function for unix-timestamp to local timestamp
	modified:   views/pages/weatherbit.ejs
  • Loading branch information
@aesclever
aesclever committed Oct 8, 2022
1 parent 3dac0a4 commit 9da8ff4
Show file tree
Hide file tree
Showing 5 changed files with 95 additions and 55 deletions.
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,5 @@ node_modules
public/ePub
views/header2.ejs
index-temp.ejs
utils.js
public/AirQIdx_Guide.png
17 changes: 16 additions & 1 deletion crypto.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,21 @@ const decrypt = (data) => {
return CryptoJS.enc.Base64.parse(data).toString(CryptoJS.enc.Utf8);
};

const toLocalDt = (unix_ts) => {
// Create a new JavaScript Date object based on the timestamp
// multiplied by 1000 so that the argument is in milliseconds, not seconds.
var date = new Date(unix_ts * 1000);
// Hours part from the timestamp
var hours = date.getHours();
// Minutes part from the timestamp
var minutes = "0" + date.getMinutes();
// Seconds part from the timestamp
var seconds = "0" + date.getSeconds();

// Will display time in 10:30:23 format
return hours + ':' + minutes.substr(-2) + ':' + seconds.substr(-2);
}

function test() {
let enStr = encrypt("e88e1a8096cd4897b79b230a9c49b243");
console.log("Encrypted Key: " + enStr);
Expand All @@ -16,4 +31,4 @@ function test() {
}

// test();
export {encrypt, decrypt};
export {encrypt, decrypt, toLocalDt};
5 changes: 3 additions & 2 deletions index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@ dotenv.config()
import request from 'request';
import express from 'express';
import bodyParser from 'body-parser';
import {encrypt, decrypt} from './crypto.js'
import {encrypt, decrypt} from './crypto.js';


// Create network routing
const app = express();
Expand Down Expand Up @@ -31,7 +32,7 @@ app.get('/weatherbit', (req, res) => {
// console.dir(req.params)
// console.dir(req.body);
let apikey = encrypt(process.env.WEATHERBIT_KEY);
res.render('pages/weatherbit', { key: apikey});
res.render('pages/weatherbit', { key: apikey });
})

// Posting data to the client-side requires two API calls.
Expand Down
18 changes: 18 additions & 0 deletions public/utils.ejs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<%
unixTsToLocalTime = (unix_ts) => {
// Create a new JavaScript Date object based on the timestamp
// multiplied by 1000 so that the argument is in milliseconds, not seconds.
var date = new Date(unix_ts * 1000);
// Hours part from the timestamp
var hours = date.getHours();
// Minutes part from the timestamp
var minutes = "0" + date.getMinutes();
// Seconds part from the timestamp
var seconds = "0" + date.getSeconds();
// Will display time in 10:30:23 format
return hours + ':' + minutes.substr(-2) + ':' + seconds.substr(-2);
}
%>
108 changes: 56 additions & 52 deletions views/pages/weatherbit.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,14 @@

<head>
<%- include('./../partials/head'); %>
<%- include ('./../../public/utils'); %>
</head>

<body class="container">
<header>
<%- include('./../partials/header'); %>
</header>
<main>
<main onload="">
<br />
<div>
<fieldset>
Expand All @@ -27,7 +28,7 @@
<div class="row">
<div class="col-sm-6">
<h5>Current Conditions</h5>
<div class="jumbotron jumbotron-fluid">
<div class="jumbotron jumbotron-fluid" style="padding:10px 5px 15px 20px;">
<% if( typeof(error)==="undefined" || curStatus===400 ){ %>
<p style="color:gray"> Waiting for data.</p>
<% } else { %>
Expand Down Expand Up @@ -62,7 +63,7 @@
<%= curData.app_temp %>
</td>
</tr>
<th>Relative humidity (%): </th>
<th>Relative humidity(%): </th>
<td>
<%= curData.rh %>
</td>
Expand All @@ -84,12 +85,7 @@
</tr>
<th>Wind Speed(m/s): </th>
<td>
<%= curData.wind_spd %>
</td>
</tr>
<th>Wind Direction: </th>
<td>
<%= curData.wind_cdir_full %>
<%= curData.wind_spd %> <%= curData.wind_cdir_full %>
</td>
</tr>
<th>Snowfall(mm/hr): </th>
Expand Down Expand Up @@ -121,27 +117,38 @@
<% } %>
</div>
<br />
</div>



<div class="col-sm-6">
<h5>Current Air Quality</h5>
<div class="jumbotron jumbotron-fluid">
<div class="jumbotron jumbotron-fluid" style="padding:10px 5px 15px 20px;">
<% if( typeof(error)==="undefined" || airqStatus===400 ) { %>
<p style="color:gray"> Waiting for data.</p>
<% } else { %>
<p style="color:gray"><strong>Local hourly</strong>: <%= airqData.timestamp_local.split('T')[1] %>
<br />
</p>
<hr />
<table class="styled-table">
<tr>
<th>Air Quality Index: </th>
<td>
<%= airqData.aqi %>
</td>
<% if (airqData.aqi <= 50) { %>
<td style="color:green;"> <%= airqData.aqi %> (Good)</td>
<% } else if (airqData.api >= 51 && airqData.api <= 100) { %>
<td style="color:yellow;"> <%= airqData.aqi %> (Moderate)</td>
<% } else if (airqData.api >= 101 && airqData.api <= 150) { %>
<td style="color:brown;"> <%= airqData.aqi %> (Sensitive to Alergy)</td>
<% } else if (airqData.api >= 151 && airqData.api <= 200) { %>
<td style="color:red;"> <%= airqData.aqi %> (Unhealthy)</td>
<% } else if (airqData.api >= 201 && airqData.api <= 300) { %>
<td style="color:purple;"> <%= airqData.aqi %> (Very unhealthy)</td>
<% } else if (airqData.api >= 301) { %>
<td style="color:rgb(50, 6, 6);"> <%= airqData.aqi %> (Hazardous)</td>
<% } %>
</tr>
<tr>
<th>O3 Concentration(µg/m³): </th>
Expand Down Expand Up @@ -190,76 +197,70 @@
<div class="row">
<div class="col-sm-12">
<h5>Extended Forecast</h5>
<div class="jumbotron jumbotron-fluid">
<div class="jumbotron jumbotron-fluid" style="padding:10px 5px 15px 20px;">
<% if( typeof(error)==="undefined" || foreStatus===400 ){ %>
<p style="color:gray"> Waiting for data.</p>
<% } else { %>
<table class="styled-table">
<thead>
<tr class="w-35">
<th>Date</th>
<th>Condition</th>
<th>Max/Min Temperature</th>
<th>Temperature(F)</th>
<th>Pressure</th>
<th>Humidity</th>
<th>Wind Gust</th>
<th>Wind Speed</th>
<th>Wind Direction</th>
<th>Cloud Cover</th>
<th>Visibility</th>
<th>UV Index</th>
<th>Sunrise/Sunset</th>
<th>Moonphase</th>
<th style="color:black;"> Date</th>
<th style="color:rgb(27, 142, 191);"> Condition</th>
<th style="color:rgb(41, 27, 191);"> Max/Min Temperature(°F)</th>
<th style="color:rgb(27, 119, 223);"> Temperature(°F) </th>
<th style="color:rgba(20, 15, 177, 0.474);"> Pressure(㎧)</th>
<th style="color:green;"> Humidity</th>
<th style="color:rgb(198, 73, 15);"> Wind Speed</th>
<th style="color:rgb(198, 15, 195);"> Wind Gust</th>
<th style="color:rgb(15, 22, 207);"> Cloud Cover(%)</th>
<th style="color:rgb(30, 140, 224);"> Visibility</th>
<th style="color:rgb(78, 122, 80);"> UV Index</th>
<th style="color:rgb(165, 58, 58);"> Sunrise/Sunset</th>
<th style="color:rgb(32, 24, 24);"> Moonphase</th>
</tr>
</thead>
<% let forecast=foreData.data; %>
<% for (let i=0; i < forecast.length; i++) { %>
<tbody>
<tr class="active-row">
<td>
<td style="color:black;">
<%= forecast[i].datetime %>
</td>
<td>
<td style="color:rgb(27, 142, 191);">
<%= forecast[i].weather.description %>
</td>
<td>
<%= forecast[i].app_max_temp %> , <%= forecast[i].app_min_temp %>
<td style="color:rgb(41, 27, 191);">
<%= forecast[i].app_max_temp %>/<%= forecast[i].app_min_temp %>
</td>
<td>
<td style="color:rgb(27, 119, 223);">
<%= forecast[i].temp %>
</td>
<td>
<%= forecast[i].slp %>
<td style="color:rgb(15, 22, 207);">
<%= forecast[i].pres %>
</td>
<td>
<td style="color:green;">
<%= forecast[i].rh %>
</td>
<td>
<%= forecast[i].windgust %>
</td>
<td>
<%= forecast[i].wind_spd %>
</td>
<td>
<td style="color:rgb(198, 73, 15);">
<%= forecast[i].wind_gust_spd %>
</td>
<td>
<%= forecast[i].wind_cdir_full %>
<td style="color:rgb(198, 15, 195);">
<%= forecast[i].wind_gust_spd %> <%= forecast[i].wind_cdir %>
</td>
<td>
<td style="color:rgb(15, 22, 207);">
<%= forecast[i].clouds %>
</td>
<td>
<td style="color:rgb(30, 140, 224);">
<%= forecast[i].vis %>
</td>
<td>
<td style="color:rgb(78, 122, 80);">
<%= forecast[i].uv %>
</td>
<td>
<%= forecast[i].sunrise_ts %> , <%= forecast[i].sunset_ts %>
<td style="color:rgb(165, 58, 58);">
<%= unixTsToLocalTime(forecast[i].sunrise_ts) %> / <%= unixTsToLocalTime(forecast[i].sunset_ts) %>
</td>
<td>
<td style="color:rgb(32, 24, 24);">
<%= forecast[i].moon_phase_lunation %>
</td>
</tr>
Expand All @@ -274,6 +275,9 @@
<% let longi, lati = "" %>
<script>
let longi, lati = "";
function getGeoLocation() {
// Store the element where the page displays the result
Expand Down

0 comments on commit 9da8ff4

Please sign in to comment.