New Javascript packages

When planning to write a lot of new code, one cannot always simply include all of it in a script tag in the HTML page. In this case it would be useful to use the Dojo class system to write your own Javascript classes on top of the geomajas framework. To do this properly, we need to go over a few steps. 

This tutorial will assume that you have downloaded geomajas version 1.3.1 (the majas-tutorial-1.3.1.war). 

Dojo's registerModulePath

It is also important to know that this step is not absolutely necessary. You can always create new Dojo classes without having them located in a package known by geomajas (so you could skip this part).

First of all, let us declare a new module basename in which all the Javascript code will be located. To do this, let us create a directory called "myPackage" under the "js" directory. In this directory, create a Javascript file "myPackage.js". Open it, and type:

dojo.registerModulePath("myPackage","../../myPackage");

Now what does this do? This will let Dojo associate the package name "myPackage" with the directory "../../myPackage". This directory is taken relatively from the Dojo home directory which is "js/dojo/dojo" (so from that directory going to ../../myPackage, we would indeed end up in the myPackage directory).

Writing a new class in the new package

Let us now write a new class by the name of "myClass". We will place it directly in de myPackage directory. The new class will be very simple, as that is not what this tutorial is about. It will have only one function: "getFoo", returning a string.

dojo.provide("myPackage.myClass");
dojo.declare("myClass", null, {

    foo : null,

    constructor : function () {
        this.foo = "bar";
    },

    getFoo : function () {
        return this.foo;
    }
});

Notice the very first line! It will introduce this file to the Dojo class system under the name "myPackage.myClass", and in it we find a class by the name of "myClass". What now lacks is a decent way of loading it in the browser.

dojo.require

Back to the "myPackage.js" file! We will now add a new line of code to it, to have it load the new class "myClass" when the "myPackage" package is loaded. We do this, using the dojo.require() function. In it we type exactly the same string, as we typed in the dojo.provide() function in the class definition file, i.e. "myPackage.myClass":

dojo.registerModulePath("myPackage","../../myPackage");

dojo.require("myPackage.myClass");

Now from the moment you load the myPackage.js file in a HTML file, you automatically load the myClass file as well (and everything in it). More information can always be found on the Dojo website (http://www.dojotoolkit.org/)