I want the card to continue with it’s closing animation. But it does not respond.
And this is the code:
let duration_Num = 1 ; // 1 second is the duration of each symbol ;
var currentTime = hypeDocument.currentTimeInTimelineNamed(element.id);
if ( currentTime == 0 )
{
hypeDocument.goToTimeInTimelineNamed(0 , element.id);
hypeDocument.continueTimelineNamed(element.id, hypeDocument.kDirectionForward, false);
}
else
{
hypeDocument.goToTimeInTimelineNamed(1 , element.id);
hypeDocument.continueTimelineNamed(element.id, hypeDocument.kDirectionBackward, false);
}
However, what I am more interested in knowing is, what is wrong with my code. Why is it not running? You have used reverse direction. But I have added animation for reverse animation. And the code is trying to call that part of the animation. Why is not working?
In addition, I also noticed I had a “stop-timeline” function inside the symbol. So instead of calling the timeline from 1.00 , I tried calling it from 1.01
In addition to the "Backwards" vs "Reverse" scripting that Hans pointed out...
Your approach to run a timeline ("id0") outside of the symbol (and your code) actually runs OK - but there was a "mechanical" flaw with where You placed a timeline "Pause" action - which was inside the Symbol as illustrated below...
When I removed this "Pause" action from inside the Symbol and created a new "Pause" action on the "id0" timeline instead your code worked...
Based on just the needs of this example there was extra code in the "clickCard" function which I removed in the attached demo: problem-1_JHSv1.hype.zip (231.6 KB)
Adjusted code - "clickCard" function Note: Also removed were unnecessary keyframes for some of the properties in the Symbol.
var currentTime = hypeDocument.currentTimeInTimelineNamed(element.id);
if (currentTime == 0)
{hypeDocument.continueTimelineNamed(element.id, hypeDocument.kDirectionForward, false);
}else{
hypeDocument.continueTimelineNamed(element.id, hypeDocument.kDirectionReverse, false);
}
Hi JimScott,
Thanks for explaining everything further and the details. However, why I put the pause function inside was to make a reusable card component, which won't need a separate pause function everytime it' used. So let's say there are 5 cards needed, I just need to put them on the timeline without caring about the pause function to be put when card opens.
Do you still think, this approach can cause problem?
@Daniel “HypeTriggerCustomBehavior” and “HypeLayoutRequest” seem to be missing in the documentation …¿
edit: i forgot to add that a custombehaviour does not need to be created before calling via script. so all in all it’s a powerful event-managing-system and plays especially well with the new opportunity to set custom attributes …
In the regular targeting you have a hierarchy and need to query the structure to find are target specific elements. You can use the use individual attributes to do the queries. Some attributes are unique like an ID and hence directly return one result but others like NAME or CLASS might return collections. Once you have got a result or collection you can act on it using it’s full API.
You can emit a signal at a specific point and every listener (no matter where in the hierarchy) gets notified. This is a very easy way to trigger stuff. The signals can’t carry any parameters but you can create a signal for every state you want to trigger.
attached a very simplfyied example of how to make use of a custombehaviour triggered event -> to reduce and understand the above abstraction cb_messaging.hype.zip (13.6 KB)
Ok, I think I understand it as I have coded using timelines using adobe flash.
In some cases Indirect Targeting is the only option to know what is the state of that symbol. For example, if an animation is running. And I want to set a trigger at 75th frame, so that I can run other code. In this case I must use indirect targeting by dispatching event on 75th frame. I cannot control such animation by direct-targeting.
you should never mess up the window object with custom js if possible.
it’s easy to use hypeDocument or hypeDocument.customdata as a namespace to avoid this. Benefit is that you have access to Hypes Api …
to your question:
there are always different possibilities to solve tasks. event-orientated programming is just one of them and plays good with generic (reuseable) programming
@MaxZieb did a nice Hype-specific introduction in his extension thread …