Class: ScrollEndEventEmitter, MobileFrontend, JSDoc

Constructor

new ScrollEndEventEmitter(eventBus, [threshold]) #

Class to assist a view in implementing infinite scrolling on some DOM element. This module itself is only responsible for emitting an Event when the bottom of an Element is scrolled to.

Example

<code>
      var
        mfExtend = require( './mfExtend' ),
        ScrollEndEventEmitter = require( './ScrollEndEventEmitter' ),
        eventBus = require( './eventBusSingleton' );
      mfExtend( PhotoList, View, {
        //...
        initialize: function ( options ) {
          this.gateway = new PhotoListGateway( {
            username: options.username
          } );
          // 1. Set up infinite scroll helper and listen to events
          this.scrollEndEventEmitter = new ScrollEndEventEmitter( eventBus, 1000 );
          this.scrollEndEventEmitter.on( ScrollEndEventEmitter.EVENT_SCROLL_END,
            this._loadPhotos.bind( this ) );
          View.prototype.initialize.apply( this, arguments );
        },
        preRender: function () {
          // 2. Disable until we've got the list rendered and set DOM el
          this.scrollEndEventEmitter.setElement( this.$el );
          this.scrollEndEventEmitter.disable();
        },
        _loadPhotos: function () {
          var self = this;
          this.gateway.getPhotos().then( function ( photos ) {
            // load photos into the DOM ...
            // 3. and (re-)enable infinite scrolling
            self.scrollEndEventEmitter.enable();
          } );
        }
      } );
    </code>

Parameters:

Name	Type	Attributes	Default	Description
`eventBus`	Object			object to listen for scroll:throttled events
`threshold`	number	optional	100	distance in pixels used to calculate if scroll position is near the end of the $el