Capture Video events

Engage let you track and capture data on how your visitors engage with your videos. The selectors defined should be as close to the actual video in the DOM as possible. But when iframes are used it should be no deeper than the iframe.

// Add this to capture video events on Vimeo.

//Example 1 
function zubi_vimeo_events(){
  const zl_vimeo_elements = document.querySelectorAll("video")
  zlt.track_video_vimeo("",['play','pause','seeked','seeking','ended','error','bufferstart','bufferend','loaded','qualitychange' , 'fullscreenchange'] , zl_vimeo_elements )
}

//Example 2 
function zubi_vimeo_events(){
  const zl_vimeo_elements = document.querySelectorAll("#video_1")
  zlt.track_video_vimeo("",['play','pause'], zl_vimeo_elements)
} 

//Example 3
function zubi_vimeo_events(){  
const zl_vimeo_elements = document.querySelectorAll(".video_1")
  zlt.track_video_vimeo("",['play','pause','ended'], zl_vimeo_elements)
} 

// Use multiple selectors
function zubi_vimeo_events(){
  const zl_vimeo_elements = document.querySelectorAll(".video, iframe, #video , video");
  zlt.track_video_vimeo("",['play','pause','seeked','seeking','ended','error','bufferstart','bufferend','loaded','qualitychange' , 'fullscreenchange'] , zl_vimeo_elements )
}

// Add this to capture Youtube video events
zlt.track_video_yt =  { id : "ID OF YOUTUBE IFRAME" }

Vimeo Supported Video Events

-Event name , -Maps to

1. play - "Video Played"

2. pause - "Video Paused"

3. seeked - "Video Seeked"

4. seeking - "Video Seeking"

5. ended - "Video Ended"

6. error - "Video Error"

7. bufferstart - "Video Buffer Start"

8. bufferend - "Video Buffer End"

9. loaded - "Video Loaded"

10. qualitychange - "Video Quality Change"

11. fullscreenchange - "Video Fullscreen Change"

Most of the events include the total duration - played duration - percentage of video watched with each event

duration: 61.857
percent: 0.485
seconds: 30

Video Error includes these values

message: "#984220 does not meet minimum contrast ratio. We recommend using brighter colors. (You could try #d35e30 instead.) See WCAG 2.0 guidelines: http://www.w3.org/TR/WCAG/#visual-audio-contrast"
method: "setColor"
name: "ContrastError"

YouTube Supported Video Events

1. "Video Played"

2. "Video Paused"

3. "Video Ended"

4. "Video Buffering"

5. "Video Cued"

6. "Video Quality Changed"

7. "Video Loaded"

Even though the attached events can be controlled on Vimeo , The way YT is currently working we attach all the possible related events

Events on YT Will send back current video duration only

Error codes :

• 2 – The request contains an invalid parameter value. For example, this error occurs if you specify a video ID that does not have 11 characters, or if the video ID contains invalid characters, such as exclamation points or asterisks.

• 5 – The requested content cannot be played in an HTML5 player or another error related to the HTML5 player has occurred.

• 100 – The video requested was not found. This error occurs when a video has been removed (for any reason) or has been marked as private.

• 101 – The owner of the requested video does not allow it to be played in embedded players.

• 150 – This error is the same as 101. It's just a 101 error in disguise!