Groups provide a convenient way to group Incidents together and manage them altogether. Just like the Clip, the Group also provides a timeline where Incidents can be positioned. Unlike Clips, Groups do not own context, they are just used to group Incidents together.
Let’s create a Group and put it on our Clip’s timeline:
// that's how we create a new Group
const myGroup = new MotorCortex.Group();
// we can add as many Incidents as we want anywhere on our Group's timeline
// On the same manner we can add our Group on any other Group's or Clip's timeline
The Group accepts the following keys on its props:
|selector||string||an optional selector string that will be used & applied to all of the child Incidents of the Group as the parent selector of them (we’ll see that in action later)|
|name||string||(optional) A name for your Group|
|id (just for development purposes)||string||(bad practice for production, use just for debugging purposes). The id of the Group|
The Group exposes a number of methods which allows Incidents' management. The most important are:
- addIncident, which takes two arguments the Incident to add and the millisecond to position it on the Group's timeline
- moveIncident which takes two arguments, the Incident to move and the new millisecond to position it
- removeIncident which takes just one argument, the Incident to remove from the Group's timeline
Notice that all three of the mentioned methods might return false, providing back a list of potential errors.
Also, notice that any Clip is a Group itself so all of the provided by Group methods are also available on Clips.