Group
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.
Example
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
myGroup.addIncident(incident1, 0);
myGroup.addIncident(incident2, 1000);
// On the same manner we can add our Group on any other Group's or Clip's timeline
myClip.addIncident(myGroup, 1000);
API
Constructor
The Group accepts the following keys on its props:
Key | Type | Comments |
---|---|---|
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 |
Methods
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.