JavaScript var in textbox

Hi there
In the head-HTML the var LoopCounter is set to 0.
On the timeline, the LoopCounter will count up each loop and the animation will be stopped, when a certain amount is reached.
Now I would like to show the current status of the loop on my banner.
How can I put the var LoopCounter in a textbox?
Thank you very much for your help.
Best wishes, Urs

Hi Urs!

Here is an example: loopTracker_InnerHTML_Demo_JHSv1.hype.zip (14.4 KB)

2 basic functions + the script in the “Head HTML”: window.loopCounter = 0;

The key point is using the global varloopCountTracker” (i.e. the text box) and set it so:

loopCountTracker.innerHTML = loopCounter;

Hi JimScott
Thank you very much for your fast answer.
Because I don’t need to reset my counter (the counter works only from the start of the animation till the end of it), my code for the counter is smaller.
textanimation.zip (33.0 KB)
Is there a solution, to use the var loopCounter (wich is already in the head-HTML) to display the numbers of animations or can’t this work that way?
Thank you very much for your patience.
Urs

Hi Urs!

Is there a solution, to use the var loopCounter (wich is already in the head-HTML) to display the numbers of animations or can’t this work that way?

I may not be understanding your question… but I will give it a try to see if I’m close.

Are You asking if You can run the necessary code just from the “Head-HTML” - including calls from the Timeline, and no functions?

If this is accurate - I do not believe You can this - or more to the point - I do not know how to do this. Maybe someone else can offer a solution for You.

Hi JimScott
My first idea was, to read out the “var loopCounter” from the header-HTML and show the value in a textbox. I guess, this was a bad idea.
I have a function, in my case “stop()”. There I put in the desired number of loops and have also a line of code for keep looping until the desired number is reached.
Now I would like to expand the code in “stop()” for showing the actual number of loop in a textbox.
Thank you in advance for your help.
All the best, Urs

create your desired textbox, give it an id of ‘showLoopCounter’ in the elementinspector, add this line of code to your stopfunction:
hypeDocument.getElementById('showLoopCounter').innerHTML = loopCounter;

1 Like

Thank you so much h_classen.
This is exactly what I was lookin for.
All the best and thanks again.
Urs