backgrid-columnmanager - npm Package Compare versions

Comparing version 0.1.2 to 0.1.3

example/js/Backgrid.ColumnManager.js

@@ -569,4 +569,11 @@ (function webpackUniversalModuleDefinition(root, factory) {
 			if(e) {
-				e.stopPropagation();
+				if (e.stopPropagation) {
+					e.stopPropagation();
+				}
+				if (e.preventDefault) {
+					e.preventDefault();
+				}
+				e.cancelBubble = true;
 			}
+
 			// Don't do anything if already open
@@ -573,0 +580,0 @@ if(this.isOpen) {

example/js/Backgrid.ColumnManager.min.js

@@ -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,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}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_"),require("jQuery")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_","jQuery"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_"),require("jQuery")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._,e.jQuery)}(this,function(e,t,n,i){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(4),s=n(1),l=n(2);l.Extension.ColumnManager=function(e,t){var n={initialColumnsVisible:null};this.options=i.extend({},n,t),e instanceof l.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},l.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this,t=e.options.initialColumnsVisible;e.columns instanceof l.Columns&&t&&e.columns.each(function(n,i){n.set("renderable",n.get("alwaysVisible")?!0:t>i),n.get("headerCell")===l.Extension.ColumnManager.ColumnVisibilityHeaderCell&&n.set("headerCell",n.get("headerCell").extend({columnManager:e})),n.get("headerCell")instanceof l.Extension.ColumnManager.ColumnVisibilityHeaderCell&&(n.get("headerCell").columnManager=e)})},l.Extension.ColumnManager.prototype.getColumn=function(e){return(i.isNumber(e)||i.isString(e))&&(e=this.columns.get(e)),e instanceof l.Column?e:!1},l.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},l.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},l.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},l.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var r=s.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()}}),a=s.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof s.View?e.DropdownItemView:r,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.offset().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",i+"px")):(i=t.offset().left,this.$el.css("left",i+"px"));var o=t.offset().top+t.outerHeight();this.$el.css("top",o+"px")},close:function(){this.$el.removeClass("open")}});l.Extension.ColumnManagerVisibilityControl=s.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:a,dropdownAlign:"auto",DropdownItemView:r,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 l.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 s.View?new this.options.DropdownView(e):new a(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),o(document.body).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"))},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)}}),l.Extension.ColumnManager.ColumnVisibilityHeaderCell=l.HeaderCell.extend({initialize:function(){l.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass(this.column.get("name"))},render:function(){this.$el.empty();var e=new l.Extension.ColumnManagerVisibilityControl({columnManager:this.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){e.exports=i}])});

lib/Backgrid.ColumnManager.js

