Hotwire Discussion

Can you create a scenario where show page responds to an update with turbo

Let’s say you have a simple model Game.

Game could be a golf tournament, a bingo game, or just about anything where you want the show page to display the current status of the game. But it responds to changes in the model by an update actions made by someone with update permission on another page.

If anyone kept up with the Masters tournament a few weeks on or the IOS/Android app, you saw what I think Turbo can probably do. There were leader boards, player scores, video stream, etc that changed within seconds of any change with probably thousands of user.

I’ve been trying to understand Turbo from the documentation and the various Chat demo apps but the wiring is still confusing me (stuff in model, connected to stuff in controller, connected to stuff in the view).

Going really simplistic, let’s say the Game is Bingo and the game has attributes: calls, status. Calls are just an array of what numbers out of the 75 possible numbers have been called. Status are things like [current, break, bingo, won, etc]. The Caller controls/updates the calls and status. The Viewer can only see the current status, which includes some stats (numbers called, latest calls, etc.)

I had this working years ago with jQuery and coffescript, but it was kind of a kludge with the viewer (show) page running on a timer.

I’ve spend many hours trying to implement this caller/viewer approach and have struck out. Probably because my approach was wrong - mainly the caller and view pages look the same, but the caller page responds to clicks, so there two different turbo_frames. Even if I got the turbo_stream to broadcast to the viewer, it’s not the same html. I though about going back to a timer(Stimulus) where an update_at frame was broadcast to viewer and it would reload the view page.

Before I go chasing waterfalls, how would you implement this caller/viewer scenario using Turbo?