Add files via upload

Calculator done
Pratham1253 · Aug 23, 2024 · f65dd8e · f65dd8e
commit f65dd8e
Show file tree

Hide file tree

Showing 3 changed files with 207 additions and 0 deletions.
diff --git a/index.css b/index.css
@@ -0,0 +1,55 @@
+
+body {
+    margin: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-image: linear-gradient(to right bottom, #ff4ed3, #7c62f0);
+}
+
+.calculator {
+    background-color: rgb(35, 33, 33);
+    width: 315px;
+    border-radius: 5px;
+}
+
+#screen {
+    background-color: rgba(100, 95, 95);
+    height: 75px;
+    text-align: right;
+    padding-right: 15px;
+    font-size: 30px;
+    color: white;
+    border-radius: 5px;
+    margin: 5px;
+    width: 96%;
+}
+
+.keypad {
+    display: flex;
+    padding: 10px;
+    flex-wrap: wrap;
+    gap: 7px;
+    justify-content: space-between;
+}
+
+.keypad>button {
+    height: 65px;
+    width: 65px;
+    border-radius: 5px;
+    color: white;
+    background-color: #7c62f0;
+    border: 0;
+    font-size: 20px;
+}
+.keypad>button:hover {
+  scale: 1.1;
+  transition: ease-out;
+  cursor: pointer;
+}
+
+
+.keypad>button:last-child {
+    width: 142px;
+    background-color: orangered;
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,35 @@
+  <html>
+    <head>
+      <title>Calculator - JS</title>
+      <link href="index.css" rel="stylesheet" />
+    </head>
+    <body>
+      <div class="calculator">
+        <input id="screen"/>
+        <div class="keypad">
+          <button>C</button>
+          <button>+-</button>
+          <button>%</button>
+          <button>/</button>
+          <button id="seven">7</button>
+          <button>8</button>
+          <button>9</button>
+          <button>X</button>
+          <button>4</button>
+          <button>5</button>
+          <button>6</button>
+          <button>-</button>
+          <button>1</button>
+          <button>2</button>
+          <button>3</button>
+          <button id="plus">+</button>
+          <button>0</button>
+          <button>.</button>
+          <button>=</button>
+        </div>
+      </div>
+      <script src="index.js"></script>
+    </body>
+  </html>
+
+
diff --git a/index.js b/index.js
@@ -0,0 +1,117 @@
+
+let buttons = document.getElementsByTagName("button")
+let buttonArray = Array.from(buttons);
+
+
+buttonArray.forEach((button) => {
+    button.addEventListener("click",printNum)
+})
+
+
+function printNum(event)
+{
+    let buttonValue = event.target.innerText;
+    let screen = document.getElementById("screen")
+
+    if(buttonValue === "C")
+    {
+        screen.value="";
+       console.log(screen.value)
+        return;
+    }
+    else if('+-X/'.includes(buttonValue))
+    {
+        if(screen.value.includes('+') || screen.value.includes('-') || screen.value.includes('X') || screen.value.includes('/'))
+        {
+            alert("Sign Already Present")
+            return;
+        }
+    }
+    else if(buttonValue ===  "+-")
+        {
+            if(screen.value[0] === '-')
+            {
+                screen.value = screen.value.slice(1)
+            }
+            else{
+                screen.value = '-' + screen.value;
+            }
+            return;
+        }
+    else if(buttonValue === "=")
+    {
+       let ans = 0;
+       if(screen.value.includes("+"))
+       {
+        ans = performSum(screen.value)
+       }
+       else if(screen.value.includes("-"))
+       {
+        ans = performSub(screen.value)
+       }
+       else if(screen.value.includes("X"))
+       {
+         ans = performMulti(screen.value)
+       }
+     else if(screen.value.includes("/"))
+     {
+        ans = performDiv(screen.value)
+     }  
+
+     if(ans === undefined)
+        {
+            screen.value="";
+        }       
+        else{
+           screen.value = ans;
+        }
+        return;
+    }
+
+
+    screen.value = screen.value + buttonValue;
+}
+function performSum(value)
+{
+    let plusIndex = value.indexOf("+")
+    let num1 = value.slice(0,plusIndex)
+    let num2 =value.slice(plusIndex + 1)
+    console.log(num1,num2);
+    let sum = Number(num1) + Number(num2);
+    return sum;
+
+}
+function performSub(value)
+{
+    let minusIndex = value.indexOf("-")
+    let num1 = value.slice(0,minusIndex)
+    let num2 =value.slice(minusIndex+ 1)
+    let sub = Number(num1) - Number(num2);
+    return sub;
+
+}
+function performMulti(value)
+{
+    let multiIndex = value.indexOf("X")
+    let num1 = value.slice(0,multiIndex)
+    let num2 = value.slice(multiIndex+1);
+    let mul = Number(num1) * Number(num2)
+    return mul;
+
+}
+function performDiv(value)
+{
+    let divIndex = value.indexOf("/")
+    let num1 = value.slice(0,divIndex)
+    let num2 =value.slice(divIndex+ 1)
+    let div = Number(num1) / Number(num2);
+    if(Number(num2) === 0 )
+    {
+        alert("Can't Divide By Zero!")
+        return;
+    }
+    return div;
+
+}
+
+