Precise Age Calculator

AgentXLP · AgentXLP · commit d0438d0e4569 · 2023-06-02T19:14:12.000-04:00
diff --git a/index.css b/index.css
diff --git a/index.html b/index.html
@@ -6,9 +6,8 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Agent's Site</title>
     <script src="index.js"></script>
-    <link rel="stylesheet" href="index.css">
 </head>
 <body>
-    <h1>come back later when theres something interesting here</h1>
+    <a href="./precise-age/index.html">Precise Age Calculator</a>
 </body>
 </html>
diff --git a/precise-age/index.html b/precise-age/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Precise Age Calculator</title>
+        <link rel="stylesheet" href="./stylesheet.css">
+    </head>
+    <body>
+        <h1>Precise Age Calculator</h1>
+        <p>Birth Date</p>
+        <input type="datetime-local" id="date">
+        <br>
+        <br>
+        <br>
+        <button onclick="window.calculate()">Calculate</button>
+        <br>
+        <br>
+        <br>
+        <h2 id="age">Age: ??</h2>
+    </body>
+    <script src="index.js"></script>
+</html>
diff --git a/precise-age/index.js b/precise-age/index.js
@@ -0,0 +1,17 @@
+const secondsInYear = 31536000
+const millisecondsToSeconds = 0.001
+
+const dateInput = document.getElementById("date")
+const age = document.getElementById("age")
+
+let interval = false
+
+window.calculate = () => {
+    const date = new Date(dateInput.value)
+    age.innerHTML = "Age: " + ((Date.now() * millisecondsToSeconds) - (date.getTime() * millisecondsToSeconds)) / secondsInYear
+    
+    if (!interval) {
+        interval = true
+        setInterval(window.calculate, 100)
+    }
+}
diff --git a/precise-age/stylesheet.css b/precise-age/stylesheet.css
@@ -0,0 +1,3 @@
+body {
+    text-align: center;
+}

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+body {`
	`2`	`+ text-align: center;`
	`3`	`+}`