WYSIFTW

WYSIFTW (formerly WYSIWTF) is a JavaScript-based tool originally written by Magnus Manske. Its primary purpose is to make it easier to edit wikipedia articles, especially for people unfamiliar with the intricacies of MediaWiki syntax (the vast majority of the planet, in case you forgot :-). This is achieved by creating a full-screen editing interface where the user can edit "augmented wikitext", that is, wikitext that has some "ugly" parts folded away by default, inline display of images etc. It has been tested on en.wikipedia, but should work elsewhere as well.

Installation
You can install WYSIFTW yourself to test it. Just add the following line to your "vector.js" user subpage: document.write('<\/script>');

Code
The current code is in the toolserver SVN, here. wysiwtf.js is the live version, wysiwtf_dev.js the development one. The other files are required as well.

Implemented function

 * Basic editing : Typing, delete/backspace, cursor movements, click-to-edit
 * Internal links are recognized and turned into "blue" links, where the label can be edited like any other text. Double-clicking the link allows the user to edit the link target.
 * Images are recognized and shown in-line. Thumbnail text can be edited like any other text. Double-clicking the image allows the user to edit the image name.
 * Templates are recognized and put into green, dotted boxes. The template name is shown in bold; if there are no parameters, the template name is shown in italics. Templates with a long paramater list are automatically folded, that is, the parameters are hidden by default. Double-clicking the template name toggles the parameter list, which can then be freely edited. This works for nested templates as well.
 * HTML tags are visually highlighted to separate them from the normal text.
 * References are collapsed, similar to templates. The full reference text can be toggled by double-clicking the &lt;ref&gt; tag. Self-closing reference tags ("&lt;ref/&gt;") are treated like normal HTML tags.
 * External links
 * Bold/italics
 * Built-in diff function
 * Built-in preview function

To do

 * "Advanced" editing: selection of text, advanced cursor movements
 * copy/pasting (listen for paste command like for backspace/space/return), then access the paste (cross-browser?) and loop through character by character as if typed (can't be inserted anyway since it's not input/textarea)
 * That's the idea for plain text, but what about copying styles? What happens to copied templates? What if the selection start is with a link, but the selection end outside? Either restriction to plain text, or generating wikitext from selected elements, then insert (and maybe parse?) that wikitext on paste. --Magnus Manske 22:27, 7 January 2011 (UTC)
 * Lists
 * Tables
 * Allowing changing filename, thumb frame or neither, left right or neither, caption/title (depending on thumb/frame or not), size (optional for thumb)