MediaWiki:Gadget-dialogue-options.js

mw.loader.using( ['oojs-ui-core', 'oojs-ui-widgets'] ).done( function() {
	$( '.story-dialogue' ).each( function() {
		var $sd_en = $( this ).find( '.sd-en' );
		var $sd_jp = $( this ).find( '.sd-jp' );
		
		
		var toggleButton = new OO.ui.ButtonSelectWidget( {
			items: [
				new OO.ui.ButtonOptionWidget({ data: 'en', label: 'EN' }),
				new OO.ui.ButtonOptionWidget({ data: 'jp', label: 'JP' }),
			],
			align: 'left'
		} );
		toggleButton.selectItemByData('en');
		toggleButton.on( 'choose' , function( item, selected ) {
			if ( item.getData() === 'en' ) {
				$sd_jp.hide();
				$sd_en.show();
			} else if ( item.getData() === 'jp' ) {
				$sd_en.hide();
				$sd_jp.show();
			}
		});

		$sd_jp.hide();
		$( this ).find( '.sd-toggle' ).append( toggleButton.$element );
	});
	
	var allToggle = new OO.ui.ButtonSelectWidget( {
		items: [
			new OO.ui.ButtonOptionWidget({ data: 'en', label: 'EN' }),
			new OO.ui.ButtonOptionWidget({ data: 'jp', label: 'JP' }),
		],
		align: 'left'
	} );
	allToggle.selectItemByData('en');
	allToggle.on( 'choose' , function( item, selected ) {
		if ( item.getData() === 'en' ) {
			$( '.story-dialogue' ).each( function() {
				var $sd_en = $( this ).find( '.sd-en' );
				var $sd_jp = $( this ).find( '.sd-jp' );
				$sd_jp.hide();
				$sd_en.show();
			});
		} else if ( item.getData() === 'jp' ) {
			$( '.story-dialogue' ).each( function() {
				var $sd_en = $( this ).find( '.sd-en' );
				var $sd_jp = $( this ).find( '.sd-jp' );
				$sd_en.hide();
				$sd_jp.show();
			});
		}
	});
	
	$( '.all-toggle' ).append( allToggle.$element );
});