User:Guycn2/ToggleDirection.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.

/*

Adds a button to switch the writing direction in the 2010 editor box.
Particularly useful on mobile devices and other platforms where
pressing Ctrl-Shift is impossible or doesn't always work properly.

Written by: [[User:Guycn2]]

*/

( () => {
	
	'use strict';
	
	if (
		![ 'edit', 'submit' ].includes( mw.config.get( 'wgAction' ) ) ||
		mw.config.get( 'wgPageContentModel' ) !== 'wikitext'
	) {
		return;
	}
	
	let messages;
	
	switch ( mw.config.get( 'wgUserLanguage' ) ) {
		case 'he':
			messages = {
				linkText: 'החלפת כיוון',
				linkTooltip: 'החלפת כיוון הכתיבה'
			};
			break;
		default:
			messages = {
				linkText: 'Switch direction',
				linkTooltip: 'Switch writing direction'
			};
			break;
	}
	
	function i18n( key ) {
		return messages[ key ] || key;
	}
	
	function addBtn() {
		
		const $editBox = $( '#wpTextbox1' );
		
		if ( !$editBox.length ) {
			return;
		}
		
		let $editingArea = $( '.wikiEditor-ui' );
		
		if ( !$editingArea.length ) {
			$editingArea = $editBox;
		}
		
		const $btn = $( '<a>' )
			.attr( { href: '#', role: 'button', title: i18n( 'linkTooltip' ) } )
			.text( i18n( 'linkText' ) )
			.on( 'click', e => toggleDir( e, $editBox ) );
		
		$editingArea.before( $btn );
		
	}
	
	function toggleDir( e, $editBox ) {
		
		e.preventDefault();
		
		const $codeMirrorBox = $( '.cm-editor' );
		
		const currentDir = $codeMirrorBox.length
			? $codeMirrorBox.attr( 'dir' )
			: $editBox.attr( 'dir' );
		
		[ $editBox, $codeMirrorBox ].forEach( $elem =>
			$elem.attr( 'dir', currentDir === 'rtl' ? 'ltr' : 'rtl' )
		);
		
	}
	
	$( addBtn );
	
} )();