Monthly Archive for April, 2007

Writing a Firefox add-on

I’ve created my first plugin for Firefox. It turned out to be easier than I thought. However, it was so easy beacause I didn’t have to interfere Forefox menu. If I hafd to, I would use XUL, which would be tough.

What I was supposed to do, was to add a link Post to notitio.us to articles on wiki that use MediaWiki engine. The link should be placed in the right menu in a box, where link Help is. I decided to use only JavaScript and test the code with GreaseMonkey plugin for Firefox. In short, GreaseMonkey allows to run a specified JavaScript on declared web pages.

So I ended up with the following JavaScript code:

// ==UserScript==
// @name            IKHarvesterWikiPlugin
// @namespace    http://notitio.us/IKHarvesterWikiPlugin
// @description    Adds to Wikipedia pages "Post to notitio.us" link
// @include         http://*wiki*/*
// @exclude        *url=*
// ==/UserScript==

(function () {
var IKHarvesterWikiPlugin = {

    addPostToNotiotiousLink: function() {
        var li = document.createElement("li");
        li.setAttribute("id", "notiotious");
        li.setAttribute("title","Added by IKHarvester plugin");
        li.innerHTML = ' \
            <a title="Post to notitio.us" \
            href="http://notitio.us/ikharvester/addLO.jsp?m=1&url='+
            window.location.href+'\" \
            style="color:red; font-weight:bold;">Post to notitio.us</a>'
            document.getElementById("n-help").parentNode.appendChild(li);
    }
}
IKHarvesterWikiPlugin.addPostToNotiotiousLink();
})();

I’ve tested with GreaseMonkey and it worked. So it could be used by anyone who used GreaseMonkey plugin. Then I stared to think how to create a real add-on to Firefox, an xpi file added to Firefox. I’ve found User Script Compiler, a service that compiles GreaseMonkey scripts to real add-ons. Compilation finished with success, and the plugin is available here

So, GreaseMonkey and User Script Compiler allow to create Firefox add-ons. The former can be used during development and testing stage, while the latter generates the final add-on. User Script Compiler creates JavaScript, xul, and other files that are required so that the plugin works. However, you can do it this way only if you don’t plan to add items to Firefox menu and taskbar. Actually, this way you can create only simple extensions. Anyway, sometime it’s just what you want icon smile Writing a Firefox add on

AJAX activity indicator

Users are familiar with indications of work performed in background since first versions of MS Windows. Besides being fancy, they are also informative.

AJAX, a Web 2.0 technique, aim at exchanging only small amounts of data with a server; this should be performed behind the scenes. If so, why not expose the moments when user interaction brings about reqest and response from a server? Remeber my previous post about using prototype.js for making AJAX request? I use prototype also for indicating background actions on web pages that support AJAX.

You’d never guess how easy it is to such indicator.

First, you must register an action which accurs in case of an AJAX-related event. The best way to do that is add the following code in the head section of the HTML code (remember to include prototype.js library before it!):

<script type="text/javascript">
<![CDATA[
Ajax.Responders.register({
    onCreate: function(){ Element.show('spinner')},
    onComplete: function(){Element.hide('spinner')}
});
]]>
</script>

Then, further in the code inside body section, add this:

<img alt="spinner" id="spinner" src="gfx/spinner.gif"
    style="display:none;" />

Actually, it’s all. Whenever you click an object which sends an AJAX request to the server, the indicator defined by img appears and is visible until the response is obtained.

Wonder, how to create an indicator animation? Generate one on ajaxload.info

Using PUT and DELETE methods in AJAX requests with prototype.js

Whenerver I write JavaScript I use prototype.js. I find it brilliant, especially when you deal with AJAX. With this library it’s easy to create an AJAX request and process its response from the server.

To send an AJAX request you create a following HTML code:

<a href="#" id="ahref">a link</a>
...
$('ahref').onclick = function() {
    new Ajax.Request('/some_url', {
        method:'get',
        parameters:'param1=value',
        onSuccess: function(transport){
            var responseXml = transport.responseXML;
            ...
        },
        onFailure:function(){ alert('Something went wrong...') }
    });
    return false;
}

