한 파일, 두 모양 — 개수를 모르는 목록

지금까지의 화면은 값이 바뀌어도 모양은 그대로였다. 실제 화면은 그렇지 않다 — 대기가 없을 때와 셋일 때는 다른 것을 보여줘야 한다.

갈라지는 자리

{ "type": "conditional", "condition": "{{empty}}",
  "then":   { "type": "text", "text": "Nobody is waiting", ... },
  "orElse": { "type": "box", ... } }

condition 이 참이면 then, 아니면 orElse. 둘 다 그냥 노드라서 무엇이든 들어간다.

여기서 {{empty}} 를 쓴 게 중요하다. {{waiting == 0}} 같은 식을 쓰지 않았다. 조건을 정하는 쪽은 화면이 아니라 서버다 — "비었다"의 정의가 바뀌면(예: 예약 대기는 안 세기로 하면) 서버만 고친다.

개수를 모르는 줄

{ "type": "list", "items": "{{rows}}",
  "itemTemplate": { "type": "linear", "direction": "horizontal", "distribution": "space-between",
    "children": [
      { "type": "text", "text": "{{item.no}}", ... },
      { "type": "text", "text": "{{item.since}}", ... } ] } }

items 는 배열을 가리키고, itemTemplate 은 한 줄의 모양이다. 줄이 몇 개인지는 안 적혀 있다.

템플릿 안에서는 {{item.*}} 로 그 줄의 값을 쓴다. 바깥 상태와 이름이 안 섞인다.

{{rows}} 에 셋을 넣으면 셋, 열을 넣으면 열이 생긴다. 파일은 1,234바이트 그대로다.