dev

DemoScripts allows demonstrating the functionality of scripts and stylesheets on the Fandom Developers Wiki. The demos can be configured either through its JavaScript page, or through the JSON page.

Configuration

General configuration

Configuration objects in DemoScripts are regular JavaScript/JSON objects with the following properties:

In further sections, you can see how these configuration objects can be used. In both JavaScript and JSON configuration, please keep the list of demos in alphabetical order, unless there are certain restrictions which prevent that (for example, CSS @import only working when in the first stylesheet).

Configuring through JSON

As demonstrations of scripts are added rather often, having each of them pass the review process is inconvenient for both users and Fandom Staff. This is why a JSON configuration page exists, where you can add your demo and have it immediately show up on the page you want to demonstrate on. For example, the following configuration makes the script from the page MediaWiki:Script.js be loaded on the Script page and its subpages:

    "Script": {
        "page": "Script",
        "scripts": "MediaWiki:Script.js"
    },

This is the preferred way of adding demonstrations. However, there are certain restrictions to this approach. Since edits to the JSON page are not reviewed before publishing, the following are not allowed:

Configuring through JavaScript

In case the JSON configuration does not suit your needs, on the script's JavaScript page you can find an includes object in which you can add a demo configuration object in a similar manner to the JSON configuration (and, more importantly, in a similar manner to what is already on that page). For example, if you wanted to add configuration for a script which configures itself before importing and works on a pseudo-special page, it would look like this:

        Script: {
            page: 'Special:Script',
            scripts: 'MediaWiki:Script.js',
            styles: 'MediaWiki:Script.css',
            exec: function() {
                window.Script = {/*... */};
            }
        },

See also

Text above can be found here (edit)