MediaWiki:Citizen.js: Difference between revisions

Latest revision as of 02:07, 5 September 2025

/* All JavaScript here will be loaded for users of the Citizen skin */
"use strict";

//New homepage search bar trigger on slash press
mw.loader.using( [ 'mediawiki.util' ] ).done( function() {
	console.log("loaded utils");
	/* Trigger search box when click on the fake search button on main page */
	if (mw.config.get( 'wgIsMainPage')) {
		document.getElementById( 'homepage-search' ).addEventListener( 'click', function() {
			var search = document.getElementById( 'citizen-search-details' );
			search.open = true;
		} );
	}
} );

@@ Line 6: / Line 6: @@
 	console.log("loaded utils");
 	/* Trigger search box when click on the fake search button on main page */
-	//if ( mw.config.get( 'wgIsMainPage' ) === true ) {
+	if (mw.config.get( 'wgIsMainPage')) {
 		document.getElementById( 'homepage-search' ).addEventListener( 'click', function() {
 			var search = document.getElementById( 'citizen-search-details' );
 			search.open = true;
 		} );
-	//}
+	}
 } );
-//Adding sepia mode to theme selector in gear icon, WORK IN PROGRESS
-mw.loader.using('mediawiki.util').done(function () {
-    console.log('Citizen.js script loaded');
-    function addSepiaOption() {
-        const container = document.querySelector('#skin-client-prefs-skin-theme form');
-        if (!container) {
-            console.log('Theme preference form not found yet. Retrying...');
-            setTimeout(addSepiaOption, 300); // Retry after a short delay
-            return;
-        }
-        const radios = container.querySelectorAll('.citizen-client-prefs-radio');
-        if (radios.length === 0) {
-            console.log('No theme radio buttons found.');
-            return;
-        }
-        // Prevent adding it multiple times
-        if (document.querySelector('#skin-client-pref-skin-theme-value-sepia')) {
-            console.log('Sepia option already added.');
-            return;
-        }
-        const sepiaRadio = radios[0].cloneNode(true);
-        const input = sepiaRadio.querySelector('input');
-        const label = sepiaRadio.querySelector('label');
-        input.id = 'skin-client-pref-skin-theme-value-sepia';
-        input.value = 'sepia';
-        input.dataset.eventName = 'skin-client-pref-skin-theme-value-sepia';
-        input.checked = false;
-        label.setAttribute('for', input.id);
-        label.textContent = 'Sepia';
-        container.appendChild(sepiaRadio);
-        console.log('Sepia theme option added.');
-    }
-    addSepiaOption();
-});