I have connection to socket.io server in my router.
afterModel: function () {
var self = this;
socket.on('message', function (message) {
// adding message to Ember.DS
}
}
Ember appends messages to div, but when scroll is become to show I need to makes Ember scrolls it down. I can do it with jQuery like that
Ember.$('.messages-area').scrollTop(1000000);
But where do I need to bind event listener for this action?
Depending on how you do this, you can use an action handler - see here: Ember - handling actions in views
A full list of view event handlers is here:
http://emberjs.com/api/classes/Ember.View.html#toc_event-names
If you can utilize one of the pre-defined handlers, it would undoubtedly be cleaner logic, However, it sounds like you probably can't do that as you're not directly inputting the text into the div via user interaction. What you would then need to do, is in your didInsertElement method, have a jQuery loop that checks the contents of the div being updated, and then runs the scroll when the content is updated.
Ember not encourages event binding, instead it captures user events by event delegation.
In your case, you can place your code at View.
For example, assume i have a application template:
<div id="div1">Click this area</div>
<div id="div2">Click this area</div>
Then you can capture click event in ApplicationView like,
click:function(event){
if(event.target.attr('id')==='div1'){
//do stuff here
}
}
I needed to observ chaning of model and after changing to add scroll down into the Ember run loop.
recordsDidChanges: function(){
Ember.run.schedule('afterRender',this, function(){
var msgArea = $('.messages-area');
if (msgArea[0]) {
msgArea.scrollTop(msgArea[0].scrollHeight);
}
});
}.observes('controller.records.@each')