gaugendre/doses
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Implement computation

Browse source
This commit is contained in:
Gabriel Augendre 2022-10-08 20:17:22 +02:00
parent 3af2ea3966
commit 8394ffa2e0
2 changed files with 62 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
index.html
View file

@ -3,15 +3,33 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Doses</title> <title>Doses</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
html {
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
</style>
</head> </head>
<body> <body>
<h1>Doses converter</h1> <h1>Doses converter</h1>
<label for="proof">Proof (%)</label>
<input type="number" id="proof" value="40"> <p>
<label for="volume">Volume (cl)</label> <label for="proof">Proof (%)</label>
<input type="number" id="volume" value="10"> <input type="number" id="proof" value="40">
<label for="dose">Dose</label> </p>
<input type="number" id="dose" value="3.2">
<p>
<label for="volume">Volume (cl)</label>
<input type="number" id="volume" value="10">
<button id="compute-volume">Compute</button>
</p>
<p>
<label for="dose">Dose</label>
<input type="number" id="dose" value="3.2">
<button id="compute-dose">Compute</button>
</p>
<script src="main.js" defer></script> <script src="main.js" defer></script>
</body> </body>
</html> </html>

38
main.js
View file

@ -0,0 +1,38 @@
const computeVolumeButton = document.getElementById("compute-volume");
computeVolumeButton.addEventListener("click", () => {
const dose = getDoseValue();
const proof = getProofValue();
const volume = (dose * 100) / 0.8 / proof;
setVolumeValue(volume.toFixed(2));
});
const computeDoseButton = document.getElementById("compute-dose");
computeDoseButton.addEventListener("click", () => {
const volume = getVolumeValue();
const proof = getProofValue();
const dose = (volume / 100) * 0.8 * proof;
setDoseValue(dose.toFixed(2));
});
const proofInput = document.getElementById("proof");
const volumeInput = document.getElementById("volume");
const doseInput = document.getElementById("dose");
function getProofValue() {
return parseFloat(proofInput.value);
}
function getVolumeValue() {
return parseFloat(volumeInput.value);
}
function setVolumeValue(value) {
volumeInput.value = value;
}
function getDoseValue() {
return parseFloat(doseInput.value);
}
function setDoseValue(value) {
doseInput.value = value;
}