Famo.us: Adds goToFirst, goToLast and goToIndex methods to Scrollview

ScrollviewGoto.js

define(function(require,module,exports){
    var Scrollview = require('famous/views/Scrollview');
    var ViewSequence = require('famous/core/ViewSequence');
    var VELOCITY = 0; // default: No animation (i.e. the item isn't given any "swipe"-velocity when moved)
    
    /***********************************
     *   getIndex
     ************************************/
    Scrollview.prototype.getIndex = function () {
      return this._node.getIndex();
    };
    
    /***********************************
     *   goToIndex
     ************************************/
    Scrollview.prototype.goToIndex = function (i,velocity,position) {
        // if we're already there, don't move!
        if(i == this.getIndex()) return;
        // create ViewSequence node at proper location
        var _ = this._node._;
        var node = new ViewSequence({
            _: _,
            index: i
        });
        // Animate the movement (default is no animation)
        if(velocity === undefined) velocity = VELOCITY;
        // If animated (i.e. velocity > 0), start at +/- height from the item, and swipe towards proper position (0);
        if(position === undefined) position = velocity > 0? this._node.getSize()[this.options.direction]: 0;
        // We're swiping from the top, start before (negative height) and swipe down (positive velocity)
        position = -1.0 * position;
        // Unless we're swiping from the bottom, then we reverse position/velocity;
        if(i < this.getIndex()) {
            velocity = -1.0 * velocity;
            position = -1.0 * position;
        }        
        // Set the Scrollview
        this.sequenceFrom(node);
        // Position a little bit away from the element
        this.setPosition(position);
        // And swipe from there -- (and hope that scrollview ends in the right position - it's a bit of guesswork...)
        this.setVelocity(velocity);
    };

    /***********************************
     *   goToFirst
     ************************************/
    Scrollview.prototype.goToFirst = function (velocity,position) {
        this.goToIndex(this._node._.firstIndex,velocity,position);
    };

    /***********************************
     *   goToLast
     ************************************/
    Scrollview.prototype.goToLast = function (velocity,position) {
        var _ = this._node._;
        var index = _.firstIndex + _.array.length - 1;
        this.goToIndex(index,position,velocity);
    };
});

the order in define is wrong: its require, exports, module

I have tried to make it work for my case, I get it scrolled to top but the first item is by half scrolled down.

oh now it works with the latest changes

it works even pretty good!

I don't think the velocity is something a user wants to set, we set velocity if this is triggered by some swiping gesture. In case of goToFirst page its probably always a click, no?

I would prefer to set the duration there.

Basically we need to set a transition there, like {duration: 500, curve: 'easeOutQuad'}

Also I suggest to write a constructor like "ScrollviewController" and put all the methods there.

This allows to use your methods together with other classes which subclass Scrollview, f.e. InfiniteScroll

function ScrollviewController(scrollview) {
    this._scrollview = scrollview
}

module.exports = ScrollviewController

ScrollviewController.prototype.getIndex = function () {
  return this._scrollview._node.getIndex()
}