mediawiki-extensions-RevisionSlider/modules/ext.RevisionSlider.init.js

var Settings = require( 'ext.RevisionSlider.Settings' ),
	settings = new Settings(),
	HelpDialog = require( 'ext.RevisionSlider.HelpDialog' ).HelpDialog,
	RevisionListModule = require( 'ext.RevisionSlider.RevisionList' ),
	autoExpand = settings.shouldAutoExpand(),
	expanded = autoExpand,
	autoExpandButton,
	toggleButton = OO.ui.ButtonWidget.static.infuse( $( '.mw-revslider-toggle-button' ) );

function initialize() {
	var startTime = mw.now(),
		api = new mw.libs.revisionSlider.Api( mw.util.wikiScript( 'api' ) ),
		changeTags = [];

	toggleButton.$element.children().attr( {
		'aria-expanded': autoExpand,
		'aria-controls': 'mw-revslider-slider-wrapper'
	} );

	mw.track( 'counter.MediaWiki.RevisionSlider.event.init' );
	RevisionListModule.setUserOffset(
		mw.user.options.get( 'timecorrection' ) ?
			mw.user.options.get( 'timecorrection' ).split( '|' )[ 1 ] :
			mw.config.get( 'extRevisionSliderTimeOffset' )
	);

	HelpDialog.init();

	api.fetchAvailableChangeTags().then( function ( data ) {
		if ( typeof data === 'object' &&
			data.query &&
			data.query.tags &&
			data.query.tags.length > 0
		) {
			changeTags = data.query.tags;
		}
		api.fetchRevisionData( mw.config.get( 'wgPageName' ), {
			startId: mw.config.get( 'wgDiffNewId' ),
			limit: mw.libs.revisionSlider.calculateRevisionsPerWindow( 160, 16 ),
			changeTags: changeTags
		} ).then( function ( data2 ) {
			var revs,
				revisionList,
				$container,
				slider;

			mw.track( 'timing.MediaWiki.RevisionSlider.timing.initFetchRevisionData', mw.now() - startTime );

			try {
				revs = data2.revisions;
				revs.reverse();

				$container = $( '.mw-revslider-slider-wrapper' );
				$container.attr( 'id', 'mw-revslider-slider-wrapper' );

				revisionList = new RevisionListModule.RevisionList(
					RevisionListModule.makeRevisions( revs ),
					changeTags
				);
				revisionList.getView().setDir( $container.css( 'direction' ) || 'ltr' );

				slider = new mw.libs.revisionSlider.Slider( revisionList );
				slider.getView().render( $container );

				$( window ).on( 'resize', OO.ui.throttle( function () {
					slider.getView().render( $container );
				}, 250 ) );

				if ( !settings.shouldHideHelpDialogue() ) {
					HelpDialog.show();
					settings.setHideHelpDialogue( true );
				}

				$( '.mw-revslider-placeholder' ).remove();
				mw.track( 'timing.MediaWiki.RevisionSlider.timing.init', mw.now() - startTime );
			} catch ( err ) {
				$( '.mw-revslider-placeholder' )
					.text( mw.message( 'revisionslider-loading-failed' ).text() );
				mw.log.error( err );
				mw.track( 'counter.MediaWiki.RevisionSlider.error.init' );
			}
		}, function ( err ) {
			$( '.mw-revslider-placeholder' )
				.text( mw.message( 'revisionslider-loading-failed' ).text() );
			mw.log.error( err );
			mw.track( 'counter.MediaWiki.RevisionSlider.error.init' );
		} );
	} );
}

function expand() {
	toggleButton.setTitle( mw.message( 'revisionslider-toggle-title-collapse' ).text() );
	$( '.mw-revslider-container' ).removeClass( 'mw-revslider-container-collapsed' )
		.addClass( 'mw-revslider-container-expanded' );
	$( '.mw-revslider-slider-wrapper' ).show();
	$( '.mw-revslider-auto-expand-button' ).show();
	toggleButton.$element.children().attr( 'aria-expanded', 'true' );
	expanded = true;
}

function collapse() {
	toggleButton.setTitle( mw.message( 'revisionslider-toggle-title-expand' ).text() );
	$( '.mw-revslider-container' ).removeClass( 'mw-revslider-container-expanded' )
		.addClass( 'mw-revslider-container-collapsed' );
	$( '.mw-revslider-slider-wrapper' ).hide();
	$( '.mw-revslider-auto-expand-button' ).hide();
	toggleButton.$element.children().attr( 'aria-expanded', 'false' );
}

autoExpandButton = new OO.ui.ToggleButtonWidget( {
	icon: 'pushPin',
	classes: [ 'mw-revslider-auto-expand-button' ],
	title: mw.msg( autoExpand ?
		'revisionslider-turn-off-auto-expand-title' :
		'revisionslider-turn-on-auto-expand-title'
	),
	value: autoExpand
} );

autoExpandButton.$element.children().attr(
	'aria-label',
	mw.msg( autoExpand ?
		'revisionslider-turn-off-auto-expand-title' :
		'revisionslider-turn-on-auto-expand-title'
	)
);

autoExpandButton.connect( this, {
	click: function () {
		autoExpand = !autoExpand;
		settings.setAutoExpand( autoExpand );
		if ( autoExpand ) {
			autoExpandButton.setTitle( mw.msg( 'revisionslider-turn-off-auto-expand-title' ) );
			autoExpandButton.$element.children().attr(
				'aria-label', mw.msg( 'revisionslider-turn-off-auto-expand-title' )
			);
			expand();
			mw.track( 'counter.MediaWiki.RevisionSlider.event.autoexpand_on' );
		} else {
			autoExpandButton.setTitle( mw.msg( 'revisionslider-turn-on-auto-expand-title' ) );
			autoExpandButton.$element.children().attr(
				'aria-label', mw.msg( 'revisionslider-turn-on-auto-expand-title' )
			);
			mw.track( 'counter.MediaWiki.RevisionSlider.event.autoexpand_off' );
		}
	}
} );

$( '.mw-revslider-container' ).append( autoExpandButton.$element );

toggleButton.connect( this, {
	click: function () {
		expanded = !expanded;
		if ( expanded ) {
			expand();
			mw.track( 'counter.MediaWiki.RevisionSlider.event.expand' );
			mw.hook( 'revslider.expand' ).fire();
		} else {
			collapse();
			mw.track( 'counter.MediaWiki.RevisionSlider.event.collapse' );
			mw.hook( 'revslider.collapse' ).fire();
		}
	}
} );

expand();
initialize();