🔒 Locked

[web] Javascript problem

Started by WebsiteWill Nov 19, 2004 at 10:48 PM 2 replies 650+ views

Original Post

Nov 19, 2004 at 10:48 PM

I am trying to write a script that will allow me to load various images on a page and then fade them in and out at the same time (each on a different phase). The problem I am having is I am using an array of AnimatedImages (a data type I created). The array gets created correctly but after the first call to the fade function the values become undefined. I'm very new to &#106avascript so go easy on me :)


var animatedImages = Array();

function AnimatedImage()
{
    var myImageID;
    var myValue;
    var myPlus;
    var myMinus;
    this.CreateNew = CreateNew;
    this.SetImageID = SetImageID;
    this.SetValue = SetValue;
    this.SetPlus = SetPlus;
    this.SetMinus = SetMinus;
    this.GetImageID = GetImageID;
    this.GetValue = GetValue;
    this.GetPlus = GetPlus;
    this.GetMinus = GetMinus;
	
	function CreateNew(ImageID, Value, Plus, Minus)
	{
		SetImageID(ImageID);
		SetValue(Value);
		SetPlus(Plus);
		SetMinus(Minus);
	}
	
	function SetImageID(ImageID)
        {
		myImageID = ImageID;
        }

        function SetValue(Value)
        {
                myValue = Value;
        }

        function SetPlus(Plus) 
        {
                myPlus = Plus;
        }

        function SetMinus(Minus) 
        {
                myMinus = Minus;
        }
    
        function GetImageID()
        {
		return myImageID;
        }

        function GetValue()
        {
                return myValue;
        }

        function GetPlus() 
        {
                return myPlus;
        }

        function GetMinus() 
        {
                return myMinus;
        }
}

function AddAnimatedImage(newID, value, plus, minus){
	animated = new AnimatedImage();
	animated.CreateNew(newID, value, plus, minus);
	animatedImages.push(animated);
}

function IE(animated){
	if (animated.GetValue<[80]]&&animated.GetPlus){
		animated.SetValue(animated.GetValue + [1]);
	}
	else{
		animated.SetPlus([0]);
		animated.SetMinus([[[1]]]);
	}
	if (animated.GetValue>[30]&&animated.GetMinus){
		animated.SetValue(animated.GetValue - [1]);
	}
	else{
		animated.SetPlus([1]);
		animated.SetMinus([0]);
	}

                document.getElementById(animated.GetImageID).filters[[0]].opacity=value

}

function MOZ(animated){
	if (animated.GetValue<[80]&&animated.GetPlus){
		animated.SetValue(animated.GetValue + [1]);
	}
	else{
		animated.SetPlus([0]);
		animated.SetMinus([1]);
	}
	if (animated.GetValue>[30]&&animated.GetMinus){
		animated.SetValue(animated.GetValue - [1]);
	}
	else{
		animated.SetPlus([1]);
		animated.SetMinus([0]);
	}
		document.getElementById(animated.GetImageID).style.MozOpacity=value+"%"
}
	
function DoFade(){
	var all = animatedImages.length;
	for(i=[0]; i<all; i++)
	{
	    if (window.sidebar){
		setInterval(MOZ, [100], animatedImages);
	    }
	    if (document.all){
		setInterval(IE, [100], animatedImages);
	    }
	}
}

The relevant html is is simply 3 image tags. Two of them call onload="&#106avascript:AddAnimatedImage('BlueIris', 1, 1, 0)" onload="&#106avascript:AddAnimatedImage('IcySea', 1, 1, 0)" The third is just a temporary dummy I am using to call onload="&#106avascript:DoFade()" The images get displayed correctly the first time. The set interval function is working but on the second iteration of that function, it seems like my animatedImages array is being cleared though it does still have a length of 2... Thanks for any help, Webby

WebsiteWill

Author

WebsiteWill

Nov 20, 2004 at 9:37 AM

function DoFade(){
for(i=0; i {
//setInterval("IE(animatedImages)", 100);
}

setInterval("IE(animatedImages[0])", 100);
setInterval("IE(animatedImages[1])", 100);
}

This works like expected. However, if I uncomment the line in the for loop and comment out the two last lines I get an
'undefined' is null or not an object, error :(
I have 2 images stored in the array so wouldn't these pieces of code be equivalent?
Seems like the for loop would evaluate the numbers 0 and 1 to me...

Is there some way to step through &#106avascript like you can with C++ or VB? I am using Visual Studio.Net 2003. I place breakpoints but nada...<br><br>Thanks,<br>Webby</span>

jjmontes

Nov 20, 2004 at 9:42 AM

I'm unsure but I'll try to help.

Try this into that loop:

setInterval("IE(animatedImages[" + i + "])", 100);

This way you are really construncting a string with the variable name. It is strange, but most script languages (perl, php...) work this way with identifier names.

Hope it helps,

WebsiteWill

Author

WebsiteWill

Nov 20, 2004 at 9:49 AM

Yup, that's got it...
I feel very stupid now :)

I'm so used to using auto complete, colored syntax errors and an IDE that lets you step-through debug that I make tons of small mistakes when left to a text editor only.

Thanks for the help!!!!
Webby

Topic Locked

This topic has been locked by a moderator. New replies are not allowed.