/*
DebugViaUrlModal Gadget - JS Initialisation, Setup, Events. Adds a modal to the header super menu with several debugging options
See detailed documentation in Dev/mediawiki
deferrable:YES -- Because it's a gadget and is not a needed dependency
*/

(function() {
	
	if( ! mwDev ) {
		console.error( 'mwDev needs to be declared. Devs: see mw-combine for clarification' );
		return;
	}
	
	// If there's not custom Header then this functionality can be aborted
	if( ! $('#custom-header').length ) return;
	
	// -------
	// Prepare

	let baseUrl = window.location.href.match(/^[^#\?]+/g)[0].replace('/wiki/Homepage','');
	let baseQuery = new URLSearchParams( window.location.search );
	
	let dontload = [];
	
	// ---
	// Fns
	
	function constructUrl() {
		return  baseUrl + ( baseQuery.toString() ? '?' + baseQuery.toString() : '' );
	}
	
	function setUrl( mode ) {
		if( mode == 'selectjs' ) {
			if( ! dontload.length ) {
				baseQuery.delete('dontload');
			} else {
				baseQuery.set( 'dontload', dontload.join(',') );
			}
		} else {
			baseQuery.set( 'dontload', mode.replace('no','') );
		}
		
		modal.find('.code-select .code').text( constructUrl() );
		modal.find('.direct-link').attr( 'href', constructUrl() );
	}
	
	// -----
	// Setup
	
	let initialUrl = constructUrl();
	
	let modal = $(
		`<div class="mini-modal" id="debug-via-url-modal">
			<h2>Disable server cache for this browser</h2>
			<span class="activate-nocache-cookie-for-server${ Cookies.get( 'nocache' ) ? ' active' : '' }">Activate <b>nocache (true)</b> server cookie for my browser</span>
			<h2>Debug vis URL</h2>
			<div class="code-select">${initialUrl}</div>
			<a class="direct-link" target="_blank" href="${initialUrl}"></a>
			<div class="info">
				Debugging helper: Click the scripts below to generate a link in which they are de/activated.
				Use CodeSelect or the link button above!
			</div>
			<div class="switcher">
				<div data-mode="selectjs" class="active">Select JS</div>
				<div data-mode="nojs">No JS</div>
				<div data-mode="nocss">No CSS</div>
				<div data-mode="nojscss">No JS+CSS</div>
			</div>
			<div class="dontload-options"></div>
		</div>`
	);
	
	$('body').append( modal );
	
	for( let file in mwDev.data.log.jsload ) {
		modal.find('.dontload-options').append( '<div' + ( mwDev.data.log.jsload[file] ? ' class="loaded"' : '' ) + '>' + file + '</div>' );
	}
	
	modal.miniModal('init');
	modal.find('.code-select').codeSelect('init');
	modal.find('.content').addClass('selectjs');
	
	// Debug Modal trigger
	
	let debugModalTrigger = $('<a class="debug-modal-trigger" href="#"><i class="fa-solid fa-code"></i>Debug Helper</a>').insertAfter('#custom-header .super-menu .print');
	
	// ------
	// Events
	
	// Event: Un/select dontload option
	
	modal.find('.dontload-options > *').on( 'click', function() {
		$(this).toggleClass('loaded');
		
		dontload = [];
		$(this).parent().children().each( function() {
			if( ! $(this).hasClass('loaded') ) {
				let name = $(this).text().match(/(?<=:).*(?=\.)/);
				if( name ) dontload.push( name[0] );
			}
		});
		
		setUrl( 'selectjs' );
	});
	
	// Event: Switch to another option
	
	modal.find('.switcher > *').on( 'click', function() {
		$(this)
			.addClass('active')
			.siblings().removeClass('active');
			
		modal
			.removeClass( 'selectjs nojs nocss nojscss' )
			.addClass( $(this).attr('data-mode') );
		
		if( $(this).attr('data-mode') == 'selectjs' ) modal.find('.dontload-options').css( 'display', '' );
		else modal.find('.dontload-options').css( 'display', 'none' );
			
		setUrl( $(this).attr('data-mode') );
	});
	
	// Event: Show Debug js modal
	
	debugModalTrigger.on( 'click', function() {
		$('#debug-via-url-modal').miniModal('show');
		return false;
	});
	
	// Event: De/activate nocache server cookie
	
	modal.find('.activate-nocache-cookie-for-server').on( 'click', function() {
		$(this).toggleClass('active');
		if( $(this).hasClass('active') ) Cookies.set( 'nocache', true, { expires: 365, sameSite: 'strict' } );
		else Cookies.remove( 'nocache' );
	});

})();

/*
[[Category:MultiWiki]]
*/