JS API code for getTimestamp()

I have a very simple project (just testing and learning). I only have a button that calls the function below and a gaugeNeedle symbol on the default scene. The symbol moves around like a clock. I also added a timeline for that needle (tried variations of getTimeline etc. too).

Trying to get the timestamp so i can make the button click move the needle by using the “seek” method . I wanted to see the timestamps in the console first and got stuck.

I don’t know how to rotate the needle with just += or -= (Like you showed me for setPosition()). So I am trying to use the needle playback frames (time stamp) as a work around. I thought of the labels, but it would be too many of them, i want it to increase as you click (or eventually hold down like a car tire psi inflator). Plus i would like to know how to do it for other ideas down the road. I hope this makes sense.

I tried many more things, but this might help you see what i am missing…
function elementEventHandler(doc, e) {
var element = doc.getElement(‘gaugeNeedle’);
element.play(); // this works
//console.log(element.getDuration()); This works

// none of these work
//var TS = element.getTimestamp(‘gaugeNeedle’);
//var TS = element.getTimestamp(‘needleTL’);
//var TS = element.getTimestamp();

Saola Animate version: 2.71

OS: Windows 10

Notes: I’ve tried so many variations to get the timestamp of symbol. I don’t understand why the API shows methods like play() and getDuration() under the heading Timeline and they work easily by adding them to my variable “element”, yet the other ones do not work like that. I am sure it is my lack of knowledge.

Btw. I am so impressed with the rotation of a symbol in this program (just using the keyframe method and playing the frames). SOOO smooth.

You have to get the timeline first.

tl = doc.getTimeline("needleTL");
ts = tl.getTimestamp();

Also if you just want to rotate a needle on a point on mouse down, you may not need coding:

needle.saolapack (2.0 KB)

Wow, love your example needle!! Simple. I wanted to use code b/c eventually i will need to collect the info of each tire being inflated etc. THANKS for taking time to send that…amazing.

The code you have above, i tried that too…saw it in examples when i was searching here. I tried it again, still not getting the stamp. Perhaps i have some stupid error in my project (naming the timeline etc). I will check and maybe upload the project here.

Again, thanks mackavi for taking time to reply.

Perhaps it is a nesting thing, since the timeline I am calling is in a symbol…need to learn more about javascript (I know scope is tricky in it)
needlePrj.saolapack (4.2 KB)

If it’s in a symbol, then you have to get the symbol first - see this post:

Although powerful, I would suggest that use of a symbol should be considered last after timelines and CSS options have been explored and really only if you need to re-use an animated element.

Hmm, how did i miss that one. I searched every Javascript help file…lol

Anyway, i tried the following;
var symbolDoc = doc.getElement(‘gaugeNeedle’).getSymbolDoc();
// start a timeline in the symbol
var ts = symbolDoc.getTimeline(‘needleTL’);
this one gave me [object Object]
i also tried the last two lines above the way it was in the example you sent
var ts = symbolDoc.getTimeline(‘needleTL’).getTimestamp();
// this one gave me no alert

Getting closer… :slight_smile:

Edit: I missed this

“Although powerful, I would suggest that use of a symbol should be considered last after timelines and CSS options have been explored and really only if you need to re-use an animated element.”

Good point. I have no idea how to include css in Saola Animate nor am i that familiar with it other than styling etc. At this point, i am just trying to learn all areas of the program. I could have made what i wanted in Flash so much easier b/c i had put a lot of time in learning as3 and the interface etc (btw, not talking about Adobe Animate…forget that junk…no matter how great i make it in flash, when i covert it for html5 it SUCKS and requires way more work to get the javascript to work. Spent hours just on buttons…lol). I’ve tried so many other programs/ways to do some thing like flash…all sucked. I may suck using Saola for now, but i feel this is the BEST program BY FAR for me to make great interactive things for my students. Not too mention how small the sl player and other files it makes the HTML 5 EXPORT FOLDER. Once i understand the JS API here and improve my javascript…i see great potential . I hope to see better documentation for the JS API…I know they plan to do that down the road.

Hi Bill,

We’ve just released version 3, it’s free to upgrade for all users who own version 2 perpetual licenses.
In version 3, you can see errors (if any) with your script in the browser console (press F12 to show the browser console). It’ll help you debugging your script.

In your project, I see that you add animation to the main timeline of the symbol, not the needeTL. So please move your animation (cut and paste) to the needleTL, or change your code to get the main timeline.
To get the main timeline, just ignore the timeline name parameter:
var mainTimeline = symbolDoc.getTimeline();

In addition, as mackavi’s advice, using mutliple timelines gives better performance than using symbols or multiple elements. For example, in your project you can use timelines for button states as guided in this tutorial: Creating Hover Effect - Atomi Systems, Inc.


I will make those changes (i think i know what you mean i will figure it out later), thank you.
WOW about the update. Awesome list! Thanks