From 362b10c2fbafff6b87a186349d3e4d4f2d058dfa Mon Sep 17 00:00:00 2001
From: ametoresu <mail@tenkyuu.dev>
Date: Tue, 24 Dec 2024 19:14:07 +0800
Subject: [PATCH] did some tweaks, leaving tasks for tommorrow

---
 script.js  | 24 ++++++++++++++++--------
 styles.css |  6 ++++++
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/script.js b/script.js
index 51fd3c0..577bdc4 100644
--- a/script.js
+++ b/script.js
@@ -5,7 +5,7 @@ const fromTxt = document.getElementById("convertFromTxt");
 const toTxt = document.getElementById("convertToTxt");
 const userInput = document.getElementById("userInput");
 
-const convert = (num, from, to) => {
+const convert = (num, from, to) => { //converts the num to the temp unit assigned
   let result = "";
 
   if (from === "Celcius") {
@@ -34,31 +34,39 @@ const convert = (num, from, to) => {
     }
   }
 
-  return result;
+  return result.toFixed(2);
 }
 
-const updateOutputTxt = (from, to, num) => {
+const updateOutputTxt = (from, to, num) => { //updates the output text
   const units = {
-
+    "Celcius": "&deg;C",
+    "Fahrenheit": "&deg;F",
+    "Kelvin": "K"
   }
-  return `${userInput.value}&deg;${from} &equals; ${num}&deg;${to}`;
+  const noSpace = userInput.value.replace(/[^\d.]/g, "");
+  const fromUnit = units[from];
+  const toUnit = units[to];
+
+  return `${noSpace}${fromUnit} &equals; ${num}${toUnit}`;
 }
 
-const updateConversionTxt = (from, to) => {
+const updateConversionTxt = (from, to) => { //updates the text above the conversion
   fromTxt.innerText = from;
   toTxt.innerText = to;
   calculate(userInput);
 }
 
-const onDropdownChange = () => {
+const onDropdownChange = () => { //executes if user change the option on the select element
   const tempFrom = tempUnitFrom.value;
   const tempTo = tempUnitTo.value;
   updateConversionTxt(tempFrom, tempTo);
 }
 
+//checks changes on the select element
 tempUnitFrom.addEventListener("change", onDropdownChange);
 tempUnitTo.addEventListener("change", onDropdownChange);
 
+//executes when user input a number
 const calculate = (value) => {
   const noSpace = value.replace(/[^\d.]/g, ""); //remove whitespaces and non-numerical characters
   const parsedInt = parseInt(noSpace);
@@ -73,4 +81,4 @@ const calculate = (value) => {
   }
 }
 
-document.addEventListener("DOMContentLoaded", onDropdownChange);
\ No newline at end of file
+document.addEventListener("DOMContentLoaded", onDropdownChange); //run once on page onload
\ No newline at end of file
diff --git a/styles.css b/styles.css
index c841771..13750be 100644
--- a/styles.css
+++ b/styles.css
@@ -38,4 +38,10 @@ input {
 #result {
   text-align: center;
   padding: 1rem;
+}
+
+@media only screen and (min-width: 1240px) {
+  main {
+    width: 50%;
+  }
 }
\ No newline at end of file
-- 
2.39.5