Loop Snowflake Animation - Html5 Canvas

[katja tortugatja]

Hi

In Animate CC on an HTML canvas for a web banner I want to animate snowflakes on a landscape.  At the moment I'm using  "Code Snippets" --> "Html5 Canvas" --> " Animation" --> "Animate Horizontally" and animated several snowflake-Movie-Clips falling from top to bottom. 

How can I loop snow infinitely so that it falls endlessly from top to bottom?

I found this article:

https://theblog.adobe.com/html5-canvas-javascript-basics/

But I didn't quite understand how to use the code correctly in a html5-banner without buttons.

[kglad · Accepted solution]

create a snowflake and assign it a class/linkage id = "Snow". you can then use:

var snowA = [];

var tl = this;

var snowNum = 100;

var snow;

createSnowF();

var animateSnowI = setInterval(animateSnowF,100);

function createSnowF(){

for(var i=0;i<snowNum;i++){

snow = new lib.Snow;

snow.x = stage.canvas.width*Math.random();

snow.y = -stage.canvas.height*Math.random();

snow.rot = 2*Math.round(Math.random())-1;

snow.sp = 5*Math.round(Math.random())+5;

tl.addChild(snow);

snowA.push(snow);

}

}

function animateSnowF(){

for(var i=0;i<snowNum;i++){

snowA.rotation+=5*snowA.rot;

snowA.y+=snowA.sp;

if(snowA.y>stage.canvas.height+snowA.nominalBounds.height){

snowA.y=-snowA.nominalBounds.height;

}

}

}

[jojobee1]

Hi, has something changed in Adobe Animate?  This code does not currently appear to work.

Does anyone have a working version?  Also, what would be the best way to stop the animation after 30 seconds?