( function() { var bpBackCompatAdminTabs = function() { var wrap = document.querySelector( '.nav-tab-wrapper' ).closest( '.wrap' ); if ( wrap ) { // 1. Add the tabbed class to the body tag. document.body.classList.add( 'bp-is-tabbed-screen' ); // 2. Make the wrapping div the BuddyPress body. wrap.classList.add( 'buddypress-body' ); wrap.classList.remove( 'wrap' ); // 3. Create the BuddyPress header. var buddypressHeader = document.createElement( 'div' ); buddypressHeader.classList.add( 'buddypress-header' ); var headings = wrap.querySelectorAll( 'h1' ); var buddypressTitleSection = document.createElement( 'div' ); buddypressTitleSection.classList.add( 'buddypress-title-section' ); // 4. Move the document title in it. if ( headings && headings[0] ) { var buddyPressLogo = document.createElement( 'span' ); buddyPressLogo.classList.add( 'bp-badge' ); headings[0].innerHTML = ' ' + headings[0].innerHTML; headings[0].prepend( buddyPressLogo ); buddypressTitleSection.appendChild( headings[0] ); } buddypressHeader.appendChild( buddypressTitleSection ); // 5. Move the tabs in it. var headerNavTabs = document.createElement( 'nav' ); headerNavTabs.classList.add( 'buddypress-tabs-wrapper' ); var bpAdminTabs = document.querySelectorAll( '.buddypress-nav-tab' ); var columns = []; bpAdminTabs.forEach( function( tabItem ) { headerNavTabs.appendChild( tabItem ); columns.push( '1fr' ); } ); // 6. Add the header's nav tabs into the header. buddypressHeader.appendChild( headerNavTabs ); // 7. Edit the number of grid columns. if ( columns.length > 0 ) { headerNavTabs.setAttribute( 'style', '-ms-grid-columns: ' + columns.join( ' ' ) + '; grid-template-columns: ' + columns.join( ' ' ) + ';'); } // 8. Create the header's separator. var headerSeparator = document.createElement( 'hr' ); headerSeparator.classList.add( 'wp-header-end' ); // 9. Insert the BuddyPress header into the document. document.querySelector('#wpbody-content').insertBefore( buddypressHeader, wrap ); document.querySelector('#wpbody-content').insertBefore( headerSeparator, wrap ); } }; if ( 'loading' === document.readyState ) { document.addEventListener( 'DOMContentLoaded', bpBackCompatAdminTabs ); } else { bpBackCompatAdminTabs; } } )();