CartoDB/cartodb20

View on GitHub
lib/assets/javascripts/builder/components/pagination/pagination-view.js

Summary

Maintainability
C
1 day
Test Coverage
var CoreView = require('backbone/core-view');
var $ = require('jquery');
var navigateThroughRouter = require('builder/helpers/navigate-through-router');
var template = require('./pagination.tpl');

/**
 * Responsible for pagination.
 *
 * Expected to be created with a pagination model, see the model for available params, here we create w/ the minimum:
 *   new PaginationView({
 *     model: new PaginationModel({
 *       // Compulsory:
 *       urlTo:  function(page) { return '/?page='+ page },

         // Optional, to router clicks on <a> tags through router.navigate by default
 *       routerModel: new Router(...)
 *     })
 *   });
 */
module.exports = CoreView.extend({
  className: 'Pagination',

  events: {
    'click .js-listItem': '_paginate'
  },

  initialize: function (opts) {
    this._routerModel = opts.routerModel; // Optional

    if (this.router && !this.model.hasUrl()) {
      throw new Error('since router is set the model must have a url method set too');
    }

    this.template = opts.template || template;
    this.model.bind('change', this.render, this);
  },

  render: function () {
    if (this.model.shouldBeVisible()) {
      this.$el.html(
        this.template({
          m: this.model,
          pagesCount: this.model.pagesCount(),
          currentPage: this.model.get('current_page')
        })
      );
      this.$el.addClass(this.className);
      this.delegateEvents();
    } else {
      this.$el.html('');
    }

    return this;
  },

  _paginate: function (ev) {
    if (this._routerModel) {
      navigateThroughRouter.apply(this, arguments);
    } else if (!this.model.hasUrl()) {
      this.killEvent(ev);
    }

    var page = $(ev.target).data('page');
    this.model.set('current_page', page);
  }
});