Detect TimeLine name in "IF" statement

In the same way I can run

if (hypeDocument.currentSceneName() == “myscene”) {

//Do something

}

Is there a way to detect if a timeline and run something when this happens?

I tried with if (hypeDocument.isPlayingTimelineNamed() == “myscene”) but I feel this is not the way to do it.

I guess it depends on the “Do Something” as in What is it you want to do and based on what condition?

Are you saying “if timeline A exists do something” or “if A is a timeline do something”?

Since Hype doesn’t have a “fill” feature for images inside containers, it just have fit, I have been using backstreetch JS for fill pictures inside those containers.

But I need the pictures to change inside those containers on different timelines:
timelines_js.zip (491.1 KB)

So far I can only trigger those changes by setting a "run javascript"on each timeline, but I was wondering if there was a single JS I could trigger from “on symbol load”, to keep it simple.

I can’t quite follow your logic, it’s not your fault necessarily, there is probably a bigger picture :slight_smile:

Why do you have the javascript being called within the Timeline? You can call it on Mouse Click of the button. Also you don’t have to use an external Library to get the same result. You can use plain Javascript.

But, have you noticed the “Background Image” property that you use in the same way you used “Background Color”? “to fit” means the image will scale to fit it’s container. Whatever size container you put there (i.e a rectangle).

Failing this here is an example going down the Javascript route.

picChangeOnClick.hype.zip (454.1 KB)

Yeah, but in your example the picture is stretched, distorted I may say.

The point of filling the picture is that the picture fill the container without distortion, it may be fixed by using a different configuration for your code I guess.

To clarify; the hypeDocument.isPlayingTimelineNamed() call takes a timeline name as a parameter, and returns whether or not it is currently in a "play" state (animating). The code would look more like:

if(hypeDocument.isPlayingTimelineNamed("My Timeline Name") == true) {
   // ... do something
}
1 Like

ok. You could still use my technique with your Backstretch plugin. You would just substitute the path to your file with the same as I’ve done so your button ID will replace the picture you want. Backstretch will replace an image by calling it again with a different path for example:

$.backstretch("/path/to/next_image.jpg");

$('elcontenedor').backstretch("${resourcesFolderName}/" + element.id + "");

timelines_js-vDBear.zip (495.1 KB)

1 Like

@jonathan unfortunately it won’t work with his example as no timeline actually plays (at the moment) also this would actually cause several functions to be made and he wants just one function to be called to save on time I guess. Of course your post was a clarification so not dis-agreeing just trying to make it obvious that the OP can’t use this option. Well at least not off the bat :slight_smile:

1 Like

It actually works when doing just 1 “if” statement, but when I do this:

if (hypeDocument.isPlayingTimelineNamed(“one”) == true) {
$(".elcontenedor").backstretch("${resourcesFolderName}/PolyFloor3.jpg");
}

if (hypeDocument.isPlayingTimelineNamed(“two”) == true) {
$(".elcontenedor").backstretch("${resourcesFolderName}/Tunel2k-4.jpg");
}

if (hypeDocument.isPlayingTimelineNamed(“three”) == true) {
$(".elcontenedor").backstretch(“destroy”);
}

it doesn’t work for some reason, but I do assume its because the same point DBear made.

Yeah, this solution is much better than the original one I was using, and much easier to implement, thanks!

Still I wish there was a (easy) way to detect the timeline name via javascript.