constructor(canvas, div, screenshotDiv, controlsDiv, video, player) {
    /** @private {!HTMLCanvasElement} */
    this.canvas_ = canvas;

    /** @private {!HTMLElement} */
    this.div_ = div;

    this.active = false;

    /** @private {!HTMLElement} */
    this.screenshotDiv_ = screenshotDiv;

    /** @private {!HTMLVideoElement} */
    this.video_ = video;

    /** @private {!shaka.Player} */
    this.player_ = player;

    /** @private {boolean} */
    this.takeAutoScreenshots_ = false;

    /** @private {shaka.util.Timer} */
    this.timer_ = new shaka.util.Timer(() => {
      this.pruneUpdates_();
      this.updateCanvas_();
      this.takeAutomaticScreenshots_();
    });

    /** @private {number} */
    this.lastCurrentTime_ = 0;

    /** @private {number} */
    this.colorIOffset_ = 0;

    /** @private {boolean} */
    this.autoScreenshotTaken_ = false;

    /**
     * @private {!Array<{
     *   start: number,
     *   end: number,
     *   contentType: string,
     *   isMuxed: boolean,
     * }>}
     */
    this.updates_ = [];

    // Listen for when new buffers are appended.
    player.addEventListener('segmentappended', (event) => {
      const start = /** @type {number} */ (event['start']);
      const end = /** @type {number} */ (event['end']);
      const contentType = /** @type {string} */ (event['contentType']);
      const isMuxed = /** @type {boolean} */ (event['isMuxed']);
      this.updates_.push({start, end, contentType, isMuxed});
    });

    player.addEventListener('unloading', () => {
      this.updates_ = [];
    });

    // Add controls.
    const inputContainer = new shakaDemo.InputContainer(
        controlsDiv, null, shakaDemo.InputContainer.Style.VERTICAL, null);

    inputContainer.addRow(null, null);
    this.screenshotButton_ = document.createElement('button');
    inputContainer.latestElementContainer.appendChild(this.screenshotButton_);
    this.screenshotButton_.textContent = 'Take Screenshot';
    this.screenshotButton_.classList.add('mdl-button');
    this.screenshotButton_.classList.add('mdl-button--colored');
    this.screenshotButton_.classList.add('mdl-js-button');
    this.screenshotButton_.classList.add('mdl-js-ripple-effect');
    this.screenshotButton_.addEventListener('click', () => {
      this.takeScreenshot_();
    });

    inputContainer.addRow('Take Screenshot On Stall', null);
    /** @private {!shakaDemo.BoolInput} */
    this.autoScreenshotToggle_ = new shakaDemo.BoolInput(
        inputContainer, 'Take Screenshot On Stall',
        (input) => {
          this.takeAutoScreenshots_ = input.checked;
        });
  }
@param {!HTMLCanvasElement} canvas
@param {!HTMLElement} div
@param {!HTMLElement} screenshotDiv
@param {!HTMLElement} controlsDiv
@param {!HTMLVideoElement} video
@param {!shaka.Player} player