Jasoop Toolbox Problem (USER CREATED)

[magicyte]

Hey. I was wondering how I could recall a function inside of another function, namely in OOP. I have this code and the highlighted line is my problem. The function is animate(). Basically I created a function for making a linked list in an array that will be fetched and then be processed to move the element around. Here is an example object: var myObj = new Element(/*id here in quotes*/); This then sets aside element functions. I will change the class name to Animation() and just have the linked list function and implementor involved. Also: VERY IMPORTANT!!: There is NO ERROR. I just want the function to keep going until the animation is complete. Please help!!

Jasoop.js

/************* - NOTICE - *************/
/ Name: Jasoop Toolbox                 /
/ File: Jasoop.js                      /
/ Copyright: 2008                      /
/ Author: Arthur Christopher Watkins   /
/ Note: This notice must stay in this  /
/ document in order for it to be legal /
/**************************************/

// Start Jasoop Toolbox

var $ = function (a) {
if(document.getElementById()) return document.getElementById(a);
else if(document.layers) return document.layers[a];
else if(document.all) return document.all[a];
}

function Element (a)
{
var animateX = new Array(99);   // animation X position
var animateY = new Array(99);   // animation Y position
var animateInt = new Array(99); // animation interval
var setAnimateNumber = 0;       // number used to set animation
var animateNumber = 0;          // number used to animate
this.pxWidth = function (w) {
    $(a).style.width = w;
};
this.pxHeight = function (h) {
    $(a).style.height = h;
};
this.textColor = function (txtcol) {
    $(a).style.color = txtcol;
};
this.backgroundColor = function (bgcol) {
    $(a).style.background = bgcol;
};
this.posType = function (postype) {
if(postype == "absolute")
    $(a).style.position = "absolute";
else if(postype == "relative")
    $(a).style.position = "relative";
else if(postype == "static")
    $(a).style.position = "static";
else if(postype == "fixed")
    $(a).style.position = "fixed";
else if(postype == "none")
    $(a).style.position = "none";
else
    $(a).style.position = "none";
};
this.overflow = function (o) {
if(o == "visible")
    $(a).style.overflow = "visible";
else if(o == "hidden")
    $(a).style.overflow = "hidden";
else if(o == "scroll")
    $(a).style.overflow = "scroll";
else if(o == "auto")
    $(a).style.overflow = "auto";
else if(o == "none")
    $(a).style.overflow = "none";
else
    $(a).style.overflow = "none";
};
this.setAnimate = function (x,y,int) {
    animateX[setAnimateNumber] = x;
    animateY[setAnimateNumber] = y;
    animateInt[setAnimateNumber] = int;
    setAnimateNumber++;
};
this.animate = function (startType) {
if(startType == 'start') {
    if(animateNumber < setAnimateNumber)
    {
        $(a).style.position = "absolute";
        $(a).style.left = animateX[animateNumber];
        $(a).style.top = animateY[animateNumber];
        animateNumber++;
        //setTimeout('this.animate("start");',animateInt[animateNumber]); // Bug
    }
    else if(animateNumber >= setAnimateNumber)
    {
        for(i = 0; i < setAnimateNumber; i++)
        {
            animateX[i]=0;
            animateY[i]=0;
            animateInt[i]=0;
        }
        setAnimateNumber=0;
        animateNumber=0;
    }
    else
    {
    }
}
else if(startType == 'reset')
{
    for(i = 0; i < setAnimateNumber; i++)
    {
        animateX[i]=0;
        animateY[i]=0;
        animateInt[i]=0;
    }
    setAnimateNumber=0;
    animateNumber=0;
}
else
{
}
};
this.moveTo = function (x,y) {
$(a).style.position = "absolute";
$(a).style.left = x;
$(a).style.top = y;
};
}

// End Jasoop Toolbox

I have tried multiple ways to do this, including Element().animate() and Element('myElement').animate(). Would anyone know how to do this?

NOTE: I created Jasoop Toolbox, standing for JavaScript Object Oriented Programming Toolbox. You need to leave the notice there to use it, that is, if you want to.

-magicyte

[Mr Moo]

Try this:

var me = this;
setTimeout(function() { me.animate("start"); },animateInt[animateNumber]);

[magicyte]

Thank you very much, sir! It works! I owe my thanks to you!!

Also, if there are any other alternative ways to do this, anybody, please let me know. If there is a shorter way to do this or even a better way in any sort of fashion, please let me know. I owe any thanks to people who can help me out with this.

-magicyte

[Nile]

A better solution:

setTimeout(function() { this.animate("start"); },animateInt[animateNumber]);

[magicyte]

I'm sorry, but that doesn't work. I just tried it. Thanks anyway.

Also, I figured out the problem. Thanks for the help guys.

-magicyte