How do I implement a text input section along with the send button in juggernaut?

Question

I have followed the exact guidelines on github and I am on the final step of:

"That's it! Now go to http://localhost:8080 to see Juggernaut in action."

A dialog box is displayed. However, I am unable to write any text.

I would like to be able to fix up the page for practical chat usage instead of just testing.

Answer 1

It looks like you need to follow the guide on the Juggernaut readme under that line titled Basic Usage.

Basic usage

Everything in Juggernaut is done within the context of a channel. JavaScript clients can subscribe to a channel which your server can publish to. First, we need to include Juggernaut's application.js file. By default, Juggernaut is hosted on port 8080 - so we can just link to the file there.

<script src="http://localhost:8080/application.js"

type="text/javascript" charset="utf-8">

We then need to instantiate the Juggernaut object and subscribe to the channel. As you can see, subscribe takes two arguments, the channel name and a callback.

<script type="text/javascript" charset="utf-8">
  var jug = new Juggernaut;
  jug.subscribe("channel1", function(data){
    console.log("Got data: " + data);
  });
</script>

That's it for the client side. Now, to publish to the channel we'll write some Ruby:

require "juggernaut"
Juggernaut.publish("channel1", "Some data")

You should see the data we sent appear instantly in the open browser window. As well as strings, we can even pass objects, like so:

Juggernaut.publish("channel1", {:some => "data"})

The publish method also takes an array of channels, in case you want to send a message to multiple channels co-currently.

Juggernaut.publish(["channel1", "channel2"], ["foo", "bar"])

That's pretty much the gist of it, the two methods - publish and subscribe. Couldn't be easier than that!

Once you have that done you can implement the Ruby code mentioned above inside a controller which takes the user input from a form and then calls something like Juggernaut.publish("channel1", @user_data) allowing your users to send data through the server to each other. `