Refactor the calc-02 demo to use a single popup menu component for angle mode and constants, align the menus to their trigger buttons, and update the README/project notes to reflect the portrait-first demo layout and constant API.
RPN Virtual Calculator
A browser-friendly RPN calculator built around a small, generic JavaScript API.
Overview
This project provides:
- a reusable JavaScript RPN engine in
src/rpn-calculator.js - browser demos in
samples/dev/andsamples/calc-02/ - a command system centralized in a single operation dictionary
- a small public API focused on stack operations and generic command dispatch
The main class is RpnCalculator.
Project structure
src/rpn-calculator.js: calculator enginesamples/dev/index.html: browser demo entry pointsamples/dev/index.css: demo stylessamples/dev/index.js: demo UI and keyboard logicsamples/calc-01/index.html: active browser demo entry pointsamples/calc-01/index.css: demo stylessamples/calc-01/index.js: demo UI and keyboard logicsamples/calc-02/index.html: portrait-first HP48GX-style demo entry pointsamples/calc-02/index.css: portrait-first demo stylessamples/calc-02/index.js: portrait-first HP48GX-style demo UI and keyboard logicsamples/calc-XX/: placeholder name for future demo variants
Public API
The calculator API is centered on these methods:
push(value)pop()clear()swap(index1, index2)remove(index)edit(index)isValidIndex(index)input(command)command(name, ...args)
Instance helpers also available:
getOperationsByCategory()getConstants()listConstants()setConstant(name, value)removeConstant(name)hasConstant(name)
Static helpers also available:
RpnCalculator.getOperationCategories()RpnCalculator.getOperationsByCategory()
State exposed on instances:
inputValueas a stringisEditingas a booleanstackas the current internal stack array used by the demoangleModebasemaxSize
Constructor options
const calc = new RpnCalculator({
maxSize: 2048,
base: 10,
angleMode: 'deg',
enabledCommands: ['add', 'sub', 'mul', 'div']
});
Supported options:
maxSize: maximum stack size, default2048base: numeric base, default10, accepted range2..16angleMode:deg,rad, orgrad, defaultdegenabledCommands: optional whitelist of enabled commands and aliases
Constants
Available constants:
pie- plus any user-defined constants added through the engine API
They can be used through command(...):
calc.command('pi');
calc.command('e');
Supported commands
Stack
enterdupdropswapclear
Arithmetic
addalias:+subalias:-mulalias:*divalias:/modalias:%powaliases:^,y^xrootaliases:y√x,yroot,nrootsqrnegsqrtalias:sqrt(x)recipalias:1/xlogln
Trigonometry
sincostanasinacosatan
Behavior notes
modis a percentage operator:a b % => (a * b) / 100
powaccepts aliases^andy^xsqrtaccepts aliassqrt(x)recipaccepts alias1/xdivandrecipthrowDivision by zerowhen neededrootcomputes the y-th root asx^(1/y)and throwsInvalid input for rootfor invalid inputssqrtthrowsInvalid input for sqrtfor negative valuesasinandacosthrow explicit domain errors outside[-1, 1]logthrowsInvalid input for logfor values<= 0lnthrowsInvalid input for lnfor values<= 0logusesMath.log10lnusesMath.log- direct trigonometric functions convert input using
toRadians(...) - inverse trigonometric functions convert results back using the current angle mode
angleModesupportsdeg,rad, andgrad- formatted numeric values are rounded to 12 decimal places
-0is normalized to0inputValueremains a string to preserve future non-decimal input support- base 10 input is parsed with
Number(...) - non-decimal input currently uses
parseInt(..., base)
Input handling
input(command) supports two modes:
- single-character editing input
- command dispatch
Accepted single-character editing input currently includes:
0-9A-Fa-f+-.
Everything else is forwarded to command(...).
Basic usage
CommonJS
const RpnCalculator = require('./src/rpn-calculator');
const calc = new RpnCalculator();
calc.push(2);
calc.push(3);
calc.command('add');
console.log(calc.pop()); // 5
Browser
<script src="./src/rpn-calculator.js"></script>
<script>
const calc = new RpnCalculator({ angleMode: 'deg' });
calc.push(9);
calc.command('sqrt');
console.log(calc.pop());
</script>
Editing values through input(...)
const calc = new RpnCalculator();
calc.input('1');
calc.input('2');
calc.input('.');
calc.input('5');
calc.command('enter');
console.log(calc.pop()); // 12.5
Aliases
const calc = new RpnCalculator();
calc.push(6);
calc.push(7);
calc.command('+');
console.log(calc.pop()); // 13
Constants and trigonometry
const calc = new RpnCalculator({ angleMode: 'deg' });
calc.command('pi');
console.log(calc.pop());
calc.push(30);
calc.command('sin');
console.log(calc.pop()); // 0.5
Demo
The active demo lives in samples/dev/.
Main UI features:
- four visible stack lines
- main display/status area
- visible angle mode indicator
- angle mode selector for
deg,rad, andgrad - status pills for
inputValueandisEditing - grouped panels for
Stack,Arithmetic,Trigonometry, andConstants - error display area
Calc 02 demo
samples/calc-02/ is a portrait-first HP48GX-inspired demo.
It keeps the display-adjacent button row aligned in four columns, uses compact popup menus for mode and constants, and supports clipboard paste plus the y√x root operation.
The demo loads the engine from:
<script src="../../src/rpn-calculator.js"></script>
Demo keyboard support
The current demo supports:
- digits and decimal point
- numpad digits and numpad arithmetic keys
EnterBackspaceDeleteEscapeArrowUp,ArrowDown,ArrowRight+,-,*,/,%,^q,n,r,i,g,l,s,c,S,Cx,y,z,t
The demo also implements stack selection and stack-item move mode in its UI layer using the public calculator methods. It keeps the calculator screen focused and updates the visible stack window as the selection moves.
Exports
RpnCalculator is exposed in both environments:
- browser:
window.RpnCalculator - CommonJS:
module.exports = RpnCalculator