wmantly/mp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #34 from Newtbot/Dev-branch

Browse Source 
ejs templating
This commit is contained in:
noot 2024-01-19 03:23:33 +08:00 committed by GitHub
commit 35040df1ed
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
15 changed files with 608 additions and 695 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
consumerWebsite/database/model/apiKeyModel.js
View File

@ -45,7 +45,7 @@ const apikeyModel = sequelize.define(
validate: { validate: {
notEmpty: true, notEmpty: true,
len: [1, 255], len: [1, 255],
isIn: [["canRead", "canWrite"]], isIn: [["canRead", "canWrite" , "auto-generated"]],
}, },
}, },
createdAt: { createdAt: {
@ -63,3 +63,46 @@ const apikeyModel = sequelize.define(
); );
module.exports = { apikeyModel }; module.exports = { apikeyModel };
/*
class AuthToken extends Model {
check(){
// check expires_on date
return this.is_valid;
}
}
AuthToken.init({
token:{
type: DataTypes.UUID,
defaultValue: DataTypes.UUIDV4,
allowNull: false,
primaryKey: true
},
expires_on: {
type: DataTypes.DATE,
allowNull: true,
validate:{
isDate:true
}
},
username: {
type: DataTypes.STRING,
ldapModel: 'User',
allowNull: false,
validate:{
notNull: true,
},
},
is_valid: {
type: DataTypes.BOOLEAN,
defaultValue: true
}
}, {
sequelize,
modelName: 'AuthToken',
});
*/

0
consumerWebsite/middleware/authChecker.js Normal file
View File

20
consumerWebsite/modules/app.js
View File

@ -1,20 +1,23 @@
const express = require("express"); const express = require("express");
const helmet = require("helmet");
const path = require("path"); const path = require("path");
const app = express(); const app = express();
const port = 80; const port = 3000;
const ejs = require("ejs");
const bodyParser = require('body-parser'); // Middleware const bodyParser = require("body-parser"); // Middleware
app.use(bodyParser.urlencoded({ extended: false })); app.use(bodyParser.urlencoded({ extended: false }));
app.use(helmet());
//disable x-powered-by header for security reasons
app.disable("x-powered-by");
app.use(express.json()); app.use(express.json());
app.set("json spaces", 2); app.set("json spaces", 2);
//public folder with path to static files // Set up the templating engine to build HTML for the front end.
app.set("views", path.join(__dirname, "../views"));
app.set("view engine", "ejs");
// Have express server static content( images, CSS, browser JS) from the public
// local folder.
app.use(express.static(path.join(__dirname, "../public"))); app.use(express.static(path.join(__dirname, "../public")));
//middleware logic ( called by next() ) //middleware logic ( called by next() )
@ -23,6 +26,9 @@ app.use(express.static(path.join(__dirname, "../public")));
//route logic //route logic
app.use("/api/v0", require("../routes/api_routes")); //consumerWebsite\routes\api_routes.js app.use("/api/v0", require("../routes/api_routes")); //consumerWebsite\routes\api_routes.js
//render logic
app.use("/", require("../routes/render")); //consumerWebsite\routes\render.js
// Catch 404 and forward to error handler. If none of the above routes are // Catch 404 and forward to error handler. If none of the above routes are
// used, this is what will be called. // used, this is what will be called.
app.use(function (req, res, next) { app.use(function (req, res, next) {

174
consumerWebsite/public/404.html
View File

@ -1,174 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Fontawesome CSS -->
<link href="css/all.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-light top-nav fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">
<img src="images/logo.png" alt="logo" />
</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false"
aria-label="Toggle navigation">
<span class="fas fa-bars"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link active" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="news.html">News</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
<li class="nav-item">
<!--<img src="images/profile-logo.png" alt="Profile Logo" class="profile-logo"> -->
<a class="nav-link" href="profile.html">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="signuplogin.html">Logout</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- full Title -->
<div class="full-title">
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">404
<small>Page Not Found</small>
</h1>
</div>
</div>
<!-- Page Content -->
<div class="container">
<div class="breadcrumb-main">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Home</a>
</li>
<li class="breadcrumb-item active">404</li>
</ol>
</div>
<div class="error-contents">
<h3>Oops! That page can’t be found.</h3>
<div class="error-img">
<img class="img-fluid" src="images/404.png" alt="" />
</div>
<p>We can’t find the page your are looking for. You can check out our <a href="#">Homepage</a>.</p>
<a class="btn btn-primary" href="index.html"> Back To Homepage </a>
</div>
<!-- /.jumbotron -->
</div>
<!-- /.container -->
<!--footer starts from here-->
<footer class="footer">
<div class="container bottom_border">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Find us</h5>
<!--headin5_amrc-->
<p><i class="fa fa-location-arrow"></i> Blk 645 Jalan Tenaga</p>
<p><i class="fa fa-phone"></i> +65 90064959</p>
<p><i class="fa fa fa-envelope"></i> Leongdingxuan@gmail.com </p>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Follow us</h5>
<!--headin5_amrc ends here-->
<ul class="footer_ul2_amrc">
<li>
<a href="#"><i class="fab fa-facebook-f fleft padding-right"></i> </a>
<a href="#">https://www.facebook.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-instagram fleft padding-right"></i> </a>
<a href="#">https://www.instagram.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a>
<a href="#">https://twitter.com/</a></p>
</li>
</ul>
<!--footer_ul2_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li><a href="#">Home</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Contact</a></li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6 ">
<h5 class="headin5_amrc col_white_amrc pt2">News</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore's air quality ...</p>
<span>7 oct 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore Government ...</p>
<span>29 Sep 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>High risk of severe ...</p>
<span>22 Jun 2023</span>
</div>
</ul>
</div>
</div>
</div>
<div class="container text-center">
<br>
<p>All Rights Reserved. &copy; 2023 <a href="#">EcoSaver</a>
</p>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>

260
consumerWebsite/public/index.html
View File

@ -1,260 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>EcoSaver</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Fontawesome CSS -->
<link href="css/all.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-light top-nav fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">
<img src="images/logo.png" alt="logo" />
</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false"
aria-label="Toggle navigation">
<span class="fas fa-bars"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link active" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="news.html">News</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contactform.html">Contact</a>
</li>
<li class="nav-item">
<!--<img src="images/profile-logo.png" alt="Profile Logo" class="profile-logo"> -->
<a class="nav-link" href="profile.html">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="signuplogin.html">Logout</a>
</li>
</ul>
</div>
</div>
</nav>
<header class="slider-main">
<div id="carouselExampleIndicators" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<!-- Slide One - Set the background image for this slide in the line below -->
<div class="carousel-item active" style="background-image: url('images/slider-01.jpg')">
<div class="carousel-caption d-none d-md-block">
<h3>Welcome to EcoSaver</h3>
<p>The current airviro system in used by NEA only has 14 substations to record air quality. Our
project aims to supplement data to NEA and also allow the general consumer to access our IoT sensor
data through a web service.</p>
</div>
</div>
<!-- Slide Two - Set the background image for this slide in the line below -->
<div class="carousel-item" style="background-image: url('images/slider-02.jpg')">
<div class="carousel-caption d-none d-md-block">
<h3>Fresh Air</h3>
<p>A Great day for jogging</p>
</div>
</div>
<!-- Slide Three - Set the background image for this slide in the line below -->
<div class="carousel-item" style="background-image: url('images/slider-03.jpg')">
<div class="carousel-caption d-none d-md-block">
<h3>Welcome to EcoSaver</h3>
<p>Hope you enjoy!</p>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</header>
<!-- Page Content -->
<div class="container">
<div class="services-bar">
<h1 class="my-4">Services </h1>
<!-- Services Section -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card">
<h4 class="card-header">Humidity</h4>
<div class="card-body text-center">
<p class="card-text display-4"> 70% - 75% </p>
</div>
<div class="card-footer">
<a href="learnmore.html" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<h4 class="card-header">Air Quality Index</h4>
<div class="card-body text-center">
<p class="card-text display-4"> 15 - 18 PSI </p>
</div>
<div class="card-footer">
<a href="learnmore.html" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<h4 class="card-header">Temperature</h4>
<div class="card-body text-center">
<p class="card-text display-4"> 30&deg; - 37&deg; </p>
</div>
<div class="card-footer">
<a href="learnmore.html" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- About Section -->
<div class="about-main">
<div class="row">
<div class="col-lg-6">
<title>EcoSaver - Your Air Quality Index Source</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>Welcome to EcoSaver - Your Air Quality Index Source</h1>
<p>We prioritize your well-being by providing up-to-date information on air quality indexes.</p>
</header>
<section class="approach">
<h2>Our Approach: Smart and Informative</h2>
<p>We believe in offering precise and comprehensive data to empower your decisions for a better
quality of life.</p>
<ul>
<li>Presenting real-time air quality data in a user-friendly format.</li>
<li>Equipping you with insights into the impact of air quality on health and the environment.
</li>
<li>Empowering communities with knowledge to make informed choices for a sustainable future.
</li>
</ul>
</section>
</div>
<div class="col-lg-6">
<img class="img-fluid rounded" src="images/about-img.jpg" alt="" />
</div>
</div>
</div>
</div>
<hr>
</div>
<!--footer starts from here-->
<footer class="footer">
<div class="container bottom_border">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Find us</h5>
<!--headin5_amrc-->
<p><i class="fa fa-location-arrow"></i> Blk 645 Jalan Tenaga</p>
<p><i class="fa fa-phone"></i> +65 90064959</p>
<p><i class="fa fa fa-envelope"></i> Leongdingxuan@gmail.com </p>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Follow us</h5>
<!--headin5_amrc ends here-->
<ul class="footer_ul2_amrc">
<li>
<a href="#"><i class="fab fa-facebook-f fleft padding-right"></i> </a>
<a href="#">https://www.facebook.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-instagram fleft padding-right"></i> </a>
<a href="#">https://www.instagram.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a>
<a href="#">https://twitter.com/</a></p>
</li>
</ul>
<!--footer_ul2_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li><a href="#">Home</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Contact</a></li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6 ">
<h5 class="headin5_amrc col_white_amrc pt2">News</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore's air quality ...</p>
<span>7 oct 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore Government ...</p>
<span>29 Sep 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>High risk of severe ...</p>
<span>22 Jun 2023</span>
</div>
</ul>
</div>
</div>
</div>
<div class="container text-center">
<br>
<p>All Rights Reserved. &copy; 2023 <a href="#">EcoSaver</a>
</p>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>

3
consumerWebsite/public/js/jquery.js → consumerWebsite/public/js/app.js
View File

@ -1,6 +1,6 @@
var app = {}; var app = {};
/*
app.api = (function(app){ app.api = (function(app){
var baseURL = '/api/v0/' var baseURL = '/api/v0/'
@ -85,7 +85,6 @@ app.api = (function(app){
return {post: post, get: get, put: put, delete: remove} return {post: post, get: get, put: put, delete: remove}
})(app) })(app)
*/
app.auth = (function(app) { app.auth = (function(app) {
var user = {} var user = {}

7
consumerWebsite/public/js/contact.js
View File

@ -1,11 +1,11 @@
const newAccessKey = '7f7ce777-6a56-4e5e-bfac-3b83c6453e65'; require('dotenv').config({ path: path.resolve(__dirname, '../../../.env') })
//const newAccessKey = process.env.ACCESS_KEY;
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const form = document.getElementById('form'); const form = document.getElementById('form');
// Set the new value for the access_key input field // Set the new value for the access_key input field
form.querySelector('input[name="access_key"]').value = newAccessKey; form.querySelector('input[name="access_key"]').value = process.env.emailKey;
form.addEventListener('submit', async (event) => { form.addEventListener('submit', async (event) => {
event.preventDefault(); // Prevent default form submission event.preventDefault(); // Prevent default form submission
@ -41,3 +41,4 @@ document.addEventListener('DOMContentLoaded', () => {
} }
}); });
}); });

247
consumerWebsite/public/news.html
View File

@ -1,247 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>N & LW Lawn Care - Landscaping Bootstrap4 HTML5 Responsive Template </title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Fontawesome CSS -->
<link href="css/all.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-light top-nav fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">
<img src="images/logo.png" alt="logo" />
</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false"
aria-label="Toggle navigation">
<span class="fas fa-bars"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="news.html">News</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contactform.html">Contact</a>
</li>
<li class="nav-item">
<a class="nav-link" href="profile.html">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="signuplogin.html">Logout</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- full Title -->
<div class="full-title">
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">News
<!--<small>Subheading</small> -->
</h1>
</div>
</div>
<!-- Page Content -->
<div class="container">
<div class="breadcrumb-main">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Home</a>
</li>
<li class="breadcrumb-item active">News</li>
</ol>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-8 blog-entries">
<div class="card mb-4">
<img class="card-img-top" src="images/newspic.jpg" alt="Card image Blog" />
<div class="card-body">
<h2 class="card-title">Singapore's air quality hits unhealthy range, 'slightly hazy' conditions
forecast for Saturday</h2>
<p class="card-text">he National Environment Agency said there has been a "significant increase"
in the number of hotspots in Sumatra.</p>
<a href="https://www.channelnewsasia.com/singapore/haze-psi-unhealthy-range-daily-advisory-pm-2-5-indonesia-hotspot-fires-nea-3827106"
class="btn btn-primary">Read More &rarr;</a>
</div>
<div class="card-footer text-muted">
Posted on October 6, 2023 by
<a href="https://www.channelnewsasia.com/">CNA</a>
</div>
</div>
<div class="card mb-4">
<img class="card-img-top" src="images/newspic.jpg" alt="Card image Blog">
<div class="card-body">
<h2 class="card-title">Singapore Government Agencies Stand Ready To Mitigate Impact Of Haze</h2>
<p class="card-text">As of 29 September 2023, 3pm, the 24-hr Pollutant Standards Index (PSI) is
81 (Moderate range) in the East region of Singapore. Accordingly, the 28 public agencies
that make up the Government’s Haze Task Force (HTF), are ready to roll out their respective
haze action plans should the air quality deteriorate into the Unhealthy range (24-hour PSI
above 100). </p>
<a href="https://www.nea.gov.sg/media/news/news/index/singapore-government-agencies-stand-ready-to-mitigate-impact-of-haze"
class="btn btn-primary">Read More &rarr;</a>
</div>
<div class="card-footer text-muted">
Posted on September 29, 2023 by
<a href="https://www.nea.gov.sg/">NEA</a>
</div>
</div>
<div class="card mb-4">
<img class="card-img-top" src="images/newspic.jpg" alt="Card image Blog">
<div class="card-body">
<h2 class="card-title">High risk of severe transboundary haze in 2023, public advised to be
prepared: Singapore institute</h2>
<p class="card-text">A latest report predicts a high risk of severe haze occurring in Southeast
Asia, though not as severe as in 2015</p>
<a href="https://www.channelnewsasia.com/singapore/high-risk-severe-transboundary-haze-2023-public-advised-be-prepared-singapore-institute-3579081"
class="btn btn-primary">Read More &rarr;</a>
</div>
<div class="card-footer text-muted">
Posted on June 22, 2023 by
<a href="https://www.channelnewsasia.com/">CNA</a>
</div>
</div>
<div class="pagination_bar_arrow">
<ul class="pagination justify-content-center mb-4">
<li class="page-item">
<a class="page-link" href="#">&larr; Older</a>
</li>
<li class="page-item">
<a class="page-link" href="#">Newer &rarr;</a>
</li>
</ul>
</div>
</div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4 blog-right-side">
<div class="card mb-4">
<h5 class="card-header">Search</h5>
<div class="card-body">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search for...">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Go!</button>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!--footer starts from here-->
<footer class="footer">
<div class="container bottom_border">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Find us</h5>
<p><i class="fa fa-location-arrow"></i> Blk 645 Jalan Tenaga</p>
<p><i class="fa fa-phone"></i> +65 90064959</p>
<p><i class="fa fa fa-envelope"></i> Leongdingxuan@gmail.com </p>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Follow us</h5>
<!--headin5_amrc ends here-->
<ul class="footer_ul2_amrc">
<li>
<a href="#"><i class="fab fa-facebook-f fleft padding-right"></i> </a>
<a href="#">https://www.facebook.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-instagram fleft padding-right"></i> </a>
<a href="#">https://www.instagram.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a>
<a href="#">https://twitter.com/</a></p>
</li>
</ul>
<!--footer_ul2_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li><a href="#">Home</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Contact</a></li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6 ">
<h5 class="headin5_amrc col_white_amrc pt2">News</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore's air quality ...</p>
<span>7 oct 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore Government ...</p>
<span>29 Sep 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>High risk of severe ...</p>
<span>22 Jun 2023</span>
</div>
</ul>
</div>
</div>
</div>
<div class="container text-center">
<br>
<p>All Rights Reserved. &copy; 2023 <a href="#">EcoSaver</a>
</p>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>

60
consumerWebsite/routes/render.js Normal file
View File

@ -0,0 +1,60 @@
/*
'use strict';
var router = require('express').Router();
const conf = require('../conf')
const values ={
title: conf.environment !== 'production' ? `<i class="fa-brands fa-dev"></i>` : ''
}
router.get('/', async function(req, res, next) {
res.render('runner', {...values});
});
router.get('/topics', function(req, res, next) {
res.render('topics', {...values});
});
router.get('/chat', function(req, res, next) {
res.render('chat', {...values});
});
router.get('/login*', function(req, res, next) {
res.render('login', {redirect: req.query.redirect, ...values});
});
router.get('/runner', function(req, res, next) {
res.render('runner', {...values});
});
router.get('/worker', function(req, res, next) {
res.render('worker', {...values});
});
module.exports = router;
*/
'use strict';
var router = require('express').Router();
//landing page of index
router.get('/', function(req, res, next) {
res.render('index');
});
//news page
router.get('/news', function(req, res, next) {
res.render('news');
});
//404 page
router.get('*', function(req, res, next) {
res.render('404');
});
module.exports = router;

37
consumerWebsite/views/404.ejs Normal file
View File

@ -0,0 +1,37 @@
<%- include('top') %>
<!-- full Title -->
<div class="full-title">
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">404
<small>Page Not Found</small>
</h1>
</div>
</div>
<!-- Page Content -->
<div class="container">
<div class="breadcrumb-main">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="/">Home</a>
</li>
<li class="breadcrumb-item active">404</li>
</ol>
</div>
<div class="error-contents">
<h3>Oops! That page can’t be found.</h3>
<div class="error-img">
<img class="img-fluid" src="images/404.png" alt="" />
</div>
<p>We can’t find the page your are looking for. You can check out our <a href="/">Homepage</a>.</p>
<a class="btn btn-primary" href="/"> Back To Homepage </a>
</div>
<!-- /.jumbotron -->
</div>
<!-- /.container -->
<%- include('bot') %>

88
consumerWebsite/views/bot.ejs Normal file
View File

@ -0,0 +1,88 @@
<!--footer starts from here-->
<footer class="footer">
<div class="container bottom_border">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Find us</h5>
<!--headin5_amrc-->
<p><i class="fa fa-location-arrow"></i> Blk 645 Jalan Tenaga</p>
<p><i class="fa fa-phone"></i> +65 90064959</p>
<p><i class="fa fa fa-envelope"></i> Leongdingxuan@gmail.com </p>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Follow us</h5>
<!--headin5_amrc ends here-->
<ul class="footer_ul2_amrc">
<li>
<a href="#"><i class="fab fa-facebook-f fleft padding-right"></i> </a>
<a href="#">https://www.facebook.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-instagram fleft padding-right"></i> </a>
<a href="#">https://www.instagram.com/</a></p>
</li>
<li>
<a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a>
<a href="#">https://twitter.com/</a></p>
</li>
</ul>
<!--footer_ul2_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li><a href="/">Home</a></li>
<li><a href="/news">News</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class="col-lg-3 col-md-6 col-sm-6 ">
<h5 class="headin5_amrc col_white_amrc pt2">News</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore's air quality ...</p>
<span>7 oct 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>Singapore Government ...</p>
<span>29 Sep 2023</span>
</div>
</ul>
<ul class="footer_ul_amrc">
<li class="media">
<div class="media-left">
<img class="img-fluid" src="images/post-img-01.jpg" alt="" />
</div>
<div class="media-body">
<p>High risk of severe ...</p>
<span>22 Jun 2023</span>
</div>
</ul>
</div>
</div>
</div>
<div class="container text-center">
<br>
<p>All Rights Reserved. &copy; 2023 <a href="/">EcoSaver</a>
</p>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>

124
consumerWebsite/views/index.ejs Normal file
View File

@ -0,0 +1,124 @@
<%- include('top') %>
<header class="slider-main">
<div id="carouselExampleIndicators" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<!-- Slide One - Set the background image for this slide in the line below -->
<div class="carousel-item active" style="background-image: url('images/slider-01.jpg')">
<div class="carousel-caption d-none d-md-block">
<h3>Welcome to EcoSaver</h3>
<p>The current airviro system in used by NEA only has 14 substations to record air quality. Our
project aims to supplement data to NEA and also allow the general consumer to access our IoT sensor
data through a web service.</p>
</div>
</div>
<!-- Slide Two - Set the background image for this slide in the line below -->
<div class="carousel-item" style="background-image: url('images/slider-02.jpg')">
<div class="carousel-caption d-none d-md-block">
<h3>Fresh Air</h3>
<p>A Great day for jogging</p>
</div>
</div>
<!-- Slide Three - Set the background image for this slide in the line below -->
<div class="carousel-item" style="background-image: url('images/slider-03.jpg')">
<div class="carousel-caption d-none d-md-block">
<h3>Welcome to EcoSaver</h3>
<p>Hope you enjoy!</p>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</header>
<!-- Page Content -->
<div class="container">
<div class="services-bar">
<h1 class="my-4">Services </h1>
<!-- Services Section -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card">
<h4 class="card-header">Humidity</h4>
<div class="card-body text-center">
<p class="card-text display-4"> 70% - 75% </p>
</div>
<div class="card-footer">
<a href="learnmore.html" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<h4 class="card-header">Air Quality Index</h4>
<div class="card-body text-center">
<p class="card-text display-4"> 15 - 18 PSI </p>
</div>
<div class="card-footer">
<a href="learnmore.html" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<h4 class="card-header">Temperature</h4>
<div class="card-body text-center">
<p class="card-text display-4"> 30&deg; - 37&deg; </p>
</div>
<div class="card-footer">
<a href="learnmore.html" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- About Section -->
<div class="about-main">
<div class="row">
<div class="col-lg-6">
<title>EcoSaver - Your Air Quality Index Source</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<h1>Welcome to EcoSaver - Your Air Quality Index Source</h1>
<p>We prioritize your well-being by providing up-to-date information on air quality indexes.</p>
</header>
<section class="approach">
<h2>Our Approach: Smart and Informative</h2>
<p>We believe in offering precise and comprehensive data to empower your decisions for a better
quality of life.</p>
<ul>
<li>Presenting real-time air quality data in a user-friendly format.</li>
<li>Equipping you with insights into the impact of air quality on health and the environment.
</li>
<li>Empowering communities with knowledge to make informed choices for a sustainable future.
</li>
</ul>
</section>
</div>
<div class="col-lg-6">
<img class="img-fluid rounded" src="images/about-img.jpg" alt="" />
</div>
</div>
</div>
</div>
<hr>
</div>
<%- include('bot') %>

112
consumerWebsite/views/news.ejs Normal file
View File

@ -0,0 +1,112 @@
<%- include('top') %>
<!-- full Title -->
<div class="full-title">
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">News
<!--<small>Subheading</small> -->
</h1>
</div>
</div>
<!-- Page Content -->
<div class="container">
<div class="breadcrumb-main">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="/">Home</a>
</li>
<li class="breadcrumb-item active">News</li>
</ol>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-8 blog-entries">
<div class="card mb-4">
<img class="card-img-top" src="images/newspic.jpg" alt="Card image Blog" />
<div class="card-body">
<h2 class="card-title">Singapore's air quality hits unhealthy range, 'slightly hazy' conditions
forecast for Saturday</h2>
<p class="card-text">he National Environment Agency said there has been a "significant increase"
in the number of hotspots in Sumatra.</p>
<a href="https://www.channelnewsasia.com/singapore/haze-psi-unhealthy-range-daily-advisory-pm-2-5-indonesia-hotspot-fires-nea-3827106"
class="btn btn-primary">Read More &rarr;</a>
</div>
<div class="card-footer text-muted">
Posted on October 6, 2023 by
<a href="https://www.channelnewsasia.com/">CNA</a>
</div>
</div>
<div class="card mb-4">
<img class="card-img-top" src="images/newspic.jpg" alt="Card image Blog">
<div class="card-body">
<h2 class="card-title">Singapore Government Agencies Stand Ready To Mitigate Impact Of Haze</h2>
<p class="card-text">As of 29 September 2023, 3pm, the 24-hr Pollutant Standards Index (PSI) is
81 (Moderate range) in the East region of Singapore. Accordingly, the 28 public agencies
that make up the Government’s Haze Task Force (HTF), are ready to roll out their respective
haze action plans should the air quality deteriorate into the Unhealthy range (24-hour PSI
above 100). </p>
<a href="https://www.nea.gov.sg/media/news/news/index/singapore-government-agencies-stand-ready-to-mitigate-impact-of-haze"
class="btn btn-primary">Read More &rarr;</a>
</div>
<div class="card-footer text-muted">
Posted on September 29, 2023 by
<a href="https://www.nea.gov.sg/">NEA</a>
</div>
</div>
<div class="card mb-4">
<img class="card-img-top" src="images/newspic.jpg" alt="Card image Blog">
<div class="card-body">
<h2 class="card-title">High risk of severe transboundary haze in 2023, public advised to be
prepared: Singapore institute</h2>
<p class="card-text">A latest report predicts a high risk of severe haze occurring in Southeast
Asia, though not as severe as in 2015</p>
<a href="https://www.channelnewsasia.com/singapore/high-risk-severe-transboundary-haze-2023-public-advised-be-prepared-singapore-institute-3579081"
class="btn btn-primary">Read More &rarr;</a>
</div>
<div class="card-footer text-muted">
Posted on June 22, 2023 by
<a href="https://www.channelnewsasia.com/">CNA</a>
</div>
</div>
<div class="pagination_bar_arrow">
<ul class="pagination justify-content-center mb-4">
<li class="page-item">
<a class="page-link" href="#">&larr; Older</a>
</li>
<li class="page-item">
<a class="page-link" href="#">Newer &rarr;</a>
</li>
</ul>
</div>
</div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4 blog-right-side">
<div class="card mb-4">
<h5 class="card-header">Search</h5>
<div class="card-body">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search for...">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Go!</button>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<%- include('bot') %>

124
consumerWebsite/views/top.ejs Normal file
View File

@ -0,0 +1,124 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<!-- Bootstrap core CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<!-- Custom styles for this template -->
<link href="css/all.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/learnmore.css" rel="stylesheet">
<!-- jQuery library -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"
integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<!-- Bootstrap 5 JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<!-- jquery app.js -->
<script src="js/app.js"></script>
</head>
<body>
<!-- javascript function to check if user is auth -->
<!-- wait for DOC to be ready -->
<script>
$(document).ready(function () {
app.auth.isLoggedIn(function (error, data) {
if (data) {
$('#cl-logout-button').show();
$('#cl-login-button').hide();
} else {
$('#cl-login-button').show();
}
});
});
</script>
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-light top-nav fixed-top">
<div class="container">
<a class="navbar-brand" href="/">
<img src="images/logo.png" alt="logo" />
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive"
aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="fas fa-bars"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/news">News</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/contact">Contact</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/profile">Profile</a>
</li>
<div class="form-inline mt-2 mt-md-0">
<a id="cl-login-button" class="btn btn-outline-danger my-2 my-sm-0"
onclick="app.auth.forceLogin()" style="display: none;">
<i class="fas fa-sign-out"></i>
Login
</a>
<button id="cl-logout-button" class="btn btn-outline-danger my-2 my-sm-0"
onclick="app.auth.logOut(e => window.location.href='/')" style="display: none;">
<i class="fas fa-sign-out"></i>
Log Out
</button>
</div>
</ul>
</div>
</div>
</nav>
</body>
</html>
<!--
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/news">News</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/contact">Contact</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/profile">Profile</a>
</li>
<li class="nav-item">
<div class="form-inline mt-2 mt-md-0">
<a id="cl-login-button" class="btn btn-outline-danger my-2 my-sm-0"
onclick="app.auth.forceLogin()" style="display: none;">
<i class="fas fa-sign-out"></i>
Login
</a>
<button id="cl-logout-button" class="btn btn-outline-danger my-2 my-sm-0"
onclick="app.auth.logOut(e => window.location.href='/')" style="display: none;">
<i class="fas fa-sign-out"></i>
Log Out
</button>
</div>
</li>
</ul>
-->

2
webserver/database/model/apiKeyModel.js
View File

@ -45,7 +45,7 @@ const apikeyModel = sequelize.define(
validate: { validate: {
notEmpty: true, notEmpty: true,
len: [1, 255], len: [1, 255],
isIn: [["canRead", "canWrite"]], isIn: [["canRead", "canWrite" , "auto-generated"]],
}, },
}, },
createdAt: { createdAt: {