StarCitizenTools/mediawiki-extensions-TabberNeue
1
0
Fork 0
mirror of https://github.com/StarCitizenTools/mediawiki-extensions-TabberNeue.git synced 2024-11-27 09:42:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: simplify VE tabber condition check

Browse source
This commit is contained in:
alistair3149 2024-11-16 02:44:00 -05:00 committed by alistair3149
parent 70f632a4db
commit b0670f5df8
2 changed files with 27 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
modules/ve-tabberNeue/ve.ce.MWTabberNode.js
View file

@ -30,10 +30,9 @@ ve.ce.MWTabberNode.static.tagName = 'div';
ve.ce.MWTabberNode.static.primaryCommandName = 'mwTabber';
/* Methods */
// eslint-disable-next-line no-var
var lastHeader;
ve.ce.MWTabberNode.static.lastHeader = null;
/* Methods */
/**
* @inheritdoc
*/
@ -42,13 +41,11 @@ ve.ce.MWTabberNode.prototype.onSetup = function () {
ve.ce.MWTabberNode.super.prototype.onSetup.call( this );
const tabber = this.$element[ 0 ];
const needsInit = tabber.classList.contains( 'tabber--init' );
const isNewHeader = tabber.firstElementChild !== ve.ce.MWTabberNode.static.lastHeader;
// Do not render header if it is already rendered
if (
tabber.firstElementChild &&
tabber.firstElementChild !== lastHeader &&
!tabber.classList.contains( 'tabber--live' ) &&
tabber.classList.contains( 'tabber' )
if ( needsInit && isNewHeader
) {
this.renderHeader( tabber );
}
@ -66,7 +63,9 @@ ve.ce.MWTabberNode.prototype.renderHeader = function ( tabber ) {
const nestedTabbers = tabber.querySelectorAll( '.tabber__panel:first-child .tabber' );
const renderSingleHeader = function ( element ) {
const firstTab = element.querySelector( ':scope > .tabber__header > .tabber__tabs > .tabber__tab' );
firstTab.setAttribute( 'aria-selected', true );
if ( firstTab ) {
firstTab.setAttribute( 'aria-selected', 'true' );
}
};
if ( nestedTabbers.length > 0 ) {
@ -76,7 +75,7 @@ ve.ce.MWTabberNode.prototype.renderHeader = function ( tabber ) {
}
renderSingleHeader( tabber );
lastHeader = tabber.firstElementChild;
ve.ce.MWTabberNode.static.lastHeader = tabber.firstElementChild;
};
/* Registration */

53
modules/ve-tabberNeue/ve.ce.MWTabberTranscludeNode.js
View file

@ -30,6 +30,8 @@ ve.ce.MWTabberTranscludeNode.static.tagName = 'div';
ve.ce.MWTabberTranscludeNode.static.primaryCommandName = 'mwTabberTransclude';
ve.ce.MWTabberTranscludeNode.static.lastHeader = null;
/* Methods */
// eslint-disable-next-line no-var
var lastHeader;
@ -42,13 +44,11 @@ ve.ce.MWTabberTranscludeNode.prototype.onSetup = function () {
ve.ce.MWTabberTranscludeNode.super.prototype.onSetup.call( this );
const tabber = this.$element[ 0 ];
const needsInit = tabber.classList.contains( 'tabber--init' );
const isNewHeader = tabber.firstElementChild !== ve.ce.MWTabberNode.static.lastHeader;
// Do not render header if it is already rendered
if (
tabber.firstElementChild &&
tabber.firstElementChild !== lastHeader &&
!tabber.classList.contains( 'tabber--live' ) &&
tabber.classList.contains( 'tabber' )
if ( needsInit && isNewHeader
) {
this.renderHeader( tabber );
}
@ -63,39 +63,22 @@ ve.ce.MWTabberTranscludeNode.prototype.onSetup = function () {
* @param {HTMLElement} tabber
*/
ve.ce.MWTabberTranscludeNode.prototype.renderHeader = function ( tabber ) {
const
tabPanels = tabber.querySelectorAll( ':scope > .tabber__section > .tabber__panel' ),
header = tabber.querySelector( ':scope > .tabber__header' ),
tabList = document.createElement( 'nav' ),
indicator = document.createElement( 'div' ),
fragment = new DocumentFragment();
const nestedTabbers = tabber.querySelectorAll( '.tabber__panel:first-child .tabber' );
const renderSingleHeader = function ( element ) {
const firstTab = element.querySelector( ':scope > .tabber__header > .tabber__tabs > .tabber__tab' );
if ( firstTab ) {
firstTab.setAttribute( 'aria-selected', 'true' );
}
};
Array.prototype.forEach.call( tabPanels, ( tabPanel, index ) => {
const tab = document.createElement( 'a' );
tab.innerText = tabPanel.getAttribute( 'data-mw-tabber-title' );
tab.classList.add( 'tabber__tab' );
// Make first tab active
if ( index === 0 ) {
tab.setAttribute( 'aria-selected', true );
if ( nestedTabbers.length > 0 ) {
Array.prototype.forEach.call( nestedTabbers, ( nestedTabber ) => {
renderSingleHeader( nestedTabber );
} );
}
fragment.append( tab );
} );
tabList.append( fragment );
tabList.classList.add( 'tabber__tabs' );
indicator.classList.add( 'tabber__indicator' );
header.append( tabList, indicator );
indicator.style.width = tabList.firstElementChild.offsetWidth + 'px';
tabber.classList.add( 'tabber--live' );
lastHeader = tabber.firstElementChild;
renderSingleHeader( tabber );
ve.ce.MWTabberNode.static.lastHeader = tabber.firstElementChild;
};
/* Registration */