This way, you create a request with GET and POST method. Recently, while developing a SOA system based on REST (REpresenational State Transfer), I faced a problem of creating requests also with other HTTP methods.

In short, REST allows using a few HTTP methods. The most popular are:

  • GET – for obtaining representation of a resource
  • POST – for updating or creating a representation of a resource
  • PUT – for creating a representation of a resource
  • DELETE – for removing a representation of a resource

Again, prototype.js helps a lot. Since version 1.5, it is possible to use all those methods (formerly, it supported only GET and POST). PUT and DELETE methods are realized by tunneling over POST. Also, “_method=METHOD_NAME” is added as a query parameter with the request. The only thing to do is to prepare relevant logic on the server side to manage the request.

Suppose you have a servlet that allows adding a resource to a database and it is invoked with the following URL:
http://example.com/servlet/RESOURCE_URL.

A simplified definition of a Ajax.Request object in prototype would be as follows:

new Ajax.Request('/some_url', {
    method:'put',
    parameters:'url=RESOURCE_URL'
});

In the JavaServlet, you obtain the request and manage it like that:

@Override
protected void doPost(
    HttpServletRequest req,
    HttpServletResponse res)
    throws ServletException, IOException {
    if (req.getParameter("_method") != null
        && "put".equalsIgnoreCase(req.getParameter("_method"))) {
        doPut(req, res);
    }
}

Firefox add-ons

Firefox is a powerful web browser; it’s popular since it’s free and offers a great many add-ons and plugins that enhance its capabilities. I decided to present a set of add-ons I use and find useful. They are groupped in a few categories, which facilitates browsing.
Continue reading ‘Firefox add-ons’

IKHarvester

Some time ago I wrote about Didaskon, a framework for composing curriculum for a specific user, basing on his profile and using formal and informal knowledge. I belong to team of the developers.

At the moment, I am developing the one of its component – IKHarvester (Informal Knowledge Harvester). It aims at collecting (harvesting) data from Social Semantic Information Sources (SSIS) and providing it to Didaskon as informal Learning Objects (LOs). By SSIS, I mean community sites (blogs, wikis, social semantic digital libraries, bookmark sharing, video sharing etc.) with semantic annotations added. The prototype will use only wikis based on MediaWiki engine, blogs that support SIOC, and JeromeDL. For the general idea look at earlier presented poster.

In this post, I will focus only on blog posts.

Continue reading ‘IKHarvester’

Latex tables

I wrote my Master’s Thesis in Latex since it allows me to focus on the content of the paper rather than on how it looks. Having the content it is possible to change the output style by changing the Latex code. Recently, I faced a problem of creating tables with background color. After some time Googleing I found some information. On its basis a created table I wanted (look below).

table Latex tables
Continue reading ‘Latex tables’

Faculty research day

On 16th of April, there will be Faculty of Engineering Research Day at NUI Galway. Researchers will be given possibility to present themselves and what they are making research on. Those who apply shall prepare an abstact and a poster.

I will present my research ideas, regarding my Master’s Thesis and what I working on at DERI: the idea of employing Social Semantic Information Spaces (semantic blogs, semantic wikis, social semantic digital libraries etc.) for e-Learning. The following picture gives an idea of how I’m trying to do that.

ssis for elearning.thumbnail Faculty research day

At the bottom, there are SSIS – online communities enriched with semantic annotations. Due the semantics, the content is also machine readable. Consequently, application can use them and reason from them. I’m developing IKHarvester, which aims at harvesting knowledge from SSIS and provide it due Web Services in a form of informal Learning Objects (LOs). These LOs are delivered to Didaskon, a Learning Management System, in a common way – described according to LOM standard. Didaskon, using the user’s preconditions, creates a curriculum by combining formal and informal Learning Objects.

There is also an Abstract available. If you want to learn more about my ideas, feel free to contact me.