HTML and CSS Reference
In-Depth Information
The corresponding events should trigger these methods as well. To accomplish this, add the following bold code
to init.js :
(function($) {
channel.bind('close', function(data){ room.close(data); });
channel.bind('open', function(data){ room.open(data); });
channel.bind('ask', function(data){ });
channel.bind('vote', function(data){ });
channel.bind('answer', function(data){ });
var room = {
open: function(data){
location.reload();
},
close: function(data){
location.reload();
}
};
})(jQuery);
Note that we have chosen to have the page reload automatically when a room is closed by the presenter.
Normally, you would not want to reload a page without the user's input because it can be confusing, but we have
good reason to here. In this particular case, as already mentioned, a lot of markup changes on the page when a
room closes. In addition, the user cannot submit a new question to a closed room, so the presenter closing the room
should be disruptive; otherwise, an attendee could spend extra time working on a question that can't be submitted
anyway, which could be more frustrating than simply realizing that the room is now closed and they should email the
presenter instead.
Adding New Questions with Animation
When a new question is asked, it should be made available for everyone viewing the room immediately. To make the
introduction of new data less jarring, it should be added with an animation.
In Chapter 8, when the action handler method create_question() was added to the Question controller for
asking new questions, you already did the view generation for this event, so formatted HTML will be sent in the
data object.
However, because the back end can't possibly know the nonce currently being used for your view, we need
to read the nonce and insert it into the value attribute of all newly generated nonce fields before animating the
question's addition to the top of the list with slideDown() :
(function($) {
channel.bind('close', function(data){ room.close(data); });
channel.bind('open', function(data){ room.open(data); });
channel.bind('ask', function(data){ question.ask(data); });
channel.bind('vote', function(data){ });
channel.bind('answer', function(data){ });
var nonce = $('input[name=nonce]:eq(0)').val(),
room = {
 
Search WWH ::




Custom Search