function Calculator(calculatorContainerId) {
calculatorContainerId.innerHTML =
` <div class="row">
<input disabled type="text" value="0" class="operations-display">
</div>
<div class="row">
<button class="operation">+</button>
<button class="operation">-</button>
<button class="operation">*</button>
<button class="operation">/</button>
</div>
<div class="row">
<button class="number">7</button>
<button class="number">8</button>
<button class="number">9</button>
</div>
<div class="row">
<button class="number">4</button>
<button class="number">5</button>
<button class="number">6</button>
</div>
<div class="row">
<button class="number">1</button>
<button class="number">2</button>
<button class="number">3</button>
</div>
<div class="row">
<button class="number decimal">.</button>
<button class="number">0</button>
<button class="reset">CE</button>
</div>
<div class="row">
<button class="operation equal">=</button>
</div>`;
this.display = calculatorContainerId.querySelector('.operations-display');
this.equalButton = calculatorContainerId.querySelector('.equal');
this.numberButtons = calculatorContainerId.getElementsByClassName('number');
this.operationButtons = calculatorContainerId.getElementsByClassName('operation');
this.resetButton = calculatorContainerId.getElementsByClassName('reset');
this.memoryCurrentNumber = 0;
this.memoryNewNumber = 0;
this.memoryPendingOperation = '';
var that = this;
for (var i = 0; i < this.numberButtons.length; i++) {
var clickedNumberButton = this.numberButtons[i];
clickedNumberButton.addEventListener('click', function (e) {
that.clickOnNumberButton(e);
});
};
for (var i = 0; i < this.operationButtons.length; i++) {
var clickedOperationButton = this.operationButtons[i];
clickedOperationButton.addEventListener('click', function (e) {
that.clickOnOperationButton(e);
});
};
for (var i = 0; i < this.resetButton.length; i++) {
var element = this.resetButton[i];
element.addEventListener('click', function (e) {
that.display.value = 0;
})
};
this.clickOnNumberButton = function (e) {
// remove zero in input if new number
if (this.memoryNewNumber) {
this.display.value = e.currentTarget.innerHTML;
this.memoryNewNumber = false;
} else {
if (this.display.value === '0') {
this.display.value = e.currentTarget.innerHTML;
} else {
this.display.value += e.currentTarget.innerHTML;
};
};
};
this.clickOnOperationButton = function (e) {
var localOperationMemory = this.display.value;
if (this.memoryNewNumber && this.memoryPendingOperation !== '=') {
this.display.value = this.memoryCurrentNumber;
} else {
this.memoryNewNumber = true;
if (this.memoryPendingOperation === '+') {
this.memoryCurrentNumber += parseFloat(localOperationMemory);
} else if (this.memoryPendingOperation === '-') {
this.memoryCurrentNumber -= parseFloat(localOperationMemory);
} else if (this.memoryPendingOperation === '*') {
this.memoryCurrentNumber *= parseFloat(localOperationMemory);
} else if (this.memoryPendingOperation === '/') {
this.memoryCurrentNumber /= parseFloat(localOperationMemory);
} else {
this.memoryCurrentNumber = parseFloat(localOperationMemory);
};
this.display.value = this.memoryCurrentNumber;
this.memoryPendingOperation = e.currentTarget.innerHTML;
};
};
}