From c6aa70a64731b608fade3acab48c1d1d2df280b6 Mon Sep 17 00:00:00 2001 From: 0t4u <61939142+0t4u@users.noreply.github.com> Date: Mon, 5 Dec 2022 20:33:28 +0000 Subject: Add files via upload --- pages/404.tsx | 21 +++++++ pages/_app.tsx | 10 +++ pages/index.tsx | 185 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 216 insertions(+) create mode 100644 pages/404.tsx create mode 100644 pages/_app.tsx create mode 100644 pages/index.tsx (limited to 'pages') diff --git a/pages/404.tsx b/pages/404.tsx new file mode 100644 index 0000000..93eabab --- /dev/null +++ b/pages/404.tsx @@ -0,0 +1,21 @@ +import React from "react"; +import Head from "next/head"; +import PageBase from "../modules/PageBase"; + +const NotFoundPage = () => { + return ( + + + 404 - Ragtag Archive + +
+
+

404

+

Page not found

+
+
+ + ); +}; + +export default NotFoundPage; diff --git a/pages/_app.tsx b/pages/_app.tsx new file mode 100644 index 0000000..27c48fc --- /dev/null +++ b/pages/_app.tsx @@ -0,0 +1,10 @@ +import "../styles/tailwind.css"; +import "../styles/player.css"; + +function MyApp({ Component, pageProps }) { + return ( + + ); +} + +export default MyApp; diff --git a/pages/index.tsx b/pages/index.tsx new file mode 100644 index 0000000..316e16a --- /dev/null +++ b/pages/index.tsx @@ -0,0 +1,185 @@ +import React from "react"; +import Head from "next/head"; +import ChatReplayPanel from "../modules/ChatReplay/ChatReplayPanel"; +import { useWindowSize } from "../modules/hooks/useWindowSize"; +import PageBase from "../modules/PageBase"; +import VideoPlayer2 from "../modules/VideoPlayer/VideoPlayer2"; +import { buttonStyle } from "../modules/VideoActionButtons"; +import { IconCheck } from "../modules/icons"; + +const CustomPlayerPage = () => { + const [isChatVisible, setIsChatVisible] = React.useState(false); + const { innerWidth, innerHeight } = useWindowSize(); + const [playbackProgress, setPlaybackProgress] = React.useState(0); + const [urlVideo, setUrlVideo] = React.useState(""); + const [urlChat, setUrlChat] = React.useState(""); + const [urlYtt, setUrlYtt] = React.useState(""); + const [showPlayer, setShowPlayer] = React.useState(false); + + const handleFile = ( + e: React.ChangeEvent, + setter: (newValue: string) => any + ) => { + const file = e.target.files?.[0]; + if (!file) { + console.error("No file selected"); + return false; + } + const url = URL.createObjectURL(file).toString(); + console.log(url); + setter(url); + }; + + return ( + + + Custom Player - Ragtag Archive + + {showPlayer ? ( +
+
+
+
+
+ +
+
+
+
+ {!urlChat ? ( +
+

Chat replay unavailable

+
+ ) : ( + + )} +
+
+ +
+ ) : ( +
+
+

Custom Video Player

+

+ You can play locally-saved video files and chat replay JSON +

+

+ Chat replay compatible with output from{" "} + + yt-dlp + + {" and "} + + chat-downloader + + . +

+
+
+
+ + + + + +
+
+
+ )} + + ); +}; + +export default CustomPlayerPage; -- cgit v1.2.3