added a way to download an excel template; added a preview feature to the display CO2 table
This commit is contained in:
parent
210275fc3d
commit
15d28e1711
2 changed files with 35 additions and 12 deletions
|
|
@ -19,8 +19,10 @@ const CO2_data = [
|
||||||
'infected_start',
|
'infected_start',
|
||||||
'room_volume',
|
'room_volume',
|
||||||
'total_people',
|
'total_people',
|
||||||
|
'ventilation_type',
|
||||||
'windows_duration',
|
'windows_duration',
|
||||||
'windows_frequency',
|
'windows_frequency',
|
||||||
|
'window_opening_regime',
|
||||||
]
|
]
|
||||||
|
|
||||||
// Method to upload a valid excel file
|
// Method to upload a valid excel file
|
||||||
|
|
@ -48,7 +50,6 @@ function excelFileToJSON(file) {
|
||||||
reader.onload = function (e) {
|
reader.onload = function (e) {
|
||||||
var data = e.target.result;
|
var data = e.target.result;
|
||||||
var workbook = XLSX.read(data, { type: "binary" });
|
var workbook = XLSX.read(data, { type: "binary" });
|
||||||
var result = {};
|
|
||||||
var firstSheetName = workbook.SheetNames[0];
|
var firstSheetName = workbook.SheetNames[0];
|
||||||
//reading only first sheet data
|
//reading only first sheet data
|
||||||
var jsonData = XLSX.utils.sheet_to_json(workbook.Sheets[firstSheetName]);
|
var jsonData = XLSX.utils.sheet_to_json(workbook.Sheets[firstSheetName]);
|
||||||
|
|
@ -67,17 +68,22 @@ function displayJsonToHtmlTable(jsonData) {
|
||||||
let structure = { times: [], CO2: [] };
|
let structure = { times: [], CO2: [] };
|
||||||
if (jsonData.length > 0) {
|
if (jsonData.length > 0) {
|
||||||
var htmlData = "<tr><th>Time</th><th>CO2 Value</th></tr>";
|
var htmlData = "<tr><th>Time</th><th>CO2 Value</th></tr>";
|
||||||
for (var i = 0; i < jsonData.length; i++) {
|
let jsonLength = jsonData.length;
|
||||||
|
for (var i = 0; i < jsonLength; i++) {
|
||||||
var row = jsonData[i];
|
var row = jsonData[i];
|
||||||
htmlData +=
|
if (i < 5) {
|
||||||
"<tr><td>" +
|
htmlData +=
|
||||||
Math.round(row["Times"] * 10) / 10 +
|
"<tr><td>" +
|
||||||
"</td><td>" +
|
Math.round(row["Times"] * 10) / 10 +
|
||||||
Math.round(row["CO2"] * 10) / 10 +
|
"</td><td>" +
|
||||||
"</td></tr>";
|
Math.round(row["CO2"] * 10) / 10 +
|
||||||
|
"</td></tr>";
|
||||||
|
}
|
||||||
structure["times"].push(row["Times"]);
|
structure["times"].push(row["Times"]);
|
||||||
structure["CO2"].push(row["CO2"]);
|
structure["CO2"].push(row["CO2"]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (jsonLength >= 5) htmlData += "<tr><td> ... </td><td> ... </td></tr>";
|
||||||
table.innerHTML = htmlData;
|
table.innerHTML = htmlData;
|
||||||
console.log(structure);
|
console.log(structure);
|
||||||
format.value = JSON.stringify(structure);
|
format.value = JSON.stringify(structure);
|
||||||
|
|
@ -86,6 +92,20 @@ function displayJsonToHtmlTable(jsonData) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function downloadTemplate() {
|
||||||
|
let final_export = [["Times", "CO2"], [8.5, 440.44]];
|
||||||
|
// Prepare the CSV file.
|
||||||
|
let csvContent = "data:text/csv;charset=utf8,"
|
||||||
|
+ final_export.map(e => e.join(",")).join("\n");
|
||||||
|
var encodedUri = encodeURI(csvContent);
|
||||||
|
// Set a name for the file.
|
||||||
|
var link = document.createElement("a");
|
||||||
|
link.setAttribute("href", encodedUri);
|
||||||
|
link.setAttribute("download", "CO2_template.XLSX");
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click();
|
||||||
|
}
|
||||||
|
|
||||||
function insertErrorFor(referenceNode, text) {
|
function insertErrorFor(referenceNode, text) {
|
||||||
var element = document.createElement("span");
|
var element = document.createElement("span");
|
||||||
element.setAttribute("class", "error_text");
|
element.setAttribute("class", "error_text");
|
||||||
|
|
@ -131,7 +151,7 @@ function submit_fitting_algorithm(url) {
|
||||||
$("#DIV_CO2_fitting_result").show();
|
$("#DIV_CO2_fitting_result").show();
|
||||||
$("#CO2_fitting_result").val(JSON.stringify(json_response));
|
$("#CO2_fitting_result").val(JSON.stringify(json_response));
|
||||||
$("#exhalation_rate_fit").html(String(json_response['exhalation_rate']));
|
$("#exhalation_rate_fit").html(String(json_response['exhalation_rate']));
|
||||||
// $("#ventilation_rate_fit").html(json_response['ventilation_values']);
|
$("#ventilation_rate_fit").html(json_response['ventilation_values']);
|
||||||
$("#CO2_data_plot").attr("src", json_response['CO2_plot']);
|
$("#CO2_data_plot").attr("src", json_response['CO2_plot']);
|
||||||
$("#generate_fitting_data").html('Fit data');
|
$("#generate_fitting_data").html('Fit data');
|
||||||
$("#save_and_dismiss_dialog").show();
|
$("#save_and_dismiss_dialog").show();
|
||||||
|
|
|
||||||
|
|
@ -685,8 +685,11 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
|
<div class="d-flex d-row justify-content-between">
|
||||||
<h5>Upload an excel file to display in HTML Table</h5><br>
|
<h5 style="margin-top: auto; margin-bottom: auto">Upload an excel file to display in HTML Table</h5>
|
||||||
|
<button type="button" class="btn btn-primary btn-sm" onclick="downloadTemplate()">Download template</button>
|
||||||
|
</div>
|
||||||
|
<br>
|
||||||
<!-- Input element to upload an excel file -->
|
<!-- Input element to upload an excel file -->
|
||||||
<input type="file" id="file_upload" />
|
<input type="file" id="file_upload" />
|
||||||
<button type="button" class="btn btn-primary btn-sm" onclick="upload_file()">Upload</button>
|
<button type="button" class="btn btn-primary btn-sm" onclick="upload_file()">Upload</button>
|
||||||
|
|
@ -703,7 +706,7 @@
|
||||||
<div id="DIV_CO2_fitting_result" style="display: none">
|
<div id="DIV_CO2_fitting_result" style="display: none">
|
||||||
<img id="CO2_data_plot"/>
|
<img id="CO2_data_plot"/>
|
||||||
<div>Exhalation rate: <p id="exhalation_rate_fit"></p> </div>
|
<div>Exhalation rate: <p id="exhalation_rate_fit"></p> </div>
|
||||||
{# <div>Air exchange: <p id="ventilation_rate_fit"></p></div> #}
|
<div>Air exchange: <p id="ventilation_rate_fit"></p></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue