SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Wizard wonshikee's Avatar
    Join Date
    Jan 2007
    Posts
    1,223
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    Too much recursion

    Hi I am trying to learn OOP Javascript. I wrote this script in a non-OOP way but somethings not working right
    when i converted it to an object. I get the error Too much recursion, so i'm guessing somehow the property this.opac is not being accessed correctly?

    Code JavaScript:
    function ImageFadeShow(imgArray)
    {
    	var opac = 100;
    	var index = 1;
    	var img = imgArray;
    	var freeze_speed;
    	var fade_speed;
     
    	this.fadeOut = function() 
    	{
    		if (opac > 0) {
    			this.changeOpac();
    			opac--;
    			setTimeout(this.fadeOut(), fade_speed * 10);
    		} else {
    			index++;
    			if (index >= img.length) {
    				index = 0;
    			}
    			document.getElementById('image-box').innerHTML = "<img src='" + document.getElementById('next-img').src + "' style='width: 300px; height: 300px; ' id='current-img' />";
    			document.getElementById('next-img').src = img[index].src;
    			opac = 100;
    			setTimeout(this.fadeOut(), freeze_speed * 1000);
    		}
     
    	}
     
    	this.changeOpac = function() 
    	{
    		var opacity = opac;
    		var object = document.getElementById('current-img').style;
    		object.opacity = (opacity / 100);
    		object.MozOpacity = (opacity / 100);
    		object.KhtmlOpacity = (opacity / 100);
    		object.filter = "alpha(opacity=" + opacity + ")";
    	}
    }
     
    var img = new Array();
    	<?php
    		$i = 0;
    		while ($row = $sql->fetch())
    		{
    			if (is_file($conf->root.$row['image'])) {
    				$image[$i] = $row['image']; 
     
    				echo 
    				"img[$i] = new Image();
    				 img[$i].src = '".$conf->http.$row['image']."';";
    				$i++;
    			}
    		}		
    	?>
    var imageShow = new ImageFadeShow(img);
    imageShow.freeze_speed = 4;
    imageShow.fade_speed = 2;
     
    window.onload = setTimeout(function() { imageShow.fadeOut(100) }, imageShow.fade_speed);

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Too much recursion means that you are calling the same function within a function in an infinite or near-infinite loop.

    In this case I think it's because when opac = 0, in the last line of this.fadeOut, you call (via setTimeout) this.fadeOut again. So it is an infinite loop.

  3. #3
    SitePoint Wizard wonshikee's Avatar
    Join Date
    Jan 2007
    Posts
    1,223
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    I tried adding this:

    document.getElementById('update-box').innerHTML = document.getElementById('update-box').innerHTML + "-" + opac;

    To fadeOut to see where it stops, and it seems to go from

    100 to 10, then stops.

    The script is supposed to go from 100 to 0, pause freeze_speed *1000 ms, then repeat itself. For some reason after initial 90 loops it seems to quit.

    This was working w/o using object notation - what am I doing wrong?

    It seems

    imageShow.fade_speed = 2;

    Does not set that object's fade_speed property, what is the correct way?

  4. #4
    SitePoint Zealot
    Join Date
    Sep 2007
    Posts
    136
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    its a private variable

    set the vars in the class using this.soemvariable = whatever;


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •