Add visibilityThreshold option

This commit is contained in:
Thomas Brouard 2020-03-10 21:46:55 +01:00
parent fd330d3895
commit 52b6506c57
3 changed files with 23 additions and 0 deletions

View file

@ -34,6 +34,7 @@ class TabGroup extends EventEmitter {
closeButtonText: args.closeButtonText || "×",
newTab: args.newTab,
newTabButtonText: args.newTabButtonText || "+",
visibilityThreshold: args.visibilityThreshold || 0,
ready: args.ready
};
this.tabContainer = document.querySelector(options.tabContainerSelector);
@ -41,6 +42,7 @@ class TabGroup extends EventEmitter {
this.tabs = [];
this.newTabId = 0;
TabGroupPrivate.initNewTabButton.bind(this)();
TabGroupPrivate.initVisibility.bind(this)();
if (typeof this.options.ready === "function") {
this.options.ready(this);
}
@ -122,6 +124,21 @@ const TabGroupPrivate = {
button.addEventListener("click", this.addTab.bind(this, undefined), false);
},
initVisibility: function () {
function toggleTabsVisibility(tab, tabGroup) {
var visibilityThreshold = this.options.visibilityThreshold;
var el = tabGroup.tabContainer.parentNode;
if (this.tabs.length >= visibilityThreshold) {
el.classList.add("visible");
} else {
el.classList.remove("visible");
}
}
this.on("tab-added", toggleTabsVisibility);
this.on("tab-removed", toggleTabsVisibility);
},
removeTab: function (tab, triggerEvent) {
let id = tab.id;
for (let i in this.tabs) {