Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Help in understanding Code?? 3

Status
Not open for further replies.

sconti11

Technical User
Jan 31, 2011
95
US
Can someone explain what is happening in the code seen below?..it is part of a whole of functions used to slide div tags up and down.

function startslide(objname){
obj[objname] = document.getElementById(objname);

endHeight[objname] = parseInt(obj[objname].style.height);
startTime[objname] = (new Date()).getTime();

if(dir[objname] == "down"){
obj[objname].style.height = "1px";
}

obj[objname].style.display = "block";

timerID[objname] = setInterval('slidetick(\'' + objname + '\');',timerlen);
}

function slidetick(objname){
var elapsed = (new Date()).getTime() - startTime[objname];

if (elapsed > slideAniLen)
endSlide(objname)
else {
var d =Math.round(elapsed / slideAniLen * endHeight[objname]);
if(dir[objname] == "up")
d = endHeight[objname] - d;

obj[objname].style.height = d + "px";
}

return;
}

I am really interested in understanding the piece called startTime in the startSide function and then the following line of code:
var elapsed = (new Date()).getTime() - startTime[objname];

I appreciate any assistance!
 
Hi

Install the FireBug extension in FireFox, add the line [tt]console.log(startTime)[/tt] at the end of the startslide() function then load that page. That is the easiest way to see what happens in JavaScript.

You will see that startTime is( probably ) an object and has properties called as the [tt]id[/tt]s of your moved [tt]div[/tt]s. Each such property's value will be a big number ( like Unix time, but with thousandth second resolution ), the time when the startslide() function was called for the given [tt]div[/tt].

In slidetick() is calculated the difference between the current time and the given [tt]div[/tt]s start time stored in startTime.


Feherke.
 
Code:
 startTime[objname] = (new Date()).getTime();

Creates an associative array called startTime and initialises it with the current timestamp

and
Code:
var elapsed = (new Date()).getTime() - startTime[objname];
Calculates the elapsed time between the current time and the starttime for the object.


Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
BTW

all objects in javascript are associative arrays

so startTime[objName]; and objName.startTime would refer to the same property value

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
It stores the time the div started sliding to use it again to calculate when the sliding should end. Based on when it started and how fast it was going.

As fherke points out its either an object or just an array with the id's of the divs to slide and the time they started sliding.



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
So what I am hearing is, that the startTime variable takes a snapshot when the div begins sliding and then takes the difference between the current time and the startTime to get elapsed....am I close?

Sounds simple enough...

I tried feherke suggestion with Firebug, but I am unsure exactly where to place the line of code so that I can see the guts of this code...can you explain where in Firebug I would place the code?

Thanks.
 
not in Firebug, but in the javascript code
Code:
  timerID[objname] = setInterval('slidetick(\'' + objname + '\');',timerlen);
// firebug out put code goes here
}


Or you can modify the alert() to give output without stopping script execution.


Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
Hi

sconti11 said:
I tried feherke suggestion with Firebug, but I am unsure exactly where to place the line of code so that I can see the guts of this code...
Chris already answered to that. But there is one more way. As startTime is a global variable, you can simply enter its name in the FireBug Console's command line.

( In the code you posted no property is [tt]delete[/tt]d. But if that happens elsewhere, will be pointless to analyze the object after the code finished running. This is why I suggested to add the debug line into the code itself, even if using the Console directly is easier. )


Feherke.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top