Skip to content

Commit a973b58

Browse files
Nathan Tatejelbourn
authored andcommitted
feat(youtube-player): Add proxy methods for calling the underlying player (#16735)
1 parent 8093b81 commit a973b58

File tree

2 files changed

+229
-0
lines changed

2 files changed

+229
-0
lines changed

src/youtube-player/youtube-player.spec.ts

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,73 @@ describe('YoutubePlayer', () => {
154154
events.onApiChange({target: playerSpy});
155155
expect(testComponent.onApiChange).toHaveBeenCalledWith({target: playerSpy});
156156
});
157+
158+
it('proxies methods to the player', () => {
159+
events.onReady({target: playerSpy});
160+
161+
testComponent.youtubePlayer.playVideo();
162+
expect(playerSpy.playVideo).toHaveBeenCalled();
163+
164+
testComponent.youtubePlayer.pauseVideo();
165+
expect(playerSpy.pauseVideo).toHaveBeenCalled();
166+
167+
testComponent.youtubePlayer.stopVideo();
168+
expect(playerSpy.stopVideo).toHaveBeenCalled();
169+
170+
testComponent.youtubePlayer.mute();
171+
expect(playerSpy.mute).toHaveBeenCalled();
172+
173+
testComponent.youtubePlayer.unMute();
174+
expect(playerSpy.unMute).toHaveBeenCalled();
175+
176+
testComponent.youtubePlayer.isMuted();
177+
expect(playerSpy.isMuted).toHaveBeenCalled();
178+
179+
testComponent.youtubePlayer.seekTo(5, true);
180+
expect(playerSpy.seekTo).toHaveBeenCalledWith(5, true);
181+
182+
testComponent.youtubePlayer.isMuted();
183+
expect(playerSpy.isMuted).toHaveBeenCalled();
184+
185+
testComponent.youtubePlayer.setVolume(54);
186+
expect(playerSpy.setVolume).toHaveBeenCalledWith(54);
187+
188+
testComponent.youtubePlayer.getVolume();
189+
expect(playerSpy.getVolume).toHaveBeenCalled();
190+
191+
testComponent.youtubePlayer.setPlaybackRate(1.5);
192+
expect(playerSpy.setPlaybackRate).toHaveBeenCalledWith(1.5);
193+
194+
testComponent.youtubePlayer.getPlaybackRate();
195+
expect(playerSpy.getPlaybackRate).toHaveBeenCalled();
196+
197+
testComponent.youtubePlayer.getAvailablePlaybackRates();
198+
expect(playerSpy.getAvailablePlaybackRates).toHaveBeenCalled();
199+
200+
testComponent.youtubePlayer.getVideoLoadedFraction();
201+
expect(playerSpy.getVideoLoadedFraction).toHaveBeenCalled();
202+
203+
testComponent.youtubePlayer.getPlayerState();
204+
expect(playerSpy.getPlayerState).toHaveBeenCalled();
205+
206+
testComponent.youtubePlayer.getCurrentTime();
207+
expect(playerSpy.getCurrentTime).toHaveBeenCalled();
208+
209+
testComponent.youtubePlayer.getPlaybackQuality();
210+
expect(playerSpy.getPlaybackQuality).toHaveBeenCalled();
211+
212+
testComponent.youtubePlayer.getAvailableQualityLevels();
213+
expect(playerSpy.getAvailableQualityLevels).toHaveBeenCalled();
214+
215+
testComponent.youtubePlayer.getDuration();
216+
expect(playerSpy.getDuration).toHaveBeenCalled();
217+
218+
testComponent.youtubePlayer.getVideoUrl();
219+
expect(playerSpy.getVideoUrl).toHaveBeenCalled();
220+
221+
testComponent.youtubePlayer.getVideoEmbedCode();
222+
expect(playerSpy.getVideoEmbedCode).toHaveBeenCalled();
223+
});
157224
});
158225

159226
/** Test component that contains a YouTubePlayer. */

