diff --git a/Calculator/jashkarangiya/css/custom.css b/Calculator/jashkarangiya/css/custom.css index 122e2d3ad..6c9d193a0 100644 --- a/Calculator/jashkarangiya/css/custom.css +++ b/Calculator/jashkarangiya/css/custom.css @@ -161,4 +161,26 @@ button#equal { .calculator.dark button.btn-equal { background-color: #223323; color: #ffffff; -} \ No newline at end of file +} + +.display-screen { + background-color: #1e1e1e; + padding: 20px; + text-align: right; + border-radius: 8px; + margin-bottom: 10px; + color: #ffffff; + font-family: monospace; +} + +.expression { + font-size: 20px; + color: #aaaaaa; + min-height: 24px; +} + +.result { + font-size: 32px; + font-weight: bold; + min-height: 40px; +} diff --git a/Calculator/jashkarangiya/index.html b/Calculator/jashkarangiya/index.html index 84a9c6491..f08da9f8d 100644 --- a/Calculator/jashkarangiya/index.html +++ b/Calculator/jashkarangiya/index.html @@ -18,8 +18,10 @@
-
-
+
+
+ +
@@ -49,7 +51,7 @@ - +
@@ -58,4 +60,4 @@ - \ No newline at end of file + diff --git a/Calculator/jashkarangiya/js/index.js b/Calculator/jashkarangiya/js/index.js index 82ba2fa30..8412396c8 100644 --- a/Calculator/jashkarangiya/js/index.js +++ b/Calculator/jashkarangiya/js/index.js @@ -1,30 +1,60 @@ -const display = document.querySelector("#display"); +const display = document.getElementById("display"); +const expressionDisplay = document.getElementById("expression"); const buttons = document.querySelectorAll("button"); -buttons.forEach((item) => { - item.onclick = () => { - if (item.id == "clear") { - display.innerText = ""; - } else if (item.id == "backspace") { - let string = display.innerText.toString(); - display.innerText = string.substr(0, string.length - 1); - } else if (display.innerText != "" && item.id == "equal") { - display.innerText = eval(display.innerText); - } else if (display.innerText == "" && item.id == "equal") { - display.innerText = "Empty!"; - setTimeout(() => (display.innerText = ""), 2000); +let input = ""; + +function updateDisplay(result = "") { + expressionDisplay.textContent = input || "0"; + display.textContent = result; +} + +buttons.forEach((btn) => { + btn.addEventListener("click", () => { + const value = btn.id; + + if (value === "clear") { + input = ""; + updateDisplay(""); + } else if (value === "backspace") { + input = input.slice(0, -1); + updateDisplay(""); + } else if (value === "equal") { + try { + // Invalid operator check + if (/[\+\-\*\/]{2,}/.test(input)) { + updateDisplay("❌ Error: Invalid operator usage!"); + input = ""; + return; + } + + // Invalid decimal + const tokens = input.split(/[\+\-\*\/\(\)]/); + for (let token of tokens) { + if ((token.match(/\./g) || []).length > 1) { + updateDisplay("❌ Error: Invalid decimal!"); + input = ""; + return; + } + } + + // Division by zero + if (/\/0+(?![0-9])/.test(input)) { + updateDisplay("❌ Error: Division by zero!"); + input = ""; + return; + } + + const result = eval(input); + input = result.toString(); + updateDisplay(); + } catch { + updateDisplay("❌ Error"); + input = ""; + } } else { - display.innerText += item.id; + input += value; + updateDisplay(); } - }; + }); }); - -const themeToggleBtn = document.querySelector(".theme-toggler"); -const calculator = document.querySelector(".calculator"); -const toggleIcon = document.querySelector(".toggler-icon"); -let isDark = true; -themeToggleBtn.onclick = () => { - calculator.classList.toggle("dark"); - themeToggleBtn.classList.toggle("active"); - isDark = !isDark; -}; \ No newline at end of file