The JavaScript version of Goldify is a standalone application, independent of the Java version. It contains a dictionary of GoldBook terms in one JavaScript file and a small JavaScript script to perform the addition of links to HTML page. The addition of links takes place on the client side - in the browser. This has the benefit of very quick deployment and no impact on the server side. On the other hand, it requires the user computer to download the dictionary, which has currently about 250 kb (83 kb gzipped). By setting up the server properly (using future expire dates and gzipping content) the effect of this can be minimized and limited to the first use only.
The JavaScript version uses the JQuery library internally, mainly to allow easy customization of which parts of the HTML page are to be processed. This can be specified very precisely by using CSS selectors. For even finer control, list of forbidden CSS selectors may be given.
How to use it
To add goldify to your page, you have to add just a small portion of code to the header of your webpages to include the JQuery library, the GoldBook dictionary and the goldify code itself. You can do it by placing the following code into your HTML page:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="goldbook_terms.js"></script> <script type="text/javascript" src="goldify.js"></script> <script type="text/javascript"> $(document).ready(function() { create_index(); goldify("body"); }); </script>
This will use a version of JQuery that is hosted at Google, which means that there is a higher probability that the visitor will already have it in browser cache. It also reduces the amount of data downloaded from your server.
The code also asumes that you have the goldbook_terms.js
and goldify.js
files located in the same directory as your HTML.
The call to function create_index()
is required for Goldify to work properly. The function goldify
takes and CSS selector supported by JQuery and processes all elements it selects.
If you would like to exclude some elements from markup, you can do so either by not selecting them in the first place (providing goldify
with a selector that does not include forbidden parts of your document) or by providing a list of forbidden tags (using CSS selectors again). Goldify by default forbids addition of links into link ("a") and script ("script") elements. You can provide your own list of forbidden elements using the variable FORBIDDEN_PARENTS
:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="goldbook_terms.js"></script> <script type="text/javascript" src="goldify.js"></script> <script type="text/javascript"> FORBIDDEN_PARENTS = ["a","script","i",":first-child"]; $(document).ready(function() { create_index(); goldify("p"); }); </script>
The example above will goldify only paragraphs ("p") and will skip all "a","script" and "i" elements and all elements that are the first child of their respective parent.
Examples
A basic online example of JavaScript Goldify is here, an interactive version that more clearly demonstrates what Goldify does is here.
You can find this and all other current examples of usage of JavaScript Goldify in the directory javascript/samples
in the source code release.