User:Guycn2/ThisMessageInOtherWikis.js

/*

In the MediaWiki namespace, adds a button to view the current
system message in other WMF wikis, as well as in translatewiki.net.

See also:
* [[User:Guycn2/ThisMessageInOtherWikis.css]] – for the corresponding style sheet


Written by: [[User:Guycn2]]

*/

( async () => {
	
	'use strict';
	
	if ( mw.config.get( 'wgNamespaceNumber' ) !== 8 ) {
		return;
	}
	
	let messages;
	
	switch ( mw.config.get( 'wgUserLanguage' ) ) {
		case 'he':
			messages = {
				openBtnTooltip: 'הודעה זו באתרי ויקי אחרים',
				dialogTitle: 'הודעה זו באתרי ויקי אחרים',
				closeBtnTooltip: 'סגירה',
				language: 'שפה',
				english: 'אנגלית',
				hebrew: 'עברית',
				project: 'אתר ויקי'
			};
			break;
		default:
			messages = {
				openBtnTooltip: 'This message in other wikis',
				dialogTitle: 'This message in other wikis',
				closeBtnTooltip: 'Close',
				language: 'Language',
				english: 'English',
				hebrew: 'Hebrew',
				project: 'Project'
			};
			break;
	}
	
	function i18n( key ) {
		return messages[ key ] || key;
	}
	
	await $.when( mw.loader.using( 'mediawiki.util' ), $.ready );
	
	const portletLink = mw.util.addPortletLink(
		'p-vector-user-menu-userpage',
		'#',
		'🌐',
		'pt-this-message-in-other-wikis',
		i18n( 'openBtnTooltip' ),
		null,
		'#pt-userpage-2'
	);
	
	if ( portletLink ) {
		$( portletLink ).one( 'click', loadCss ).on( 'click', openDialog );
	}
	
	function loadCss() {
		mw.loader.load(
			'https://meta.wikimedia.org/w/index.php?title=User:Guycn2/ThisMessageInOtherWikis.css&action=raw&ctype=text/css',
			'text/css'
		);
	}
	
	async function openDialog( e ) {
		
		e.preventDefault();
		
		function ProcessDialog( config ) {
			ProcessDialog.super.call( this, config );
		}
		
		await mw.loader.using( [ 'oojs-ui-core', 'oojs-ui-windows' ] );
		
		OO.inheritClass( ProcessDialog, OO.ui.ProcessDialog );
		
		const windowManager = new OO.ui.WindowManager();
		
		ProcessDialog.static.name = 'thisMessageInOtherWikisDialog';
		ProcessDialog.static.title = i18n( 'dialogTitle' );
		ProcessDialog.static.size = 'small';
		
		ProcessDialog.static.actions = [ {
			action: 'closeDialog',
			flags: [ 'close', 'safe' ],
			label: i18n( 'closeBtnTooltip' )
		} ];
		
		ProcessDialog.prototype.initialize = function () {
			ProcessDialog.super.prototype.initialize.apply( this, arguments );
		};
		
		ProcessDialog.prototype.getSetupProcess = function ( data = {} ) {
			return ProcessDialog.super.prototype.getSetupProcess.call( this, data )
			.next( function () {
				createDialogContent.call( this, ProcessDialog );
			}, this );
		};
		
		ProcessDialog.prototype.getActionProcess = function ( action ) {
			if ( action === 'closeDialog' ) {
				return new OO.ui.Process( function () {
					this.close();
				}, this );
			} else {
				return ProcessDialog.super.prototype.getActionProcess.call( this, action );
			}
		};
		
		ProcessDialog.prototype.getTeardownProcess = function ( data = {} ) {
			return ProcessDialog.super.prototype.getTeardownProcess.call( this, data )
			.next( () => windowManager.destroy() );
		};
		
		$( document.body ).append( windowManager.$element );
		const dialog = new ProcessDialog( { id: 'this-message-in-other-wikis-dialog' } );
		windowManager.addWindows( [ dialog ] );
		windowManager.openWindow( dialog );
		
	}
	
	function createDialogContent( ProcessDialog ) {
		
		const radioOptionEnglish = new OO.ui.RadioOptionWidget( {
			data: 'en',
			label: i18n( 'english' )
		} );
		
		const radioOptionHebrew = new OO.ui.RadioOptionWidget( {
			data: 'he',
			label: i18n( 'hebrew' )
		} );
		
		const radioSelect = new OO.ui.RadioSelectWidget( {
			items: [ radioOptionEnglish, radioOptionHebrew ]
		} );
		
		const langFieldset = new OO.ui.FieldsetLayout( {
			id: 'this-message-in-other-wikis-lang-fieldset',
			items: [ radioSelect ],
			label: i18n( 'language' )
		} );
		
		const links = {
			enwiki: {
				address: 'https://en.wikipedia.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'enwiki' )
			},
			hewiki: {
				address: 'https://he.wikipedia.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewiki' )
			},
			hewiktionary: {
				address: 'https://he.wiktionary.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewiktionary' )
			},
			hewikisource: {
				address: 'https://he.wikisource.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewikisource' )
			},
			hewikiquote: {
				address: 'https://he.wikiquote.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewikiquote' )
			},
			hewikibooks: {
				address: 'https://he.wikibooks.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewikibooks' )
			},
			hewikinews: {
				address: 'https://he.wikinews.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewikinews' )
			},
			hewikivoyage: {
				address: 'https://he.wikivoyage.org/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'hewikivoyage' )
			},
			translatewiki: {
				address: 'https://translatewiki.net/wiki/MediaWiki:',
				$element: $( '<a>' ).attr( 'href', '#' ).text( 'translatewiki' )
			}
		};
		
		const $linksContainer = $( '<ul>' )
			.attr( 'id', 'this-message-in-other-wikis-links-container' );
		
		for ( const project in links ) {
			$linksContainer.append( $( '<li>' ).append( links[ project ].$element ) );
		}
		
		const msgName =
			mw.config.get( 'wgPageName' ).split( '/' )[ 0 ].split( ':' )[ 1 ];
		
		updateLinks( msgName, links );
		
		radioSelect.on( 'choose', chosenOption =>
			updateLinks( msgName, links, chosenOption.data )
		);
		
		const projectFieldset = new OO.ui.FieldsetLayout( {
			id: 'this-message-in-other-wikis-project-fieldset',
			label: i18n( 'project' )
		} );
		
		projectFieldset.$element.append( $linksContainer );
		
		const $dialogContent = $( '<div>' )
			.attr( 'id', 'this-message-in-other-wikis-dialog-content' )
			.append( langFieldset.$element, projectFieldset.$element );
		
		this.$body.append( $dialogContent );
		
		ProcessDialog.prototype.getBodyHeight = () =>
			this.$body[ 0 ].scrollHeight + 8;
		
	}
	
	function updateLinks( msgName, links, lang = '' ) {
		
		for ( const project in links ) {
			
			const $element = links[ project ].$element;
			
			if ( project === 'enwiki' ) {
				
				$element.attr(
					'href',
					`${ links[ project ].address }${ msgName }${
						lang === 'he' ? '/he?uselang=he' : ''
					}`
				);
				
			} else if ( project === 'translatewiki' ) {
				
				$element.attr(
					'href',
					`${ links[ project ].address }${ msgName }${
						lang === 'en' ? '/en?uselang=en' : '/he?uselang=he'
					}`
				);
				
			} else {
				
				$element.attr(
					'href',
					`${ links[ project ].address }${ msgName }${
						lang === 'en' ? '/en?uselang=en' : ''
					}`
				);
				
			}
			
		}
		
	}
	
} )();