onControlsKeyDown_(event) {
    const activeElement = document.activeElement;
    const isVolumeBar = activeElement && activeElement.classList ?
        activeElement.classList.contains('shaka-volume-bar') : false;
    const isSeekBar = activeElement && activeElement.classList &&
        activeElement.classList.contains('shaka-seek-bar');
    // Show the control panel if it is on focus or any button is pressed.
    if (this.controlsContainer_.contains(activeElement)) {
      this.onMouseMove_(event);
    }

    if (!this.config_.enableKeyboardPlaybackControls) {
      return;
    }

    const keyboardSeekDistance = this.config_.keyboardSeekDistance;
    const keyboardLargeSeekDistance = this.config_.keyboardLargeSeekDistance;

    switch (event.key) {
      case 'ArrowLeft':
        // If it's not focused on the volume bar, move the seek time backward
        // for a few sec. Otherwise, the volume will be adjusted automatically.
        if (this.seekBar_ && isSeekBar && !isVolumeBar &&
            keyboardSeekDistance > 0) {
          event.preventDefault();
          this.seek_(this.seekBar_.getValue() - keyboardSeekDistance);
        }
        break;
      case 'ArrowRight':
        // If it's not focused on the volume bar, move the seek time forward
        // for a few sec. Otherwise, the volume will be adjusted automatically.
        if (this.seekBar_ && isSeekBar && !isVolumeBar &&
            keyboardSeekDistance > 0) {
          event.preventDefault();
          this.seek_(this.seekBar_.getValue() + keyboardSeekDistance);
        }
        break;
      case 'PageDown':
        // PageDown is like ArrowLeft, but has a larger jump distance, and does
        // nothing to volume.
        if (this.seekBar_ && isSeekBar && keyboardSeekDistance > 0) {
          event.preventDefault();
          this.seek_(this.seekBar_.getValue() - keyboardLargeSeekDistance);
        }
        break;
      case 'PageUp':
        // PageDown is like ArrowRight, but has a larger jump distance, and does
        // nothing to volume.
        if (this.seekBar_ && isSeekBar && keyboardSeekDistance > 0) {
          event.preventDefault();
          this.seek_(this.seekBar_.getValue() + keyboardLargeSeekDistance);
        }
        break;
      // Jump to the beginning of the video's seek range.
      case 'Home':
        if (this.seekBar_) {
          this.seek_(this.player_.seekRange().start);
        }
        break;
      // Jump to the end of the video's seek range.
      case 'End':
        if (this.seekBar_) {
          this.seek_(this.player_.seekRange().end);
        }
        break;
      case 'f':
        if (this.isFullScreenSupported()) {
          this.toggleFullScreen();
        }
        break;
      case 'm':
        if (this.ad_ && this.ad_.isLinear()) {
          this.ad_.setMuted(!this.ad_.isMuted());
        } else {
          this.localVideo_.muted = !this.localVideo_.muted;
        }
        break;
      case 'p':
        if (this.isPiPAllowed()) {
          this.togglePiP();
        }
        break;
      // Pause or play by pressing space on the seek bar.
      case ' ':
        if (isSeekBar) {
          this.playPausePresentation();
        }
        break;
    }
  }
Support controls with keyboard inputs.
@param {!KeyboardEvent} event
@private