<html>
<head>
<title>Binary Calculator</title>
</head>
<body>
<h1>Binary Calculator</h1>
<form>
<input type="text" id="first-number" placeholder="First Number">
<input type="text" id="second-number" placeholder="Second Number">
<button type="button" id="add-button">+</button>
<button type="button" id="subtract-button">-</button>
<button type="button" id="multiply-button">*</button>
<button type="button" id="divide-button">/</button>
<button type="button" id="modulo-button">%</button>
<button type="button" id="clear-button">Clear</button>
<p id="result"></p>
</form>
<script>
function binaryToDecimal(binary) {
var decimal = 0;
var power = 0;
for (var i = binary.length - 1; i >= 0; i--) {
decimal += binary[i] * Math.pow(2, power);
power++;
}
return decimal;
}
function decimalToBinary(decimal) {
var binary = "";
while (decimal > 0) {
binary = decimal % 2 + binary;
decimal = Math.floor(decimal / 2);
}
return binary;
}
function add(a, b) {
return a + b;
}
function subtract(a, b) {
return a - b;
}
function multiply(a, b) {
return a * b;
}
function divide(a, b) {
return a / b;
}
function modulo(a, b) {
return a % b;
}
function calculate(a, b, operation) {
var decimalA = binaryToDecimal(a);
var decimalB = binaryToDecimal(b);
var decimalResult = operation(decimalA, decimalB);
var binaryResult = decimalToBinary(decimalResult);
return binaryResult;
}
var firstNumber = document.getElementById("first-number");
var secondNumber = document.getElementById("second-number");
var addButton = document.getElementById("add-button");
var subtractButton = document.getElementById("subtract-button");
var moduloButton = document.getElementById("modulo-button");
var clearButton = document.getElementById("clear-button");
var result = document.getElementById("result");
addButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, add);
});
subtractButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, subtract);
});
multiplyButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, multiply);
});
divideButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, divide);
});
moduloButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, modulo);
});
clearButton.addEventListener("click", function() {
firstNumber.value = "";
secondNumber.value = "";
result.innerHTML = "";
});
</script>
</body>
</html var multiplyButton = document.getElementById("multiply-button");
var divideButton = document.getElementById("divide-button");
var moduloButton = document.getElementById("modulo-button");
var clearButton = document.getElementById("clear-button");
var result = document.getElementById("result");
addButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, add);
});
subtractButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, subtract);
});
multiplyButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, multiply);
});
divideButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, divide);
});
moduloButton.addEventListener("click", function() {
result.innerHTML = calculate(firstNumber.value, secondNumber.value, modulo);
});
clearButton.addEventListener("click", function() {
firstNumber.value = "";
secondNumber.value = "";
result.innerHTML = "";
});
</script>
</body>
</html>
