spatial-navigation/lib/ElementNavigation.js

A javascript-based implementation of Spatial Navigation.

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var ElementNavigation = function () {
  function ElementNavigation() {
    _classCallCheck(this, ElementNavigation);
  }

  _createClass(ElementNavigation, [{
    key: 'getToNavigate',
    value: function getToNavigate(currElement, direction) {
      var element = void 0;

      var countInRow = this.getCountInRow(currElement.parent.collection);
      var currIndex = currElement.parent.collection.getIndex(currElement);

      switch (direction) {
        case 'up':
        case 'down':
          if (direction === 'up') {
            element = currElement.parent.collection.getByIndex(currIndex - countInRow);
          } else {
            // MAGIC!
            var nextIndex = currIndex + countInRow;
            var maxCountInCollection = Math.ceil(currElement.parent.collection.length / countInRow) * countInRow;
            var lastElementIndex = currElement.parent.collection.length - 1;

            if (nextIndex > lastElementIndex && nextIndex < maxCountInCollection) {
              nextIndex = lastElementIndex;
            }

            element = currElement.parent.collection.getByIndex(nextIndex);
          }
          break;

        case 'left':
          if (currIndex % countInRow !== 0) {
            element = currElement.parent.collection.getByIndex(--currIndex);
          }
          break;

        case 'right':
          if ((currIndex + 1) % countInRow !== 0) {
            element = currElement.parent.collection.getByIndex(++currIndex);
          }
          break;
      }

      // TODO move this from here ?
      if (element && element.parent.collection.settings && element.parent.collection.settings.lazy && element.parent.collection.settings.lazy[direction]) {
        var countFromEnd = this.getCountFromEnd(element, direction);

        if (element.parent.collection.settings.lazy[direction].fromEnd === countFromEnd) {
          element.parent.collection.lazyLoad();
        }
      }

      if (element && element.disabled) {
        return this.getToNavigate(element, direction);
      }

      return element;
    }
  }, {
    key: 'getCountFromEnd',
    value: function getCountFromEnd(element, direction) {
      var countInRow = this.getCountInRow(element.parent.collection);
      var elementIndex = element.parent.collection.getIndex(element);
      var elementColumnIndex = elementIndex % countInRow;
      var countFromEnd = countInRow - (elementColumnIndex + 1);

      return countFromEnd;
    }
  }, {
    key: 'getCountInRow',
    value: function getCountInRow(collection) {
      var count = 1;
      var offsetLeft = collection.items[0].domEl.offsetLeft;

      for (var i = 1;; i++) {
        var element = collection.items[i];

        if (element && element.domEl.offsetLeft > offsetLeft) {
          offsetLeft = element.domEl.offsetLeft;
          count++;
        } else {
          return count;
        }
      }
    }
  }]);

  return ElementNavigation;
}();

exports.default = new ElementNavigation();
module.exports = exports['default'];