src/youtube-player/youtube-player.ts

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -171,6 +171,168 @@ export class YouTubePlayer implements AfterViewInit, OnDestroy {
171171
this._ngZone.run(() => callback(...args));
172172
};
173173
}
174+
175+
/** Proxied methods. */
176+
177+
/** See https://developers.google.com/youtube/iframe_api_reference#playVideo */
178+
playVideo() {
179+
if (!this._player) {
180+
return;
181+
}
182+
this._player.playVideo();
183+
}
184+
185+
/** See https://developers.google.com/youtube/iframe_api_reference#pauseVideo */
186+
pauseVideo() {
187+
if (!this._player) {
188+
return;
189+
}
190+
this._player.pauseVideo();
191+
}
192+
193+
/** See https://developers.google.com/youtube/iframe_api_reference#stopVideo */
194+
stopVideo() {
195+
if (!this._player) {
196+
return;
197+
}
198+
this._player.stopVideo();
199+
}
200+
201+
/** See https://developers.google.com/youtube/iframe_api_reference#seekTo */
202+
seekTo(seconds: number, allowSeekAhead: boolean) {
203+
if (!this._player) {
204+
return;
205+
}
206+
this._player.seekTo(seconds, allowSeekAhead);
207+
}
208+
209+
/** See https://developers.google.com/youtube/iframe_api_reference#mute */
210+
mute() {
211+
if (!this._player) {
212+
return;
213+
}
214+
this._player.mute();
215+
}
216+
217+
/** See https://developers.google.com/youtube/iframe_api_reference#unMute */
218+
unMute() {
219+
if (!this._player) {
220+
return;
221+
}
222+
this._player.unMute();
223+
}
224+
225+
/** See https://developers.google.com/youtube/iframe_api_reference#isMuted */
226+
isMuted(): boolean {
227+
if (!this._player) {
228+
return false;
229+
}
230+
return this._player.isMuted();
231+
}
232+
233+
/** See https://developers.google.com/youtube/iframe_api_reference#setVolume */
234+
setVolume(volume: number) {
235+
if (!this._player) {
236+
return;
237+
}
238+
this._player.setVolume(volume);
239+
}
240+
241+
/** See https://developers.google.com/youtube/iframe_api_reference#getVolume */
242+
getVolume(): number {
243+
if (!this._player) {
244+
return 0;
245+
}
246+
return this._player.getVolume();
247+
}
248+
249+
/** See https://developers.google.com/youtube/iframe_api_reference#setPlaybackRate */
250+
setPlaybackRate(playbackRate: number) {
251+
if (!this._player) {
252+
return;
253+
}
254+
return this._player.setPlaybackRate(playbackRate);
255+
}
256+
257+
/** See https://developers.google.com/youtube/iframe_api_reference#getPlaybackRate */
258+
getPlaybackRate(): number {
259+
if (!this._player) {
260+
return 0;
261+
}
262+
return this._player.getPlaybackRate();
263+
}
264+
265+
/** See https://developers.google.com/youtube/iframe_api_reference#getAvailablePlaybackRates */
266+
getAvailablePlaybackRates(): number[] {
267+
if (!this._player) {
268+
return [];
269+
}
270+
return this._player.getAvailablePlaybackRates();
271+
}
272+
273+
/** See https://developers.google.com/youtube/iframe_api_reference#getVideoLoadedFraction */
274+
getVideoLoadedFraction(): number {
275+
if (!this._player) {
276+
return 0;
277+
}
278+
return this._player.getVideoLoadedFraction();
279+
}
280+
281+
/** See https://developers.google.com/youtube/iframe_api_reference#getPlayerState */
282+
getPlayerState(): YT.PlayerState {
283+
if (!this._player) {
284+
return YT.PlayerState.UNSTARTED;
285+
}
286+
return this._player.getPlayerState();
287+
}
288+
289+
/** See https://developers.google.com/youtube/iframe_api_reference#getCurrentTime */
290+
getCurrentTime(): number {
291+
if (!this._player) {
292+
return 0;
293+
}
294+
return this._player.getCurrentTime();
295+
}
296+
297+
/** See https://developers.google.com/youtube/iframe_api_reference#getPlaybackQuality */
298+
getPlaybackQuality(): YT.SuggestedVideoQuality {
299+
if (!this._player) {
300+
return 'default';
301+
}
302+
return this._player.getPlaybackQuality();
303+
}
304+
305+
/** See https://developers.google.com/youtube/iframe_api_reference#getAvailableQualityLevels */
306+
getAvailableQualityLevels(): YT.SuggestedVideoQuality[] {
307+
if (!this._player) {
308+
return [];
309+
}
310+
return this._player.getAvailableQualityLevels();
311+
}
312+
313+
/** See https://developers.google.com/youtube/iframe_api_reference#getDuration */
314+
getDuration(): number {
315+
if (!this._player) {
316+
return 0;
317+
}
318+
return this._player.getDuration();
319+
}
320+
321+
/** See https://developers.google.com/youtube/iframe_api_reference#getVideoUrl */
322+
getVideoUrl(): string {
323+
if (!this._player) {
324+
return '';
325+
}
326+
return this._player.getVideoUrl();
327+
}
328+
329+
/** See https://developers.google.com/youtube/iframe_api_reference#getVideoEmbedCode */
330+
getVideoEmbedCode(): string {
331+
if (!this._player) {
332+
return '';
333+
}
334+
return this._player.getVideoEmbedCode();
335+
}
174336
}
175337

176338
/** Listens to changes to the given width and height and sets it on the player. */

0 commit comments

Comments
 (0)