WebFund 2013F: Tutorial 13

This tutorial is not yet finalized.

In this tutorial you will be learning about adding JavaScript code to your browser to modify the behavior and content of selected web pages. Such JavaScript code is knows as greasemonkey scripts or user scripts.

This material is purely optional. If you have been having difficulty we suggest that you use this tutorial time to get help with the assignments and past tutorials. You will get full marks for this tutorial simply for attending and working on class-related material during that time.

Getting Started

First, you should install the appropriate browser extension:

• Greasemonkey for Firefox, or
• Tampermonkey for Chrome/Chromium (Chrome web store or project page)

While Chrome has native support for user scripts; however, the interface is a bit clunky without an extension.

Note the rest of the instructions assume the use of Firefox and Greasemonkey; however, all of the code should work on either browser.

Changing Google's Interface

Install the Google Black Bar Returns user script. (A local copy is here.) You should be able to just click the "install" button in the top-right corner of the page. Make sure you see the smiling monkey in the top-right corner of your browser. If it is greyed out then scripts are disabled!

After installing it, visit the Google home page. Notice anything different? Try and click on the gear icon in the top right.

Next, look at the source of the script (how can you do that?) and see how much of it you can understand.

Explore

• All kinds of user scripts are available at userscripts.org.
• A full book on writing user scripts, Greasemonkey Hacks, is here in wiki form. It is a bit dated and Firefox-specific in parts; however, most of the content is still relevant.
• And in case you were wondering, yes there are many security concerns with user scripts (but they are mostly taken care of now).