# Drag to seat @icon(users) @category(productivity) > Drag a guest onto a table. Same one-integer state as the kanban board — one decimal digit per guest holding their table number — but the gesture is a real drag, not a tap then a tap. # The guests @icon(list) @collapsed guests = [{name: "Ada Lovelace", meal: "veg"}, {name: "Grace Hopper", meal: "fish"}, {name: "Alan Turing", meal: "veg"}, {name: "Katherine Johnson", meal: "beef"}, {name: "Jean Bartik", meal: "fish"}, {name: "Tim Berners-Lee", meal: "beef"}] // @sheet @cols(Guest, Meal) @label(Edit a name, change a meal, add a guest) @icon(list) # Room @icon(sliders-horizontal) @density(compact) @skin(form) seats per table = 2 // 1..4 by 1 @label(Seats per table) @icon(armchair) @note(a table over its count turns red — the plan still lets you do it) seating = 231132 // @label(The plan, as one number) @icon(hash) @advanced @note(digit N is guest N's table, 1..3 — this row IS the save file, and a drop rewrites it) # Engine @hidden // Digit N of `seating` is guest N's table, read right-to-left with 10^i so // guest 0 is the LAST digit. Tables are 1-based on purpose: a 0 in the // leading position would vanish from the number and silently unseat a guest. _n = sum(map(guests, g => 1)) _t(i) = floor(seating / 10^i) mod 10 _at(c) = filter(seq(_n, 0), i => _t(i) == c) _nat(c) = count(_at(c)) _slot(i) = count(filter(seq(_n, 0), m => m < i && _t(m) == _t(i))) _over(c) = if(_nat(c) > seats per table, 1, 0) _overs = count(filter(seq(3, 1), c => _nat(c) > seats per table)) _seated = count(filter(seq(_n, 0), i => _t(i) >= 1 && _t(i) <= 3)) _seatcol = if(_overs > 0, "var(--ic-svg-error)", "var(--ic-svg-success)") _hint = if(_overs > 0, concat(_overs, " table(s) over ", seats per table, " — drag someone across to fix it"), "Drag a guest onto any table") _veg = count(filter(seq(_n, 0), i => guests[i].meal == "veg")) # Geometry @hidden // The drag action is a TEMPLATE, not a finished action: `%z` is the one hole, // and SvgRender fills it with the dropped-on zone's index. Everything else is // closed over here at render time, because an action is evaluated against an // env of NUMERIC ROWS ONLY — `seating + 10` works, `_t(1)` does not (it is a // function, resolves to nothing, and collapses the whole expression to 0). _lanerows = max(2, max(_nat(1), max(_nat(2), _nat(3)))) _lh = 34 + _lanerows * 38 _noteY = 60 + _lh + 18 _h = 60 + _lh + 34 _tedge(c) = if(_over(c) > 0, "var(--ic-svg-error)", "var(--border-soft)") _tnote(c) = if(_nat(c) == 0, "empty — drop someone here", concat(_nat(c), " of ", seats per table, " seats used")) _tables = map(seq(3, 1), c => {c: c, x: 14 + (c - 1) * 204, tx: 26 + (c - 1) * 204, bx: 194 + (c - 1) * 204, lab: concat("Table ", c), badge: concat(_nat(c), " / ", seats per table), note: _tnote(c), edge: _tedge(c), sw: if(_over(c) > 0, 1.5, 1), dash: if(_over(c) > 0, "0", "3 3")}) _gedge(i) = if(guests[i].meal == "veg", "var(--ic-svg-success)", if(guests[i].meal == "fish", "var(--ic-svg-info)", "var(--ic-svg-warning)")) _deck = map(seq(_n, 0), i => {n: guests[i].name, meal: guests[i].meal, x: 22 + (_t(i) - 1) * 204, tx: 32 + (_t(i) - 1) * 204, y: 90 + _slot(i) * 38, y1: 104 + _slot(i) * 38, y2: 116 + _slot(i) * 38, edge: _gedge(i), tip: concat("Drag ", guests[i].name, " to another table"), act: concat("seating = seating + (%z - ", _t(i), ") * ", 10^i)}) # Plan @tab @icon(users) the plan = svg(``) tables over capacity = _overs // @hero @label(Tables over capacity) @icon(triangle-alert) @note(drag a guest across and this drops as you release) # Catering @tab @icon(utensils) vegetarian meals = _veg // @label(Vegetarian) @icon(salad) total guests = _n // @label(Guests) @icon(users) # How it works @tab @icon(info) > A drag never re-evaluates this calc. Measured on the kanban board, one action round-trip is 364ms — 264ms of it engine — so a rewrite per pointermove would run under 3 frames a second. Instead the renderer moves the card itself with a CSS transform and fires exactly one action when you let go, costing the same as a tap. > That is the whole trick, and it only works for a DISCRETE drag: one where the answer changes at the drop and nowhere in between. A drag whose value must track the pointer the entire way — a handle on a chart — is a different mechanism, and belongs on the slider preview lane instead. > Tables are numbered from 1, not 0. A leading zero disappears from a number, so a guest at table 0 in the top digit would silently unseat themselves.