first commit

2025-03-18 15:42:42 +00:00 · 2025-03-18 15:42:42 +00:00 · a57570558b
commit a57570558b
4 changed files with 138 additions and 0 deletions
--- a/.make.lock
+++ b/.make.lock
--- a/index.html
+++ b/index.html
@ -0,0 +1,52 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width">
+    <title>Roman coin denomination converter</title>
+    <script type="module" src="script.js"></script>
+    <link rel="stylesheet" href="style.css">
+  </head>
+  <body>
+    <header>
+      <h1>Roman coin denomination converter</h1>
+    </header>
+    <main>
+      <form id="convert">
+          <input aria-label="How many" type="number" min="0" value="1" id="num_from" name="num_from">
+    
+          <select aria-label="From denomination" id="from" name="from">
+            <option value="Quadrans">Quadrans</option>
+            <option value="Semis">Semis</option>
+            <option value="As">As</option>
+            <option value="Dupondius">Dupondius</option>
+            <option value="Sestertius">Sestertius</option>
+            <option value="Quinarius argenteus">Quinarius argenteus</option>
+            <option value="Denarius">Denarius</option>
+            <option value="Quinarius aureus">Quinarius aureus</option>
+            <option selected value="Aureus">Aureus</option> 
+          </select>
+  
+          =
+
+          <span class="vertical">
+            <output id="num_to" for="num_from"></output>
+
+            <button type="button" id="swap">⇆</button>
+          </span>
+    
+          <select aria-label="To denomination" id="to" name="to">
+            <option selected value="Quadrans">Quadrans</option>
+            <option value="Semis">Semis</option>
+            <option value="As">As</option>
+            <option value="Dupondius">Dupondius</option>
+            <option value="Sestertius">Sestertius</option>
+            <option value="Quinarius argenteus">Quinarius argenteus</option>
+            <option value="Denarius">Denarius</option>
+            <option value="Quinarius aureus">Quinarius aureus</option>
+            <option value="Aureus">Aureus</option> 
+          </select>
+      </form>
+    </main>
+  </body>
+</html>
--- a/script.js
+++ b/script.js
@ -0,0 +1,65 @@
+const form = document.getElementById('convert');
+
+const values = {
+  'Quadrans': 1,
+  'Semis': 2,
+  'As': 4,
+  'Dupondius': 8,
+  'Sestertius': 16,
+  'Quinarius argenteus': 32,
+  'Denarius': 64,
+  'Quinarius aureus': 800,
+  'Aureus': 1600,
+}
+
+function gcd(a,b) {
+  if(a==0) {
+    return 1;
+  }
+  console.log(a,b);
+  if(a<b) {
+    return gcd(b,a);
+  }
+  while(b) {
+    const [m,c] = [a%b,b];
+    a = c;
+    b = m;
+  }
+  return a;
+}
+
+function update() {
+  const fd = new FormData(form);
+  const {num_from, from, to} = Object.fromEntries(Array.from(fd));
+  console.log(num_from,from,to);
+
+  const value_from = values[from];
+  const value_to = values[to];
+  let [n,d] = value_to > value_from ? [num_from, value_to/value_from] : [num_from * value_from/value_to, 1];
+  const g = gcd(n,d);
+  n /= g;
+  d /= g;
+  const output = d==1 ? n : `${n} / ${d}`;
+  document.querySelector('output').textContent = output;
+}
+
+function swap() {
+  const fd = new FormData(form);
+  const {num_from, from, to} = Object.fromEntries(Array.from(fd));
+
+  const value_from = values[from];
+  const value_to = values[to];
+
+  document.getElementById('num_from').value = num_from * value_from/value_to;
+  
+  document.getElementById('from').value = to;
+  document.getElementById('to').value = from;
+
+  update();
+}
+
+update();
+
+form.addEventListener('input', update);
+
+document.getElementById('swap').addEventListener('click', swap);
--- a/style.css
+++ b/style.css
@ -0,0 +1,21 @@
+:root {
+  --spacing: 1em;
+
+  color-scheme: light dark;
+}
+
+form {
+  display: flex;
+  gap: 1em;
+  text-align: center;
+  align-items: start;
+
+}
+input {
+  text-align: center;
+}
+
+.vertical {
+  display: inline-flex;
+  flex-direction: column;
+}