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

Remove unnecessary code and update button styles

Browse Source
This commit is contained in:
newtbot
2024-01-28 03:31:39 +08:00
parent d491750916
commit fadabf3451
8 changed files with 499 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
consumerWebsite/views/bot.ejs
View File

@ -82,8 +82,6 @@
</div>
</footer>
<script src="js/search.js"></script>
<script src="js/data.js"></script>
</body>

5
consumerWebsite/views/logintop.ejs
View File

@ -46,6 +46,7 @@
app.auth.isLoggedIn(function (error, data) {
if (!error) {
$("#cl-logout-button").show("fast");
$("#cl-viewdata-button").show("fast");
$("#cl-api-button").show("fast");
$("#cl-profile-button").show("fast");
$("#cl-login-button").hide("fast");
@ -84,6 +85,10 @@
</li>
<!-- profile button -->
<div class="form-inline mt-2 mt-md-0">
<a id="cl-viewdata-button" class="btn btn-outline-info btn-sm my-2 my-sm-0" href="/viewdata"
style="display: none">
<i class="fas fa-sign-out"></i>Data
</a>
<a id="cl-api-button" class="btn btn-outline-info btn-sm my-2 my-sm-0" href="/api"
style="display: none">
<i class="fas fa-sign-out"></i> API

6
consumerWebsite/views/top.ejs
View File

@ -62,6 +62,7 @@
$.scope.getUserDetails.update(data);
}
$("#cl-logout-button").show("fast");
$("#cl-viewdata-button").show("fast");
$("#cl-api-button").show("fast");
$("#cl-profile-button").show("fast");
$("#cl-login-button").hide("fast");
@ -106,6 +107,11 @@
-->
<!-- profile button -->
<div class="form-inline mt-2 mt-md-0">
<a id="cl-viewdata-button" class="btn btn-outline-info btn-sm my-2 my-sm-0" href="/viewdata"
style="display: none">
<i class="fas fa-sign-out"></i>Data
</a>
<a id="cl-api-button" class="btn btn-outline-info btn-sm my-2 my-sm-0" href="/api"
style="display: none">
<i class="fas fa-sign-out"></i> API

212
consumerWebsite/views/viewdata.ejs
View File

@ -1,43 +1,187 @@
<%- include('top') %>
<link href="css/data.css" rel="stylesheet" />
<link href="css/data.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<br>
<br>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script type="text/javascript">
// Require login to see this page.
app.auth.forceLogin()
</script>
<br>
<br>
<body>
<body>
<div class="air-quality-container">
<%#
<div class="graphbutton-container">
<button id="barButton">Bar Graph</button>
<button id="lineButton">Line Graph</button>
</div> %>
<div class="chart-container">
<canvas id="dataChart"></canvas>
<div class="air-quality-container">
<div class="querybutton-container" id="querybutton-container">
<!-- <button id="yearButton">Year</button>
<button id="monthButton">Month</button>
<button id="weekButton">Week</button> -->
<button id="dayButton">Day</button>
</div>
<br>
<div class="chart-container">
<canvas id="dataChart"></canvas>
</div>
<!-- <div class="button-container">
<button id="psiButton">PSI</button>
<button id="tempButton">Temperature</button>
<button id="humButton">Humidity</button>
<button id="o3Button">O3</button>
<button id="no2Button">NO2</button>
<button id="so2Button">SO2</button>
<button id="coButton">CO</button>
</div>
-->
<br>
<div class="download-container">
<p>Download data here:</p>
<button id="downloadCSVButton" onclick="downloadCSV()">Download CSV</button>
<br><br>
<button id="downloadCSVButton" onclick="downloadExcel()">Download Excel Sheet</button>
</div>
</div>
<div class="button-container">
<button id="aqiButton">AQI</button>
<button id="tempButton">Temperature</button>
<button id="humButton">Humidity</button>
<button id="pm25Button">PM2.5</button>
<button id="pm10Button">PM10</button>
<button id="o3Button">O3</button>
<button id="no2Button">NO2</button>
<button id="so2Button">SO2</button>
<button id="coButton">CO</button>
</div>
<div class="download-container">
<p>Download data here:</p>
<button id="downloadCSVButton">Download CSV</button>
</div>
</div>
</body>
</body>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<script src="js/data.js"></script>
<!-- //download csv and excel -->
<script type="text/javascript">
//https://stackoverflow.com/questions/14964035/how-to-export-javascript-array-info-to-csv-on-client-side
function exportToCsv(filename, rows) {
var processRow = function (row) {
var finalVal = '';
for (var j = 0; j < row.length; j++) {
var innerValue = row[j] === null ? '' : row[j].toString();
if (row[j] instanceof Date) {
innerValue = row[j].toLocaleString();
};
var result = innerValue.replace(/"/g, '""');
if (result.search(/("|,|\n)/g) >= 0)
result = '"' + result + '"';
if (j > 0)
finalVal += ',';
finalVal += result;
}
return finalVal + '\n';
};
var csvFile = '';
for (var i = 0; i < rows.length; i++) {
csvFile += processRow(rows[i]);
}
<br>
<br>
var blob = new Blob([csvFile], { type: 'text/csv;charset=utf-8;' });
if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(blob, filename);
} else {
var link = document.createElement("a");
if (link.download !== undefined) { // feature detection
// Browsers that support HTML5 download attribute
var url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", filename);
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
}
}
//content="application/vnd.ms-excel;charset=utf-8"
function exportToExcel(filename, rows) {
var processRow = function (row) {
var finalVal = '';
for (var j = 0; j < row.length; j++) {
var innerValue = row[j] === null ? '' : row[j].toString();
if (row[j] instanceof Date) {
innerValue = row[j].toLocaleString();
}
var result = innerValue.replace(/"/g, '""');
if (result.search(/("|,|\n)/g) >= 0) {
result = '"' + result + '"';
}
if (j > 0) {
finalVal += '\t'; // Use tabs for Excel format
}
finalVal += result;
}
return finalVal + '\n';
};
<%- include('bot') %>
var excelFile = '';
for (var i = 0; i < rows.length; i++) {
excelFile += processRow(rows[i]);
}
var blob = new Blob([excelFile], { type: "application/vnd.ms-excel;charset=utf-8" });
if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(blob, filename + '.xls');
} else {
var link = document.createElement("a");
if (link.download !== undefined) { // Feature detection
// Browsers that support HTML5 download attribute
var url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", filename);
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
}
}
//onclick call
function downloadCSV() {
app.api.get('sensor-data/', function (error, data) {
//to loop through the data and assign into map array
var formattedData = data.map(function (item) {
return [
item.id,
item.sensorid,
item.locationid,
JSON.stringify(item.measurement), //to handle measurement object
item.createdAt
];
});
exportToCsv('export.csv', [
['id', 'sensorid', 'locationid', 'measurement', 'createdAt'],
...formattedData
]);
});
}
function downloadExcel() {
app.api.get('sensor-data/', function (error, data) {
//to loop through the data and assign into map array
var formattedData = data.map(function (item) {
return [
item.id,
item.sensorid,
item.locationid,
JSON.stringify(item.measurement), //to handle measurement object
item.createdAt
];
});
exportToExcel('export.xls', [
['id', 'sensorid', 'locationid', 'measurement', 'createdAt'],
...formattedData
]);
});
}
</script>
<%- include('bot') %>