69 lines
2.4 KiB
HTML
69 lines
2.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>HP48-style RPN Calculator</title>
|
|
<link rel="stylesheet" href="./index.css">
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<div class="calc">
|
|
<div class="brand">
|
|
<h1>HP48-style RPN</h1>
|
|
<small>powered by src/rpn-calculator.js</small>
|
|
</div>
|
|
|
|
<div class="screen" id="screen" tabindex="0" role="application" aria-label="HP48 style calculator screen">
|
|
<div class="screen-top">
|
|
<div>RPN stack</div>
|
|
<div id="modeLabel">deg</div>
|
|
</div>
|
|
<div id="stack" class="stack"></div>
|
|
<div id="display"></div>
|
|
</div>
|
|
|
|
<input id="input" class="hidden-input" type="text" autocomplete="off" aria-hidden="true" tabindex="-1">
|
|
|
|
<div class="toolbar">
|
|
<div class="status">
|
|
<div class="pill">inputValue: <span id="inputValueLabel"></span></div>
|
|
<div class="pill">isEditing: <span id="editingLabel"></span></div>
|
|
</div>
|
|
|
|
<label class="mode-select">
|
|
<span>Angle</span>
|
|
<select id="angleMode">
|
|
<option value="deg">Degrees</option>
|
|
<option value="rad">Radians</option>
|
|
<option value="grad">Grads</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="keyboard-layout">
|
|
<section class="key-group key-group-functions" aria-label="Functions">
|
|
<div class="group-title">Functions</div>
|
|
<div class="key-grid functions-grid" id="functionsButtons"></div>
|
|
</section>
|
|
|
|
<section class="key-group key-group-numbers" aria-label="Numbers">
|
|
<div class="group-title">Numbers</div>
|
|
<div class="key-grid numbers-grid" id="numbersButtons"></div>
|
|
</section>
|
|
|
|
<section class="key-group key-group-operators" aria-label="Operators">
|
|
<div class="group-title">Operators</div>
|
|
<div class="key-grid operators-grid" id="operatorsButtons"></div>
|
|
</section>
|
|
</div>
|
|
|
|
<div id="error" class="error"></div>
|
|
<div class="hint">Keyboard: digits, numpad, Enter, Backspace, Delete, Esc, ↑, ↓, →, +, -, *, /, %, ^, q, n, r, i, g, l, s, c, S, C, x, y, z, t</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="../../src/rpn-calculator.js"></script>
|
|
<script src="./index.js"></script>
|
|
</body>
|
|
</html> |