From 5826973f972e5f2484c6cb240d2ee2f76f83ccd6 Mon Sep 17 00:00:00 2001 From: Chirayu Date: Sun, 1 Oct 2023 21:05:03 +0530 Subject: [PATCH] feat: view previous results using local storage --- index.html | 13 ++++++---- script.js | 69 ++++++++++++++++++++++++++++++++++++------------------ 2 files changed, 55 insertions(+), 27 deletions(-) diff --git a/index.html b/index.html index 5633e64..aa9d4fb 100644 --- a/index.html +++ b/index.html @@ -1,5 +1,6 @@ + @@ -9,11 +10,12 @@ +

Welcome to Calculate me!

- +
@@ -55,11 +57,14 @@

Welcome to Calculate me!

-
- - +
+

Calculation History

+ +
+ + \ No newline at end of file diff --git a/script.js b/script.js index 2188349..f6a0e80 100644 --- a/script.js +++ b/script.js @@ -1,27 +1,50 @@ -let string=""; -let buttons=document.querySelectorAll('.button'); -Array.from(buttons).forEach((button)=>{ - button.addEventListener('click',(e)=>{ - if(e.target.innerHTML=='='){ - string=eval(string); - document.querySelector('input').value=string; - } - else if(e.target.innerHTML=='C'){ - string=""; - document.querySelector('input').value=string; - } +let calculationString = ""; +let calculationHistory = []; // To store the calculation history - else if(e.target.innerHTML=='Bksp'){ - string=string.slice(0,string.length-1); - document.querySelector('input').value=string; - } +// Function to update the input field and store history +function updateInputAndHistory() { + document.querySelector('input').value = calculationString; + localStorage.setItem('calculationHistory', JSON.stringify(calculationHistory)); + updateHistoryList(); // Update the history list +} +// Load calculation history from local storage if it exists +const savedCalculationHistory = localStorage.getItem('calculationHistory'); +if (savedCalculationHistory) { + calculationHistory = JSON.parse(savedCalculationHistory); + updateHistoryList(); // Update the history list when the page loads +} +function updateHistoryList() { + const historyList = document.getElementById('history-list'); + historyList.innerHTML = ""; // Clear the existing list - else{ - console.log(e.target); - string+=e.target.innerHTML; - document.querySelector('input').value=string; - } + calculationHistory.forEach((calculation) => { + const listItem = document.createElement('li'); + listItem.textContent = calculation; + historyList.appendChild(listItem); + }); +} - }) -}) \ No newline at end of file +let buttons = document.querySelectorAll('.button'); +Array.from(buttons).forEach((button) => { + button.addEventListener('click', (e) => { + if (e.target.innerHTML == '=') { + + let result = eval(calculationString); + + calculationHistory.push(`${calculationString} = ${result}`); + calculationString = result.toString(); + + updateInputAndHistory(); + } else if (e.target.innerHTML == 'C') { + calculationString = ""; + updateInputAndHistory(); + } else if (e.target.innerHTML == 'Bksp') { + calculationString = calculationString.slice(0, calculationString.length - 1); + updateInputAndHistory(); + } else { + calculationString += e.target.innerHTML; + updateInputAndHistory(); + } + }); +}); \ No newline at end of file