diff --git a/samples/calc-02/index.js b/samples/calc-02/index.js index c4335ea..5f69357 100644 --- a/samples/calc-02/index.js +++ b/samples/calc-02/index.js @@ -119,30 +119,17 @@ function clearStatus() { statusLine.classList.remove('is-error'); } -function normalizeStack() { - // Demo display only shows the top 4 stack values; the calculator stack remains unlimited. -} - function getStackLine(indexFromTop) { return indexFromTop >= 0 && indexFromTop < calc.stack.length ? calc.stack[indexFromTop] : ''; } -function getEditingDisplayValue() { - if (!calc.isEditing) return ''; - return calc.inputValue; -} - function getStackDisplayValue(label) { - if (label === 'X') { - return calc.isEditing ? getEditingDisplayValue() : (calc.formatNumber(getStackLine(0)) || ''); + if (label === 'X' && calc.isEditing) { + return calc.inputValue; } - if (label === 'Y') { - return calc.isEditing ? (calc.formatNumber(getStackLine(0)) || '') : (calc.formatNumber(getStackLine(1)) || ''); - } - if (label === 'Z') { - return calc.isEditing ? (calc.formatNumber(getStackLine(1)) || '') : (calc.formatNumber(getStackLine(2)) || ''); - } - return calc.isEditing ? (calc.formatNumber(getStackLine(2)) || '') : (calc.formatNumber(getStackLine(3)) || ''); + const indexMap = { X: 0, Y: 1, Z: 2, T: 3 }; + const indexFromTop = calc.isEditing ? Math.max(0, indexMap[label] - 1) : indexMap[label]; + return calc.formatNumber(getStackLine(indexFromTop)) || ''; } function updateCopyButtons() { @@ -156,16 +143,18 @@ function updateCopyButtons() { } } +function renderEditValue() { + const cursor = Math.max(0, Math.min(editCursor, calc.inputValue.length)); + stackEls.X.innerHTML = `${calc.inputValue.slice(0, cursor)}${calc.inputValue.slice(cursor)}`; +} + function render() { const isPortrait = window.matchMedia('(orientation: portrait)').matches || window.innerWidth <= 860; calculatorEl?.classList.toggle('portrait', isPortrait); calculatorEl?.classList.toggle('landscape', !isPortrait); - const xValue = getStackDisplayValue('X'); + stackEls.X.textContent = calc.isEditing ? '' : getStackDisplayValue('X'); if (calc.isEditing) { - const cursor = Math.max(0, Math.min(editCursor, calc.inputValue.length)); - stackEls.X.innerHTML = `${calc.inputValue.slice(0, cursor)}${calc.inputValue.slice(cursor)}`; - } else { - stackEls.X.textContent = xValue; + renderEditValue(); } stackEls.Y.textContent = getStackDisplayValue('Y'); stackEls.Z.textContent = getStackDisplayValue('Z'); @@ -184,6 +173,10 @@ function stopEditing(clearValue = false) { editCursor = 0; } +function moveEditCursor(delta) { + editCursor = Math.max(0, Math.min(calc.inputValue.length, editCursor + delta)); +} + function pushEditingValueIfNeeded() { if (!calc.isEditing) return; if (calc.inputValue !== '') { @@ -194,6 +187,16 @@ function pushEditingValueIfNeeded() { editCursor = 0; } +function startEditingFromStackTop() { + if (!calc.isValidIndex(0)) return false; + const value = calc.stack[0]; + calc.remove(0); + calc.isEditing = true; + calc.inputValue = calc.formatNumber(value); + editCursor = calc.inputValue.length; + return true; +} + function inputToX(value) { if (!calc.isEditing) { calc.isEditing = true; @@ -210,8 +213,7 @@ function inputToX(value) { editCursor += value.length; } if (calc.inputValue === '') { - calc.isEditing = false; - editCursor = 0; + stopEditing(); } } @@ -261,9 +263,7 @@ function execute(name) { if (calc.isEditing) { const hasSign = calc.inputValue.startsWith('-'); calc.inputValue = hasSign ? calc.inputValue.slice(1) : `-${calc.inputValue}`; - if (!hasSign) editCursor += 1; - if (hasSign) editCursor = Math.max(0, editCursor - 1); - editCursor = Math.max(0, Math.min(editCursor, calc.inputValue.length)); + moveEditCursor(hasSign ? -1 : 1); } else { calc.command('neg'); } @@ -340,7 +340,7 @@ function handleKeyboard(event) { if (key === 'ArrowLeft') { event.preventDefault(); if (calc.isEditing) { - editCursor = Math.max(0, editCursor - 1); + moveEditCursor(-1); render(); return; } @@ -350,7 +350,7 @@ function handleKeyboard(event) { if (key === 'ArrowRight') { event.preventDefault(); if (calc.isEditing) { - editCursor = Math.min(calc.inputValue.length, editCursor + 1); + moveEditCursor(1); render(); return; } @@ -511,27 +511,22 @@ constButton.addEventListener('click', (event) => { leftButton.addEventListener('click', () => { if (calc.isEditing) { - editCursor = Math.max(0, editCursor - 1); + moveEditCursor(-1); render(); focusInput(); } }); downButton.addEventListener('click', () => { -if (!calc.isEditing && calc.isValidIndex(0)) { - const value = calc.stack[0]; - calc.remove(0); - calc.isEditing = true; - calc.inputValue = calc.formatNumber(value); - editCursor = calc.inputValue.length; - render(); - focusInput(); -} + if (!calc.isEditing && startEditingFromStackTop()) { + render(); + focusInput(); + } }); rightButton.addEventListener('click', () => { if (calc.isEditing) { - editCursor = Math.min(calc.inputValue.length, editCursor + 1); + moveEditCursor(1); render(); focusInput(); return;