backgridjs-rails 0.2.6

data/vendor/assets/javascripts/backgrid-extensions/backgrid-moment-cell.js

@@ -0,0 +1,175 @@
+/*
+  backgrid-moment-cell
+  http://github.com/wyuenho/backgrid
+
+  Copyright (c) 2013 Jimmy Yuen Ho Wong and contributors
+  Licensed under the MIT @license.
+*/
+(function ($, _, Backbone, Backgrid, moment) {
+
+  /**
+     MomentFormatter converts bi-directionally any datetime values in any format
+     supported by [moment()](http://momentjs.com/docs/#/parsing/) to any
+     datetime format
+     [moment.fn.format()](http://momentjs.com/docs/#/displaying/format/)
+     supports.
+
+     @class Backgrid.Extension.MomentFormatter
+     @extends Backgrid.CellFormatter
+     @constructor
+   */
+  var MomentFormatter = Backgrid.Extension.MomentFormatter = function (options) {
+    _.extend(this, this.defaults, options);
+  };
+  MomentFormatter.prototype = new Backgrid.CellFormatter;
+  _.extend(MomentFormatter.prototype, {
+
+    /**
+       @cfg {Object} options
+
+       @cfg {boolean} [options.modelInUnixOffset=false] Whether the model values
+       should be read/written as the number of milliseconds since UNIX Epoch.
+
+       @cfg {boolean} [options.modelInUnixTimestamp=false] Whether the model
+       values should be read/written as the number of seconds since UNIX Epoch.
+
+       @cfg {boolean} [options.modelInUTC=true] Whether the model values should
+       be read/written in UTC mode or local mode.
+
+       @cfg {string} [options.modelLang=moment.lang()] The locale the model
+       values should be read/written in.
+
+       @cfg {string} [options.modelFormat=moment.defaultFormat] The format this
+       moment formatter should use to read/write model values. Only meaningful if
+       the values are strings.
+
+       @cfg {boolean} [options.displayInUnixOffset=false] Whether the display
+       values should be read/written as the number of milliseconds since UNIX
+       Epoch.
+
+       @cfg {boolean} [options.displayInUnixTimestamp=false] Whether the display
+       values should be read/written as the number of seconds since UNIX Epoch.
+
+       @cfg {boolean} [options.displayInUTC=true] Whether the display values
+       should be read/written in UTC mode or local mode.
+
+       @cfg {string} [options.displayLang=moment.lang()] The locale the display
+       values should be read/written in.
+
+       @cfg {string} [options.displayFormat=moment.defaultFormat] The format
+       this moment formatter should use to read/write dislay values.
+     */
+    defaults: {
+      modelInUnixOffset: false,
+      modelInUnixTimestamp: false,
+      modelInUTC: true,
+      modelLang: moment.lang(),
+      modelFormat: moment.defaultFormat,
+      displayInUnixOffset: false,
+      displayInUnixTimestamp: false,
+      displayInUTC: true,
+      displayLang: moment.lang(),
+      displayFormat: moment.defaultFormat
+    },
+
+    /**
+       Converts datetime values from the model for display.
+
+       @member Backgrid.Extension.MomentFormatter
+       @param {*} rawData
+       @return {string}
+     */
+    fromRaw: function (rawData) {
+      if (rawData == null) return '';
+
+      var m = this.modelInUnixOffset ? moment(rawData) :
+        this.modelInUnixTimestamp ? moment.unix(rawData) :
+        this.modelInUTC ?
+        moment.utc(rawData, this.modelFormat, this.modelLang) :
+        moment(rawData, this.modelFormat, this.modelLang);
+
+      if (this.displayInUnixOffset) return +m;
+
+      if (this.displayInUnixTimestamp) return m.unix();
+
+      if (this.displayLang) m.lang(this.displayLang);
+
+      if (this.displayInUTC) m.utc(); else m.local();
+
+      return m.format(this.displayFormat);
+    },
+
+    /**
+       Converts datetime values from user input to model values.
+
+       @member Backgrid.Extension.MomentFormatter
+       @param {string} formattedData
+       @return {string}
+     */
+    toRaw: function (formattedData) {
+
+      var m = this.displayInUnixOffset ? moment(+formattedData) :
+        this.displayInUnixTimestamp ? moment.unix(+formattedData) :
+        this.displayInUTC ?
+        moment.utc(formattedData, this.displayFormat, this.displayLang) :
+        moment(formattedData, this.displayFormat, this.displayLang);
+
+      if (!m || !m.isValid()) return;
+
+      if (this.modelInUnixOffset) return +m;
+
+      if (this.modelInUnixTimestamp) return m.unix();
+
+      if (this.modelLang) m.lang(this.modelLang);
+
+      if (this.modelInUTC) m.utc(); else m.local();
+
+      return m.format(this.modelFormat);
+    }
+
+  });
+
+  /**
+     Renders a datetime cell that uses a Backgrid.Extension.MomentFormatter to
+     convert and validate values.
+
+     @class Backgrid.Extension.MomentCell
+     @extends Backgrid.Cell
+   */
+  var MomentCell = Backgrid.Extension.MomentCell = Backgrid.Cell.extend({
+
+    editor: Backgrid.InputCellEditor,
+
+    /** @property */
+    className: "moment-cell",
+
+    /** @property {Backgrid.CellFormatter} [formatter=Backgrid.Extension.MomentFormatter] */
+    formatter: MomentFormatter,
+
+    /**
+       Initializer. Accept Backgrid.Extension.MomentFormatter.options and
+       Backgrid.Cell.initialize required parameters.
+     */
+    initialize: function (options) {
+
+      Backgrid.Cell.prototype.initialize.apply(this, arguments);
+
+      var formatterDefaults = MomentFormatter.prototype.defaults;
+      var formatterDefaultKeys = _.keys(formatterDefaults);
+      var classAttrs = _.pick(this, formatterDefaultKeys);
+      var formatterOptions = _.pick(options, formatterDefaultKeys);
+
+      this.formatter = new this.formatter(_.extend({}, formatterDefaults, classAttrs, formatterOptions));
+
+      this.editor = this.editor.extend({
+        attributes: _.extend({}, this.editor.prototype.attributes || this.editor.attributes || {}, {
+          placeholder: this.formatter.displayFormat
+        })
+      });
+    }
+
+  });
+
+  _.extend(MomentCell.prototype, MomentFormatter.prototype.defaults);
+
+}(jQuery, _, Backbone, Backgrid, moment));

