From a772df102d1bed014246340f4c1f2e27b9f08810 Mon Sep 17 00:00:00 2001 From: REJack Date: Wed, 30 Sep 2020 09:04:29 +0200 Subject: [PATCH] rework methods --- build/js/IFrame.js | 97 ++++++++++++++++++++++++---------------------- 1 file changed, 50 insertions(+), 47 deletions(-) diff --git a/build/js/IFrame.js b/build/js/IFrame.js index 8ecc6326a..f919edf19 100644 --- a/build/js/IFrame.js +++ b/build/js/IFrame.js @@ -75,9 +75,9 @@ class IFrame { this._config.onTabCreated(item) } - createTab(title, link, autoOpen) { - const tabId = `panel-${link.replace('.html', '').replace('./', '').replaceAll('/', '-')}-${Math.floor(Math.random() * 1000)}` - const navId = `tab-${link.replace('.html', '').replace('./', '').replaceAll('/', '-')}-${Math.floor(Math.random() * 1000)}` + createTab(title, link, uniqueName, autoOpen) { + const tabId = `panel-${uniqueName}-${Math.floor(Math.random() * 1000)}` + const navId = `tab-${uniqueName}-${Math.floor(Math.random() * 1000)}` const newNavItem = `` $(SELECTOR_TAB_NAVBAR_NAV).append(newNavItem) @@ -86,13 +86,29 @@ class IFrame { $(SELECTOR_TAB_CONTENT).append(newTabItem) if (autoOpen) { - this.switchTab(`#${navId}`, this._config.loadingScreen) + if (this._config.loadingScreen) { + const $loadingScreen = $(SELECTOR_TAB_LOADING) + $loadingScreen.fadeIn() + $(`${tabId} iframe`).ready(() => { + if (typeof this._config.loadingScreen === 'number') { + this.switchTab(`#${navId}`, this._config.loadingScreen) + setTimeout(() => { + $loadingScreen.fadeOut() + }, this._config.loadingScreen) + } else { + this.switchTab(`#${navId}`, this._config.loadingScreen) + $loadingScreen.fadeOut() + } + }) + } else { + this.switchTab(`#${navId}`) + } } this.onTabCreated($(`#${navId}`)) } - openTabSidebar(item) { + openTabSidebar(item, autoOpen = this._config.autoShowNewTab) { let $item = $(item).clone() if ($item.attr('href') === undefined) { $item = $(item).parent('a').clone() @@ -109,59 +125,26 @@ class IFrame { return } - this.createTab(title, link, this._config.autoShowNewTab) + this.createTab(title, link, link.replace('.html', '').replace('./', '').replaceAll('/', '-'), autoOpen) } - switchTab(item, loadingScreen = null) { - $(SELECTOR_TAB_EMPTY).hide() - $(`${SELECTOR_TAB_NAVBAR_NAV} .active`).tab('dispose').removeClass('active') - this._fixHeight() + switchTab(item) { const $item = $(item) const tabId = $item.attr('href') - if (loadingScreen) { - const $loadingScreen = $(SELECTOR_TAB_LOADING) - $loadingScreen.fadeIn() - $(`${tabId} iframe`).ready(() => { - if (typeof loadingScreen === 'number') { - setTimeout(() => { - $loadingScreen.fadeOut() - }, loadingScreen) - } else { - $loadingScreen.fadeOut() - } - }) - } + $(SELECTOR_TAB_EMPTY).hide() + $(`${SELECTOR_TAB_NAVBAR_NAV} .active`).tab('dispose').removeClass('active') + this._fixHeight() $item.tab('show') $item.parents('li').addClass('active') this.onTabChanged($item) if (this._config.autoItemActive) { - this.setItemActive($(`${tabId} iframe`).attr('src')) + this._setItemActive($(`${tabId} iframe`).attr('src')) } } - setItemActive(href) { - $(`${SELECTOR_SIDEBAR_MENU_ITEM}, ${SELECTOR_HEADER_DROPDOWN_ITEM}`).removeClass('active') - $(SELECTOR_HEADER_MENU_ITEM).parent().removeClass('active') - - const $headerMenuItem = $(`${SELECTOR_HEADER_MENU_ITEM}[href$="${href}"]`) - const $headerDropdownItem = $(`${SELECTOR_HEADER_DROPDOWN_ITEM}[href$="${href}"]`) - const $sidebarMenuItem = $(`${SELECTOR_SIDEBAR_MENU_ITEM}[href$="${href}"]`) - - $headerMenuItem.each((i, e) => { - $(e).parent().addClass('active') - }) - $headerDropdownItem.each((i, e) => { - $(e).addClass('active') - }) - $sidebarMenuItem.each((i, e) => { - $(e).addClass('active') - $(e).parents('.nav-treeview').prevAll('.nav-link').addClass('active') - }) - } - removeActiveTab() { $(`${SELECTOR_TAB_NAVBAR_NAV_ITEM}.active`).parent().remove() $('.tab-pane.active').remove() @@ -211,6 +194,26 @@ class IFrame { }) } + _setItemActive(href) { + $(`${SELECTOR_SIDEBAR_MENU_ITEM}, ${SELECTOR_HEADER_DROPDOWN_ITEM}`).removeClass('active') + $(SELECTOR_HEADER_MENU_ITEM).parent().removeClass('active') + + const $headerMenuItem = $(`${SELECTOR_HEADER_MENU_ITEM}[href$="${href}"]`) + const $headerDropdownItem = $(`${SELECTOR_HEADER_DROPDOWN_ITEM}[href$="${href}"]`) + const $sidebarMenuItem = $(`${SELECTOR_SIDEBAR_MENU_ITEM}[href$="${href}"]`) + + $headerMenuItem.each((i, e) => { + $(e).parent().addClass('active') + }) + $headerDropdownItem.each((i, e) => { + $(e).addClass('active') + }) + $sidebarMenuItem.each((i, e) => { + $(e).addClass('active') + $(e).parents('.nav-treeview').prevAll('.nav-link').addClass('active') + }) + } + _fixHeight(tabEmpty = false) { const contentWrapperHeight = parseFloat($(SELECTOR_CONTENT_WRAPPER).css('min-height')) const navbarHeight = $(SELECTOR_TAB_NAV).outerHeight() @@ -225,7 +228,7 @@ class IFrame { // Static - static _jQueryInterface(operation) { + static _jQueryInterface(operation, ...args) { let data = $(this).data(DATA_KEY) const _options = $.extend({}, Default, $(this).data()) @@ -234,8 +237,8 @@ class IFrame { $(this).data(DATA_KEY, data) } - if (typeof operation === 'string' && operation.match(/openTabSidebar/)) { - data[operation]() + if (typeof operation === 'string' && operation.match(/createTab|openTabSidebar|switchTab|removeActiveTab/)) { + data[operation](...args) } } }