Friday, November 30, 2007

Latest news from Konqueror Userscripts

Hi everyone. (anyone? :P)

(Read on to see a video of the Konqueror Userscript Plugin in action...)

I spent some time today to fix a few issues to the khtml_userscript plugin for Konqueror (think of it as GreaseMonkey for KDE) and it now works to a point where I think its usable.

The installer now works. It can be used with:
  • The builtin binary "khtml_userscript_installer"
  • Clicking the Tools => User Scripts => Install Script button in Konqueror
  • Double-clicking a *.user.js file in dolphin / konqueror
Also there is a very dumb greasemonkey compatibility script that gets installed. Right now it does *nothing* but provides the few functions GreaseMonkey provide. At least scripts that use the GM_log() function do not throw any errors anymore... (All other functions are likely to fail)

Internally, we don't use KJS anymore. KHTMLPart now provides a very handy executeScript() function. Basically the Konqueror Userscript plugin is simply an UI on top of this method...

Lots of issues remaining though: the status bar icon is not deleted so after browsing for a while you'll see 20 instances of the icon. Also the "Manage User Script" is still read-only (it shows the good information but no editing works).

For those of you who wonder what exactly is khtml_userscript, I made a small screencast that shows a few features. You can see it below, some explainations will follow...





First I install a user script from the konqueror "Tools => Konqueror UserScripts" menu. I install a script that was used in the previous example by neofreko. It highlights all link with a red border.

// ==UserScript==
// @name KHTML Userscript (kuskus) Test
// @version 0.1.1
// @namespace http://www.kde.org
// @author Akhmad Fathonih
// @description Change links in red, only for testing
// @include *.kde.org*
// @exclude *.google.com*
// ==/UserScript==

var elms = document.getElementsByTagName("a");
//alert(elms.length);

for(var i=0;i<elms.length;i++) {
elms[i].style.color="red";
elms[i].style.border="1px solid";
}


Then I install another userscript that acts on planetkde.org. In this one, all the image of class "hackergotchi" are replaced with another image and I add a h1 element at top of the page that says "Planet Thumbs Up!"

// ==UserScript==
// @name KHTML Userscript Test in PlanetKDE
// @version 0.1.1
// @namespace http://www.kde.org
// @author Mathieu Ducharme
// @description
// @include *.planetkde.org*
// ==/UserScript==

var imgs = document.getElementsByTagName("img");
//alert(elms.length);

for(var i=0;i<imgs.length;i++) {
if(imgs[i].className == 'hackergotchi') {
imgs[i].src = 'http://upload.wikimedia.org/wikipedia/commons/thumb/2/2c/Thumbs_up.jpg/420px-Thumbs_up.jpg';
}
}

var h2 = document.getElementsByTagName('h2')[4];
var txt = document.createElement('h1');
txt.innerHTML = 'Planet Thumbs Up';

h2.parentNode.insertBefore(txt, h2);