Lab_interaccio/2023/smartcitizen-kit-21/tools/calculator.htm
2025-02-25 21:29:42 +01:00

217 lines
6.3 KiB
HTML

<html>
<head>
<link rel="stylesheet" type="text/css" href="../esp/build_data/css.css">
</head>
<body onload="onLoad()">
<div class="container">
<form name=”calculator”>
<div>
<!-- <label>Reading interval</label> -->
<br/>
<div id="input-ranges">
<span id="readint_l"></span></p>
<input type="range" id="readint" min="1" max="60" value="1" oninput="calculate()">
<br/>
<span id="PM_l"></span></p>
<input type="range" id="readint_pm" min="1" max="60" value="6" oninput="calculate()">
<br/>
<span id="pubint_l"></span></p>
<input type="range" id="pubint" min="1" max="60" value="20" oninput="calculate()">
<br/><br/>
</div>
<div>
Sleep consumption <span id="sleep_percent"></span>
</div>
<br/><br/>
<div id="bar">
<div id="b_sleep" title="Sleeping"></div>
<div id="b_read" title="Reading sensors"></div>
<div id="b_pm" title="Reading PM sensor"></div>
<div id="b_pub" title="Publishing readings"></div>
</div>
<br/>
<p id="result"></p>
<input type="checkbox" id="checkbatt"> Custom battery<br>
<div id="battdiv">
<p>Battery capacity (mAh)
<input id="batt" type="text" value="2000" oninput="calculate()">
</p>
</div>
<hr>
<h2>Command for SCK's Shell</h2>
<p id="command" class="font70"></p>
</div>
</form>
</div>
</body>
</html>
<style type="text/css">
div.container{
font-family: Roboto;
margin-left: 1%;
margin-right: 1%;
}
p#command{
padding: 8px;
background: gray;
color: white;
font-family: monospace;
border-radius: 2px;
}
p#result{
font-weight: 700;
font-size: 14px;
}
h2{
font-size: 15px;
}
</style>
<script type="text/javascript">
function onLoad () {
const checkbatt = document.getElementById('checkbatt');
checkbatt.addEventListener('change', (event) => {
if (event.target.checked) {
document.getElementById('battdiv').style.visibility = 'visible';
document.getElementById('batt').value = '2000';
} else {
document.getElementById('battdiv').style.visibility = 'hidden';
document.getElementById('batt').value = '2000';
}
calculate();
})
document.getElementById('battdiv').style.visibility = 'hidden';
checkbatt.checked = false;
calculate();
}
function hour2str (hours) {
var line = "The battery will last for ";
function numberEnding (number) {
return (number > 1) ? "s " : " ";
}
var weeks = Math.floor(hours / 168);
if (weeks) {
hours -= (weeks * 168);
line += weeks + " week" + numberEnding(weeks);
}
var days = Math.floor(hours / 24);
if (days) {
hours -= (days * 24)
line += days + " day" + numberEnding(days);
}
var hours_ = Math.floor(hours);
if (hours_) {
hours -= hours_
line += hours_ + " hour" + numberEnding(hours_);
}
var minutes = Math.floor(hours * 60);
if (minutes) {
line += minutes + " minute" + numberEnding(minutes);
}
return line;
}
function calculate() {
// Intervals in minutes
var readint = parseInt(document.getElementById('readint').value);
var readint_pm = parseInt(document.getElementById('readint_pm').value);
var pubint = parseInt(document.getElementById('pubint').value);
// Power variables
var batt = parseInt(document.getElementById('batt').value);
var mA_on = 19.6; // mAh during normal reading
var sec_on = 1; // Seconds to get a reading from ALL sensors (not PM)
var mA_PM = 96.6; // mAh during PM reading
var sec_PM = 15; // Seconds to get a PM reading
var mA_ESP = 74.8; // mAh during Wi-Fi connection
var sec_ESP = 10; // Seconds to publish on Wi-Fi
var mA_sleep = 7.4; // mAh during sleep
// Calculate how much time per hour on each state
var perHour_on = (60 / readint) * sec_on;
var perHour_PM = (60 / readint_pm) * sec_PM;
var perHour_ESP = (60 / pubint) * sec_ESP;
var perHour_Sleep = 3600 - (perHour_on + perHour_PM + perHour_ESP);
// Consumption per hour
var read_cons = perHour_on * mA_on / 3600;
var PM_cons = perHour_PM * mA_PM / 3600;
var ESP_cons = perHour_ESP * mA_ESP / 3600;
var sleep_cons = perHour_Sleep * mA_sleep / 3600;
// Total mAh consumption
var mA_total = read_cons + PM_cons + ESP_cons + sleep_cons;
// Percentajes
var read_p = read_cons / mA_total * 100;
var PM_p = PM_cons / mA_total * 100;
var ESP_p = ESP_cons / mA_total * 100;
var sleep_p = sleep_cons / mA_total * 100;
var result_hours = batt / mA_total;
document.getElementById('command').innerHTML = "config -readint " + readint*60 + " -pubint " + pubint*60 + "<br/>sensor -interval 1.0 " + readint_pm*60 + "<br/>sensor -interval 2.5 " + readint_pm*60 + "<br/>sensor -interval 10.0 " + readint_pm*60;
document.getElementById("readint_l").innerHTML = "Read sensors every " + readint + " min";
document.getElementById("PM_l").innerHTML = "Read PM sensor every " + readint_pm + " min";
document.getElementById("pubint_l").innerHTML = "Send to server every " + pubint + " min"
document.getElementById("sleep_percent").innerHTML = sleep_cons.toFixed(1) + " mAh (" + sleep_p.toFixed(1) + "%)";
document.getElementById("result").innerHTML = hour2str(result_hours);
// redraw bar
var bar_sleep = document.getElementById("b_sleep");
var bar_read = document.getElementById("b_read");
var bar_pm = document.getElementById("b_pm");
var bar_pub = document.getElementById("b_pub");
bar_sleep.style.height = "60px";
bar_sleep.style.width = sleep_p+"%";
bar_sleep.style.backgroundColor = "#adbef3";
bar_sleep.style.float = "left";
bar_sleep.title = "Sleeping consumption " + sleep_cons.toFixed(1) + " mAh (" + sleep_p.toFixed(1) + "%)";
bar_read.style.height = "60px";
bar_read.style.width = read_p+"%";
bar_read.style.backgroundColor = "#9bdd92";
bar_read.style.float = "left";
bar_read.title = "Reading sensors consumption " + read_cons.toFixed(1) + " mAh (" + read_p.toFixed(1) + "%)";
bar_pm.style.height = "60px";
bar_pm.style.width = PM_p+"%";
bar_pm.style.backgroundColor = "#e7cfa8";
bar_pm.style.float = "left";
bar_pm.title = "Reading PM sensor consumption " + + PM_cons.toFixed(1) + " mAh (" + PM_p.toFixed(1) + "%)";
bar_pub.style.height = "60px";
bar_pub.style.width = ESP_p+"%";
bar_pub.style.backgroundColor = "#f5b4bc";
bar_pub.style.float = "right";
bar_pub.title = "Publishing data consumption " + ESP_cons.toFixed(1) + " mAh (" + ESP_p.toFixed(1) + "%)";
}
</script>