ShaakhDev · March 5, 2023 08:25 · Mar 5, 2023
diff --git a/index.html b/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+    <head>
+          <link rel="stylesheet" href="css/binaryCalculator.css" type="text/css">
+        <meta charset="utf-8">
+        <title>Binary Calculator</title>
+    </head>
+    <body>
+
+        <div id="res"></div>
+        <div id="btns">
+            <button id="btn0" onclick="clickZero()">0</button>
+            <button id="btn1" onclick="clickOne()">1</button>
+            <button id="btnClr" onclick="clickClear()">C</button>
+            <button id="btnEql" onclick="clickEql()">=</button>
+            <button id="btnSum" onclick="clickSum()">+</button>
+            <button id="btnSub" onclick="clickSub()">-</button>
+            <button id="btnMul" onclick="clickMul()">*</button>
+            <button id="btnDiv" onclick="clickDiv()">/</button>
+
+        </div>
+
+        <script src="js/binaryCalculator.js" type="text/javascript"></script>
+    </body>
+</html>
diff --git a/script.js b/script.js
@@ -0,0 +1,57 @@
+const display = document.getElementById('res');
+const btns = document.getElementById('btns')
+
+let inputValue = "";
+let regexForExeptSigns =  /[+\-*/]/;
+let operation = "";
+
+
+btns.addEventListener('click',handler)
+
+
+function handler(event) {
+  let sign = event.target.innerText;
+
+  if (sign === '0' || sign === '1') inputValue += sign;
+
+  if ((sign === '+' || 
+       sign === '-' || 
+       sign === '*' || 
+       sign === '/')&& 
+       !inputValue.match(regexForExeptSigns)
+  ){
+    inputValue += sign;      
+    operation = sign;
+  } 
+
+  if(sign === 'C') inputValue = "";
+  if(sign === '=') calculate()
+
+  displayInput();
+}
+
+
+
+//calculating the result
+function calculate(){
+
+
+  let [firstBin,secondBin] = inputValue.split(regexForExeptSigns);
+
+  let result = getResult(firstBin,secondBin).toString(2)
+  inputValue = result;
+
+};
+
+function getResult(first,second){
+  if(operation === '+') return BigInt('0b' + first) + BigInt('0b' + second);
+  if(operation === '-') return BigInt('0b' + first) - BigInt('0b' + second);
+  if(operation === '*') return BigInt('0b' + first) * BigInt('0b' + second);
+  if(operation === '/') return BigInt('0b' + first) / BigInt('0b' + second);
+
+
+}
+//displaying an input string
+function displayInput(){
+    display.innerText = inputValue
+}
diff --git a/style.css b/style.css
@@ -0,0 +1,34 @@
+body{
+    width:33%;
+}
+#res{
+    background-color:lightgray;
+    border:solid;
+    height:48px;
+    font-size:20px;
+}
+#btn0,#btn1{
+    background-color:lightgreen; 
+    color:brown;
+}
+
+#btnClr,#btnEql{
+       background-color:darkgreen; 
+    color:white;
+}
+#btnSum,#btnSub,#btnMul,#btnDiv{
+     background-color:black; 
+    color:red;
+}
+button{
+
+    width:25%;
+    height:36px;
+    font-size:18px;
+    margin:0px;
+    float:left;
+
+}
+
+
+