mstoeck3/fscalc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix calculator

Browse Source
This commit is contained in:
overcuriousity
2025-10-04 20:20:08 +02:00
parent 1cfcb0a0b1
commit 444294b9fb
2 changed files with 40 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
webroot/js/calculator.js
View File

@@ -122,26 +122,23 @@ export class Calculator {
}
setupEventListeners() {
// Button clicks
// Event delegation for calculator buttons
document.addEventListener('click', (e) => {
if (e.target.classList.contains('calc-btn')) {
const action = e.target.getAttribute('onclick');
if (action) {
// Parse the onclick attribute to determine the action
if (action.includes('calcInput')) {
const match = action.match(/calcInput\('([^']+)'\)/);
if (match) this.input(match[1]);
} else if (action.includes('calcOperation')) {
const match = action.match(/calcOperation\('([^']+)'\)/);
if (match) this.operation(match[1]);
} else if (action.includes('calcEquals')) {
this.equals();
} else if (action.includes('calcClear')) {
this.clear();
} else if (action.includes('calcBackspace')) {
this.backspace();
}
}
// Only handle clicks on calculator buttons
if (!e.target.classList.contains('calc-btn')) return;
const button = e.target;
if (button.classList.contains('number')) {
this.input(button.textContent);
} else if (button.classList.contains('operation')) {
this.operation(button.textContent);
} else if (button.classList.contains('equals')) {
this.equals();
} else if (button.classList.contains('clear')) {
this.clear();
} else if (button.classList.contains('backspace')) {
this.backspace();
}
});
@@ -203,38 +200,38 @@ export class Calculator {
</div>
<div class="calc-buttons">
<div class="calc-row">
<button class="calc-btn number" onclick="calcInput('A')">A</button>
<button class="calc-btn number" onclick="calcInput('B')">B</button>
<button class="calc-btn number" onclick="calcInput('C')">C</button>
<button class="calc-btn number" onclick="calcInput('D')">D</button>
<button class="calc-btn clear" onclick="calcClear()">C</button>
<button class="calc-btn number">A</button>
<button class="calc-btn number">B</button>
<button class="calc-btn number">C</button>
<button class="calc-btn number">D</button>
<button class="calc-btn clear">C</button>
</div>
<div class="calc-row">
<button class="calc-btn number" onclick="calcInput('E')">E</button>
<button class="calc-btn number" onclick="calcInput('F')">F</button>
<button class="calc-btn number" onclick="calcInput('7')">7</button>
<button class="calc-btn number" onclick="calcInput('8')">8</button>
<button class="calc-btn operation" onclick="calcOperation('/')">/</button>
<button class="calc-btn number">E</button>
<button class="calc-btn number">F</button>
<button class="calc-btn number">7</button>
<button class="calc-btn number">8</button>
<button class="calc-btn operation">/</button>
</div>
<div class="calc-row">
<button class="calc-btn number" onclick="calcInput('4')">4</button>
<button class="calc-btn number" onclick="calcInput('5')">5</button>
<button class="calc-btn number" onclick="calcInput('6')">6</button>
<button class="calc-btn operation" onclick="calcOperation('*')">*</button>
<button class="calc-btn operation" onclick="calcOperation('MOD')">MOD</button>
<button class="calc-btn number">4</button>
<button class="calc-btn number">5</button>
<button class="calc-btn number">6</button>
<button class="calc-btn operation">*</button>
<button class="calc-btn operation">MOD</button>
</div>
<div class="calc-row">
<button class="calc-btn number" onclick="calcInput('1')">1</button>
<button class="calc-btn number" onclick="calcInput('2')">2</button>
<button class="calc-btn number" onclick="calcInput('3')">3</button>
<button class="calc-btn operation" onclick="calcOperation('-')">-</button>
<button class="calc-btn operation" onclick="calcOperation('+')">+</button>
<button class="calc-btn number">1</button>
<button class="calc-btn number">2</button>
<button class="calc-btn number">3</button>
<button class="calc-btn operation">-</button>
<button class="calc-btn operation">+</button>
</div>
<div class="calc-row">
<button class="calc-btn number wide" onclick="calcInput('0')">0</button>
<button class="calc-btn number" onclick="calcInput('9')">9</button>
<button class="calc-btn backspace" onclick="calcBackspace()">⌫</button>
<button class="calc-btn equals" onclick="calcEquals()">=</button>
<button class="calc-btn number wide">0</button>
<button class="calc-btn number">9</button>
<button class="calc-btn backspace">⌫</button>
<button class="calc-btn equals">=</button>
</div>
</div>
</div>