Skip to content

Commit d0e12e7

Browse files
author
Nathan Tate
committed
feat(youtube-player): Add proxy methods for calling the underlying player
1 parent 1de1b98 commit d0e12e7

File tree

2 files changed

+230
-1
lines changed

2 files changed

+230
-1
lines changed

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

Lines changed: 68 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,73 @@ describe('YoutubePlayer', () => {
107107
events.onApiChange({target: playerSpy});
108108
expect(testComponent.onApiChange).toHaveBeenCalledWith({target: playerSpy});
109109
});
110+
111+
it('proxies methods to the player', () => {
112+
onPlayerReady();
113+
114+
testComponent.youtubePlayer.playVideo();
115+
expect(playerSpy.playVideo).toHaveBeenCalled();
116+
117+
testComponent.youtubePlayer.pauseVideo();
118+
expect(playerSpy.pauseVideo).toHaveBeenCalled();
119+
120+
testComponent.youtubePlayer.stopVideo();
121+
expect(playerSpy.stopVideo).toHaveBeenCalled();
122+
123+
testComponent.youtubePlayer.mute();
124+
expect(playerSpy.mute).toHaveBeenCalled();
125+
126+
testComponent.youtubePlayer.unMute();
127+
expect(playerSpy.unMute).toHaveBeenCalled();
128+
129+
testComponent.youtubePlayer.isMuted();
130+
expect(playerSpy.isMuted).toHaveBeenCalled();
131+
132+
testComponent.youtubePlayer.seekTo(5, true);
133+
expect(playerSpy.seekTo).toHaveBeenCalledWith(5, true);
134+
135+
testComponent.youtubePlayer.isMuted();
136+
expect(playerSpy.isMuted).toHaveBeenCalled();
137+
138+
testComponent.youtubePlayer.setVolume(54);
139+
expect(playerSpy.setVolume).toHaveBeenCalledWith(54);
140+
141+
testComponent.youtubePlayer.getVolume();
142+
expect(playerSpy.getVolume).toHaveBeenCalled();
143+
144+
testComponent.youtubePlayer.setPlaybackRate(1.5);
145+
expect(playerSpy.setPlaybackRate).toHaveBeenCalledWith(1.5);
146+
147+
testComponent.youtubePlayer.getPlaybackRate();
148+
expect(playerSpy.getPlaybackRate).toHaveBeenCalled();
149+
150+
testComponent.youtubePlayer.getAvailablePlaybackRates();
151+
expect(playerSpy.getAvailablePlaybackRates).toHaveBeenCalled();
152+
153+
testComponent.youtubePlayer.getVideoLoadedFraction();
154+
expect(playerSpy.getVideoLoadedFraction).toHaveBeenCalled();
155+
156+
testComponent.youtubePlayer.getPlayerState();
157+
expect(playerSpy.getPlayerState).toHaveBeenCalled();
158+
159+
testComponent.youtubePlayer.getCurrentTime();
160+
expect(playerSpy.getCurrentTime).toHaveBeenCalled();
161+
162+
testComponent.youtubePlayer.getPlaybackQuality();
163+
expect(playerSpy.getPlaybackQuality).toHaveBeenCalled();
164+
165+
testComponent.youtubePlayer.getAvailableQualityLevels();
166+
expect(playerSpy.getAvailableQualityLevels).toHaveBeenCalled();
167+
168+
testComponent.youtubePlayer.getDuration();
169+
expect(playerSpy.getDuration).toHaveBeenCalled();
170+
171+
testComponent.youtubePlayer.getVideoUrl();
172+
expect(playerSpy.getVideoUrl).toHaveBeenCalled();
173+
174+
testComponent.youtubePlayer.getVideoEmbedCode();
175+
expect(playerSpy.getVideoEmbedCode).toHaveBeenCalled();
176+
});
110177
});
111178

112179
/** Test component that contains a YouTubePlayer. */
@@ -132,5 +199,5 @@ class TestApp {
132199
onPlaybackRateChange = jasmine.createSpy('onPlaybackRateChange');
133200
onError = jasmine.createSpy('onError');
134201
onApiChange = jasmine.createSpy('onApiChange');
135-
@ViewChild('player', {static: true}) youtubePlayer: YouTubePlayer;
202+
@ViewChild('player', {static: false}) youtubePlayer: YouTubePlayer;
136203
}

