Effects definition

Mostly everybody wants to use not the only effect with his slider, but the set of different effects. That's why we provide a way to use as many effects as you want in the same time. All you need to do is to provide us with the list of effects you need.

After the effects are set up they are called randomly from the list provided.

It is not forbidden to set the effect not only once, that's even better to set up some instances of the same effect with different granularity and smoothness. Also, if you want to increase the chance of choosing this concrete effect, you can copy it to increase the chance of random selection.

To construct the effects set there are three possible ways to do it:

  • as a string
  • as a strings array
  • as an objects array.

Every effect instance or the effects group instance is very simple to define:

  • name: name of effect or group of effects
  • duration: the amount of milliseconds to run the effect. Be careful: depends on browser and effect it can take much longer than the selected value
  • size: depends on effect mean granularity or zoom
  • steps: smoothness of the effect. Means how many steps does one part (e.g. one cell of the the ChessBoard) need to fully appear.

After this is clear, it should now be easy to define the special effect. You can select it as you prefer, just take into account what has a better look for you and what is easier to support later on. For more comfortable understanding it is better to start from the end of list.

Using objects array

Create an objects array, where every object is defined like in the example below:

JavaScript
var effects = [{
  name: "groupOrEffectName1",
  duration: 1000,
  size: 10,
  steps: 15
}, {
  name: "groupOrEffectName2",
  duration: 2000,
  size: 20,
  steps: 30
}];

Structured and clear.

Using strings array

This way is a simplified way to write the object above. Every string in array should be represented as below

JavaScript
var effects = ["groupOrEffectName1:1000:10:15","groupOrEffectName2:2000:20:30"];

Much easier, isn't it? But a bit less understandable for the next developer...

Using string

This is again a simplified version of a previous way. Put all the strings of array with a comma delimiter

JavaScript
var effects = "groupOrEffectName1:1000:10:15,groupOrEffectName2:2000:20:30";

The easiest way to do, but is not comfortable to support.

Also it is possible to use a string "random" which means all possible effects with default settings, but this method is not recommended, because not all the effects are really fitting together, especially with default settings. Sometimes effects are capricious and need detailed settings.