ミックラー加算機のエミュレーターを作ってみた

以前紹介したミックラー加算機のエミュレーターを作りました。数字の位置を押さえてスライドキーを引く、実機の操作を試せるようしてみました。

ブラウザで操作できるエミュレーター

ミックラー加算機のエミュレーターを開く

インストールは不要です。マウスや指で数字の位置を押さえ、そのまま下へ引いて操作します。スマホとかタブレットのほうが直感的な操作ができて勧めだと思います。

左から「拾万・万・千・百・拾・円」の6桁が並び、下の答え窓に結果が出ます。黒数字は足し算用、小さな赤数字は引き算用です。右側のレバーを下へ引くか、クリックするとゼロに戻ります。

何から触ればいいか分からない場合は、画面上部の「チュートリアル」から始められます。足し算と引き算のコースがあり、次に操作する箇所を光らせて、順番に案内するようにしました。

操作方法をまとめて読みたい場合は「説明」をどうぞ。

実装について

ソースコードはGitHubに置いています。言語はTypeScriptです。簡単な実装なのでフレームワーク等は使っていません。

計算部分で行っているのは、スライドキーを引いた段数に、その桁の位を掛けて足すことです。引き算も赤数字の位置を使って足し算するので、計算部分に別の減算処理はありません。

画面側ではスライドキー、答え窓、ゼロ戻しレバーを動かします。答えを数字だけで表示するのではなく、桁上がりで隣も回るようにしています。

日本語と英語の表示に対応し、キーボードでも操作できます。実機の手応えまではブラウザで再現できませんが、どんな手順で計算するものなのかは試せます。特に引き算は文字の説明だけだとややこしいので、チュートリアルで実際に動かしてみてください。