User:Udays108/common.js: Difference between revisions

Revision as of 21:32, 8 May 2026

/**
 * BioMicro Center Wiki — Modern UI JavaScript
 * Paste into: User:USERNAME/common.js
 * Promoted to: MediaWiki:Common.js (by sysop)
 */

( function () {
	'use strict';

	/* ── 1. Sidebar Toggle ──────────────────────────────────────── */
	function initSidebarToggle() {
		var STORAGE_KEY = 'bmc-sidebar-collapsed';
		var body = document.body;

		// Create toggle button
		var btn = document.createElement( 'button' );
		btn.id = 'bmc-sidebar-toggle';
		btn.setAttribute( 'aria-label', 'Toggle sidebar' );
		btn.setAttribute( 'title', 'Toggle sidebar' );
		btn.innerHTML = '☰'; // ☰ hamburger
		document.body.appendChild( btn );

		// Restore persisted state
		if ( localStorage.getItem( STORAGE_KEY ) === '1' ) {
			body.classList.add( 'sidebar-collapsed' );
		}

		btn.addEventListener( 'click', function () {
			var collapsed = body.classList.toggle( 'sidebar-collapsed' );
			localStorage.setItem( STORAGE_KEY, collapsed ? '1' : '0' );
		} );
	}

	/* ── 2. Smooth Scroll for TOC links ─────────────────────────── */
	function initSmoothScroll() {
		var tocLinks = document.querySelectorAll( '#toc a, .toc a' );
		tocLinks.forEach( function ( link ) {
			link.addEventListener( 'click', function ( e ) {
				var href = link.getAttribute( 'href' );
				if ( href && href.charAt( 0 ) === '#' ) {
					var target = document.getElementById( decodeURIComponent( href.slice( 1 ) ) );
					if ( target ) {
						e.preventDefault();
						target.scrollIntoView( { behavior: 'smooth', block: 'start' } );
						// Update URL without page jump
						history.pushState( null, '', href );
					}
				}
			} );
		} );
	}

	/* ── 3. Active Sidebar Nav Highlighting ─────────────────────── */
	function highlightActiveSidebarLink() {
		var currentTitle = mw.config.get( 'wgPageName' );
		var sidebarLinks = document.querySelectorAll(
			'#mw-panel a, .vector-column-start a'
		);
		sidebarLinks.forEach( function ( link ) {
			var href = link.getAttribute( 'href' ) || '';
			// Match by title query param or path segment
			if (
				href.indexOf( encodeURIComponent( currentTitle ) ) !== -1 ||
				href.indexOf( currentTitle.replace( / /g, '_' ) ) !== -1
			) {
				var li = link.closest( 'li' );
				if ( li ) {
					li.classList.add( 'active' );
				}
			}
		} );
	}

	/* ── 4. Auto-style Plain Tables ─────────────────────────────── */
	function styleUnstyledTables() {
		var tables = document.querySelectorAll(
			'.mw-parser-output table:not(.wikitable):not(.infobox):not(.navbox)'
		);
		tables.forEach( function ( table ) {
			table.classList.add( 'wikitable' );
		} );
	}

	/* ── 5. Run on page content ready ───────────────────────────── */
	mw.hook( 'wikipage.content' ).add( function () {
		initSidebarToggle();
		initSmoothScroll();
		highlightActiveSidebarLink();
		styleUnstyledTables();
	} );

} )();