Add Java extensions to your wiki

Java applets can bring dynamic functionality to your wiki pages

Wikipedia may be the most high-profile example of a user-edited wiki site, but millions of people around the world are setting up wikis for knowledge-sharing on a smaller scale. In this article, Randall Scarberry demonstrates an interesting way to add dynamic functionality to a wiki -- using good old-fashioned Java applets.

Virtually everyone familiar with today's World Wide Web has encountered the free online encyclopedia, Wikipedia. Wikipedia is driven by an excellent open source product called MediaWiki, which is also available for free. This has led to a proliferation of wiki sites devoted to just about any topic you can imagine. Users of a wiki can add content -- all they need to do is type their additions into their Web browsers using the simple markup language called wikitext. Even better, the developers of wikitext made it extensible. With a little server-side development of your own, you can add your own custom syntax. Users aware of your extensions can then utilize them on their wiki pages with a few simple keystrokes. These extensions can include custom decorations, formatting, Web applications, and even instances of the venerable Java applet. Jmol, for instance, can be used to embed a 3D molecular viewer into a wiki page.

In this article, you'll walk through the steps of deploying a fairly elaborate applet as a MediaWiki extension. Though the example is by no means exhaustive -- an entire book would be required to explain everything about the subject -- it does demonstrate how to give the applet resize handles using a little JavaScript, CSS coding, and some popular JavaScript libraries. You'll also see how to customize the extension using a wiki template. Finally, you'll get a look at a rudimentary persistence mechanism that allows applets to save data directly to the wiki pages on which they reside.

The example applet and wiki setup

This article employs an example applet, shown in Figure 1, that compares K-Means and X-Means clustering on small amounts of generated data.

The demonstration applet deployed as a MediaWiki extension.
Figure 1. Demonstration applet deployed as a MediaWiki extension
K-Means? X-Means? What does that mean?
If you know nothing about the mathematical discipline of clustering analysis, these terms probably don't mean a whole lot to you. Fortunately, you don't really need to know the details to follow along with the example. A quick primer: given some number of points in N-dimensional space (this example uses two-dimensional space to keep things simple), clustering groups the points by Euclidean distance. In other words, clustering attempts to identify the clumps. K-Means groups them into exactly the number of requested clusters (K), while X-Means attempts to determine how many clumps are in the distribution using a statistical measure.

Before you can use the demo application (which I'll refer to as clustering_demo for the remainder of this article), you need to have developer and administrator access to your own MediaWiki site. To set up your own wiki, you need some free software, a moderately capable computer, and an Internet connection. If you do not yet have a wiki set up, go to the MediaWiki homepage, download MediaWiki, and follow the installation instructions on the site. During the procedure, you will need to also download and install PHP and an open source database such as MySQL. And, of course, you need to have a Web server, such as Apache.

Assuming that you have installed MediaWiki and initialized your wiki site, you can hook in clustering_demo using the following procedure:

  1. Download and save the zip file accompanying this article,, onto the computer on which your MediaWiki server resides.

  2. Open the file you downloaded in a zip file browser (or expand it to a temporary directory and navigate to that directory with a file browser).

  3. In another file browser window, find the MediaWiki installation directory, which should have a name like mediawiki-1.12.0 (the name you see will depends upon the version of MediaWiki you installed). This directory will also contain a file named LocalSettings.php.

  4. If the MediaWiki installation directory does not already contain a subdirectory named "extensions," create it.

  5. In the zip file browser, change to the deployment directory. Extract or copy the subdirectory named "clustering_demo" to the extensions directory you found or created in Step 4. Be sure to copy the directory's contents, including its subdirectories, and keep the relative file paths.

  6. Open LocalSettings.php in a text editor. At the bottom of the file, add the line in Listing 1.

    Listing 1. Adding clustering_demo to LocalSettings.php


    Then save the file.

  7. To disable caching while you are working through this example, add the lines in Listing 2 to LocalSettings.php.

    Listing 2. Disabling caching

    $wgMainCacheType = CACHE_NONE;
    $wgMessageCacheType = CACHE_NONE;
    $wgParserCacheType = CACHE_NONE;
    $wgCachePages = false;

    If caching is not disabled, you may have to do more than simply reload Web pages in your browser before you can see the effects of the changes to the PHP code. Having to restart servers to see the effects of minor edits can be quite frustrating.

  8. Put on your wiki user hat and create a new test page on your wiki. Point your Web browser to a page on your wiki server that does not yet exist. For example, if you're working on the server machine itself, direct the browser to http://localhost/mediawiki/index.php/ClusteringDemoTest.

  9. Click on the new page's Edit tab. In the text area of the form that appears, type <clustering />, and then click the Save Page button.

Assuming that all went well, the applet from Figure 1 should now be sitting proudly in your browser. The four text fields in the upper-left corner allow you to type in the number of 2-D test coordinates, the number of clusters, a random number seed to be used throughout, and the standard deviation of the cluster distributions. If all fields have values, the button labeled Generate Test Data and Cluster kicks off the clustering processes. First the data is generated, then K-Means is run, and then X-Means. The text area displays status messages as the algorithms move along. On the right are three scatter plots implemented using the excellent open-source library JfreeChart 1.0.4. The top plot shows the data as generated, the middle shows the K-Means clusters, and the bottom shows the results from X-Means. The Save Settings button copies the test settings to a row in the table at the lower left, associating them with a comment. Clicking on the Restore Settings button copies the settings from the selected table row back into the text fields, so you can rerun them and relive the glories of clustering past.

Step 6 of the procedure hooks the extensions into MediaWiki. These extensions, defined in clustering_demo.php, take two different forms: tag extensions and parser functions. The chief difference between them is the form of the wikitext you type into your Web browser to embed the applet extension on the page of the wiki. Tag extensions use an XML syntax. Step 9 above employs the tag extension format, with the tag name clustering. The parser function format uses a syntax that is somewhat more cryptic, but shorter when you need to supply parameters to the extension. If Step 9 had used the parser function format, you would have entered {{#clustering:}} to embed the applet.

1 2 3 4 5 6 7 8 Page 1
Page 1 of 8