Drag to rearrange. Right-click or tap an item to sell it.
Saga
tmpl.js
How this works
A server renders HTML with a few data attributes. Thryft does the rest in the browser.
fetch.js
Loads each panel from the server and, after every action, diffs the new HTML in. Only changed text and attributes are touched, so nothing flickers. Stores are polled every 5 seconds.
timer.js
Ticks the stores up every second between polls from data-rate, runs the voyage countdown and its progress bar.
cost.js
Reads the ticking stores, fills each cost ring and switches Build buttons on the moment you can afford them.
tooltip.js
Anchored tooltips on buildings, cursor tooltips on items.
inventory.js
Drag to reorder (sent to the server), and the Sell / Drop menu.
sound.js
Bell when the ship is home, coins on a sale, off until you turn it on.
modal.js
This window, and the Ledger, which is fetched from the server when you open it.
tmpl.js
Each saga line is stamped from one <template>.
The "server" here is a small script in the page so the demo runs on a static site; it keeps your hold in this browser, so it keeps producing while you're away.