mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2026-08-12 04:50:18 +00:00
Merge pull request #33092 from jurca/master
[youtube-player] Add definitions for youtube-player
This commit is contained in:
Mine Starks
+31
@@ -0,0 +1,31 @@
|
||||
import PlayerStates from './constants/PlayerStates';
|
||||
|
||||
declare const FUNCTION_STATE_MAP: {
|
||||
pauseVideo: {
|
||||
acceptableStates: [
|
||||
PlayerStates.ENDED,
|
||||
PlayerStates.PAUSED
|
||||
],
|
||||
stateChangeRequired: false,
|
||||
},
|
||||
playVideo: {
|
||||
acceptableStates: [
|
||||
PlayerStates.ENDED,
|
||||
PlayerStates.PLAYING
|
||||
],
|
||||
stateChangeRequired: false,
|
||||
},
|
||||
seekTo: {
|
||||
acceptableStates: [
|
||||
PlayerStates.ENDED,
|
||||
PlayerStates.PLAYING,
|
||||
PlayerStates.PAUSED
|
||||
],
|
||||
stateChangeRequired: true,
|
||||
|
||||
// TRICKY: `seekTo` may not cause a state change if no buffering is required.
|
||||
timeout: 3000,
|
||||
},
|
||||
};
|
||||
|
||||
export default FUNCTION_STATE_MAP;
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
import { EmitterType, YouTubePlayer } from './types';
|
||||
|
||||
export interface EventHandlerMapType {
|
||||
[key: string]: (event: object) => void;
|
||||
}
|
||||
|
||||
declare const YouTubePlayerHelpers: {
|
||||
proxyEvents(emitter: EmitterType): EventHandlerMapType,
|
||||
promisifyPlayer(playerAPIReady: Promise<YouTubePlayer>, strictState?: boolean): YouTubePlayer,
|
||||
};
|
||||
|
||||
export default YouTubePlayerHelpers;
|
||||
@@ -0,0 +1,10 @@
|
||||
declare enum PlayerStates {
|
||||
BUFFERING = 3,
|
||||
ENDED = 0,
|
||||
PAUSED = 2,
|
||||
PLAYING = 1,
|
||||
UNSTARTED = -1,
|
||||
VIDEO_CUED = 5,
|
||||
}
|
||||
|
||||
export default PlayerStates;
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
declare const EVENT_NAMES: [
|
||||
'ready',
|
||||
'stateChange',
|
||||
'playbackQualityChange',
|
||||
'playbackRateChange',
|
||||
'error',
|
||||
'apiChange',
|
||||
'volumeChange'
|
||||
];
|
||||
|
||||
export default EVENT_NAMES;
|
||||
|
||||
export type EventType =
|
||||
'ready' |
|
||||
'stateChange' |
|
||||
'playbackQualityChange' |
|
||||
'playbackRateChange' |
|
||||
'error' |
|
||||
'apiChange' |
|
||||
'volumeChange';
|
||||
+46
@@ -0,0 +1,46 @@
|
||||
declare const FUNCTION_NAMES: [
|
||||
'cueVideoById',
|
||||
'loadVideoById',
|
||||
'cueVideoByUrl',
|
||||
'loadVideoByUrl',
|
||||
'playVideo',
|
||||
'pauseVideo',
|
||||
'stopVideo',
|
||||
'getVideoLoadedFraction',
|
||||
'cuePlaylist',
|
||||
'loadPlaylist',
|
||||
'nextVideo',
|
||||
'previousVideo',
|
||||
'playVideoAt',
|
||||
'setShuffle',
|
||||
'setLoop',
|
||||
'getPlaylist',
|
||||
'getPlaylistIndex',
|
||||
'setOption',
|
||||
'mute',
|
||||
'unMute',
|
||||
'isMuted',
|
||||
'setVolume',
|
||||
'getVolume',
|
||||
'seekTo',
|
||||
'getPlayerState',
|
||||
'getPlaybackRate',
|
||||
'setPlaybackRate',
|
||||
'getAvailablePlaybackRates',
|
||||
'getPlaybackQuality',
|
||||
'setPlaybackQuality',
|
||||
'getAvailableQualityLevels',
|
||||
'getCurrentTime',
|
||||
'getDuration',
|
||||
'removeEventListener',
|
||||
'getVideoUrl',
|
||||
'getVideoEmbedCode',
|
||||
'getOptions',
|
||||
'getOption',
|
||||
'addEventListener',
|
||||
'destroy',
|
||||
'setSize',
|
||||
'getIframe'
|
||||
];
|
||||
|
||||
export default FUNCTION_NAMES;
|
||||
Vendored
+9
@@ -0,0 +1,9 @@
|
||||
import { Options, YouTubePlayer } from './types';
|
||||
|
||||
declare function PlayerFactory(
|
||||
maybeElementId: YouTubePlayer | HTMLElement | string,
|
||||
options?: Options,
|
||||
strictState?: boolean,
|
||||
): YouTubePlayer;
|
||||
|
||||
export default PlayerFactory;
|
||||
@@ -0,0 +1,4 @@
|
||||
import { EmitterType, IframeApiType } from './types';
|
||||
|
||||
declare function Loader(emitter: EmitterType): Promise<IframeApiType>;
|
||||
export default Loader;
|
||||
Vendored
+142
@@ -0,0 +1,142 @@
|
||||
import PlayerState from './constants/PlayerStates';
|
||||
import { EventType } from './eventNames';
|
||||
|
||||
export interface EmitterType {
|
||||
trigger: (eventName: string, event: object) => void;
|
||||
}
|
||||
|
||||
export interface Options {
|
||||
width?: number;
|
||||
height?: number;
|
||||
videoId?: string;
|
||||
playerVars?: {
|
||||
autoplay?: 0 | 1,
|
||||
cc_lang_pref?: string,
|
||||
cc_load_policy?: 1,
|
||||
color?: 'red' | 'white',
|
||||
controls?: 0 | 1,
|
||||
disablekb?: 0 | 1,
|
||||
enablejsapi?: 0 | 1,
|
||||
end?: number,
|
||||
fs?: 0 | 1,
|
||||
hl?: string,
|
||||
iv_load_policy?: 1 | 3,
|
||||
list?: string,
|
||||
listType?: 'playlist' | 'search' | 'user_uploads',
|
||||
loop?: 0 | 1,
|
||||
modestbranding?: 1,
|
||||
origin?: string,
|
||||
playlist: string,
|
||||
playsinline?: 0 | 1,
|
||||
rel?: 0 | 1,
|
||||
start?: number,
|
||||
widget_referrer?: string,
|
||||
};
|
||||
events?: {
|
||||
[eventType in EventType]: (event: CustomEvent) => void
|
||||
};
|
||||
}
|
||||
|
||||
export interface IframeApiType {
|
||||
Player: {new(elementId: string, options: Options): YouTubePlayer};
|
||||
}
|
||||
|
||||
/**
|
||||
* @see https://developers.google.com/youtube/iframe_api_reference
|
||||
*/
|
||||
export interface YouTubePlayer {
|
||||
addEventListener(event: string, listener: (event: CustomEvent) => void): void;
|
||||
destroy(): void;
|
||||
getAvailablePlaybackRates(): ReadonlyArray<number>;
|
||||
getAvailableQualityLevels(): ReadonlyArray<string>;
|
||||
getCurrentTime(): number;
|
||||
getDuration(): number;
|
||||
getIframe(): HTMLIFrameElement;
|
||||
getOption(module: string, option: string): any;
|
||||
getOptions(): string[];
|
||||
getOptions(module: string): object;
|
||||
setOption(module: string, option: string, value: any): void;
|
||||
setOptions(): void;
|
||||
cuePlaylist(
|
||||
playlist: string | ReadonlyArray<string>,
|
||||
index?: number,
|
||||
startSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
): void;
|
||||
cuePlaylist(playlist: {
|
||||
listType: string,
|
||||
list?: string,
|
||||
index?: number,
|
||||
startSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
}): void;
|
||||
loadPlaylist(
|
||||
playlist: string | ReadonlyArray<string>,
|
||||
index?: number,
|
||||
startSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
): void;
|
||||
loadPlaylist(playlist: {
|
||||
listType: string,
|
||||
list?: string,
|
||||
index?: number,
|
||||
startSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
}): void;
|
||||
getPlaylist(): ReadonlyArray<string>;
|
||||
getPlaylistIndex(): number;
|
||||
getPlaybackQuality(): string;
|
||||
getPlaybackRate(): number;
|
||||
getPlayerState(): PlayerState;
|
||||
getVideoEmbedCode(): string;
|
||||
getVideoLoadedFraction(): number;
|
||||
getVideoUrl(): string;
|
||||
getVolume(): number;
|
||||
cueVideoById(videoId: string, startSeconds?: number, suggestedQuality?: string): void;
|
||||
cueVideoById(video: {
|
||||
videoId: string,
|
||||
startSeconds?: number,
|
||||
endSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
}): void;
|
||||
cueVideoByUrl(mediaContentUrl: string, startSeconds?: number, suggestedQuality?: string): void;
|
||||
cueVideoByUrl(video: {
|
||||
mediaContentUrl: string,
|
||||
startSeconds?: number,
|
||||
endSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
}): void;
|
||||
loadVideoByUrl(mediaContentUrl: string, startSeconds?: number, suggestedQuality?: string): void;
|
||||
loadVideoByUrl(video: {
|
||||
mediaContentUrl: string,
|
||||
startSeconds?: number,
|
||||
endSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
}): void;
|
||||
loadVideoById(videoId: string, startSeconds?: number, suggestedQuality?: string): void;
|
||||
loadVideoById(video: {
|
||||
videoId: string,
|
||||
startSeconds?: number,
|
||||
endSeconds?: number,
|
||||
suggestedQuality?: string,
|
||||
}): void;
|
||||
isMuted(): boolean;
|
||||
mute(): void;
|
||||
nextVideo(): void;
|
||||
pauseVideo(): void;
|
||||
playVideo(): void;
|
||||
playVideoAt(index: number): void;
|
||||
previousVideo(): void;
|
||||
removeEventListener(event: string, listener: (event: CustomEvent) => void): void;
|
||||
seekTo(seconds: number, allowSeekAhead: boolean): void;
|
||||
setLoop(loopPlaylists: boolean): void;
|
||||
setPlaybackQuality(suggestedQuality: string): void;
|
||||
setPlaybackRate(suggestedRate: number): void;
|
||||
setShuffle(shufflePlaylist: boolean): void;
|
||||
setSize(width: number, height: number): object;
|
||||
setVolume(volume: number): void;
|
||||
stopVideo(): void;
|
||||
unMute(): void;
|
||||
on(eventType: 'stateChange', listener: (event: CustomEvent & {data: number}) => void): void;
|
||||
on(eventType: EventType, listener: (event: CustomEvent) => void): void;
|
||||
}
|
||||
Vendored
+9
@@ -0,0 +1,9 @@
|
||||
// Type definitions for youtube-player 5.5
|
||||
// Project: https://github.com/gajus/youtube-player#readme
|
||||
// Definitions by: Martin Jurča <https://github.com/jurca>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
// TypeScript Version: 2.7
|
||||
|
||||
import PlayerFactory from './dist/index';
|
||||
|
||||
export default PlayerFactory;
|
||||
@@ -0,0 +1,32 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"module": "commonjs",
|
||||
"lib": [
|
||||
"es6",
|
||||
"dom"
|
||||
],
|
||||
"noImplicitAny": true,
|
||||
"noImplicitThis": true,
|
||||
"strictNullChecks": true,
|
||||
"strictFunctionTypes": true,
|
||||
"baseUrl": "../",
|
||||
"typeRoots": [
|
||||
"../"
|
||||
],
|
||||
"types": [],
|
||||
"noEmit": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
},
|
||||
"files": [
|
||||
"index.d.ts",
|
||||
"dist/constants/PlayerStates.d.ts",
|
||||
"dist/eventNames.d.ts",
|
||||
"dist/functionNames.d.ts",
|
||||
"dist/FunctionStateMap.d.ts",
|
||||
"dist/index.d.ts",
|
||||
"dist/loadYouTubeIframeApi.d.ts",
|
||||
"dist/types.d.ts",
|
||||
"dist/YouTubePlayer.d.ts",
|
||||
"youtube-player-tests.ts"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
{ "extends": "dtslint/dt.json" }
|
||||
@@ -0,0 +1,81 @@
|
||||
import youTubePlayerFactory from 'youtube-player';
|
||||
import PlayerStates from 'youtube-player/dist/constants/PlayerStates';
|
||||
import { YouTubePlayer } from 'youtube-player/dist/types';
|
||||
|
||||
youTubePlayerFactory('foo');
|
||||
const player: YouTubePlayer = youTubePlayerFactory(
|
||||
document.getElementById('bar')!,
|
||||
{
|
||||
width: 640,
|
||||
height: 300,
|
||||
videoId: 'aaaaaaaaaa',
|
||||
playerVars: {
|
||||
autoplay: 1,
|
||||
cc_lang_pref: 'en_US',
|
||||
cc_load_policy: 1,
|
||||
color: 'white',
|
||||
controls: 1,
|
||||
disablekb: 0,
|
||||
enablejsapi: 1,
|
||||
end: 60,
|
||||
fs: 0,
|
||||
hl: 'fooBar',
|
||||
iv_load_policy: 3,
|
||||
list: 'bbbbbbbbbb',
|
||||
listType: 'search',
|
||||
loop: 0,
|
||||
modestbranding: 1,
|
||||
origin: 'https://definitelytyped.org/',
|
||||
playlist: 'cccccccccc',
|
||||
playsinline: 0,
|
||||
rel: 1,
|
||||
start: 3,
|
||||
widget_referrer: 'nothing',
|
||||
},
|
||||
events: {
|
||||
ready: (event: CustomEvent): void => {},
|
||||
stateChange: (event: CustomEvent): void => {
|
||||
console.log(player.getPlayerState() === PlayerStates.PLAYING);
|
||||
},
|
||||
playbackQualityChange: (event: CustomEvent): void => {},
|
||||
playbackRateChange: (event: CustomEvent): void => {},
|
||||
error: (event: CustomEvent): void => {},
|
||||
apiChange: (event: CustomEvent): void => {},
|
||||
volumeChange: (event: CustomEvent): void => {},
|
||||
},
|
||||
},
|
||||
true,
|
||||
);
|
||||
|
||||
player.cueVideoById('xyzabc123');
|
||||
player.loadVideoById('doesNotExist');
|
||||
player.playVideo();
|
||||
player.pauseVideo();
|
||||
player.setSize(320, 200);
|
||||
if (player.isMuted()) {
|
||||
player.unMute();
|
||||
} else {
|
||||
player.mute();
|
||||
}
|
||||
player.setVolume(player.getVolume() / 2);
|
||||
|
||||
player.on('stateChange', (event: CustomEvent<void> & {data: number}) => {
|
||||
switch (event.data) {
|
||||
case PlayerStates.PLAYING:
|
||||
console.log('playing');
|
||||
break;
|
||||
case PlayerStates.PAUSED:
|
||||
console.log('paused');
|
||||
break;
|
||||
case PlayerStates.ENDED:
|
||||
console.log('ended');
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
});
|
||||
player.on('error', (event: CustomEvent<number>) => {
|
||||
console.error('player error', event.detail);
|
||||
});
|
||||
|
||||
player.destroy();
|
||||
Reference in New Issue
Block a user