feat: update calculator function key labels and shortcuts

Add titles for function and trig buttons to expose keyboard hints, and remap reciprocal/power10 shortcuts to match the new key layout.
Update the portrait visual spec to reflect the revised keypad and function ordering.
This commit is contained in:
2026-05-17 00:35:50 +02:00
parent 16b567731f
commit 62a0f447c5
2 changed files with 27 additions and 26 deletions
+19 -18
View File
@@ -53,28 +53,28 @@ const keypadKeys = [
];
const functionKeys = [
{ label: 'x²', action: 'sqr', className: 'key-default' },
{ label: '', action: 'pow', className: 'key-default' },
{ label: '1/x', action: 'recip', className: 'key-default' },
{ label: 'x²', action: 'sqr', className: 'key-default', title: 's' },
{ label: '√x', action: 'sqrt', className: 'key-default', title: 'r' },
{ label: '1/x', action: 'recip', className: 'key-default', title: 'v' },
{ label: '%', action: 'mod', className: 'key-default' },
{ label: '√x', action: 'sqrt', className: 'key-default' },
{ label: 'y√x', action: 'root', className: 'key-default' },
{ label: '10ˣ', action: 'pow10', className: 'key-default' },
{ label: '', action: 'pow', className: 'key-default', title: 'S' },
{ label: 'y√x', action: 'root', className: 'key-default', title: 'R' },
{ label: '10ˣ', action: 'pow10', className: 'key-default', title: 'u' },
{ label: '', spacer: true },
{ label: 'log', action: 'log', className: 'key-default' },
{ label: 'ln', action: 'ln', className: 'key-default' },
{ label: 'eˣ', action: 'exp', className: 'key-default' },
{ label: 'log', action: 'log', className: 'key-default', title: 'l / L' },
{ label: 'ln', action: 'ln', className: 'key-default', title: 'n / N' },
{ label: 'eˣ', action: 'exp', className: 'key-default', title: 'e / E' },
{ label: '', spacer: true },
];
const trigoKeys = [
{ label: 'sin', action: 'sin', className: 'key-default' },
{ label: 'cos', action: 'cos', className: 'key-default' },
{ label: 'tan', action: 'tan', className: 'key-default' },
{ label: 'sin', action: 'sin', className: 'key-default', title: 'i' },
{ label: 'cos', action: 'cos', className: 'key-default', title: 'o' },
{ label: 'tan', action: 'tan', className: 'key-default', title: 'a' },
{ label: '', spacer: true },
{ label: 'asin', action: 'asin', className: 'key-default' },
{ label: 'acos', action: 'acos', className: 'key-default' },
{ label: 'atan', action: 'atan', className: 'key-default' },
{ label: 'asin', action: 'asin', className: 'key-default', title: 'I' },
{ label: 'acos', action: 'acos', className: 'key-default', title: 'O' },
{ label: 'atan', action: 'atan', className: 'key-default', title: 'A' },
{ label: '', spacer: true },
];
@@ -280,7 +280,7 @@ function execute(name) {
}
}
function createKeyButton({ label, input, action, spacer, className }) {
function createKeyButton({ label, input, action, spacer, className, title }) {
if (spacer) {
const div = document.createElement('div');
return div;
@@ -289,6 +289,7 @@ function createKeyButton({ label, input, action, spacer, className }) {
button.type = 'button';
button.textContent = label;
button.className = className;
if (title) button.title = title;
button.addEventListener('click', () => {
if (input) {
inputToX(input);
@@ -340,8 +341,8 @@ function handleKeyboard(event) {
S: 'pow',
r: 'sqrt',
R: 'root',
v: 'recip',
u: 'pow10',
x: 'recip',
d: 'pow10',
l: 'log',
L: 'log',
n: 'ln',