IN DEPTH - CALLBACK - RUN ON LOAD - RUN ON CALL

CALLBACK FUNCTION

The callback function in full range is beyond the scope of this manual
A callback   function   is just  a   new function   custom code can be inserted here and will execute after the animation

But a  callback function  is a very powerful function that will make understanding this option worthwhile
Before we get into using this callback function we will take a look at the   run on load   and   run on call   properties

RUN ON LOAD  and  RUN ON CALL

run on load
With   run on load   we can set the animation to execute (true) or not to execute (false) on page load
If we set it to   false   the animation or event or draggable or cycle  etc    the function will simply not run on page load
Which makes the next  property   run on call   very interesting

run on call
With   run on call   we can  name-id  that specific function and we can CALL it to run at will


SO HOW DO WE CALL A   RUN ON CALL   ?


THE CALLBACK FUNCTION TO USE

We can ie. use a   callback | function   to call an animation to occur

AN EXAMPLE:
We have a Shape1 and we want to animate it to move relative to the left by 300 pixels
We do not want it to run at page load, but we want to call it later by a mouse-click on a Shape2

The properties for Shape1 would look something like ...     module | OnLoad is used

module | OnLoad
selector                      : #wb_Shape1
action 1 | action             : left
action 1 | value              : +=300
...
run on load                   : false
run on call                   : moveShape1rel300   <--- the  run on call

The properties for Shape2 would look something like ...     module | OnEvent is used

module | OnEvent
selector                      : #wb_Shape2
event 1 | event               : click
...
event 1 | callback | function : moveShape1rel300() <--- the  run on call  called


So, in this example we created an animation for a Shape1 with the   module | OnLoad
We have set the property   run on load   to   false   so the function to animate will  not  run on page load
We then created a click event in the   module | OnEvent    for a Shape2
And we used the   callback   of that event to execute the   run on call   of the OnLoad module
THE RESULT: If we now click on a  Shape2  the animation of  Shape1  will execute

To call a   run on call   we just place a  ( )  behind the   run on call   name used, it is a function
in this example the   run on call   is  -  moveShape1rel300
we call it like this                    -  moveShape1rel300()   <--- it is a function call

NOTE: give each   run on call   it's own unique name
NOTE: never call a   run on call   that does not exist, that is not defined first

DEPTH CALLBACK RUN ON