Greasemonkey is an add-on for Firefox that allows you to change the behavior of web pages in your browser. That includes creating mashups. You already saw an example of a Greasemonkey script in Chapter 1—the Google Maps in Flickr Greasemonkey script. And here are some good references you can use to get the best out of Greasemonkey:
Greasemonkey Hacks by Mark Pilgrim (O’Reilly Media, 2005)
http://www.greasespot.net/ (the official blog of the Greasemonkey
project)
Links that show up on the New York Times online site typically expire after a week. That is, instead of going to the article, you are given an excerpt and a chance to purchase a copy of the article. However, in 2003, Dave Winer struck a deal with the New York Times to provide a mechanism to get weblog-safe permalinks to articles.[127]New York Times link generator that compiles those permalinks and makes them available for lookup via a web form or a JavaScript bookmarklet.[128]New York Times article, and it will return to you a more permanent link.
Let’s look at an example. Consider the following URL:
http://www.nytimes.com/2007/04/04/education/04colleges.html
This corresponds to the following:
You can see this for yourself by going to the link generator:
http://nytimes.blogspace.com/genlink?q=http://www.nytimes.com/2007/04/04/education/04colleges.html
When there is no permalink for an article, you will see a different type of output from the New York Times link generator. For example, consider the following:
http://www.nytimes.com/aponline/us/AP-Imus-Protests.html
This doesn’t have a permalink, as you can see from this:
http://nytimes.blogspace.com/genlink?q=http://www.nytimes.com/aponline/us/AP-Imus-Protests.html
Where’s a good place to stick a UI element for the permanent link on the New York Times page? There are lots of choices, but a good one is a toolbar with such elements as e-mail/print/single-page/save/share.
The basic logic of the Greasemonkey script we want to write consists of the following:
If you are on a New York Times article, send the link to the New York Times link generator.
If there is a permalink (which you will know is true if the href
attribute of the first <a> tag starts with http: and
not genlink), insert a new <li> element at the end of
the <ul id="toolsList">.
Now let’s walk through the steps to get this functionality working in your own Firefox browser installation:
Install the Greasemonkey extension if you don’t already have it installed.[129]
Create a new script in Greasemonkey in one of two ways:
a.You can go to http://examples.mashupguide.net/ch08/?newyorktimespermalinker.?user.js
and click Install.
b.Select Tools → Greasemonkey → New User Script, fill in
Name/Namespace/?Description/?Includes, and then enter the following code. (Note
the use of GM_xml
httpRequest to find out what a more permanent link is. You will
see in Chapter 10 the logic behind xmlhttpRequest.[130]
// ==UserScript==
// @name New York Times Permlinker
// @namespace http://mashupguide.net
// @description Adds a link to a "permalink" or "weblog-safe" URL
// for the NY Times article, if such a link exists
// @include http://*.nytimes.com/*
// ==/UserScript==
function rd(){
// the following code is based on the bookmarklet written by Aaron Swartz
// at http://nytimes.blogspace.com/genlink
var x,t,i,j;
// change %3A -> : and %2F -> '/'
t=location.href.replace(/[%]3A/ig,':').replace(/[%]2f/ig,'/');
// get last occurrence of "http://"
i=t.lastIndexOf('http://');
// lop off stuff after '&'
if(i>0){
t=t.substring(i);
j=t.indexOf('&');
if(j>0)t=t.substring(0,j)
}
var url = 'http://nytimes.blogspace.com/genlink?q='+t;
// send the NY Times link to the nytimes.blogspace.com service.
// If there is a permalink, then the href attribute of the first tag
// will start with 'http:' and not 'genlink'.
// if there is a permalink, then insert a new li element at the end of the
// <ul id="toolsList">.
GM_xmlhttpRequest({
method:"GET",
url:url,
headers:{
"User-Agent":"monkeyagent",
"Accept":"text/html",
},
onload:function(details) {
var s = details.responseText;
var p = /a href="(.*)"/;
var plink = s.match(p)[1];
if ( plink.match(/^http:/) &&
(tl = document.getElementById('toolsList')) ) {
plink = plink + "&pagewanted=all";
plinkItem = document.createElement('li');
plinkItem.innerHTML = '<a href="' + plink + '">PermaLink</a>';
tl.appendChild(plinkItem);
}
}
});
}
rd();
What you will see now with this Greasemonkey script if you go to http://www.nytimes.com/2007/04/04/education/04colleges.html is
the new entry Permalink underneath the Share button. The link may take a few seconds
to appear while the permalink is retrieved.
Note that this Greasemonkey script is sensitive to changes in the way New York Times articles are laid out: older articles have a different page structure and therefore need some other logic to put the permalink in the right place.