I am developing a new UI library based on Mootools, and I encounter a awkward problem: the resources used by UI library should be designated by external program, for example, I use some images to imply a tree node, for more flexibility, the images’ URL can not hard-code in the JavaScript, because JavaScript is running at client-side and the images’ are stored in server-side, thus the client-side script can not know where to find those images.

Finally, I decide to store all resource files (images, text files and XML files, etc.) into a sub-directory of current UI library folder. The problem is that I need to know the server-side directory of the JavaScript.

We must point out the actual server-side directory where the script is stored when using it in a HTML or a server-side HTML (JSP, ASP, PHP, and so on), it looks like this :

<script src=”/WebApplicationName/JavaScripts/script.file.name.js”></script>

From the preceding code fragment, we know the file is stored in server-side directory “/WebApplicationName/JavaScripts/”, we assume that the resources are stored in the same directory.

The problem changes to how to get the server-side directory of a JavaScript file from the code of that file.

I have referred implementations of some mature JavaScript library, such as Prototype JS and Mootools, and I decide using the Prototype JS’s way finally.

I have code the following in JeasonZhao.utils.js to get the current server-side directory of this file:

if(null==window.JeasonZhao.RootPath)
    {
        var js = /jeasonzhao\.utils\.js(\?.*)?$/;
        $$("script[src]").each(function(s)
        {
            if(s.src.match(js))
            {
                window.JeasonZhao.RootPath = s.src.replace(js, '');
                window.JeasonZhao.ImagePath = window.JeasonZhao.RootPath+"jeasonzhao.images/";
            }
        });
    }

I have to admit that I copy source code from scriptaculous-js-1.8.2, why not?