backgrid-columnmanager
Advanced tools
@@ -1,1 +0,1 @@ | ||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._)}(this,function(e,t,n){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";var i=n(3),o=n(1),s=n(2);s.Extension.ColumnManager=function(e,t){var n={initialColumnsVisible:null};this.options=i.extend({},n,t),e instanceof s.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},s.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this.options.initialColumnsVisible;this.columns instanceof s.Columns&&e&&this.columns.each(function(t,n){t.set("renderable",e>n||t.get("alwaysVisible"))})},s.Extension.ColumnManager.prototype.getColumn=function(e){return(i.isNumber(e)||i.isString(e))&&(e=this.columns.get(e)),e instanceof s.Column?e:!1},s.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},s.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},s.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},s.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var l=o.View.extend({className:"columnmanager-dropdown-item",tagName:"li",initialize:function(e){this.columnManager=e.columnManager,this.column=e.column,this.template=e.template,i.bindAll(this,"render","toggleVisibility"),this.column.on("change:renderable",this.render,this),this.el.addEventListener("click",this.toggleVisibility,!0)},render:function(){return this.$el.empty(),this.$el.append(this.template({label:this.column.get("label")})),this.column.get("renderable")?this.$el.addClass(this.column.get("renderable")?"visible":null):this.$el.removeClass("visible"),this},toggleVisibility:function(e){e&&this.stopPropagation(e),this.columnManager.toggleColumnVisibility(this.column)},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()}}),r=o.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof o.View?e.DropdownItemView:l,this.button=e.button,this.on("dropdown:opened",this.open,this),this.on("dropdown:closed",this.close,this),this.columnManager.columns.on("add remove",this.render,this)},render:function(){var e=this;return e.$el.empty(),this.columnManager.columns.each(function(t){t.get("alwaysVisible")||e.$el.append(new e.ItemView({column:t,columnManager:e.columnManager,template:e.options.dropdownItemTemplate}).render().el)}),this},open:function(){this.$el.addClass("open");var e,t=this.$el.parent().find(".dropdown-button").first();if("auto"===this.options.align){var n=document.body.clientWidth||document.body.clientWidth;e=t.offset().left+this.$el.outerWidth()>n?"left":"right"}else e="left"===this.options.align||"right"===this.options.align?"right"===this.options.align?"right":"left":"right";var i;"left"===e?(i=t.position().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",i+"px")):(i=t.position().left,this.$el.css("left",i+"px"))},close:function(){this.$el.removeClass("open")}});s.Extension.ColumnManagerVisibilityControl=o.View.extend({tagName:"div",className:"columnmanager-visibilitycontrol",defaultEvents:{click:"stopPropagation"},defaultOpts:{width:null,closeOnEsc:!0,closeOnClick:!0,openOnInit:!1,columnManager:null,buttonTemplate:i.template("<button class='dropdown-button'>...</button>"),DropdownView:r,dropdownAlign:"auto",DropdownItemView:l,dropdownItemTemplate:i.template("<span class='indicator'></span><span class='column-label'><%= label %></span>")},initialize:function(e){this.options=i.extend({},this.defaultOpts,e),this.events=i.extend({},this.defaultEvents,this.events||{}),this.columnManager=e.columnManager,!this.columnManager instanceof s.Extension.ColumnManager&&console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns"),i.bindAll(this,"deferClose","stopDeferClose","closeOnEsc","toggle","render"),document.body.addEventListener("click",this.deferClose,!0),this.el.addEventListener("click",this.stopDeferClose,!0),this.options.closeOnEsc&&document.body.addEventListener("keyup",this.closeOnEsc,!1),this.el.addEventListener("click",this.toggle,!1),this.setup(),this.view.on("dropdown:close",this.close,this),this.view.on("dropdown:open",this.open,this)},delayStart:function(){clearTimeout(this.closeTimeout),this.delayTimeout=setTimeout(this.open.bind(this),this.options.delay)},delayEnd:function(){clearTimeout(this.delayTimeout),this.closeTimeout=setTimeout(this.close.bind(this),300)},setup:function(){this.options.width&&this.$el.width(this.options.width+"px");var e={columnManager:this.columnManager,DropdownItemView:this.options.DropdownItemView,dropdownItemTemplate:this.options.dropdownItemTemplate,align:this.options.dropdownAlign};this.view=this.options.DropdownView instanceof o.View?new this.options.DropdownView(e):new r(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),this.$el.append(this.view.el),this},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()},toggle:function(e){this.isOpen!==!0?this.open(e):this.close(e)},open:function(e){clearTimeout(this.closeTimeout),clearTimeout(this.deferCloseTimeout),e&&e.stopPropagation(),this.isOpen||(this.isOpen=!0,this.$el.addClass("open"),this.trigger("dropdown:opened"),this.view.trigger("dropdown:opened"),this.setDropdownPosition())},close:function(){this.isOpen&&(this.isOpen=!1,this.$el.removeClass("open"),this.trigger("dropdown:closed"),this.view.trigger("dropdown:closed"))},closeOnEsc:function(e){27===e.which&&this.deferClose()},deferClose:function(){this.deferCloseTimeout=setTimeout(this.close.bind(this),0)},stopDeferClose:function(){clearTimeout(this.deferCloseTimeout)},setDropdownPosition:function(){this.view.$el.css("top",this.$el.height())}}),s.Extension.ColumnManager.ColumnVisibilityHeaderCell=s.HeaderCell.extend({initialize:function(){s.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass("columnVisibility")},render:function(){this.$el.empty();var e=new s.Extension.ColumnManagerVisibilityControl({columnManager:this.column.collection.columnManager});return this.$el.html(e.render().el),this.delegateEvents(),this}})},function(t){t.exports=e},function(e){e.exports=t},function(e){e.exports=n}])}); | ||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._)}(this,function(e,t,i){return function(e){function t(n){if(i[n])return i[n].exports;var o=i[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var i={};return t.m=e,t.c=i,t.p="",t(0)}([function(e,t,i){"use strict";var n=i(3),o=i(1),s=i(2);s.Extension.ColumnManager=function(e,t){var i={initialColumnsVisible:null};this.options=n.extend({},i,t),e instanceof s.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},s.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this.options.initialColumnsVisible;this.columns instanceof s.Columns&&e&&this.columns.each(function(t,i){t.set("renderable",e>i||t.get("alwaysVisible"))})},s.Extension.ColumnManager.prototype.getColumn=function(e){return(n.isNumber(e)||n.isString(e))&&(e=this.columns.get(e)),e instanceof s.Column?e:!1},s.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},s.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},s.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},s.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var l=o.View.extend({className:"columnmanager-dropdown-item",tagName:"li",initialize:function(e){this.columnManager=e.columnManager,this.column=e.column,this.template=e.template,n.bindAll(this,"render","toggleVisibility"),this.column.on("change:renderable",this.render,this),this.el.addEventListener("click",this.toggleVisibility,!0)},render:function(){return this.$el.empty(),this.$el.append(this.template({label:this.column.get("label")})),this.column.get("renderable")?this.$el.addClass(this.column.get("renderable")?"visible":null):this.$el.removeClass("visible"),this},toggleVisibility:function(e){e&&this.stopPropagation(e),this.columnManager.toggleColumnVisibility(this.column)},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()}}),r=o.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof o.View?e.DropdownItemView:l,this.button=e.button,this.on("dropdown:opened",this.open,this),this.on("dropdown:closed",this.close,this),this.columnManager.columns.on("add remove",this.render,this)},render:function(){var e=this;return e.$el.empty(),this.columnManager.columns.each(function(t){t.get("alwaysVisible")||e.$el.append(new e.ItemView({column:t,columnManager:e.columnManager,template:e.options.dropdownItemTemplate}).render().el)}),this},open:function(){this.$el.addClass("open");var e,t=this.$el.parent().find(".dropdown-button").first();if("auto"===this.options.align){var i=document.body.clientWidth||document.body.clientWidth;e=t.offset().left+this.$el.outerWidth()>i?"left":"right"}else e="left"===this.options.align||"right"===this.options.align?"right"===this.options.align?"right":"left":"right";var n;"left"===e?(n=t.position().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",n+"px")):(n=t.position().left,this.$el.css("left",n+"px"))},close:function(){this.$el.removeClass("open")}});s.Extension.ColumnManagerVisibilityControl=o.View.extend({tagName:"div",className:"columnmanager-visibilitycontrol",defaultEvents:{click:"stopPropagation"},defaultOpts:{width:null,closeOnEsc:!0,closeOnClick:!0,openOnInit:!1,columnManager:null,buttonTemplate:n.template("<button class='dropdown-button'>...</button>"),DropdownView:r,dropdownAlign:"auto",DropdownItemView:l,dropdownItemTemplate:n.template("<span class='indicator'></span><span class='column-label'><%= label %></span>")},initialize:function(e){this.options=n.extend({},this.defaultOpts,e),this.events=n.extend({},this.defaultEvents,this.events||{}),this.columnManager=e.columnManager,!this.columnManager instanceof s.Extension.ColumnManager&&console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns"),n.bindAll(this,"deferClose","stopDeferClose","closeOnEsc","toggle","render"),document.body.addEventListener("click",this.deferClose,!0),this.el.addEventListener("click",this.stopDeferClose,!0),this.options.closeOnEsc&&document.body.addEventListener("keyup",this.closeOnEsc,!1),this.el.addEventListener("click",this.toggle,!1),this.setup(),this.view.on("dropdown:close",this.close,this),this.view.on("dropdown:open",this.open,this)},delayStart:function(){clearTimeout(this.closeTimeout),this.delayTimeout=setTimeout(this.open.bind(this),this.options.delay)},delayEnd:function(){clearTimeout(this.delayTimeout),this.closeTimeout=setTimeout(this.close.bind(this),300)},setup:function(){this.options.width&&this.$el.width(this.options.width+"px");var e={columnManager:this.columnManager,DropdownItemView:this.options.DropdownItemView,dropdownItemTemplate:this.options.dropdownItemTemplate,align:this.options.dropdownAlign};this.view=this.options.DropdownView instanceof o.View?new this.options.DropdownView(e):new r(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),this.$el.append(this.view.el),this},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()},toggle:function(e){this.isOpen!==!0?this.open(e):this.close(e)},open:function(e){clearTimeout(this.closeTimeout),clearTimeout(this.deferCloseTimeout),e&&e.stopPropagation(),this.isOpen||(this.isOpen=!0,this.$el.addClass("open"),this.trigger("dropdown:opened"),this.view.trigger("dropdown:opened"),this.setDropdownPosition())},close:function(){this.isOpen&&(this.isOpen=!1,this.$el.removeClass("open"),this.trigger("dropdown:closed"),this.view.trigger("dropdown:closed"))},closeOnEsc:function(e){27===e.which&&this.deferClose()},deferClose:function(){this.deferCloseTimeout=setTimeout(this.close.bind(this),0)},stopDeferClose:function(){clearTimeout(this.deferCloseTimeout)},setDropdownPosition:function(){this.view.$el.css("top",this.$el.height())}}),s.Extension.ColumnManager.ColumnVisibilityHeaderCell=s.HeaderCell.extend({initialize:function(){s.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass("columnVisibility")},render:function(){this.$el.empty();var e=new s.Extension.ColumnManagerVisibilityControl({columnManager:this.column.collection.columnManager});return this.$el.html(e.render().el),this.delegateEvents(),this}})},function(t){t.exports=e},function(e){e.exports=t},function(e){e.exports=i}])}); |
@@ -57,4 +57,6 @@ "use strict"; | ||
// Move lib to example | ||
gulp.task("move-library", function() { | ||
return gulp.src("lib/*.js").pipe(gulp.dest("example/js")); | ||
gulp.task("move-library", function(cb) { | ||
gulp.src("lib/*.js").pipe(gulp.dest("example/js")); | ||
gulp.src("lib/*.css").pipe(gulp.dest("example")); | ||
cb(); | ||
}); | ||
@@ -61,0 +63,0 @@ |
@@ -1,1 +0,1 @@ | ||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._)}(this,function(e,t,n){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";var i=n(3),o=n(1),s=n(2);s.Extension.ColumnManager=function(e,t){var n={initialColumnsVisible:null};this.options=i.extend({},n,t),e instanceof s.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},s.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this.options.initialColumnsVisible;this.columns instanceof s.Columns&&e&&this.columns.each(function(t,n){t.set("renderable",e>n||t.get("alwaysVisible"))})},s.Extension.ColumnManager.prototype.getColumn=function(e){return(i.isNumber(e)||i.isString(e))&&(e=this.columns.get(e)),e instanceof s.Column?e:!1},s.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},s.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},s.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},s.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var l=o.View.extend({className:"columnmanager-dropdown-item",tagName:"li",initialize:function(e){this.columnManager=e.columnManager,this.column=e.column,this.template=e.template,i.bindAll(this,"render","toggleVisibility"),this.column.on("change:renderable",this.render,this),this.el.addEventListener("click",this.toggleVisibility,!0)},render:function(){return this.$el.empty(),this.$el.append(this.template({label:this.column.get("label")})),this.column.get("renderable")?this.$el.addClass(this.column.get("renderable")?"visible":null):this.$el.removeClass("visible"),this},toggleVisibility:function(e){e&&this.stopPropagation(e),this.columnManager.toggleColumnVisibility(this.column)},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()}}),r=o.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof o.View?e.DropdownItemView:l,this.button=e.button,this.on("dropdown:opened",this.open,this),this.on("dropdown:closed",this.close,this),this.columnManager.columns.on("add remove",this.render,this)},render:function(){var e=this;return e.$el.empty(),this.columnManager.columns.each(function(t){t.get("alwaysVisible")||e.$el.append(new e.ItemView({column:t,columnManager:e.columnManager,template:e.options.dropdownItemTemplate}).render().el)}),this},open:function(){this.$el.addClass("open");var e,t=this.$el.parent().find(".dropdown-button").first();if("auto"===this.options.align){var n=document.body.clientWidth||document.body.clientWidth;e=t.offset().left+this.$el.outerWidth()>n?"left":"right"}else e="left"===this.options.align||"right"===this.options.align?"right"===this.options.align?"right":"left":"right";var i;"left"===e?(i=t.position().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",i+"px")):(i=t.position().left,this.$el.css("left",i+"px"))},close:function(){this.$el.removeClass("open")}});s.Extension.ColumnManagerVisibilityControl=o.View.extend({tagName:"div",className:"columnmanager-visibilitycontrol",defaultEvents:{click:"stopPropagation"},defaultOpts:{width:null,closeOnEsc:!0,closeOnClick:!0,openOnInit:!1,columnManager:null,buttonTemplate:i.template("<button class='dropdown-button'>...</button>"),DropdownView:r,dropdownAlign:"auto",DropdownItemView:l,dropdownItemTemplate:i.template("<span class='indicator'></span><span class='column-label'><%= label %></span>")},initialize:function(e){this.options=i.extend({},this.defaultOpts,e),this.events=i.extend({},this.defaultEvents,this.events||{}),this.columnManager=e.columnManager,!this.columnManager instanceof s.Extension.ColumnManager&&console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns"),i.bindAll(this,"deferClose","stopDeferClose","closeOnEsc","toggle","render"),document.body.addEventListener("click",this.deferClose,!0),this.el.addEventListener("click",this.stopDeferClose,!0),this.options.closeOnEsc&&document.body.addEventListener("keyup",this.closeOnEsc,!1),this.el.addEventListener("click",this.toggle,!1),this.setup(),this.view.on("dropdown:close",this.close,this),this.view.on("dropdown:open",this.open,this)},delayStart:function(){clearTimeout(this.closeTimeout),this.delayTimeout=setTimeout(this.open.bind(this),this.options.delay)},delayEnd:function(){clearTimeout(this.delayTimeout),this.closeTimeout=setTimeout(this.close.bind(this),300)},setup:function(){this.options.width&&this.$el.width(this.options.width+"px");var e={columnManager:this.columnManager,DropdownItemView:this.options.DropdownItemView,dropdownItemTemplate:this.options.dropdownItemTemplate,align:this.options.dropdownAlign};this.view=this.options.DropdownView instanceof o.View?new this.options.DropdownView(e):new r(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),this.$el.append(this.view.el),this},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()},toggle:function(e){this.isOpen!==!0?this.open(e):this.close(e)},open:function(e){clearTimeout(this.closeTimeout),clearTimeout(this.deferCloseTimeout),e&&e.stopPropagation(),this.isOpen||(this.isOpen=!0,this.$el.addClass("open"),this.trigger("dropdown:opened"),this.view.trigger("dropdown:opened"),this.setDropdownPosition())},close:function(){this.isOpen&&(this.isOpen=!1,this.$el.removeClass("open"),this.trigger("dropdown:closed"),this.view.trigger("dropdown:closed"))},closeOnEsc:function(e){27===e.which&&this.deferClose()},deferClose:function(){this.deferCloseTimeout=setTimeout(this.close.bind(this),0)},stopDeferClose:function(){clearTimeout(this.deferCloseTimeout)},setDropdownPosition:function(){this.view.$el.css("top",this.$el.height())}}),s.Extension.ColumnManager.ColumnVisibilityHeaderCell=s.HeaderCell.extend({initialize:function(){s.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass("columnVisibility")},render:function(){this.$el.empty();var e=new s.Extension.ColumnManagerVisibilityControl({columnManager:this.column.collection.columnManager});return this.$el.html(e.render().el),this.delegateEvents(),this}})},function(t){t.exports=e},function(e){e.exports=t},function(e){e.exports=n}])}); | ||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._)}(this,function(e,t,i){return function(e){function t(n){if(i[n])return i[n].exports;var o=i[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var i={};return t.m=e,t.c=i,t.p="",t(0)}([function(e,t,i){"use strict";var n=i(3),o=i(1),s=i(2);s.Extension.ColumnManager=function(e,t){var i={initialColumnsVisible:null};this.options=n.extend({},i,t),e instanceof s.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},s.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this.options.initialColumnsVisible;this.columns instanceof s.Columns&&e&&this.columns.each(function(t,i){t.set("renderable",e>i||t.get("alwaysVisible"))})},s.Extension.ColumnManager.prototype.getColumn=function(e){return(n.isNumber(e)||n.isString(e))&&(e=this.columns.get(e)),e instanceof s.Column?e:!1},s.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},s.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},s.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},s.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var l=o.View.extend({className:"columnmanager-dropdown-item",tagName:"li",initialize:function(e){this.columnManager=e.columnManager,this.column=e.column,this.template=e.template,n.bindAll(this,"render","toggleVisibility"),this.column.on("change:renderable",this.render,this),this.el.addEventListener("click",this.toggleVisibility,!0)},render:function(){return this.$el.empty(),this.$el.append(this.template({label:this.column.get("label")})),this.column.get("renderable")?this.$el.addClass(this.column.get("renderable")?"visible":null):this.$el.removeClass("visible"),this},toggleVisibility:function(e){e&&this.stopPropagation(e),this.columnManager.toggleColumnVisibility(this.column)},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()}}),r=o.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof o.View?e.DropdownItemView:l,this.button=e.button,this.on("dropdown:opened",this.open,this),this.on("dropdown:closed",this.close,this),this.columnManager.columns.on("add remove",this.render,this)},render:function(){var e=this;return e.$el.empty(),this.columnManager.columns.each(function(t){t.get("alwaysVisible")||e.$el.append(new e.ItemView({column:t,columnManager:e.columnManager,template:e.options.dropdownItemTemplate}).render().el)}),this},open:function(){this.$el.addClass("open");var e,t=this.$el.parent().find(".dropdown-button").first();if("auto"===this.options.align){var i=document.body.clientWidth||document.body.clientWidth;e=t.offset().left+this.$el.outerWidth()>i?"left":"right"}else e="left"===this.options.align||"right"===this.options.align?"right"===this.options.align?"right":"left":"right";var n;"left"===e?(n=t.position().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",n+"px")):(n=t.position().left,this.$el.css("left",n+"px"))},close:function(){this.$el.removeClass("open")}});s.Extension.ColumnManagerVisibilityControl=o.View.extend({tagName:"div",className:"columnmanager-visibilitycontrol",defaultEvents:{click:"stopPropagation"},defaultOpts:{width:null,closeOnEsc:!0,closeOnClick:!0,openOnInit:!1,columnManager:null,buttonTemplate:n.template("<button class='dropdown-button'>...</button>"),DropdownView:r,dropdownAlign:"auto",DropdownItemView:l,dropdownItemTemplate:n.template("<span class='indicator'></span><span class='column-label'><%= label %></span>")},initialize:function(e){this.options=n.extend({},this.defaultOpts,e),this.events=n.extend({},this.defaultEvents,this.events||{}),this.columnManager=e.columnManager,!this.columnManager instanceof s.Extension.ColumnManager&&console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns"),n.bindAll(this,"deferClose","stopDeferClose","closeOnEsc","toggle","render"),document.body.addEventListener("click",this.deferClose,!0),this.el.addEventListener("click",this.stopDeferClose,!0),this.options.closeOnEsc&&document.body.addEventListener("keyup",this.closeOnEsc,!1),this.el.addEventListener("click",this.toggle,!1),this.setup(),this.view.on("dropdown:close",this.close,this),this.view.on("dropdown:open",this.open,this)},delayStart:function(){clearTimeout(this.closeTimeout),this.delayTimeout=setTimeout(this.open.bind(this),this.options.delay)},delayEnd:function(){clearTimeout(this.delayTimeout),this.closeTimeout=setTimeout(this.close.bind(this),300)},setup:function(){this.options.width&&this.$el.width(this.options.width+"px");var e={columnManager:this.columnManager,DropdownItemView:this.options.DropdownItemView,dropdownItemTemplate:this.options.dropdownItemTemplate,align:this.options.dropdownAlign};this.view=this.options.DropdownView instanceof o.View?new this.options.DropdownView(e):new r(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),this.$el.append(this.view.el),this},stopPropagation:function(e){e.stopPropagation(),e.stopImmediatePropagation(),e.preventDefault()},toggle:function(e){this.isOpen!==!0?this.open(e):this.close(e)},open:function(e){clearTimeout(this.closeTimeout),clearTimeout(this.deferCloseTimeout),e&&e.stopPropagation(),this.isOpen||(this.isOpen=!0,this.$el.addClass("open"),this.trigger("dropdown:opened"),this.view.trigger("dropdown:opened"),this.setDropdownPosition())},close:function(){this.isOpen&&(this.isOpen=!1,this.$el.removeClass("open"),this.trigger("dropdown:closed"),this.view.trigger("dropdown:closed"))},closeOnEsc:function(e){27===e.which&&this.deferClose()},deferClose:function(){this.deferCloseTimeout=setTimeout(this.close.bind(this),0)},stopDeferClose:function(){clearTimeout(this.deferCloseTimeout)},setDropdownPosition:function(){this.view.$el.css("top",this.$el.height())}}),s.Extension.ColumnManager.ColumnVisibilityHeaderCell=s.HeaderCell.extend({initialize:function(){s.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass("columnVisibility")},render:function(){this.$el.empty();var e=new s.Extension.ColumnManagerVisibilityControl({columnManager:this.column.collection.columnManager});return this.$el.html(e.render().el),this.delegateEvents(),this}})},function(t){t.exports=e},function(e){e.exports=t},function(e){e.exports=i}])}); |
{ | ||
"name": "backgrid-columnmanager", | ||
"version": "0.1.0", | ||
"version": "0.1.1", | ||
"description": "A backgrid column manager. Adds the ability to show/hide columns.", | ||
@@ -5,0 +5,0 @@ "main": "lib/Backgrid.ColumnManager.js", |
Sorry, the diff of this file is not supported yet
750239
0.5%56
1.82%7783
1.35%