Creating Animation is just like creating a video. Everything that is to be displayed on screen needs to have a start time and end time. Once all the items have completed their end time the animation stops.
In Bilza.js everything that is drawn on the screen is called component (comp). "Text" is a component, "Line" is a component, "Grid" is a component and so on.
Component is refered in these docs as "comp" and Properties are referred to as "props".Every comp is derived from a Parent / Base Object called "BaseComponent". All the properties (props) of BaseComponent are available in all the child comps. These props are like color, width, height etc. The props derived from BaseComponent are called "core props".
Though every comp get "core props" from BaseComponent however not every comp implements each one of these props. For example "circle" comp does not implement height prop.
In addition to "core props" each component has "Comp Props". The comp props are those which are unique to some component as per its requirement.
In Bilza.js everything that is drawn on screen is a Component (comp). Components have Properties (props). When a component is drawn it represents the value of its props. We alter the props and attach animation to them to create animations.
When ever we add a comp to Bilza.js engine we have to give it the starting time and ending time. A comp will just be displayed between these two times.
We can also add components which are displayed all the time.
After the comps have been added, their prop values set and animations attached to props: all we have to do is call draw or start.