/* 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]] */