ReferencePopups

This is a reimplementation of Wikipedia's reference popup gadget; the feature that lets you hover over a citation and displays the contents of the reference in a floating box. The obvious advantage of this is that you can view the references in situ without having to scroll to the bottom, or click the citation and lose your [mental] place in the article.

This gadget includes intelligent color scheme matching so it will try to fit itself into the wiki's color scheme automatically without requiring any custom CSS to fix it. It does this using the colors from Special:ThemeDesigner; if you have altered the wiki's colors using CSS instead of ThemeDesigner then this might not work properly. [If you encounter a wiki where the color adaptation doesn't work properly and it looks wrong, please report it on the |talk page so that it can be made smarter]

Installation
Add the appropriate row to your  in MediaWiki:Common.js:  importArticles({   type: 'script',    articles: [        // ...        'w:c:dev:ReferencePopups/code.js',        // ...    ] });

Usage Notes
The popups are configurable via the built-in UI. You can trigger them via clicking instead of hovering, and you can customise the hover delay and turn the animations on and off. It's also possible to disable them entirely on a per user basis for individual users who don't want it.

When popups are disabled, there is a link at the end of the article, just below the categories, that can be clicked to reopen the configuration UI to turn them back on later.

Administrator Configuration
Administrators can remove the gadget's configuration link from their wiki by putting Reference Popups into "lockdown" mode. This will force the popups to be stay enabled and remove the configuration link from the end of the article, but not from the popup itself.

To enable lockdown, just add this to MediaWiki:Common.js along with the import above:  ((window.dev = window.dev || {}).ReferencePopups = dev.ReferencePopups || {}).lockdown = true;

There are no other administration settings, everything else is per-user.

Design Notes
The popup is a fully reusable component and can be used to create other custom scripts that pop other arbitrary content in the same way.

TODO

 * Create a simple integration script that reuses reference popups to display arbitrary content.
 * This will be usable as a template that wraps the contents in a DIV/SPAN and creates an invisible DIV. The script will attach a popup to each element, using the invisible DIV as the contents.
 * Document the programming interface.