Tinylib
DiscoverSign inGet started

Places and links

function route() {
  const [path, query] = tinylib.places.address.split('?')
  const [screen, id] = path.split('/')
  if (screen === 'game' && id) return showGame(id)
  if (screen === 'settings') return showSettings(new URLSearchParams(query))
  showStart()
}

tinylib.places.onChange(route)
route()
tinylib.places.go(`game/${id}`)
tinylib.places.go('', { replace: true })

An address is the page's own path without its first /, with any ? part: game/abc?tab=moves. '' is the start screen. The # part stays inside the page. onChange runs after every move: the page's own, back and forward, and Tinylib landing the person on an address. Since the address is the page's path, a router such as React Router works as it is, in place of tinylib.places.

Links

<a href="/settings">Settings</a>
<a href="/game/abc?tab=moves">Back to the game</a>
<a href="https://example.com/rules">The rules of chess</a>

A plain <a href> to an address in the app moves there without loading a page, as places.go does. A link anywhere else opens outside Tinylib. A page that reloads itself is opened again at its address.

Sharing a place

await tinylib.places.share(`list/${id}`, 'Our shopping list')

share opens Tinylib's share sheet with a link to that place in the app, which opens the app at that address.

Where people arrive from outside

// rules.js
export const game = withViews({ address: 'game/:id', create, on, view, status })
export const list = withViews({ address: '?list=:id', create, on, view, status })

A notification, an invitation, a room's link and a tap on a room in Tinylib's own lists send the person to the kind's address, with :id filled in with the room's id. A kind with no address sends them to the start screen, and the app isn't told which room. A reminder lands on its own address.