SOS

Shane O'Sullivan's technical blog… really ties the room together

Archive for the ‘greasemonkey’ Category

EasyCheckboxes: dojo.query and Greasemonkey

Posted by Shane O'Sullivan on May 2, 2009

I’ve written a useful script for Firefox and Greasemonkey called EasyCheckboxes.  It makes it more convenient to work with multiple checkboxes on a page, enabling you to select, deselect or toggle groups of checkboxes. It will also work with all web pages.

See the video below for more info, or you can install it right now by clicking here, or by visiting the script homepage at http://chofter.com/apps/?n=easycheckboxes

Context Aware Selections

One of the most useful features of EasyCheckboxes is that it is context aware.  It figures out what checkboxes are related to the one you chose, and only changes the state of those. This is useful if you have multiple columns of checkboxes, and you only want to check all inputs in one column.

Of course you can also change the values of all checkboxes on the page.

Using Dojo’s query engine, Acme, in Greasemonkey

If you’re not interested in the techie details, you can stop reading now.

Since version 1.3 of the Dojo Ajax Toolkit, it provides a standalone DOM query engine called Acme.  I compressed this down to a single line of code, and inserted it in my GreaseMonkey script.   I previously tried using the Sizzle query engine, but it had too many issues with Greasemonkey, the main being that it sometimes crashed the browser.

Using it is very simple.  Simply call:

acme.query(“.someClass”, unsafeWindow.document);

And it returns an array of the matching nodes.

Posted in Ajax, Dojo, dojo.query, greasemonkey, Javascript, open source, Technical | Leave a Comment »

Using dojo.query & Greasemonkey to skip welcome screens

Posted by Shane O'Sullivan on May 2, 2009

I posted a couple of weeks ago on how I used the Sizzle CSS selector engine in a Greasemonkey script to skip annoying “Welcome Screens”, see it here, or check out the very handy script here.  However, there were a couple of issues with using Sizzle:

  • It had to be inserted in the main page’s JavaScript context, otherwise it would not work.  This is obviously bad as it takes it out of the Greasemonkey sandbox, and potentially could break functionality on the page in question.
  • On some pages it crashed the browser.  Not good.

So, I’ve replaced it with the Dojo standalone library, Acme.  Some advantages it has over Sizzle:

  • It’s arguably faster
  • It doesn’t have to be put outside the Greasemonkey sandbox, so no interfering with the page code.
  • It doesn’t crash the browser :-)

You can get the uncompressed version of Acme here – http://archive.dojotoolkit.org/nightly/checkout/dojo/_base/query.js

If you want a compressed version, that works independantly of Dojo, you can compress that file to a single line using the YUI compressor at http://www.refresh-sf.com/yui/

Posted in Ajax, dojo.query, greasemonkey, Javascript, Technical | 3 Comments »

Skip Welcome Screens With Greasemonkey

Posted by Shane O'Sullivan on April 18, 2009

A feature of some websites that really annoys me are so called “Welcome Screens”, otherwise known as full page advertisements that you have to click through to see the real page. (e.g. Forbes.com).  This apparently annoys plenty of other people too, so I decided to write a simple GreaseMonkey script that will automatically get past the majority of these pages.

It is called “SkipWelcomeScreen”, funnily enough, and you can install it on Firefox 3 from it’s homepage at http://chofter.com/apps/?n=skipwelcomescreen

If you’re not interested in technical details, you can stop reading now.

Using Sizzle with Greasemonkey

To very quickly search the page for anchor tags, I used John Resigs very cool standalone query selector engine, Sizzle.  However, it had to be modified very slightly to work in GreaseMonkey.

At the end of the Sizzle.js file, there is the line:

window.Sizzle = Sizzle;

which had to be changed to

unsafeWindow.Sizzle = Sizzle;

due to GreaseMonkey’s use of a sandbox.

Also, when calling Sizzle, it wasn’t possible to call it directly, like:

Sizzle("a");

instead it has to be called using the unsafeWindow parameter:

unsafeWindow.Sizzle("a");

Otherwise, it works perfectly, and is blisteringly fast.

Posted in greasemonkey, Technical | Tagged: | 3 Comments »

Big DaftMonkey update

Posted by Shane O'Sullivan on February 23, 2009

I’ve added many new features to my Greasemonkey + Dojo script for Firefox and Daft.ie, including:

  • Price history tracking
  • Note taking for each property
  • Better UI
  • Filtering by agent

… and more.  See the video below for a rundown of its features.

Oh and yes, I’m still looking for a nice one bedroom apartment in Dublin – anybody know of one? :-)

Posted in Ajax, Dojo, greasemonkey, Javascript | Tagged: | Leave a Comment »

Dojo & GreaseMonkey == DaftMonkey

Posted by Shane O'Sullivan on January 26, 2009

Given that I’m looking for a new apartment, and I live in Ireland, I use the property search website Daft.ie.  Everyone does.  However I wasn’t very happy with how slow it is to scan through the many results that match my meagre budget.  I realised that it could be readily fixed with GreaseMonkey, using the Dojo Ajax Toolkit to make life easier when it comes to parsing the page, adding effects etc.

The result is DaftMonkey.

