Skip to content
This repository has been archived by the owner on Apr 19, 2024. It is now read-only.

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
fikryfahrezy committed Oct 15, 2023
1 parent e4c5c57 commit 6972172
Show file tree
Hide file tree
Showing 55 changed files with 2,291 additions and 1,711 deletions.
175 changes: 96 additions & 79 deletions src/lib/PlayerMedia.svelte
Original file line number Diff line number Diff line change
@@ -1,16 +1,19 @@
<script lang="ts">
import type { SeekToType, PlayerDispatcher, PlayerMediaRef } from './types';
import type { SeekToType } from './types';
import type {
OnProgressProps,
InternalPlayerKey,
OnErrorProps,
FilePlayerUrl,
Player
PlayerUrl,
Player,
PlayerRef,
PlayerDispatcher,
PlayerConfigObject,
PlayerGetPlayerKey
} from './players/types';
import { onMount, createEventDispatcher } from 'svelte';
import { isMediaStream } from './players/utils';
export let url: FilePlayerUrl;
export let url: PlayerUrl;
export let playing: boolean;
export let loop: boolean;
export let controls: boolean;
Expand All @@ -23,7 +26,7 @@
export let playsinline: boolean;
export let pip: boolean;
export let stopOnUnmount: boolean;
export let config: any; // Expect this type is `PlayerConfig` but, can't figure it out how
export let config: PlayerConfigObject;
export let progressFrequency: number | undefined = undefined;
export let disableDeferredLoading: boolean | undefined = undefined;
Expand All @@ -32,30 +35,30 @@
export let display: string | undefined = undefined;
export let activePlayer: Player['loadComponent'];
const SEEK_ON_PLAY_EXPIRY = 5000;
const dispatch = createEventDispatcher<PlayerDispatcher>();
let mounted = false;
let isReady = false;
let isPlaying = false; // Track playing state internally to prevent bugs
let isLoading = true; // Use isLoading to prevent onPause when switching URL
let loadOnReady: FilePlayerUrl | null = null;
let loadOnReady: PlayerUrl | null = null;
let seekOnPlay: number | null = null;
let progressTimeout: number | undefined = undefined;
let durationCheckTimeout: number | undefined = undefined;
let prevPlayed: number | undefined = undefined;
let prevLoaded: number | undefined = undefined;
let onDurationCalled: boolean | undefined = undefined;
let startOnPlay: boolean | undefined = undefined;
let player: PlayerMediaRef | undefined;
const SEEK_ON_PLAY_EXPIRY = 5000;
const dispatch = createEventDispatcher<PlayerDispatcher>();
let player: PlayerRef;
onMount(function () {
mounted = true;
return function () {
clearTimeout(progressTimeout);
clearTimeout(durationCheckTimeout);
if (player !== undefined && isReady && stopOnUnmount) {
if (isReady && stopOnUnmount) {
player.stop();
if (player.disablePIP) {
Expand All @@ -68,135 +71,150 @@
});
function handlePropsUrlChange(propsUrl: typeof url) {
if (player !== undefined && isReady) {
if (isLoading && !forceLoad && !disableDeferredLoading && !isMediaStream(propsUrl)) {
console.warn(
`SveltePlayer: the attempt to load ${propsUrl} is being deferred until the player has loaded`
);
loadOnReady = propsUrl;
return;
}
isLoading = true;
startOnPlay = true;
onDurationCalled = false;
player.load(propsUrl, isReady);
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (isLoading && !forceLoad && !disableDeferredLoading && !isMediaStream(propsUrl)) {
console.warn(
`SveltePlayer: the attempt to load ${propsUrl} is being deferred until the player has loaded`
);
loadOnReady = propsUrl;
return;
}
isLoading = true;
startOnPlay = true;
onDurationCalled = false;
player.load(propsUrl, isReady);
}
$: handlePropsUrlChange(url);
function handlePropsPlayingChange(propsPlaying: typeof playing) {
if (player !== undefined && isReady) {
if (propsPlaying && !isPlaying) {
player.play();
}
if (!propsPlaying && isPlaying) {
player.pause();
}
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (propsPlaying && !isPlaying) {
player.play();
}
if (!propsPlaying && isPlaying) {
player.pause();
}
}
$: handlePropsPlayingChange(playing);
function handlePropsPipChange(propsPip: typeof pip) {
if (player !== undefined && isReady) {
if (propsPip && player.enablePIP) {
player.enablePIP();
}
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (!propsPip && player.disablePIP) {
player.disablePIP();
}
if (propsPip && player.enablePIP) {
player.enablePIP();
}
if (!propsPip && player.disablePIP) {
player.disablePIP();
}
}
$: handlePropsPipChange(pip);
function handlePropsVolumeChange(propsVolume: typeof volume) {
if (player !== undefined && isReady && propsVolume !== null) {
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (propsVolume !== null) {
player.setVolume(propsVolume);
}
}
$: handlePropsVolumeChange(volume);
function handlePropsMutedChange(propsMuted: typeof muted) {
if (player !== undefined && isReady) {
if (propsMuted) {
player.mute();
} else {
player.unmute();
if (volume !== null) {
// Set volume next tick to fix a bug with DailyMotion
setTimeout(function () {
if (player !== undefined && volume !== null) {
player.setVolume(volume);
}
});
}
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (propsMuted) {
player.mute();
} else {
player.unmute();
if (volume !== null) {
// Set volume next tick to fix a bug with DailyMotion
setTimeout(function () {
player.setVolume(Number(volume));
});
}
}
}
$: handlePropsMutedChange(muted);
function handlePropsPlaybackRateChange(propsPlaybackRate: typeof playbackRate) {
if (player !== undefined && isReady && player.setPlaybackRate) {
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (player.setPlaybackRate) {
player.setPlaybackRate(propsPlaybackRate);
}
}
$: handlePropsPlaybackRateChange(playbackRate);
function handlePropsLoopChange(propsLoop: typeof loop) {
if (player !== undefined && isReady && player.setLoop) {
// If there isn’t a player available, don’t do anything
if (!player) {
return;
}
if (player.setLoop) {
player.setLoop(propsLoop);
}
}
$: handlePropsLoopChange(loop);
function handlePlayerMount() {
if (player !== undefined) {
player.load(url);
progress();
}
player.load(url);
progress();
}
export function getDuration() {
if (player === undefined || !isReady) {
if (!isReady) {
return null;
}
return player.getDuration();
}
export function getCurrentTime() {
if (player === undefined || !isReady) {
if (!isReady) {
return null;
}
return player.getCurrentTime();
}
export function getSecondsLoaded() {
if (player === undefined || !isReady) {
if (!isReady) {
return null;
}
return player.getSecondsLoaded();
}
export function getInternalPlayer(key: InternalPlayerKey) {
if (!player) return null;
switch (key) {
case 'player':
if (player.getPlayer !== undefined) {
return player.getPlayer();
}
return null;
case 'hls':
case 'dash':
default:
return null;
export function getInternalPlayer(key?: PlayerGetPlayerKey) {
if (!player) {
return null;
}
return player.getPlayer(key);
}
function progress() {
Expand Down Expand Up @@ -226,7 +244,7 @@
export function seekTo(amount: number, type?: SeekToType, keepPlaying = false) {
// When seeking before player is ready, store value and seek later
if (player === undefined || !isReady) {
if (!isReady) {
if (amount !== 0) {
seekOnPlay = amount;
setTimeout(function () {
Expand Down Expand Up @@ -258,13 +276,13 @@
isLoading = false;
dispatch('ready');
if (player !== undefined && !muted && volume !== null) {
if (!muted && volume !== null) {
player.setVolume(volume);
}
if (player !== undefined && loadOnReady) {
if (loadOnReady) {
player.load(loadOnReady, true);
loadOnReady = null;
} else if (player !== undefined && playing) {
} else if (playing) {
player.play();
}
handleDurationCheck();
Expand All @@ -274,7 +292,7 @@
isPlaying = true;
isLoading = false;
if (startOnPlay) {
if (player !== undefined && player.setPlaybackRate && playbackRate !== 1) {
if (player.setPlaybackRate && playbackRate !== 1) {
player.setPlaybackRate(playbackRate);
}
dispatch('start');
Expand Down Expand Up @@ -354,7 +372,6 @@
on:error={handleError}
on:bufferEnd
on:buffer
on:startxxxxxxxxxxx
on:playbackRateChange
on:seek
on:playbackQualityChange
Expand Down
Loading

0 comments on commit 6972172

Please sign in to comment.