@@ -569,4 +569,11 @@ (function webpackUniversalModuleDefinition(root, factory) {
 			if(e) {
-				e.stopPropagation();
+				if (e.stopPropagation) {
+					e.stopPropagation();
+				}
+				if (e.preventDefault) {
+					e.preventDefault();
+				}
+				e.cancelBubble = true;
 			}
+
 			// Don't do anything if already open
@@ -573,0 +580,0 @@ if(this.isOpen) {

lib/Backgrid.ColumnManager.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_"),require("jQuery")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_","jQuery"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_"),require("jQuery")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._,e.jQuery)}(this,function(e,t,n,i){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(4),s=n(1),l=n(2);l.Extension.ColumnManager=function(e,t){var n={initialColumnsVisible:null};this.options=i.extend({},n,t),e instanceof l.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},l.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this,t=e.options.initialColumnsVisible;e.columns instanceof l.Columns&&t&&e.columns.each(function(n,i){n.set("renderable",n.get("alwaysVisible")?!0:t>i),n.get("headerCell")===l.Extension.ColumnManager.ColumnVisibilityHeaderCell&&n.set("headerCell",n.get("headerCell").extend({columnManager:e})),n.get("headerCell")instanceof l.Extension.ColumnManager.ColumnVisibilityHeaderCell&&(n.get("headerCell").columnManager=e)})},l.Extension.ColumnManager.prototype.getColumn=function(e){return(i.isNumber(e)||i.isString(e))&&(e=this.columns.get(e)),e instanceof l.Column?e:!1},l.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},l.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},l.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},l.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var r=s.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()}}),a=s.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof s.View?e.DropdownItemView:r,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.offset().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",i+"px")):(i=t.offset().left,this.$el.css("left",i+"px"));var o=t.offset().top+t.outerHeight();this.$el.css("top",o+"px")},close:function(){this.$el.removeClass("open")}});l.Extension.ColumnManagerVisibilityControl=s.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:a,dropdownAlign:"auto",DropdownItemView:r,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 l.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 s.View?new this.options.DropdownView(e):new a(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),o(document.body).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"))},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)}}),l.Extension.ColumnManager.ColumnVisibilityHeaderCell=l.HeaderCell.extend({initialize:function(){l.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass(this.column.get("name"))},render:function(){this.$el.empty();var e=new l.Extension.ColumnManagerVisibilityControl({columnManager:this.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){e.exports=i}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("Backbone"),require("Backgrid"),require("_"),require("jQuery")):"function"==typeof define&&define.amd?define(["Backbone","Backgrid","_","jQuery"],t):"object"==typeof exports?exports["Backgrid.Extension.ColumnManager"]=t(require("Backbone"),require("Backgrid"),require("_"),require("jQuery")):e["Backgrid.Extension.ColumnManager"]=t(e.Backbone,e.Backgrid,e._,e.jQuery)}(this,function(e,t,n,i){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(4),s=n(1),l=n(2);l.Extension.ColumnManager=function(e,t){var n={initialColumnsVisible:null};this.options=i.extend({},n,t),e instanceof l.Columns?(this.columns=e,e.columnManager=this,this.setInitialColumnVisibility()):console.error("Backgrid.ColumnManager: options.columns is not an instance of Backgrid.Columns")},l.Extension.ColumnManager.prototype.setInitialColumnVisibility=function(){var e=this,t=e.options.initialColumnsVisible;e.columns instanceof l.Columns&&t&&e.columns.each(function(n,i){n.set("renderable",n.get("alwaysVisible")?!0:t>i),n.get("headerCell")===l.Extension.ColumnManager.ColumnVisibilityHeaderCell&&n.set("headerCell",n.get("headerCell").extend({columnManager:e})),n.get("headerCell")instanceof l.Extension.ColumnManager.ColumnVisibilityHeaderCell&&(n.get("headerCell").columnManager=e)})},l.Extension.ColumnManager.prototype.getColumn=function(e){return(i.isNumber(e)||i.isString(e))&&(e=this.columns.get(e)),e instanceof l.Column?e:!1},l.Extension.ColumnManager.prototype.hideColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!1)},l.Extension.ColumnManager.prototype.showColumn=function(e){var t=this.getColumn(e);t&&t.set("renderable",!0)},l.Extension.ColumnManager.prototype.toggleColumnVisibility=function(e){var t=this.getColumn(e);t&&(t.get("renderable")?this.hideColumn(t):this.showColumn(t))},l.Extension.ColumnManager.prototype.getColumnCollection=function(){return this.columns};var r=s.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()}}),a=s.View.extend({className:"columnmanager-dropdown-container",initialize:function(e){this.options=e,this.columnManager=e.columnManager,this.ItemView=e.DropdownItemView instanceof s.View?e.DropdownItemView:r,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.offset().left+t.outerWidth()-this.$el.outerWidth(),this.$el.css("left",i+"px")):(i=t.offset().left,this.$el.css("left",i+"px"));var o=t.offset().top+t.outerHeight();this.$el.css("top",o+"px")},close:function(){this.$el.removeClass("open")}});l.Extension.ColumnManagerVisibilityControl=s.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:a,dropdownAlign:"auto",DropdownItemView:r,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 l.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 s.View?new this.options.DropdownView(e):new a(e)},render:function(){return this.$el.empty(),this.$el.append(this.options.buttonTemplate()),this.view.render(),o(document.body).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&&e.stopPropagation(),e.preventDefault&&e.preventDefault(),e.cancelBubble=!0),this.isOpen||(this.isOpen=!0,this.$el.addClass("open"),this.trigger("dropdown:opened"),this.view.trigger("dropdown:opened"))},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)}}),l.Extension.ColumnManager.ColumnVisibilityHeaderCell=l.HeaderCell.extend({initialize:function(){l.HeaderCell.prototype.initialize.apply(this,arguments),this.$el.addClass(this.column.get("name"))},render:function(){this.$el.empty();var e=new l.Extension.ColumnManagerVisibilityControl({columnManager:this.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){e.exports=i}])});

package.json

 {
   "name": "backgrid-columnmanager",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "A backgrid column manager. Adds the ability to show/hide columns.",
@@ -5,0 +5,0 @@ "main": "lib/Backgrid.ColumnManager.js",

src/Backgrid.ColumnManager.js

@@ -513,4 +513,11 @@ "use strict";
 		if(e) {
-			e.stopPropagation();
+			if (e.stopPropagation) {
+				e.stopPropagation();
+			}
+			if (e.preventDefault) {
+				e.preventDefault();
+			}
+			e.cancelBubble = true;
 		}
+
 		// Don't do anything if already open
@@ -517,0 +524,0 @@ if(this.isOpen) {

No alert changes

Improved metrics

Total package byte prevSize

751792

increased by0.1%

Lines of code

7825

increased by0.23%

No dependency changes