User:V111P/js/Smart Linking

Smart Linking is a tool for linking articles and previewing the linked pages while source-editing Wikipedia/MediaWiki articles.

To use it (after installing it), position the cursor anywhere within or just after the second closing bracket of a link and press the Smart Linking button, or select an existing link (with or without its square brackets) or select unlinked text you want to make a link from, and press the Smart Linking Button. Smart Linking's display with the linked article's content (or the message "Non-existing page" if there is no such article) will appear above the textarea.

You can learn how to use most of the features by hovering with the mouse pointer over the various icons and links and reading the tooltips. Some less obvious things you need to know are:

The links within the display can lead you to other articles, but keep in mind that visiting other articles will change the address of the link in the textarea where you last left the cursor before pressing the SmartLinking button. You can use the back link (<<) to get back to the article you want to link to.
You can resize the display to make it display more than a single line at a time in several ways:
- temporarily - by double clicking anywhere within the display or by dragging the bottom edge of the display (The second way doesn't always work in Internet Explorer). This way of resizing hides part of the textarea under the display. Double clicking the display while it is temporarily expanded collapses it back and returns focus to the textarea.
- semi-permanently - by dragging the resize handle on the right of the display
- permanently - by editing your common.js file and setting the exact size you want the display to be (you will still be able to resize it manually after that). How to do this will be explained later.
Sometimes after you click the Smart Linking the keyboard focus is left within the display. You can press Escape or ` to return the focus to the textarea (Escape won't work in some browsers).

More documentation will appear here soon.

Installation

For the English Wikipedia, add this code to your common.js file:

if ( $.inArray( mw.config.get( 'wgAction' ), ['edit', 'submit'] ) > -1 )
	$.ajax({
		url: '/w/index.php?title=User:V111P/js/smartLinkingLoader.js'
			+ '&action=raw&ctype=text/javascript&smaxage=0&maxage=0',
		dataType: 'script',
		cache: true
	});

For other Wikipedias you can simply add //en.wikipedia.org at the beginning of the URL. However, Smart Linking won't be able to detect your other-meaning and main-article templates. I'll explain how to fix that later.

Credits

I'm using the following images from Commons:

valSel.js, one of the components of Smart Linking, includes code from Rangy Inputs, a jQuery plug-in for selection and caret manipulation within textareas and text inputs, Copyright 2010-2013, Tim Down, Licensed under the MIT license.