snowprint/geek-calc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
geek-calc/README.md
snowprint 54f427ea21
Some checks failed
Deploy to GitHub Pages / build-and-deploy (push) Has been cancelled
Details
init geek calc
2025-10-04 10:53:41 +08:00

2.3 KiB
Raw Permalink Blame History

Geek Calculator

A single-file, offline-capable calculator with a terminal-like interface. Features basic arithmetic operations, RPN mode, keyboard-first operation, and a "geek vibe" aesthetic.

Features

  • Basic arithmetic operations (+, -, ×, ÷)
  • Parentheses support for complex expressions
  • Percentage calculations
  • Positive/negative toggle (±)
  • RPN (Reverse Polish Notation) mode
  • Full keyboard operation
  • Command palette (access with @ key)
  • Calculation history with re-run capability
  • Terminal-themed UI with ASCII banner
  • Full offline capability
  • Keyboard accessibility (ARIA roles, focus indicators)

Usage

Basic Operations

  • Click buttons or use keyboard: +, -, *, /, =
  • Use Enter to evaluate expressions
  • Use Escape to clear current input
  • Use Backspace to delete last character

RPN Mode

  • Toggle RPN mode with the RPN button
  • Enter numbers followed by operators
  • Example: To calculate 4 + 6, enter: 4 ENTER 6 +

Keyboard Controls

  • Numbers: 0-9
  • Operators: +, -, *, /
  • Equals: Enter or =
  • Clear: Escape or C
  • Decimal: .
  • Backspace: Backspace
  • RPN Enter: Enter (in RPN mode)
  • Toggle RPN: R
  • Command Palette: @
  • History Navigation: ↑ and ↓
  • Help: ?

Command Palette

  • Press @ to open the command palette
  • Type commands like "clear", "history", "theme", etc.

Offline Capability

The calculator works completely offline. The first time you load it, it will cache all necessary files using a service worker.

Technical Details

  • Pure HTML/CSS/JavaScript (no external dependencies)
  • Total payload < 50KB
  • Uses ES6 modules for code organization
  • Service worker for offline functionality
  • LocalStorage for calculation history
  • Accessible with full keyboard navigation and ARIA roles

Development

To run tests:

  1. Open tests/index.html in your browser
  2. Tests will run automatically

Architecture

  • calculator.js: Core calculator logic
  • rpn-calculator.js: RPN calculator implementation
  • ui.js: User interface interactions
  • state.js: Application state management
  • utils.js: Utility functions
  • styles.css: All styling (dark theme, ASCII art, responsive)
  • service-worker.js: Offline functionality
  • manifest.webmanifest: PWA features

Size Budget

The entire application is designed to stay under 50KB total payload.