MediaWiki:Gadget-entry-counter.js

Uwaga: aby zobaczyć zmiany po opublikowaniu, może zajść potrzeba wyczyszczenia pamięci podręcznej przeglądarki.

Firefox / Safari: Przytrzymaj Shift podczas klikania Odśwież bieżącą stronę, lub naciśnij klawisze Ctrl+F5, lub Ctrl+R (⌘-R na komputerze Mac)
Google Chrome: Naciśnij Ctrl-Shift-R (⌘-Shift-R na komputerze Mac)
Internet Explorer / Edge: Przytrzymaj Ctrl, jednocześnie klikając Odśwież, lub naciśnij klawisze Ctrl+F5
Opera: Naciśnij klawisze Ctrl+F5.

var API_ENDPOINT = 'https://pbbot.toolforge.org/plwikt-stats-api',
	INTERVAL_MS = 60 * 1000, // 60 seconds
	ANIMATION_DURATION_MS = 1000,
	PLURAL_FORMS = [ 'hasło', 'hasła', 'haseł' ],
	shouldUpdate = false,
	currentRequest = null;

function animate( $counter, fromValue, toValue ) {
	var startTimestamp,
		displayedValue = fromValue,
		deferred = $.Deferred();
	
	// https://css-tricks.com/animating-number-counters/
	
	function step( timestamp ) {
		var progress, currentValue;
		
		if ( !startTimestamp ) {
			startTimestamp = timestamp;
		}
		
		progress = Math.min( ( timestamp - startTimestamp ) / ANIMATION_DURATION_MS, 1 );
		currentValue = Math.floor( progress * ( toValue - fromValue ) + fromValue );
		
		if ( currentValue !== displayedValue ) {
			$counter.text( mw.language.convertNumber( currentValue ) );
			displayedValue = currentValue;
		}
		
		if ( progress < 1 ) {
			window.requestAnimationFrame( step );
		} else {
			deferred.resolve();
		}
	}
	
	window.requestAnimationFrame( step );
	
	return deferred.promise();
}

function doUpdate( $counter, $plural ) {
	if ( currentRequest && 'abort' in currentRequest ) {
		currentRequest.abort();
	}
	
	currentRequest = $.getJSON( API_ENDPOINT ).done( function ( data ) {
		var initial = $counter.data( 'ws-stats-counter' );
		
		if ( data.canonical && data.canonical !== initial ) {
			animate( $counter, initial, data.canonical ).done( function () {
				$counter.data( 'ws-stats-counter', data.canonical );
				$plural.text( mw.language.convertPlural( data.canonical, PLURAL_FORMS ) );
			} );
		}
	} );
}

function updateIfVisible( $counter, $plural ) {
	if ( document.visibilityState === 'visible' ) {
		shouldUpdate = false;
		doUpdate( $counter, $plural );
	} else {
		shouldUpdate = true;
	}
}

mw.hook( 'wikipage.content' ).add( function ( $content ) {
	var $container = $content.find( '.ws-stats-entry-counter' ).first(),
		$counter = $container.find( '.ws-stats-counter' ).first(),
		$plural = $container.find( '.ws-stats-plural' ).first();
	
	if ( $counter.length ) {
		mw.loader.using( 'mediawiki.language' ).done( function () {
			updateIfVisible( $counter, $plural );
			setInterval( updateIfVisible, INTERVAL_MS, $counter, $plural );
			
			document.addEventListener( 'visibilitychange', function ( e ) {
				if ( shouldUpdate && document.visibilityState === 'visible' ) {
					shouldUpdate = false;
					doUpdate( $counter, $plural );
				}
			} );
		} );
	}
} );