MediaWiki:Live-reload.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
// Automatically refresh the html content for a page
$.when( mw.loader.using( [ "mediawiki.util" ] ), $.ready ).then( function () {

	// Timestamp will be appended when setting the html
	var LIVE_RELOAD_INDICATOR = "Live! This page will be refreshed every minute. Last refreshed at: ";
	var LIVE_RELOAD_INTERVAL_IN_MINUTES = 1;

	// Replace the live-reload link with the indicator
	$( ".live-reload-link" ).html( LIVE_RELOAD_INDICATOR + ( new Date() ).toLocaleTimeString() );

	// url of the html to retrieve for the page contents
	var htmlUrl = mw.util.getUrl( mw.config.get( "wgPageName" ), { "action": "render" } );
	// Start the automatic reloader
	setInterval( function () {
		// Fetch the current HTML of this page
		$.get( htmlUrl ).then( function( html ) {
			if ( html ) {

				// Remove the translate banner at the top, since one's in the new HTML
				$( "#mw-content-text > div.mw-pt-translate-header" ).remove();

				// Replace the current page content with the new HTML
				$( "#mw-content-text > .mw-parser-output" ).replaceWith( html );

				// Fire the wikipage.content hook so that user scripts, live content, etc gets updated
				mw.hook( "wikipage.content" ).fire( $( "#mw-content-text > .mw-parser-output" ) );

				$( "#mw-content-text h2,#mw-content-text h3" ).append( function ( index ) {
					if( this.id !== 'mw-toc-heading' ) {
						return '<span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/w/index.php?title=' + mw.config.get( 'wgPageName' ) + '&amp;veaction=edit&amp;section=' + index + '" class="mw-editsection-visualeditor" title="Edit section: Details">edit</a><span class="mw-editsection-divider"> | </span><a href="/w/index.php?title=' + mw.config.get( 'wgPageName' ) + '&amp;action=edit&amp;section=' + index + '" title="Edit section: Details">edit source</a><span class="mw-editsection-bracket">]</span></span>';
					}
				} );

				// Also, replace our own live-reload link again
				$( ".live-reload-link" ).html( LIVE_RELOAD_INDICATOR + ( new Date() ).toLocaleTimeString() );
			} else {
				// Got a falsy response from the API, for some reason
				console.warn( "Live-reload.js got no useful response from the API!" );
			}
		}, function () {
			// Handle an API error
			console.warn( "Live-reload.js got an error from the API: ", arguments );
		} );
	}, LIVE_RELOAD_INTERVAL_IN_MINUTES * 60 * 1000 );
} );