Broadcast/Listen example

[japgolly]

Add to live demos.
Show that listener works for any type of external event, including ajax.

[i-am-the-slime]

Would also be nice to see an example for the ... part in the current docs in Listenable.install(...).

[japgolly]

@i-am-the-slime Sure, will do. I did a quick search and realised there's a tiny little demo from the early days that hasn't been integrated with the online/live demos yet:

https://github.com/japgolly/scalajs-react/blob/master/gh-pages/src/main/scala/ghpages/ExtrasExamples.scala#L58-L73

If you were motivated to add this comment because you want to use it and you're not sure about how, my advice is to look at the signatures and just follow the types. If you can satisfy those types and scalac is happy then it will just work.

As far as other examples, there's also this in the Router:
https://github.com/japgolly/scalajs-react/blob/master/extra/src/main/scala/japgolly/scalajs/react/extra/router2/Router.scala#L27

[japgolly]

@i-am-the-slime Actually, both of the examples above use state monads. I'll give you an example of not using state monads, this is from a private project of mine (so I can't give you too much):

final class ClientData(init: Project) extends Broadcaster[Changes] {
  // This holds all global state in my app
  // When it receives an update from the server, it does something like this:
  def acceptDataFromServer(data): IO[Unit] = IO {
    val  changes: Changes = ...
    broadcast(changes)
  }
}

// Then I have some helper code for components to accept changes

  class UpdateState[S](val f: Changes => S => S) extends AnyVal {
    def install[P, B <: OnUnmount, N <: TopNode](cd: P => ClientData) =
      Listenable.install[P, S, B, N, Changes](cd, $ => changes =>
        $.modState(f(changes)))
  }

  class Refresh(val refresh: Changes => Boolean) extends AnyVal {
    def install[P, S, B <: OnUnmount, N <: TopNode](cd: P => ClientData) =
      Listenable.install[P, S, B, N, Changes](cd, $ => changes =>
        if (refresh(changes))
          $.forceUpdate())
  }

As you can see from the types, ClientData (the Broadcaster) is handed to each component via its props.

Hope that helps.