Enlace para desplazarse por eventos con Ember.js

Puede aprender mucho leyendo el c贸digo fuente del discurso. Hoy encontr茅 una buena combinaci贸n que hace que sea f谩cil recibir una notificaci贸n cuando se desplaza la ventana del navegador. Esto es lo que aprend铆 …

La vinculaci贸n a eventos de desplazamiento / toque del navegador es f谩cil:

App.Scrolling = Em.Mixin.create({

bindScrolling
: function(opts) {
var onScroll, _this = this;

onScroll
= function(){
return _this.scrolled();
};

$
(document).bind('touchmove', onScroll);
$
(window).bind('scroll', onScroll);
},

unbindScrolling
: function() {
$
(window).unbind('scroll');
$
(document).unbind('touchmove');
}

});

Usando el mixin anterior, puede vincular / desvincular para desplazar eventos desde cualquier vista:

App.MyView = Ember.View.extend(App.Scrolling, {
didInsertElement
: function() {
this.bindScrolling();
},
willRemoveElement
: function() {
this.unbindScrolling();
},
scrolled
: function() {
console
.log('MyView was scrolled')
}
});

隆Los eventos de desplazamiento probablemente necesiten ser eliminados!

Los eventos de desplazamiento se activan muy r谩pidamente, por lo que el m茅todo scroll () de la vista anterior se llamar谩 como loco. La 煤nica forma sensata de hacer esto es eliminando los rebotes . Discourse hace esto agregando una funci贸n al espacio de nombres de la aplicaci贸n. Suponiendo que tengamos el nuestro, el mixin desplazable puede usarlo para acelerar las notificaciones de desplazamiento:debounce()App.debounce

App.Scrolling = Em.Mixin.create({

bindScrolling
: function(opts) {
var onScroll, _this = this;
opts
= opts || {debounce: 100};

if (opts.debounce) {
onScroll
= App.debounce(function() { return _this.scrolled(); }, 100);
} else {
onScroll
= function(){
return _this.scrolled();
};
}
$
(document).bind('touchmove', onScroll);
$
(window).bind('scroll', onScroll);
},

unbindScrolling
: function() {
$
(window).unbind('scroll');
$
(document).unbind('touchmove');
}

});

Puede encontrar la versi贸n original (en el discurso github rebo) [ https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/mixins/scrolling.js ]