123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362 |
- /*
- * FooTable v3 - FooTable is a jQuery plugin that aims to make HTML tables on smaller devices look awesome.
- * @version 3.1.6
- * @link http://fooplugins.com
- * @copyright Steven Usher & Brad Vincent 2015
- * @license Released under the GPLv3 license.
- */
- (function($, F){
- // global int to use if the table has no ID
- var _uid = 0,
- // a hash value for the current url
- _url_hash = (function(str){
- var i, l, hval = 0x811c9dc5;
- for (i = 0, l = str.length; i < l; i++) {
- hval ^= str.charCodeAt(i);
- hval += (hval << 1) + (hval << 4) + (hval << 7) + (hval << 8) + (hval << 24);
- }
- return hval >>> 0;
- })(location.origin + location.pathname);
- F.State = F.Component.extend(/** @lends FooTable.State */{
- /**
- * The state component adds the ability for the table to remember its basic state for filtering, paging and sorting.
- * @constructs
- * @extends FooTable.Component
- * @param {FooTable.Table} table - The parent {@link FooTable.Table} object for the component.
- * @returns {FooTable.State}
- */
- construct: function(table){
- // call the constructor of the base class
- this._super(table, table.o.state.enabled);
- // Change this value if an update to this component requires any stored data to be reset
- this._key = '1';
- /**
- * The key to use to store the state for this table.
- * @type {(null|string)}
- */
- this.key = this._key + (F.is.string(table.o.state.key) ? table.o.state.key : this._uid());
- /**
- * Whether or not to allow the filtering component to store it's state.
- * @type {boolean}
- */
- this.filtering = F.is.boolean(table.o.state.filtering) ? table.o.state.filtering : true;
- /**
- * Whether or not to allow the paging component to store it's state.
- * @type {boolean}
- */
- this.paging = F.is.boolean(table.o.state.paging) ? table.o.state.paging : true;
- /**
- * Whether or not to allow the sorting component to store it's state.
- * @type {boolean}
- */
- this.sorting = F.is.boolean(table.o.state.sorting) ? table.o.state.sorting : true;
- },
- /* PROTECTED */
- /**
- * Checks the supplied data and options for the state component.
- * @instance
- * @protected
- * @param {object} data - The jQuery data object from the parent table.
- * @fires FooTable.State#"preinit.ft.state"
- * @this FooTable.State
- */
- preinit: function(data){
- var self = this;
- /**
- * The preinit.ft.state event is raised before the UI is created and provides the tables jQuery data object for additional options parsing.
- * Calling preventDefault on this event will disable the component.
- * @event FooTable.State#"preinit.ft.state"
- * @param {jQuery.Event} e - The jQuery.Event object for the event.
- * @param {FooTable.Table} ft - The instance of the plugin raising the event.
- * @param {object} data - The jQuery data object of the table raising the event.
- */
- this.ft.raise('preinit.ft.state', [data]).then(function(){
- self.enabled = F.is.boolean(data.state)
- ? data.state
- : self.enabled;
- if (!self.enabled) return;
- self.key = self._key + (F.is.string(data.stateKey) ? data.stateKey : self.key);
- self.filtering = F.is.boolean(data.stateFiltering) ? data.stateFiltering : self.filtering;
- self.paging = F.is.boolean(data.statePaging) ? data.statePaging : self.paging;
- self.sorting = F.is.boolean(data.stateSorting) ? data.stateSorting : self.sorting;
- }, function(){
- self.enabled = false;
- });
- },
- /**
- * Gets the state value for the specified key for this table.
- * @instance
- * @param {string} key - The key to get the value for.
- * @returns {(*|null)}
- */
- get: function(key){
- return JSON.parse(localStorage.getItem(this.key + ':' + key));
- },
- /**
- * Sets the state value for the specified key for this table.
- * @instance
- * @param {string} key - The key to set the value for.
- * @param {*} data - The value to store for the key. This value must be JSON.stringify friendly.
- */
- set: function(key, data){
- localStorage.setItem(this.key + ':' + key, JSON.stringify(data));
- },
- /**
- * Clears the state value for the specified key for this table.
- * @instance
- * @param {string} key - The key to clear the value for.
- */
- remove: function(key){
- localStorage.removeItem(this.key + ':' + key);
- },
- /**
- * Executes the {@link FooTable.Component#readState} function on all components.
- * @instance
- */
- read: function(){
- this.ft.execute(false, true, 'readState');
- },
- /**
- * Executes the {@link FooTable.Component#writeState} function on all components.
- * @instance
- */
- write: function(){
- this.ft.execute(false, true, 'writeState');
- },
- /**
- * Executes the {@link FooTable.Component#clearState} function on all components.
- * @instance
- */
- clear: function(){
- this.ft.execute(false, true, 'clearState');
- },
- /**
- * Generates a unique identifier for the current {@link FooTable.Table} if one is not supplied through the options.
- * This value is a combination of the url hash and either the element ID or an incremented global int value.
- * @instance
- * @returns {*}
- * @private
- */
- _uid: function(){
- var id = this.ft.$el.attr('id');
- return _url_hash + '_' + (F.is.string(id) ? id : ++_uid);
- }
- });
- F.components.register('state', F.State, 700);
- })(jQuery, FooTable);
- (function(F){
- /**
- * This method is called from the {@link FooTable.State#read} method and allows a component to retrieve its' stored state.
- * @instance
- * @protected
- * @function
- */
- F.Component.prototype.readState = function(){};
- /**
- * This method is called from the {@link FooTable.State#write} method and allows a component to write its' current state to the store.
- * @instance
- * @protected
- * @function
- */
- F.Component.prototype.writeState = function(){};
- /**
- * This method is called from the {@link FooTable.State#clear} method and allows a component to clear any stored state.
- * @instance
- * @protected
- * @function
- */
- F.Component.prototype.clearState = function(){};
- })(FooTable);
- (function(F){
- /**
- * An object containing the state options for the plugin. Added by the {@link FooTable.State} component.
- * @type {object}
- * @prop {boolean} enabled=false - Whether or not to allow state to be stored for the table. This overrides the individual component enable options.
- * @prop {boolean} filtering=true - Whether or not to allow the filtering state to be stored.
- * @prop {boolean} paging=true - Whether or not to allow the filtering state to be stored.
- * @prop {boolean} sorting=true - Whether or not to allow the filtering state to be stored.
- * @prop {string} key=null - The unique key to use to store the table's data.
- */
- F.Defaults.prototype.state = {
- enabled: false,
- filtering: true,
- paging: true,
- sorting: true,
- key: null
- };
- })(FooTable);
- (function(F){
- if (!F.Filtering) return;
- /**
- * Allows the filtering component to retrieve its' stored state.
- */
- F.Filtering.prototype.readState = function(){
- if (this.ft.state.filtering){
- var state = this.ft.state.get('filtering');
- if (F.is.hash(state) && !F.is.emptyArray(state.filters)){
- this.filters = this.ensure(state.filters);
- }
- }
- };
- /**
- * Allows the filtering component to write its' current state to the store.
- */
- F.Filtering.prototype.writeState = function(){
- if (this.ft.state.filtering) {
- var filters = F.arr.map(this.filters, function (f) {
- return {
- name: f.name,
- query: f.query instanceof F.Query ? f.query.val() : f.query,
- columns: F.arr.map(f.columns, function (c) {
- return c.name;
- }),
- hidden: f.hidden,
- space: f.space,
- connectors: f.connectors,
- ignoreCase: f.ignoreCase
- };
- });
- this.ft.state.set('filtering', {filters: filters});
- }
- };
- /**
- * Allows the filtering component to clear any stored state.
- */
- F.Filtering.prototype.clearState = function(){
- if (this.ft.state.filtering) {
- this.ft.state.remove('filtering');
- }
- };
- })(FooTable);
- (function(F){
- if (!F.Paging) return;
- /**
- * Allows the paging component to retrieve its' stored state.
- */
- F.Paging.prototype.readState = function(){
- if (this.ft.state.paging) {
- var state = this.ft.state.get('paging');
- if (F.is.hash(state)) {
- this.current = state.current;
- this.size = state.size;
- }
- }
- };
- /**
- * Allows the paging component to write its' current state to the store.
- */
- F.Paging.prototype.writeState = function(){
- if (this.ft.state.paging) {
- this.ft.state.set('paging', {
- current: this.current,
- size: this.size
- });
- }
- };
- /**
- * Allows the paging component to clear any stored state.
- */
- F.Paging.prototype.clearState = function(){
- if (this.ft.state.paging) {
- this.ft.state.remove('paging');
- }
- };
- })(FooTable);
- (function(F){
- if (!F.Sorting) return;
- /**
- * Allows the sorting component to retrieve its' stored state.
- */
- F.Sorting.prototype.readState = function(){
- if (this.ft.state.sorting) {
- var state = this.ft.state.get('sorting');
- if (F.is.hash(state)) {
- var column = this.ft.columns.get(state.column);
- if (column instanceof F.Column) {
- this.column = column;
- this.column.direction = state.direction;
- }
- }
- }
- };
- /**
- * Allows the sorting component to write its' current state to the store.
- */
- F.Sorting.prototype.writeState = function(){
- if (this.ft.state.sorting && this.column instanceof F.Column){
- this.ft.state.set('sorting', {
- column: this.column.name,
- direction: this.column.direction
- });
- }
- };
- /**
- * Allows the sorting component to clear any stored state.
- */
- F.Sorting.prototype.clearState = function(){
- if (this.ft.state.sorting) {
- this.ft.state.remove('sorting');
- }
- };
- })(FooTable);
- (function(F){
- // hook into the _construct method so we can add the state property to the table.
- F.Table.extend('_construct', function(ready){
- this.state = this.use(FooTable.State);
- return this._super(ready);
- });
- // hook into the _preinit method so we can trigger a plugin wide read state operation.
- F.Table.extend('_preinit', function(){
- var self = this;
- return self._super().then(function(){
- if (self.state.enabled){
- self.state.read();
- }
- });
- });
- // hook into the draw method so we can trigger a plugin wide write state operation.
- F.Table.extend('draw', function(){
- var self = this;
- return self._super().then(function(){
- if (self.state.enabled){
- self.state.write();
- }
- });
- });
- })(FooTable);
|