I this possible: Direct loading animated GIFs with timeline only vs. on sceneload?


(Mikael) #1

I want to ‘restart’ a GIF by forcing the image to be reloaded in the timeline or if a user clicks.

I am wondering if Hype can fetch GIFs in an action (timeline og user), so a non-looped animation appear to run once every time when displayed.

If the animation was running in a loop there would be no challenge, but this is not what I’m going for.

Attempting this in conventional manner the GIF-animation is executed on scene-load (with or without the ressource preload option switched) thus only the last frame is displayed – and as a still image only.

Is there an option to achieve that the GIF-animation is executed (loaded) by a specific action?

Kind regards, Mikael


(Mark Hunte) #2

I think this issue is more a Chrome issue if I remember right.

The only way I have found to do it consitantly is with code to laod the gifs.

     var imgcontainer = hypeDocument.getElementById("imgcontainer")
     var gifName = element.id
     var d = new Date();
imgcontainer.innerHTML = '<img src="' + '${resourcesFolderName}/' + gifName + '.gif?dummy='  + d.getTime() + '">';  

This code is very simple to use.
How you actually call the loader can use any action but you will need to determin how to know whiich gif is loaded.

In this case we use button click actions and the id of the buttons.

Add a Rect to your scene and give it the id of imgcontainer

Add for eaxmple buttons that have the name of each gif as it’s id.

for example foo.gif would give it’s button the id of foo.

Will also need to add a cache number on the end so the browser see the image as a new one and not use a cache

For more…


(Hans-Gerd Claßen) #3

Currently Hype4-Beta has a feature to load gif as spritesheet. This can be controlled by timelineactions …

For Hype3 you can do a forumsearch on this topic there are a few threads …


(Mikael) #4

Very elegant. Making the button trigger new scene – which then loads the gif-sequence – is a nice approach. Ill try to incorporate it in my setup and check it out.

Two questions:
(1) What do do mean with “is more a Chrome issue”?
(2) “Will also need to add a cache number on the end”: do I have to do this or is it an automatic part of the submitted js-test() function?

KInd regards and thanks, Mikael


(Mark Hunte) #5

Thats not really what that example is about… that was just illerstrating the going from and back to a scene and the gif restarting… similar to what you want but you need from a different action than on sceneload to start the animation.
As I said.


In Safari for example the animation will just restart…

Already in the test()


(Mikael) #6

Ah, pardon! I understood but from the wrong reasons :wink:
Your contribution is clear to me now

Kind regards and – again – thankyou very much :slight_smile:
Mikael