MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
// --- COMMON.JS: Minimal Calculator | // --- COMMON.JS: Minimal Calculator (ES5 safe) --- | ||
mw.hook('wikipage.content').add(function () { | |||
var container = document.getElementById("calcContainer"); | |||
if (!container) return; | if (!container) return; | ||
container.innerHTML = | |||
container.innerHTML = | '<div style="margin:10px 0;">' + | ||
<div style="margin:10px 0;"> | '<label>Num1: <input type="number" id="num1" value="0" style="width:60px;"></label> ' + | ||
<label>Num1: <input type="number" id="num1" value="0" style="width:60px;"></label> | '<label>Num2: <input type="number" id="num2" value="0" style="width:60px;"></label> ' + | ||
<label>Num2: <input type="number" id="num2" value="0" style="width:60px;"></label> | '<label>Operation: ' + | ||
<label>Operation: | '<select id="op">' + | ||
<select id="op"> | '<option value="+">+</option>' + | ||
<option value="+">+</option> | '<option value="-">-</option>' + | ||
<option value="-">-</option> | '<option value="*">*</option>' + | ||
<option value="*">*</option> | '<option value="/">/</option>' + | ||
<option value="/">/</option> | '</select>' + | ||
</select> | '</label> ' + | ||
</label> | '<button id="calcButton">Calculate</button>' + | ||
<button id="calcButton">Calculate</button> | '</div>' + | ||
</div> | '<div>Result: <span id="result">0</span></div>'; | ||
<div>Result: <span id="result">0</span></div> | |||
var btn = document.getElementById("calcButton"); | |||
btn.onclick = function () { | |||
var a = parseFloat(document.getElementById("num1").value); | |||
var b = parseFloat(document.getElementById("num2").value); | |||
var op = document.getElementById("op").value; | |||
var result; | |||
if (isNaN(a) || isNaN(b)) { | if (isNaN(a) || isNaN(b)) { | ||
| Line 43: | Line 39: | ||
} | } | ||
document.getElementById("result").textContent = result; | document.getElementById("result").textContent = result; | ||
} | }; | ||
}); | }); | ||
Revision as of 02:36, 5 March 2026
// --- COMMON.JS: Minimal Calculator (ES5 safe) ---
mw.hook('wikipage.content').add(function () {
var container = document.getElementById("calcContainer");
if (!container) return;
container.innerHTML =
'<div style="margin:10px 0;">' +
'<label>Num1: <input type="number" id="num1" value="0" style="width:60px;"></label> ' +
'<label>Num2: <input type="number" id="num2" value="0" style="width:60px;"></label> ' +
'<label>Operation: ' +
'<select id="op">' +
'<option value="+">+</option>' +
'<option value="-">-</option>' +
'<option value="*">*</option>' +
'<option value="/">/</option>' +
'</select>' +
'</label> ' +
'<button id="calcButton">Calculate</button>' +
'</div>' +
'<div>Result: <span id="result">0</span></div>';
var btn = document.getElementById("calcButton");
btn.onclick = function () {
var a = parseFloat(document.getElementById("num1").value);
var b = parseFloat(document.getElementById("num2").value);
var op = document.getElementById("op").value;
var result;
if (isNaN(a) || isNaN(b)) {
result = "Enter valid numbers";
} else {
switch(op) {
case "+": result = a + b; break;
case "-": result = a - b; break;
case "*": result = a * b; break;
case "/": result = b !== 0 ? a / b : "∞"; break;
default: result = "Error";
}
}
document.getElementById("result").textContent = result;
};
});