zoriya/v10
1
0
Fork 0
mirror of https://github.com/zoriya/v10.git synced 2026-08-16 02:45:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(packages)!: rename cast to google-cast and remote-playback (#1380)

Browse Source
This commit is contained in:
Wesley Luyten
2026-04-20 15:50:16 -07:00
committed by GitHub
parent c93dce4438
commit 413874c1e0
31 changed files with 216 additions and 174 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/src/content/docs/reference/feature-cast.mdx
-52
View File
@@ -1,52 +0,0 @@
---
title: Cast
description: Cast state and actions for the player store
---
import FeatureReference from "@/components/docs/api-reference/FeatureReference.astro";
import DocsLink from "@/components/docs/DocsLink.astro";
import FrameworkCase from "@/components/docs/FrameworkCase.astro";
Controls casting to remote playback devices (e.g. Chromecast). Exits fullscreen before initiating a cast session.
<FeatureReference feature="cast" />
### Selector
<FrameworkCase frameworks={["react"]}>
Pass `selectCast` to <DocsLink slug="reference/use-player">`usePlayer`</DocsLink> to subscribe to cast state. Returns `undefined` if the cast feature is not configured.
</FrameworkCase>
<FrameworkCase frameworks={["html"]}>
Pass `selectCast` to <DocsLink slug="reference/player-controller">`PlayerController`</DocsLink> to subscribe to cast state. Returns `undefined` if the cast feature is not configured.
</FrameworkCase>
<FrameworkCase frameworks={["react"]}>
```tsx title="CastButton.tsx"
import { selectCast, usePlayer } from '@videojs/react';
function CastButton() {
const cast = usePlayer(selectCast);
if (!cast || cast.castAvailability !== 'available') return null;
return (
<button onClick={cast.toggleCast}>
{cast.castState === 'connected' ? 'Disconnect' : 'Cast'}
</button>
);
}
```
</FrameworkCase>
<FrameworkCase frameworks={["html"]}>
```ts title="cast-button.ts"
import { createPlayer, MediaElement, selectCast } from '@videojs/html';
import { videoFeatures } from '@videojs/html/video';
const { PlayerController, context } = createPlayer({ features: videoFeatures });
class CastButton extends MediaElement {
readonly #cast = new PlayerController(this, context, selectCast);
}
```
</FrameworkCase>
site/src/content/docs/reference/feature-remote-playback.mdx
+52
View File
@@ -0,0 +1,52 @@
---
title: Remote Playback
description: Remote playback state and actions for the player store
---
import FeatureReference from "@/components/docs/api-reference/FeatureReference.astro";
import DocsLink from "@/components/docs/DocsLink.astro";
import FrameworkCase from "@/components/docs/FrameworkCase.astro";
Controls remote playback to devices like Chromecast. Exits fullscreen before initiating a remote playback session.
<FeatureReference feature="remotePlayback" />
### Selector
<FrameworkCase frameworks={["react"]}>
Pass `selectRemotePlayback` to <DocsLink slug="reference/use-player">`usePlayer`</DocsLink> to subscribe to remote playback state. Returns `undefined` if the remote playback feature is not configured.
</FrameworkCase>
<FrameworkCase frameworks={["html"]}>
Pass `selectRemotePlayback` to <DocsLink slug="reference/player-controller">`PlayerController`</DocsLink> to subscribe to remote playback state. Returns `undefined` if the remote playback feature is not configured.
</FrameworkCase>
<FrameworkCase frameworks={["react"]}>
```tsx title="CastButton.tsx"
import { selectRemotePlayback, usePlayer } from '@videojs/react';
function CastButton() {
const remotePlayback = usePlayer(selectRemotePlayback);
if (!remotePlayback || remotePlayback.remotePlaybackAvailability !== 'available') return null;
return (
<button onClick={remotePlayback.toggleRemotePlayback}>
{remotePlayback.remotePlaybackState === 'connected' ? 'Disconnect' : 'Cast'}
</button>
);
}
```
</FrameworkCase>
<FrameworkCase frameworks={["html"]}>
```ts title="cast-button.ts"
import { createPlayer, MediaElement, selectRemotePlayback } from '@videojs/html';
import { videoFeatures } from '@videojs/html/video';
const { PlayerController, context } = createPlayer({ features: videoFeatures });
class CastButton extends MediaElement {
readonly #remotePlayback = new PlayerController(this, context, selectRemotePlayback);
}
```
</FrameworkCase>