Start animation from external javascript function

(Vito Lipari) #1

I want, when i export an animation, that animation start ( from current keyframe ) when it called from an external function.
In this way i could control the progression of timeline.
How can i make this?

Start Function from another Hype animation
(Andrew) #2

You can use this:

HYPE.documents['DocumentName'].startTimelineNamed('timelineName', ),HYPE.documents['DocumentName'].kDirectionForward);

Not tested, but it should work :smile:

(Vito Lipari) #3

Thank you fro answer!!!
But i solve my question in this way:

i created 4 scene.
in scene 1 when i click a picture it go to scene 2
scene 2 have a loop animation, a added this javascript function on scene load:

	function launchWaitingStatusEvent(hypeDocument, element, event){
            var hypeSceneChange = new CustomEvent("onHypeSceneChange", {

i exported in HTML5
i created my web page, i paste the hype exported code
in my javascript i wrote this

<script type="text/javascript" id="mainscript">
        if(typeof(window.addEventListener) == 'function') window.addEventListener("load", initApp, false );
        else if(window.attachEvent) window.attachEvent("onload", initApp);

		function initApp(){
			document.body.addEventListener('onHypeSceneChange', myAjaxFunction, false);
		function myAjaxFunction( ev ){
			if( ev.detail == 'MyScene' ){
				// Ajax.request
< / script>

I’m sorry for my english!

(Andrew) #4

Okay, mine is much less code though :smile:

(Vito Lipari) #5

Sure, and i thank yo again!
But your code and my code, works on different situation, your code commands the time line of current scene, my code creates event for scene changing, and in external javascript command the change of scene.

Using your code and my code is possible to have the full control of hype animation from external javascript.

(Trevor) #6

Hi there,

I’ve used similar technique for starting some timelines from external javascript:

        var hypeApp =   HYPE.documents['GLR-Products-v6'];
        hypeApp.goToTimeInTimelineNamed(0, 'Main Timeline');
        hypeApp.continueTimelineNamed('Main Timeline');

This post helped me to find the way. Thanks

(Alex) #7

Hi trevor, I am wandering where to fine Hype document name. Thank you

(Trevor) #8

hi alex, I did this long time ago, but as far as I remember; the Hype document name (in my example GLR-Products-v6 ) is the name you give while you export your project. This is considered project ID/name

(Mark Hunte) #9

As explained here

You can find the appropriate ‘MyDocumentName’ by looking at the first line in the hypegenerated_script.js in the exported Resources folder. If you saved a document named ‘index’ then your MyDocumentName value would be simply index. It’s best to use scene names that do not contain foreign characters or symbols. Keep em simple.

(Alex) #10

Hi Mark, this thread solved my problem. Thank a lot.