src/youtube-player/youtube-player.ts

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -144,6 +144,168 @@ export class YouTubePlayer implements AfterViewInit, OnDestroy {
144144
this._ngZone.run(() => callback(...args));
145145
};
146146
}
147+
148+
/** Proxied methods. */
149+
150+
/** See https://developers.google.com/youtube/iframe_api_reference#playVideo */
151+
playVideo() {
152+
if (!this._player) {
153+
return;
154+
}
155+
this._player.playVideo();
156+
}
157+
158+
/** See https://developers.google.com/youtube/iframe_api_reference#pauseVideo */
159+
pauseVideo() {
160+
if (!this._player) {
161+
return;
162+
}
163+
this._player.pauseVideo();
164+
}
165+
166+
/** See https://developers.google.com/youtube/iframe_api_reference#stopVideo */
167+
stopVideo() {
168+
if (!this._player) {
169+
return;
170+
}
171+
this._player.stopVideo();
172+
}
173+
174+
/** See https://developers.google.com/youtube/iframe_api_reference#seekTo */
175+
seekTo(seconds: number, allowSeekAhead: boolean) {
176+
if (!this._player) {
177+
return;
178+
}
179+
this._player.seekTo(seconds, allowSeekAhead);
180+
}
181+
182+
/** See https://developers.google.com/youtube/iframe_api_reference#mute */
183+
mute() {
184+
if (!this._player) {
185+
return;
186+
}
187+
this._player.mute();
188+
}
189+
190+
/** See https://developers.google.com/youtube/iframe_api_reference#unMute */
191+
unMute() {
192+
if (!this._player) {
193+
return;
194+
}
195+
this._player.unMute();
196+
}
197+
198+
/** See https://developers.google.com/youtube/iframe_api_reference#isMuted */
199+
isMuted(): boolean {
200+
if (!this._player) {
201+
return false;
202+
}
203+
return this._player.isMuted();
204+
}
205+
206+
/** See https://developers.google.com/youtube/iframe_api_reference#setVolume */
207+
setVolume(volume: number) {
208+
if (!this._player) {
209+
return;
210+
}
211+
this._player.setVolume(volume);
212+
}
213+
214+
/** See https://developers.google.com/youtube/iframe_api_reference#getVolume */
215+
getVolume(): number {
216+
if (!this._player) {
217+
return 0;
218+
}
219+
return this._player.getVolume();
220+
}
221+
222+
/** See https://developers.google.com/youtube/iframe_api_reference#setPlaybackRate */
223+
setPlaybackRate(playbackRate: number) {
224+
if (!this._player) {
225+
return;
226+
}
227+
return this._player.setPlaybackRate(playbackRate);
228+
}
229+
230+
/** See https://developers.google.com/youtube/iframe_api_reference#getPlaybackRate */
231+
getPlaybackRate(): number {
232+
if (!this._player) {
233+
return 0;
234+
}
235+
return this._player.getPlaybackRate();
236+
}
237+
238+
/** See https://developers.google.com/youtube/iframe_api_reference#getAvailablePlaybackRates */
239+
getAvailablePlaybackRates(): number[] {
240+
if (!this._player) {
241+
return [];
242+
}
243+
return this._player.getAvailablePlaybackRates();
244+
}
245+
246+
/** See https://developers.google.com/youtube/iframe_api_reference#getVideoLoadedFraction */
247+
getVideoLoadedFraction(): number {
248+
if (!this._player) {
249+
return 0;
250+
}
251+
return this._player.getVideoLoadedFraction();
252+
}
253+
254+
/** See https://developers.google.com/youtube/iframe_api_reference#getPlayerState */
255+
getPlayerState(): YT.PlayerState {
256+
if (!this._player) {
257+
return YT.PlayerState.UNSTARTED;
258+
}
259+
return this._player.getPlayerState();
260+
}
261+
262+
/** See https://developers.google.com/youtube/iframe_api_reference#getCurrentTime */
263+
getCurrentTime(): number {
264+
if (!this._player) {
265+
return 0;
266+
}
267+
return this._player.getCurrentTime();
268+
}
269+
270+
/** See https://developers.google.com/youtube/iframe_api_reference#getPlaybackQuality */
271+
getPlaybackQuality(): YT.SuggestedVideoQuality {
272+
if (!this._player) {
273+
return 'default';
274+
}
275+
return this._player.getPlaybackQuality();
276+
}
277+
278+
/** See https://developers.google.com/youtube/iframe_api_reference#getAvailableQualityLevels */
279+
getAvailableQualityLevels(): YT.SuggestedVideoQuality[] {
280+
if (!this._player) {
281+
return [];
282+
}
283+
return this._player.getAvailableQualityLevels();
284+
}
285+
286+
/** See https://developers.google.com/youtube/iframe_api_reference#getDuration */
287+
getDuration(): number {
288+
if (!this._player) {
289+
return 0;
290+
}
291+
return this._player.getDuration();
292+
}
293+
294+
/** See https://developers.google.com/youtube/iframe_api_reference#getVideoUrl */
295+
getVideoUrl(): string {
296+
if (!this._player) {
297+
return '';
298+
}
299+
return this._player.getVideoUrl();
300+
}
301+
302+
/** See https://developers.google.com/youtube/iframe_api_reference#getVideoEmbedCode */
303+
getVideoEmbedCode(): string {
304+
if (!this._player) {
305+
return '';
306+
}
307+
return this._player.getVideoEmbedCode();
308+
}
147309
}
148310

149311
/**

0 commit comments

Comments
 (0)