data/vendor/assets/javascripts/backgrid-extensions/backgrid-paginator.js

@@ -0,0 +1,198 @@
+/*
+  backgrid-paginator
+  http://github.com/wyuenho/backgrid
+
+  Copyright (c) 2013 Jimmy Yuen Ho Wong and contributors
+  Licensed under the MIT @license.
+*/
+
+(function ($, _, Backbone, Backgrid) {
+
+  "use strict";
+
+  /**
+     Paginator is a Backgrid extension that renders a series of configurable
+     pagination handles. This extension is best used for splitting a large data
+     set across multiple pages. If the number of pages is larger then a
+     threshold, which is set to 10 by default, the page handles are rendered
+     within a sliding window, plus the fast forward, fast backward, previous and
+     next page handles. The fast forward, fast backward, previous and next page
+     handles can be turned off.
+
+     @class Backgrid.Extension.Paginator
+  */
+  Backgrid.Extension.Paginator = Backbone.View.extend({
+
+    /** @property */
+    className: "backgrid-paginator",
+
+    /** @property */
+    windowSize: 10,
+
+    /**
+       @property {Object} fastForwardHandleLabels You can disable specific
+       handles by setting its value to `null`.
+    */
+    fastForwardHandleLabels: {
+      first: "《",
+      prev: "〈",
+      next: "〉",
+      last: "》"
+    },
+
+    /** @property */
+    template: _.template('<ul><% _.each(handles, function (handle) { %><li <% if (handle.className) { %>class="<%= handle.className %>"<% } %>><a href="#" <% if (handle.title) {%> title="<%= handle.title %>"<% } %>><%= handle.label %></a></li><% }); %></ul>'),
+
+    /** @property */
+    events: {
+      "click a": "changePage"
+    },
+
+    /**
+       Initializer.
+
+       @param {Object} options
+       @param {Backbone.Collection} options.collection
+       @param {boolean} [options.fastForwardHandleLabels] Whether to render fast forward buttons.
+    */
+    initialize: function (options) {
+      Backgrid.requireOptions(options, ["collection"]);
+
+      var collection = this.collection;
+      var fullCollection = collection.fullCollection;
+      if (fullCollection) {
+        this.listenTo(fullCollection, "add", this.render);
+        this.listenTo(fullCollection, "remove", this.render);
+        this.listenTo(fullCollection, "reset", this.render);
+      }
+      else {
+        this.listenTo(collection, "add", this.render);
+        this.listenTo(collection, "remove", this.render);
+        this.listenTo(collection, "reset", this.render);
+      }
+    },
+
+    /**
+       jQuery event handler for the page handlers. Goes to the right page upon
+       clicking.
+
+       @param {Event} e
+     */
+    changePage: function (e) {
+      e.preventDefault();
+
+      var $li = $(e.target).parent();
+      if (!$li.hasClass("active") && !$li.hasClass("disabled")) {
+
+        var label = $(e.target).text();
+        var ffLabels = this.fastForwardHandleLabels;
+
+        var collection = this.collection;
+
+        if (ffLabels) {
+          switch (label) {
+          case ffLabels.first:
+            collection.getFirstPage();
+            return;
+          case ffLabels.prev:
+            collection.getPreviousPage();
+            return;
+          case ffLabels.next:
+            collection.getNextPage();
+            return;
+          case ffLabels.last:
+            collection.getLastPage();
+            return;
+          }
+        }
+
+        var state = collection.state;
+        var pageIndex = +label;
+        collection.getPage(state.firstPage === 0 ? pageIndex - 1 : pageIndex);
+      }
+    },
+
+    /**
+       Internal method to create a list of page handle objects for the template
+       to render them.
+
+       @return {Array.<Object>} an array of page handle objects hashes
+     */
+    makeHandles: function () {
+
+      var handles = [];
+      var collection = this.collection;
+      var state = collection.state;
+
+      // convert all indices to 0-based here
+      var firstPage = state.firstPage;
+      var lastPage = +state.lastPage;
+      lastPage = Math.max(0, firstPage ? lastPage - 1 : lastPage);
+      var currentPage = Math.max(state.currentPage, state.firstPage);
+      currentPage = firstPage ? currentPage - 1 : currentPage;
+      var windowStart = Math.floor(currentPage / this.windowSize) * this.windowSize;
+      var windowEnd = Math.min(lastPage + 1, windowStart + this.windowSize);
+
+      if (collection.mode !== "infinite") {
+        for (var i = windowStart; i < windowEnd; i++) {
+          handles.push({
+            label: i + 1,
+            title: "No. " + (i + 1),
+            className: currentPage === i ? "active" : undefined
+          });
+        }
+      }
+
+      var ffLabels = this.fastForwardHandleLabels;
+      if (ffLabels) {
+
+        if (ffLabels.prev) {
+          handles.unshift({
+            label: ffLabels.prev,
+            className: collection.hasPrevious() ? void 0 : "disabled"
+          });
+        }
+
+        if (ffLabels.first) {
+          handles.unshift({
+            label: ffLabels.first,
+            className: collection.hasPrevious() ? void 0 : "disabled"
+          });
+        }
+
+        if (ffLabels.next) {
+          handles.push({
+            label: ffLabels.next,
+            className: collection.hasNext() ? void 0 : "disabled"
+          });
+        }
+
+        if (ffLabels.last) {
+          handles.push({
+            label: ffLabels.last,
+            className: collection.hasNext() ? void 0 : "disabled"
+          });
+        }
+      }
+
+      return handles;
+    },
+
+    /**
+       Render the paginator handles inside an unordered list.
+    */
+    render: function () {
+      this.$el.empty();
+
+      this.$el.append(this.template({
+        handles: this.makeHandles()
+      }));
+
+      this.delegateEvents();
+
+      return this;
+    }
+
+  });
+
+}(jQuery, _, Backbone, Backgrid));