I wasn’t even sure if Dojo could be used from within a GreaseMonkey script, as it sandboxes away the custom script code.  However, with a little hackery it was (more or less) possible.  The steps I took were:

  1. Set up the djConfig parameter in the host window to tell Dojo that the page had already loaded, using unsafeWindow.djConfig = {afterOnLoad: true};. unsafeWindow is what GreaseMonkey calls the normal, non-sandboxed window.
  2. Added the <script> tag for dojo.js to the head of the document.  In this case I used the dojo.js.file hosted on AOL’s CDN servers – see http://dev.aol.com/dojo .
  3. Now you have to wait for Dojo to load.  This can be done with a simple setInterval function call, checking if unsafeWindow.dojo exists or not.  (Update: thanks a comment from James, this has been changed to use the djConfig.addOnLoad function)
  4. Once Dojo is loaded, you can call a function kicking off whatever it is that you  script is supposed to do.  In this case, I wanted to add a bunch of DOM nodes to the page (which you can do without Dojo), and add some cool effects, so I also included the dojo.fx bundle.
  5. Copy the dojo variable back into the sandbox window using var dojo = unsafeWindow.dojo, otherwise you’ll have to refer to it as unsafeWindow.dojo all the time.

Screen Scraping With dojo.query

A lot of the features of DaftMonkey rely on asynchronously fetching remote HTML pages and scraping the required data from them.  The approach I used for this was:

  1. Perform a remote request using GreaseMonkey’s native Ajax function GM_xmlhttpRequest.  This works more or less the same as dojo.xhrGet, and I saw no reason to not use it.
  2. When the text is returned, create a DIV, and absolutely position it far to the left.  Fix it’s size to just one pixel so it doesn’t mess with the scroll bars.
  3. Set the innerHTML of the DIV to the text you have retrieved.  Congratulations, you can now use dojo.query to find whatever nodes you need.  e.g. to find all images inside anchor tags, use dojo.query(“a img”, tempDiv).  Note the second parameter, this tells Dojo to only search inside the temporary DIV we created, and not the whole document.

Some other site-specific things were required as part of the screen scraping process.  Many of the sites had iframes included, and as soon as you add those to the temporary DIV, they start loading another page.  This was a nasty performance hit, so I had to remove them from the HTML string before setting the innerHTML of the temporary DIV.

Problems

One problem I found is that calling dojo.declare didn’t work from inside a GreaseMonkey script.  I don’t know why.  Therefore widgets had to be defined the old fashioned way.

A second problem was more related to the website I was writing the script for, Daft.ie.  The entire site is programmed using TABLES!  Seriously, there’s barely one or two DIVs on the page, with practically no CSS either.  This makes it quite difficult and brittle to screen scrape using dojo.query, as there’s really no classes to match.  Still it was possible, but could break relatively easily if the site layout is changed.

Get the Source

You can get the entire source for the script at http://userscripts.org/scripts/show/41105 .

To read a bit more about DaftMonkey, I’ve put up a page about it at http://www.chofter.com/apps?n=daftmonkey .

Posted in Ajax, Dojo, dojo.query, greasemonkey, Javascript, open source, search, widget | 8 Comments »

GreaseMonkey script to add Digg-like links to posts

Posted by Shane O'Sullivan on May 22, 2007

I decided today that I wanted to put links at the bottom of each of my blog posts that would allow people to perform actions on the post, e.g:

My blog is on WordPress.com which doesn’t seem to have a plugin that will allow me to do this. So, I got off my ass and wrote a GreaseMonkey Firefox script that’ll do it for me. You can download this script by going to http://userscripts.org/scripts/show/9421 and clicking the “Install This Script” button.

The links that are inserted are at the bottom of this post. The script is open source (GPL license), so take it, play with it, whatever. If you find any bugs, please let me know by commenting on this post.
Share this post:digg it|kick it|Email it|bookmark it|reddit|liveIt

Posted in Ajax, Firefox, greasemonkey, Javascript | 11 Comments »

Greasemonkey script to turn on Firebug debugging for Dojo

Posted by Shane O'Sullivan on January 12, 2007

Enabling debugging in Dojo is a relatively simple thing to achieve, you simply put

djConfig={isDebug:true};

into a script block before including the dojo.js file, and that’s it. If you want to use Firebug to display your debug statements, put the code:

dojo.require(“dojo.debug.console”)

somewhere on the page. However, this is not always as straightforward as it seems. For simple html or PHP pages, sure, it’s easy. But what if you want to debug multiple pages and you’re using static html? You’ll have to put this code on all of them, and remove it when you’re done. Or what, as is the case in my current position, you are working with a very large framework that doesn’t easily allow you to change the template of a page without a long rebuild step?

The solution is to use a Greasemonkey script to enable Dojo/Firebug debugging on any page you visit, or only for pages in a given list of domains (not that this only works for Firefox, poor old IE doesn’t have anything nearly as cool as Greasemonkey available). The steps to use this script are as follows:

  1. Install Greasemonkey from http://greasemonkey.mozdev.org/
  2. Install Firebug from http://www.getfirebug.com
  3. Go to http://userscripts.org/scripts/show/9424 and click the “Install this Script” button. Greasemonkey should prompt you to install it.

That should be all that’s necessary. Now, every page you visit will print it’s debug output to the Firebug console, regardless of whether the page has debugging switched on or not. Obviously you don’t always want this script to run, so to disable it, in Firefox to to “Tools/Greasemonkey/Manage User Scripts”, select the script and uncheck the “Enabled” checkbox whenever you don’t want to use it. Even simpler, if this is the only script you use with Greasemonkey, you can enable/disable Greasemonkey completely by clicking on the monkey icon at the bottom-left of the Firefox window.

Posted in Ajax, Dojo, greasemonkey, Javascript, Technical | 7 Comments »

 
Follow

Get every new post delivered to your Inbox.

Join 535 other followers

%d bloggers like this: