diff --git a/src/components/search/search.tsx b/src/components/search/search.tsx index d470755..ebf5249 100644 --- a/src/components/search/search.tsx +++ b/src/components/search/search.tsx @@ -41,7 +41,7 @@ export interface SearchProps { prevMatchLabel?: string; searchResultsLabel?: string; eventManager?: any - focusPluginButton: () => void; + focusPluginButton: (event: KeyboardEvent) => void; player?: any; } @@ -52,15 +52,19 @@ class SearchComponent extends Component { constructor(props: SearchProps) { super(props); - this.props.eventManager?.listen(this.props.player, this.props.player.Event.FIRST_PLAY, () => { + if (this.props.player._firstPlay){ + this.props.eventManager?.listen(this.props.player, this.props.player.Event.FIRST_PLAY, () => { + this.props.eventManager?.listen(document, 'keydown', this.handleKeydownEvent); + }) + } else { this.props.eventManager?.listen(document, 'keydown', this.handleKeydownEvent); - }) + } } private handleKeydownEvent = (event: KeyboardEvent) => { if (event.keyCode === TAB && event.shiftKey && document.activeElement === this._inputField?.base?.childNodes[0]){ - event.preventDefault(); - this.props.focusPluginButton(); + //@ts-ignore + this.props.focusPluginButton(event); } }; diff --git a/src/components/transcript/transcript.tsx b/src/components/transcript/transcript.tsx index f847b10..002df34 100644 --- a/src/components/transcript/transcript.tsx +++ b/src/components/transcript/transcript.tsx @@ -70,7 +70,7 @@ export interface TranscriptProps { isMobile?: boolean; playerWidth?: number; onJumpToSearchMatch: () => void; - focusPluginButton: () => void; + focusPluginButton: (event: KeyboardEvent) => void; textTracks: Array; changeLanguage: (textTrack: core.TextTrack) => void; } diff --git a/src/transcript-plugin.tsx b/src/transcript-plugin.tsx index e0b9ab4..21a1c1f 100644 --- a/src/transcript-plugin.tsx +++ b/src/transcript-plugin.tsx @@ -346,7 +346,7 @@ export class TranscriptPlugin extends KalturaPlayer.core.BasePlugin { }} onJumpToSearchMatch={this._toSearchMatch} //@ts-ignore - focusPluginButton={() => this.upperBarManager!.focusPluginButton(this._transcriptIcon)} + focusPluginButton={(event: KeyboardEvent) => this.upperBarManager!.focusPluginButton(this._transcriptIcon, event)} textTracks={this._getTextTracks()} changeLanguage={this._changeLanguage} />