data/vendor/assets/javascripts/backgrid-extensions/backgrid-select-all.js

@@ -0,0 +1,215 @@
+/*
+  backgrid-select-all
+  http://github.com/wyuenho/backgrid
+
+  Copyright (c) 2013 Jimmy Yuen Ho Wong and contributors
+  Licensed under the MIT @license.
+*/
+(function (window, $, _, Backbone, Backgrid)  {
+
+  /**
+     Renders a checkbox for row selection.
+
+     @class Backgrid.Extension.SelectRowCell
+     @extends Backbone.View
+  */
+  var SelectRowCell = Backgrid.Extension.SelectRowCell = Backbone.View.extend({
+
+    /** @property */
+    className: "select-row-cell",
+
+    /** @property */
+    tagName: "td",
+
+    /** @property */
+    events: {
+      "keydown :checkbox": "onKeydown",
+      "change :checkbox": "onChange",
+      "click :checkbox": "enterEditMode"
+    },
+
+    /**
+       Initializer. If the underlying model triggers a `select` event, this cell
+       will change its checked value according to the event's `selected` value.
+
+       @param {Object} options
+       @param {Backgrid.Column} options.column
+       @param {Backbone.Model} options.model
+    */
+    initialize: function (options) {
+      Backgrid.requireOptions(options, ["model", "column"]);
+
+      this.column = options.column;
+      if (!(this.column instanceof Backgrid.Column)) {
+        this.column = new Backgrid.Column(this.column);
+      }
+
+      this.listenTo(this.model, "backgrid:select", function (model, selected) {
+        this.$el.find(":checkbox").prop("checked", selected).change();
+      });
+
+    },
+
+    /**
+       Focuses the checkbox.
+    */
+    enterEditMode: function () {
+      this.$el.find(":checkbox").focus();
+    },
+
+    /**
+       Unfocuses the checkbox.
+    */
+    exitEditMode: function () {
+      this.$el.find(":checkbox").blur();
+    },
+
+    /**
+       Process keyboard navigation.
+    */
+    onKeydown: function (e) {
+      var command = new Backgrid.Command(e);
+      if (command.passThru()) return true; // skip ahead to `change`
+      if (command.cancel()) {
+        e.stopPropagation();
+        this.$el.find(":checkbox").blur();
+      }
+      else if (command.save() || command.moveLeft() || command.moveRight() ||
+               command.moveUp() || command.moveDown()) {
+        e.preventDefault();
+        e.stopPropagation();
+        this.model.trigger("backgrid:edited", this.model, this.column, command);
+      }
+    },
+
+    /**
+       When the checkbox's value changes, this method will trigger a Backbone
+       `backgrid:selected` event with a reference of the model and the
+       checkbox's `checked` value.
+    */
+    onChange: function (e) {
+      this.model.trigger("backgrid:selected", this.model, $(e.target).prop("checked"));
+    },
+
+    /**
+       Renders a checkbox in a table cell.
+    */
+    render: function () {
+      this.$el.empty().append('<input tabindex="-1" type="checkbox" />');
+      this.delegateEvents();
+      return this;
+    }
+
+  });
+
+  /**
+     Renders a checkbox to select all rows on the current page.
+
+     @class Backgrid.Extension.SelectAllHeaderCell
+     @extends Backgrid.Extension.SelectRowCell
+  */
+  var SelectAllHeaderCell = Backgrid.Extension.SelectAllHeaderCell = SelectRowCell.extend({
+
+    /** @property */
+    className: "select-all-header-cell",
+
+    /** @property */
+    tagName: "th",
+
+    /**
+       Initializer. When this cell's checkbox is checked, a Backbone
+       `backgrid:select` event will be triggered for each model for the current
+       page in the underlying collection. If a `SelectRowCell` instance exists
+       for the rows representing the models, they will check themselves. If any
+       of the SelectRowCell instances trigger a Backbone `backgrid:selected`
+       event with a `false` value, this cell will uncheck its checkbox. In the
+       event of a Backbone `backgrid:refresh` event, which is triggered when the
+       body refreshes its rows, which can happen under a number of conditions
+       such as paging or the columns were reset, this cell will still remember
+       the previously selected models and trigger a Backbone `backgrid:select`
+       event on them such that the SelectRowCells can recheck themselves upon
+       refreshing.
+
+       @param {Object} options
+       @param {Backgrid.Column} options.column
+       @param {Backbone.Collection} options.collection
+    */
+    initialize: function (options) {
+      Backgrid.requireOptions(options, ["column", "collection"]);
+
+      this.column = options.column;
+      if (!(this.column instanceof Backgrid.Column)) {
+        this.column = new Backgrid.Column(this.column);
+      }
+
+      var collection = this.collection;
+      var selectedModels = this.selectedModels = {};
+      this.listenTo(collection, "backgrid:selected", function (model, selected) {
+        if (selected) selectedModels[model.id || model.cid] = model;
+        else {
+          delete selectedModels[model.id || model.cid];
+          this.$el.find(":checkbox").prop("checked", false);
+        }
+      });
+
+      this.listenTo(collection, "remove", function (model) {
+        delete selectedModels[model.cid];
+      });
+
+      this.listenTo(collection, "backgrid:refresh", function () {
+        this.$el.find(":checkbox").prop("checked", false);
+        for (var i = 0; i < collection.length; i++) {
+          var model = collection.at(i);
+          if (selectedModels[model.id || model.cid]) {
+            model.trigger('backgrid:select', model, true);
+          }
+        }
+      });
+    },
+
+    /**
+       Progagates the checked value of this checkbox to all the models of the
+       underlying collection by triggering a Backbone `backgrid:select` event on
+       the models themselves, passing each model and the current `checked` value
+       of the checkbox in each event.
+    */
+    onChange: function (e) {
+      var checked = $(e.target).prop("checked");
+
+      var collection = this.collection;
+      collection.each(function (model) {
+        model.trigger("backgrid:select", model, checked);
+      });
+    }
+
+  });
+
+  /**
+     Convenient method to retrieve a list of selected models. This method only
+     exists when the `SelectAll` extension has been included.
+
+     @member Backgrid.Grid
+     @return {Array.<Backbone.Model>}
+  */
+  Backgrid.Grid.prototype.getSelectedModels = function () {
+    var selectAllHeaderCell;
+    var headerCells = this.header.row.cells;
+    for (var i = 0, l = headerCells.length; i < l; i++) {
+      var headerCell = headerCells[i];
+      if (headerCell instanceof SelectAllHeaderCell) {
+        selectAllHeaderCell = headerCell;
+        break;
+      }
+    }
+
+    var result = [];
+    if (selectAllHeaderCell) {
+      for (var modelId in selectAllHeaderCell.selectedModels) {
+        result.push(this.collection.get(modelId));
+      }
+    }
+
+    return result;
+  };
+
+}(window, jQuery, _, Backbone, Backgrid));