diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..6f3a291
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "liveServer.settings.port": 5501
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 935c09e..cb9a6f9 100644
--- a/index.html
+++ b/index.html
@@ -28,10 +28,10 @@
-
+
+
+
+
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..192e362
--- /dev/null
+++ b/script.js
@@ -0,0 +1,105 @@
+let FirstNumber, SecondNumber;
+let result;
+let currentOperator = null;
+
+let display = document.querySelector('.display')
+let numbers = document.querySelectorAll('.number')
+let plus = document.querySelector('#add')
+let equal = document.querySelector('#equal')
+let divide = document.querySelector('#divide')
+let subtract = document.querySelector('#subtract')
+let multiply = document.querySelector('#multiply')
+let clear = document.querySelector('#clear')
+let operator = document.querySelectorAll('.operator')
+
+
+numbers.forEach(btn => {
+ btn.addEventListener('click', () => {
+ const value = btn.textContent;
+ console.log(currentOperator)
+ if (currentOperator == null) {
+ FirstNumber = (FirstNumber ?? "") + value;
+ console.log(`FirstNumber ${FirstNumber}`);
+ display.textContent = FirstNumber;
+ }
+ else {
+ SecondNumber = (SecondNumber ?? "") + value;
+ console.log(`SecondNumber ${SecondNumber}`);
+ display.textContent += value;
+ }
+ });
+});
+
+
+plus.addEventListener('click', function () {
+ currentOperator = '+';
+ updateOperatorDisplay();
+});
+
+subtract.addEventListener('click', function () {
+ currentOperator = '-';
+ updateOperatorDisplay();
+});
+
+multiply.addEventListener('click', function () {
+ currentOperator = '*';
+ updateOperatorDisplay();
+});
+
+divide.addEventListener('click', function () {
+ currentOperator = '/';
+ updateOperatorDisplay();
+});
+
+
+function updateOperatorDisplay() {
+ if (!FirstNumber && FirstNumber !== 0) return; //the second check is for 0 value, that pass the first condition
+
+ const text = display.textContent;
+ const lastChar = text[text.length - 1]; //get last character to check if it's an operator
+
+ if (['+', '-', '*', '/'].includes(lastChar)) {
+ display.textContent = text.slice(0, -1) + currentOperator; //replace last operator with new one
+ } else {
+ display.textContent += currentOperator;
+ }
+
+ console.log(`operator ${currentOperator}`);
+}
+
+
+
+clear.addEventListener('click', function () {
+ FirstNumber = null;
+ SecondNumber = null;
+ currentOperator = null;
+ result = null;
+ display.innerHTML = ' '; // Keep display from collapsing
+
+ console.clear()
+ console.log('clear');
+});
+
+equal.addEventListener('click', function () {
+ if (currentOperator == '+') {
+ result = Number(FirstNumber) + Number(SecondNumber);
+ }
+
+ if (currentOperator == '-') {
+ result = Number(FirstNumber) - Number(SecondNumber);
+ }
+
+ if (currentOperator == '*') {
+ result = Number(FirstNumber) * Number(SecondNumber);
+ }
+
+ if (currentOperator == '/') {
+ result = Number(FirstNumber) / Number(SecondNumber);
+ }
+ const limitedResult = Number(result.toFixed(8)); // Limit to 8 decimal places
+ display.textContent = limitedResult;
+ console.log(result)
+ FirstNumber = null;
+ SecondNumber = null;
+ currentOperator = null;
+});
\ No newline at end of file