My Simple Animation Functions

Hopefully this shares correctly. Below are the functions I use to easily program animations such as layerset; vertical, horizontal and omni resizing; four directional moves, light control, and rotation. The functions are controlled by easy to understand parameters such as graphic name, start size, end size, start angle, end angle, distance, layer name, etc.&nbsp; Delay controls when the function will act so you can make a sequence of these functions. Combine two or more functions at the same delay time to make composites like move and grow, or change layers and rotate, etc.&nbsp; Duration controls how long a function will take from start to finish, and increments are how many frames the function will use. For example, a resize from 70 to 140 pixels with 4 increments and a duration of 2 seconds will grow about 17.5 pixels every half-second. Don't forget to use quotation marks around layer names and graphic names. An example function call looks like this:&nbsp;vresize("smoke1",35,350,4,3000,500); Simple. <a href="https://github.com/MelvinMcSnatch/roll20-api/blob/master/Animations" rel="nofollow">https://github.com/MelvinMcSnatch/roll20-api/blob/master/Animations</a> Some other advice: Don't try to run things too fast. If you use too many increments in a short amount of time, it will skip or act&nbsp;erratically. Objects resize from the middle and will also resize the transparency around the image. If you want something to just grow vertically or horizontally (like a side view) but not both (like from a top down view), you will need to either edit the image to double its size with transparency at the bottom of the image, or use a coordinated move to offset the resize. But goodluck with that.

If you wanted to you could encapsulate the code then have each function simply add a new command to a task list witch is then executed by a single loop that forces a set fps. // This acts as a static class basicaly. var melvinAnimation = { &nbsp; tasklist:[], &nbsp; consume:function() { &nbsp; // some sort of time code here. maybe calculate delta and only exicute when delta = 500ms (ie 2fps) &nbsp; // you might have this in a loop somewhere. maybe a timer then you wouldnt need the delta. &nbsp; var item = melvinAnimation.tasklist[0]; &nbsp; item[0].call(undefined, item[1]); &nbsp; melvinAnimation.tasklist.splice(0,1); &nbsp; }, &nbsp; _vresize:function(obj) { &nbsp; //real code here &nbsp; }, &nbsp; vresize:function(name, int1, int2, int3 ,int4, int5) { &nbsp; // You use this function when building the script. &nbsp; var obj = { "name":name, "int1":int1, "int2":int2, "int3":int3, "int4":int4, "int5":int5 }; &nbsp; // No brakets on the function!!!!! &nbsp; var arr = [melvinAnimation._vresize, obj]; &nbsp; melvinAnimation.tasklist.push(arr); &nbsp; } }; Then somewhere maybe in a timer or a loop you would have "melvinAnimation.consume();" and you would just write you script as normal melvinAnimation.vresize("smoke1",35,350,4,3000,500); That being said you would want each animation frame to go into the array&nbsp; separately so you would need to break it down more than this. Just to make it clear this is just an example it may or may not work, I haven't tested it, but the concept is sound.