Skip to content

Configure all the things!

Compare
Choose a tag to compare
@poteto poteto released this 27 Apr 19:09
· 379 commits to master since this release

This release adds 2 features:

  1. didScroll{Up,Down,Left,Right} hooks

    You can now subscribe to didScroll{Up,Down,Left,Right} hooks that are
    emitted by the Mixin when the element enters the viewport. This is primarily
    for the purposes of replacing the waypoints library in ember-waypoints to
    use an Ember implementation instead.

    As with any other hook in Ember, you can handle it with:

    export default Ember.Component.extend(InViewportMixin, {
      didScrollUp(direction) {
        console.log(direction); // 'up'
      },
    
      didScrollDown(direction) {
        console.log(direction); // 'down'
      },
    
      didScrollLeft(direction) {
        console.log(direction); // 'left'
      },
    
      didScrollRight(direction) {
        console.log(direction); // 'right'
      }
    });

    There is also a new viewportScrollSensitivity option that affects the above
    behavior.

  2. Global options

    You can set application wide defaults for ember-in-viewport in your app
    (they are still manually overridable inside of a Component). To set new
    defaults, just add a config object to config/environment.js, like so:

    module.exports = function(environment) {
      var ENV = {
        // ...
        viewportConfig: {
          viewportSpy               : false,
          viewportUseRAF            : true,
          viewportScrollSensitivity : 1,
          viewportRefreshRate       : 100,
          viewportListeners         : [],
          viewportTolerance: {
            top    : 0,
            left   : 0,
            bottom : 0,
            right  : 0
          }
        }
      };
    };
Changelog

#13 Application wide defaults by @poteto
#12 Guard against removed element by @LevelbossMike
#11 waypoint hooks first draft by @poteto