diff options
| -rw-r--r-- | actioncable/README.md | 15 | ||||
| -rw-r--r-- | guides/source/action_cable_overview.md | 17 |
2 files changed, 21 insertions, 11 deletions
diff --git a/actioncable/README.md b/actioncable/README.md index 1d9864292f..8792113664 100644 --- a/actioncable/README.md +++ b/actioncable/README.md @@ -86,12 +86,17 @@ end The client-side needs to setup a consumer instance of this connection. That's done like so: -```coffeescript -# app/assets/javascripts/cable.coffee -#= require action_cable +```js +// app/assets/javascripts/cable.js +//= require action_cable +//= require_self +//= require_tree ./channels + +(function() { + this.App || (this.App = {}); -@App = {} -App.cable = ActionCable.createConsumer("ws://cable.example.com") + App.cable = ActionCable.createConsumer("ws://cable.example.com"); +}).call(this); ``` The `ws://cable.example.com` address must point to your Action Cable server(s), and it diff --git a/guides/source/action_cable_overview.md b/guides/source/action_cable_overview.md index aa15c5a06f..5cc280072e 100644 --- a/guides/source/action_cable_overview.md +++ b/guides/source/action_cable_overview.md @@ -142,12 +142,17 @@ established using the following Javascript, which is generated by default in Rai #### Connect Consumer -```coffeescript -# app/assets/javascripts/cable.coffee -#= require action_cable +```js +// app/assets/javascripts/cable.js +//= require action_cable +//= require_self +//= require_tree ./channels + +(function() { + this.App || (this.App = {}); -@App = {} -App.cable = ActionCable.createConsumer() + App.cable = ActionCable.createConsumer(); +}).call(this); ``` This will ready a consumer that'll connect against /cable on your server by default. @@ -414,7 +419,7 @@ App.cable.subscriptions.create "AppearanceChannel", ``` ##### Client-Server Interaction -1. **Client** establishes a connection with the **Server** via `App.cable = ActionCable.createConsumer("ws://cable.example.com")`. [*` cable.coffee`*] The **Server** identified this connection instance by `current_user`. +1. **Client** establishes a connection with the **Server** via `App.cable = ActionCable.createConsumer("ws://cable.example.com")`. [*` cable.js`*] The **Server** identified this connection instance by `current_user`. 2. **Client** initiates a subscription to the `Appearance Channel` for their connection via `App.cable.subscriptions.create "AppearanceChannel"`. [*`appearance.coffee`*] 3. **Server** recognizes a new subscription has been initiated for `AppearanceChannel` channel performs the `subscribed` callback, which calls the `appear` method on the `current_user`. [*`appearance_channel.rb`*] 4. **Client** recognizes that a subscription has been established and calls `connected` [*`appearance.coffee`*] which in turn calls `@install` and `@appear`. `@appear` calls`AppearanceChannel#appear(data)` on the server, and supplies a data hash of `appearing_on: $("main").data("appearing-on")`. This is possible because the server-side channel instance will automatically expose the public methods declared on the class (minus the callbacks), so that these can be reached as remote procedure calls via a subscription's `perform` method. |