Event Generation

When viewers interact with the stream inside their web browsers, the developers can send events into the Genvid event system based on their interaction.

To send an event from the webpage, you need to use the IGenvidClient that was created with the genvidClient.createGenvidClient() function inside your webpage.

The Genvid event system receives event objects formatted into key:value pairs. You can send events via two methods:

1. sendEvent()

       // Method used when clicking on a color to change the color of a cube
       onColorChange(cube, color) {
           let evt = {
               key: ["changeColor", cube],
               value: color,
           };
           this.genvidClient.sendEvent([evt]);
       }
   

   In this example, a viewer reports a color change for a specific cube. In this case, we create a structure to contain the key and value.

   The key is an array that contains “changeColor” and the cube name.

   The value is the color that we want to apply to the cube.

2. sendEventObject()

       // Upon cheering a player
       onCheer(cubeName) {
           this.genvidClient.sendEventObject({
               cheer: cubeName,
           });
       }
   

   In this example, a viewer reports a cheer for a specific cube. In this case, we simply associate the key with the value.

   The key is “cheer”.

   The value is the cube name.