As you can see on my previews post, i created a great mouse hunt script using grease monkey and jQuery, in this post i will explain how the update is done.

The idea behind this is, that the user will install the script and most probably will never go back and check if there is an update to that script, so you, the developer, will have to fix this problem for the user. I didn't wanted to automatically install software or updates on a users PC so i'm notifying the user that there is an update available, so he can install it by hand (only click on the link).

There are 2 parts for this, the Javascript part (inside the greasemokney script) and the server part (php in my case). The principle is simple, we have a variable inside the gresemonkey script which will contain the version of that script :

var cVersion = "1.14b";

and we have a function which will call an url giving that version as a parameter :

//check if a new version is availble.
	GM_xmlhttpRequest({
method: 'GET',
url: 'http://path.to.your.script.php?version='+cVersion,
headers: {
'User-agent': 'Mozilla/4.0 (compatible) Greasemonkey',
'Accept': 'application/atom+xml,application/xml,text/xml',
},
onload: function(responseDetails) {
$("#gm_pl_version_container").html(responseDetails.responseText);
}
});
 

What this function does is pretty straight forward, will call an url (passing the script's version as a parameter) and put all the returning content (presumed html) inside a div.

Now, we have the server script, which we called earlier. This script also has a variable inside :

$local_version = "1.14b";

which contains the latest version of the script. This script is also pretty straight forward, will compare the latest version of the script, defined here, with the version provided as a parameter, and based on that will return an html, here is the entire script :

 
<?php
$local_version = "1.14b";
if($_GET['version']!= $local_version)
{
	print "
<div style='padding:3px'>
	A new version of this script is available.<br>
	Click <a href='http://userscripts.org/scripts/source/57446.user.js'>here to upgrade</a>
	</div>
 
	";
}
else
{
	print "your script is up to date ($local_version)";
}
?>
 

And this is it.
If you don't want to use Jquery, no problem you will have to replace this :

 $("#gm_pl_version_container").html(responseDetails.responseText);

with :

document.getElementById("gm_pl_version_container").innerHTML(responseDetails.responseText);

where gm_pl_version_container is the id of the element where you want to insert the content.

Related posts:

  1. GreaseMonkey, Jquery and the greatest mouse hunt script.
  2. Greasemonkey, create a options panel using jQuery
  3. jQuery popups wizard, web 2.0 ideea and usability