Playlist downloads

This commit is contained in:
Astrid 2023-12-27 22:40:04 +01:00
parent 7f0701ee61
commit 57edcbeb79

View File

@ -15,6 +15,7 @@ function useDownloadLink() {
const url = useMemo(() => { const url = useMemo(() => {
if (source?.type === "file" && currentQuality) if (source?.type === "file" && currentQuality)
return source.qualities[currentQuality]?.url ?? null; return source.qualities[currentQuality]?.url ?? null;
if (source?.type === "hls") return source.url;
return null; return null;
}, [source, currentQuality]); }, [source, currentQuality]);
return url; return url;
@ -42,6 +43,7 @@ export function DownloadView({ id }: { id: string }) {
const { t } = useTranslation(); const { t } = useTranslation();
const downloadUrl = useDownloadLink(); const downloadUrl = useDownloadLink();
const sourceType = usePlayerStore((s) => s.source?.type);
const selectedCaption = usePlayerStore((s) => s.caption?.selected); const selectedCaption = usePlayerStore((s) => s.caption?.selected);
const subtitleUrl = useMemo( const subtitleUrl = useMemo(
() => () =>
@ -60,36 +62,61 @@ export function DownloadView({ id }: { id: string }) {
</Menu.BackLink> </Menu.BackLink>
<Menu.Section> <Menu.Section>
<div> <div>
<Menu.ChevronLink onClick={() => router.navigate("/download/pc")}> {sourceType === "hls" ? (
{t("player.menus.downloads.onPc.title")} <>
</Menu.ChevronLink> <Menu.Paragraph marginClass="mb-6">
<Menu.ChevronLink onClick={() => router.navigate("/download/ios")}> <StyleTrans k="player.menus.downloads.hlsDisclaimer" />
{t("player.menus.downloads.onIos.title")} </Menu.Paragraph>
</Menu.ChevronLink>
<Menu.ChevronLink
onClick={() => router.navigate("/download/android")}
>
{t("player.menus.downloads.onAndroid.title")}
</Menu.ChevronLink>
<Menu.Divider /> <Button className="w-full" href={downloadUrl} theme="purple">
{t("player.menus.downloads.downloadPlaylist")}
</Button>
<Button
className="w-full mt-2"
href={subtitleUrl ?? undefined}
disabled={!subtitleUrl}
theme="secondary"
download="subtitles.srt"
>
{t("player.menus.downloads.downloadCaption")}
</Button>
</>
) : (
<>
<Menu.ChevronLink onClick={() => router.navigate("/download/pc")}>
{t("player.menus.downloads.onPc.title")}
</Menu.ChevronLink>
<Menu.ChevronLink
onClick={() => router.navigate("/download/ios")}
>
{t("player.menus.downloads.onIos.title")}
</Menu.ChevronLink>
<Menu.ChevronLink
onClick={() => router.navigate("/download/android")}
>
{t("player.menus.downloads.onAndroid.title")}
</Menu.ChevronLink>
<Menu.Paragraph marginClass="my-6"> <Menu.Divider />
<StyleTrans k="player.menus.downloads.disclaimer" />
</Menu.Paragraph>
<Button className="w-full" href={downloadUrl} theme="purple"> <Menu.Paragraph marginClass="my-6">
{t("player.menus.downloads.downloadVideo")} <StyleTrans k="player.menus.downloads.disclaimer" />
</Button> </Menu.Paragraph>
<Button
className="w-full mt-2" <Button className="w-full" href={downloadUrl} theme="purple">
href={subtitleUrl ?? undefined} {t("player.menus.downloads.downloadVideo")}
disabled={!subtitleUrl} </Button>
theme="secondary" <Button
download="subtitles.srt" className="w-full mt-2"
> href={subtitleUrl ?? undefined}
{t("player.menus.downloads.downloadCaption")} disabled={!subtitleUrl}
</Button> theme="secondary"
download="subtitles.srt"
>
{t("player.menus.downloads.downloadCaption")}
</Button>
</>
)}
</div> </div>
</Menu.Section> </Menu.Section>
</> </>