Drop Prism, it doesn't work, so just don't use it
This commit is contained in:
parent
5366422ea7
commit
ded7d47e1e
SSH key fingerprint:
SHA256:Q0b0KraMldpAO9oKa+w+gcsXsOTykQ4UkAKn0ByGn5U
8 changed files with 20 additions and 20 deletions
|
|
@ -3,7 +3,7 @@ Title: Audio Source
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
<Zorn
|
||||
|
|
@ -18,7 +18,7 @@ import {Zorn} from "@minpluto/zorn"
|
|||
Since Zorn was originally built for the MinPluto frontend project, there are scenarios where the video source has no audio to get higher quality options. If you're in a scenario where the video source is missing audio, but you do have the audio itself, you can add that audio source to the video player. A separated `<audio/>` element is used, this will use a sync function in JavaScript to make sure the video and audio are synced. As before with the video source, it can be local or remote.
|
||||
|
||||
**Demo Used Above**
|
||||
<Prism lang="jsx" code={
|
||||
<Code lang="jsx" code={
|
||||
`---
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
---
|
||||
|
|
@ -34,9 +34,9 @@ import {Zorn} from "@minpluto/zorn"
|
|||
`}/>
|
||||
|
||||
**Local**
|
||||
<Prism lang="jsx" code={`<Zorn Audio="/media/audio.ogg"/>`}/>
|
||||
<Code lang="jsx" code={`<Zorn Audio="/media/audio.ogg"/>`}/>
|
||||
|
||||
> Use the `/public/` folder in your Astro project.
|
||||
|
||||
**Remote**
|
||||
<Prism lang="jsx" code={`<Zorn Audio="https://example.org/media/audio.ogg"/>`}/>
|
||||
<Code lang="jsx" code={`<Zorn Audio="https://example.org/media/audio.ogg"/>`}/>
|
||||
|
|
@ -3,7 +3,7 @@ Title: Basic Usage
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
<Zorn
|
||||
|
|
@ -14,7 +14,7 @@ import {Zorn} from "@minpluto/zorn"
|
|||
|
||||
You can add it to any page on your Astro website by importing Zorn:
|
||||
|
||||
<Prism lang="jsx" code={
|
||||
<Code lang="jsx" code={
|
||||
`---
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
---
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ Title: HLS
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
<Zorn Live Video="https://twitch.api.sudovanilla.org/proxy/stream/chillhopradio/hls.m3u8"/>
|
||||
|
|
@ -12,4 +12,4 @@ Zorn can stream `.m3u8` content with HLS support added. The HLS support is only
|
|||
|
||||
Just add the `Live` option with an `.m3u8` source.
|
||||
|
||||
<Prism lang="jsx" code={`<Zorn Live Video="https://example.org/cats.m3u8"/>`}/>
|
||||
<Code lang="jsx" code={`<Zorn Live Video="https://example.org/cats.m3u8"/>`}/>
|
||||
|
|
@ -3,7 +3,7 @@ Title: Milieu
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
|
||||
|
|
@ -40,4 +40,4 @@ import {Zorn} from "@minpluto/zorn"
|
|||
|
||||
The Milieu option is an attempt to copy YouTube's ambient player feature. Where it adds a blurry glow around the player. This uses two `<canvas/>`s behind the player to make a smooth transition when it changes.
|
||||
|
||||
<Prism lang="jsx" code={`<Zorn Milieu/>`}/>
|
||||
<Code lang="jsx" code={`<Zorn Milieu/>`}/>
|
||||
|
|
@ -3,7 +3,7 @@ Title: Setting Menus
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
## Automated items
|
||||
|
|
@ -12,7 +12,7 @@ When enabling certain functions and features of Zorn, certain items will automat
|
|||
|
||||
However, if you don't have your items added at all with no `Settings` variable setup, the Settings icon is setup to not be shown. So if you decide to enable these other functions and features without creating a custom settings menu, at least create a blank one:
|
||||
|
||||
<Prism lang="jsx" code={`
|
||||
<Code lang="jsx" code={`
|
||||
<Zorn
|
||||
Settings={[{"Type": "Button","Name": "","Action": "null"}}
|
||||
/>
|
||||
|
|
@ -22,7 +22,7 @@ However, if you don't have your items added at all with no `Settings` variable s
|
|||
|
||||
To setup the settings menu with your own custom items, you'll need to setup an array within the Zorn player, here's a quick example:
|
||||
|
||||
<Prism lang="jsx" code={`
|
||||
<Code lang="jsx" code={`
|
||||
<Zorn
|
||||
Settings={
|
||||
[
|
||||
|
|
@ -57,7 +57,7 @@ You can also enable the "Quality" menu, doing so will automatically add this to
|
|||
|
||||
You can set what resolutions are available and set the `onclick` action for it:
|
||||
|
||||
<Prism lang="jsx" code={`
|
||||
<Code lang="jsx" code={`
|
||||
<Zorn
|
||||
Quality={
|
||||
[
|
||||
|
|
|
|||
|
|
@ -3,14 +3,14 @@ Title: Subtitles
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
|
||||
|
||||
To apply subtitles to the video player, add a slot for tracks and insert HTML5 [`textTracks`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/textTracks). Make sure to set the `label` and `srclang`.
|
||||
|
||||
<Prism lang="jsx" code={`
|
||||
<Code lang="jsx" code={`
|
||||
<Zorn Subtitles>
|
||||
<slot slot="subtitles">
|
||||
<track kind="subtitles" src="/subtitles/English.vtt" label="English" srclang="en" />
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ Title: Toggles
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
Zorn has plent of controls to show, some are enabled or disabled by default with their toggle option.
|
||||
|
|
@ -12,4 +12,4 @@ Zorn has plent of controls to show, some are enabled or disabled by default with
|
|||
|
||||
By default, these buttons are hidden. If you want to show them, just add the `ShowBackAndForward` option:
|
||||
|
||||
<Prism lang="jsx" code={`<Zorn ShowBackAndForward/>`}/>
|
||||
<Code lang="jsx" code={`<Zorn ShowBackAndForward/>`}/>
|
||||
|
|
@ -3,7 +3,7 @@ Title: YouTube
|
|||
Type: Document
|
||||
---
|
||||
|
||||
import {Prism} from "@astrojs/prism"
|
||||
import {Code} from "astro:components"
|
||||
import {Zorn} from "@minpluto/zorn"
|
||||
|
||||
<Zorn
|
||||
|
|
@ -19,7 +19,7 @@ import {Zorn} from "@minpluto/zorn"
|
|||
|
||||
Zorn supports YouTube videos, using Invidious. Set the video id and quality in Zorn. If you do not set the quality, it'll default to `137`, which is the itag for 1080p.
|
||||
|
||||
<Prism lang="jsx" code={`<Zorn YouTube Audio WatchId="a0a0-0a000" YouTubeQuality="137">`}/>
|
||||
<Code lang="jsx" code={`<Zorn YouTube Audio WatchId="a0a0-0a000" YouTubeQuality="137">`}/>
|
||||
|
||||
If you're setting the quality to 1080p or up, using `Audio` is required for Dash support.
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue