[Javascript] Knowing wich function called another function within the code of the latter.

Thu Aug 31 06:35:53 CDT 2006

Hi there. First and foremost, let me salute you, for i have been reading
this news mail for quite a lot of time and found a great source of 
knowledge and helpful people.
So, this header is basically a 'Hi, I'm new' message.

Now, to the problem itself. For a GUI library I'm trying to write for
personal use,based on Prototype and Base and loosely based on Java's 
Swing syntax, i need a java-like "import" global method.
Every javascript "class" has a file, as with java, and every file is
inside a folder/package.
So, the syntax I'm using for the method is:
/include("package.subpackage.anothersubpackage.Class")
wich gets translated at runtime to
package/subpackage/anothersubpackage/Class.js.
What the method does is including in the header of the page (with a
<script src="" type="text/javascript" /> element )
the javascript file "included", after looking if it isn't there already.
The actual method is (don't know how to give a better reading style in
plain text for code):
/**
 * Allows to include a class or a file given its name (java style)
 * ex: include("mpt.web.gui.components.CComponent")
 * @param String importName the qualified name of the Class to be loaded
 */
function include(importName)
{
    //Transform the importName into a js file to include
    var pathName = "js/"+importName.replace(/\./g,"/") + ".js";

    //Search the actual html header for a duplicated include
    var nodeList = document.getElementsByTagName("script");
    for(var i=0;i<nodeList.length;i++)
    {
        var node = nodeList.item(i);
        if(node.getAttribute("type") == "text/javascript")
        {
            var name = node.getAttribute("src");

            if(name == pathName)
                return;
        }
    }

    //Insert the js file into the header element of the page
    var headerNode= document.getElementsByTagName("head").item(0);
    var node = document.createElement("script");
    node.setAttribute("type","text/javascript");
    node.setAttribute("src",pathName);
    headerNode.appendChild(node);
}

So, what's the problem with all this? Dependencies! I find that included
files with this method get loaded at any place inside the header element
of the page, moreover. And that becomes a problem since classes are
often dependent (Inheritance tree or as attributes of the class itself)
on others, and if those dependencies are listed below the dependent
element in the header, the dependent class never find it's dependencies.
To solve that problem i thought that when i include a class, it's script
element should be inserted just a line before the caller script element.
I don't know if i'm making myself clear (you will have to excuse my poor 
English, as it isn't my native language and never was a good student), 
so i will show it with an example: 
Let's think of a Button (Button.js) class, wich extends a Component (Component.js) 
class, both are inside the folder webAppRootFolder/js/mpt/web/gui/components, 
so their qualified names are mpt.web.gui.components.Button and mpt.web.gui.components.Component. 
The Button.js file "includes" the Component.js file, declaring it as a dependency, 
and is itself included in the Main class of the application. Let's see how
the Main class would look:

include("mpt.web.gui.components.Label");
include("mpt.web.gui.components.Button");
include("mpt.web.gui.components.Window");
include("mpt.web.util.Point3D");

function main()
{
    var window = new Window();

    var l1 = new Label("Test label");
    l1.setId("l1");
    l1.setPosition(new Point3D(50,50,1));    
    window.addComponent(l1);

    var b1 = new Button("Button 1");
    b1.setId("b1");
    b1.setPosition(new Point3D(200,50,1));
    window.addComponent(b1);

    window.show();
}

And the main html page that would call the main function looks like this:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Test Page</title>

		<!-- Javascript files -->
		<script type="text/javascript" src="js/mpt/web/util/common.js" />
		<script type="text/javascript" src="js/mpt/web/util/prototype.js" />
		<script type="text/javascript" src="js/mpt/web/util/Base.js" />
		<script type="text/javascript" src="js/app/bin/main.js" />

		<!-- Stylesheet files -->
		<link rel="stylesheet" type="text/css" href="rsc/skins/redmond/style.css" />
	</head>

	<body>

	</body>
</html>

Both prototype and Base will be loaded by common.js when i get everything right, 
to reduce the number of js includes in the main html page. So, common actually
calls the main function, wich must be implemented by the application js file, wich
is in this case app.bin.main. In fact, the include function is in common.js, just that
you know.
The include function puts every script element below the stylesheet link element. Sometimes
they are also put below the main.js script element.

And now - at last! - the context is set and now i can talk about what i actually need:
¿Is there a way to know from within a function wich file or class or Function called it?
I would need that knowledge so that i can put the <script /> element needed by the calling Class
just one line before the <script /> element of the calling Class.

I hope i've explained myself right. And i hope you will be able to answer such a question.

Best regards,
Loïc Prieto.

______________________________________________ 
LLama Gratis a cualquier PC del Mundo. 
Llamadas a fijos y móviles desde 1 céntimo por minuto. 
http://es.voice.yahoo.com