jQuery / External Libraries

It is my understanding that jQuery is embedded in AP9.
If that is true - is there a way that we can access it directly?

I am working on trying to create a button that will cause another object to animate across the screen and when clicked again - the object will animate back.
I know that I can set a new position for the object but it snaps to that position rather than sliding nicely. I did not notice a method in the manual to do this and I did not see a way to use a button to activate a motion path for a different object. I’d rather not use the timeline as a workaround.

I would normally do something like this using jQuery directly but I cannot seem to find the right path.

if (help==0) {
$("#objName").animate({left: "+400px"});
help=1;
}

else {
$("#objName").animate({left: "0px"});
help=0;
}

Also - is it possible to use/load an external JS file that will both render in preview and be accessible via console?

Here is a short example of what I am trying to do. Hopefully it shows.

slide

1 Like

Hi Greg,

You can achieve this example in ActivePresenter by using the Toggle Visibility action and Peek In/Peek Out effects, all without the necessity of writing code.
However, if you prefer a code-based approach, you can use the show/hide function with effects as described in the User Manual - no need to rely on jQuery.
If you do opt for jQuery, please note that object selection should be done as follows:

$(prez.object("objName").node)

rather than:

$("#objName")

Regards,

1 Like

Thank you, @Hang - This was helpful in a couple ways

The show/hide functions with PEEK_IN and PEEK_OUT will work in some situations where I would need to animate a box to/from a spot right on the edge of the stage. This was good intel as I had not thought about using PEEK_IN and PEEK_OUT.

However, there are also times when I want to animate an object off the stage from a spot that is more to the center. In this case, PEEK_IN and PEEK_OUT do not work as well because it disappears at the boundary of the object rather than the boundary of the stage.
In these situations - the jQuery works better since I can animate the object all the way across.

You can see the result of both below.
*I would still be interested to know if it is possible to include an external JS file that can be referenced as well. This could allow for even more possibilities.

slides

1 Like

Thank you for your response, Greg.

I think the Fly In/Out effect will be more suitable than Peek In/Out in this case. Sure, if you want to know about external JS, please refer to this thread: JSON Animations in ActivePresenter? - #2 by ToanLS

Have a nice day!

1 Like

This is fantastic! Thank you, @Hang and @ToanLS

I firmly believe in creating experiences that are interactive. This now increases our ability to help teach young ones to tell time and old ones how to work with equipment in a more simulated and interactive way - and so much more!
Very excited about this!
I will work on something a bit more polished to share.

dials

2 Likes

I’m so glad to hear that and can’t wait to see your creative and awesome examples.
Keep up the great work!

Cheers,