1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556 |
- let apiPromise: Promise<void>;
- export function loadYoutubeApi(): Promise<void> {
- if (apiPromise) {
- return apiPromise;
- }
- console.time('Loading YouTube API');
- apiPromise = new Promise((resolve, _) => {
- const tag = document.createElement('script');
- tag.src = 'https://www.youtube.com/iframe_api';
- window.onYouTubeIframeAPIReady = () => {
- console.timeEnd('Loading YouTube API');
- resolve();
- };
- document.body.appendChild(tag);
- });
- return apiPromise;
- }
- export async function createPlayer(element: HTMLElement): Promise<YT.Player> {
- await loadYoutubeApi();
- console.time('Loading YouTube player');
- return new Promise((resolve, reject) => {
- const player = new YT.Player(element, {
- height: '100%',
- width: '100%',
- events: {
- onReady: () => {
- console.timeEnd('Loading YouTube player');
- resolve(player);
- },
- onError: ({ data }) => {
- reject(data);
- },
- },
- playerVars: {
- disablekb: 1,
- rel: 0,
- iv_load_policy: 3,
- fs: 0,
- },
- });
- });
- }
- export function getVideoId(url: string): string | null {
- try {
- const parsed = new URL(url);
- if (!parsed.hostname.endsWith('youtube.com')) {
- return null;
- }
- return parsed.searchParams.get('v');
- } catch {
- return null;
- }
- }
|