color mode stuff

This commit is contained in:
vel 2022-01-24 19:45:47 -08:00
parent 0fd974266c
commit e4d7906cb5
Signed by: velvox
GPG Key ID: 1C8200C1D689CEF5
4 changed files with 17 additions and 16 deletions

View File

@ -5,10 +5,8 @@
</component> </component>
<component name="ChangeListManager"> <component name="ChangeListManager">
<list default="true" id="8a64704d-5500-41a6-aa4c-e275933fc58c" name="Changes" comment=""> <list default="true" id="8a64704d-5500-41a6-aa4c-e275933fc58c" name="Changes" comment="">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" /> <change beforePath="$PROJECT_DIR$/../frontend/src/components/Player.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/src/components/Player.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/internal/ws/handlers.go" beforeDir="false" afterPath="$PROJECT_DIR$/internal/ws/handlers.go" afterDir="false" /> <change beforePath="$PROJECT_DIR$/../frontend/src/pages/player.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/src/pages/player.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/internal/ws/hub.go" beforeDir="false" afterPath="$PROJECT_DIR$/internal/ws/hub.go" afterDir="false" />
<change beforePath="$PROJECT_DIR$/internal/ws/message.go" beforeDir="false" afterPath="$PROJECT_DIR$/internal/ws/message.go" afterDir="false" />
</list> </list>
<option name="SHOW_DIALOG" value="false" /> <option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" /> <option name="HIGHLIGHT_CONFLICTS" value="true" />

View File

@ -1,19 +1,15 @@
import React, { FC } from "react"; import React, { FC } from "react";
import ReactPlayer, { ReactPlayerProps } from "react-player"; import ReactPlayer, { Config, ReactPlayerProps } from "react-player";
type PlayerProps = { id: string } & ReactPlayerProps; type PlayerProps = { id: string } & ReactPlayerProps;
const Player: FC<PlayerProps> = ({ id, config }) => { const Player: FC<PlayerProps> = (props) => {
return <ReactPlayer url={id} config={config} />; const config: Config = {
};
Player.defaultProps = {
id: "",
config: {
file: { file: {
forceHLS: true, forceHLS: true,
}, },
}, };
return <ReactPlayer url={props.id} config={config} {...props} />;
}; };
export default Player; export default Player;

View File

@ -1,5 +1,6 @@
import NextDocument, { Html, Head, Main, NextScript } from "next/document"; import NextDocument, { Html, Head, Main, NextScript } from "next/document";
import { ColorModeScript } from "@chakra-ui/react"; import { ColorModeScript } from "@chakra-ui/react";
import theme from "../theme";
export default class Document extends NextDocument { export default class Document extends NextDocument {
render() { render() {
@ -8,7 +9,7 @@ export default class Document extends NextDocument {
<Head /> <Head />
<body> <body>
{/* Make Color mode to persists when you refresh the page. */} {/* Make Color mode to persists when you refresh the page. */}
<ColorModeScript /> <ColorModeScript initialColorMode={theme.config.initialColorMode} />
<Main /> <Main />
<NextScript /> <NextScript />
</body> </body>

View File

@ -3,7 +3,8 @@ import { GetServerSideProps, NextPage } from "next";
import { Session, User } from "next-auth"; import { Session, User } from "next-auth";
import { getSession, useSession } from "next-auth/react"; import { getSession, useSession } from "next-auth/react";
import dynamic from "next/dynamic"; import dynamic from "next/dynamic";
import React, { useEffect } from "react"; import React, { useEffect, useRef } from "react";
import ReactPlayer from "react-player";
import { Container } from "../components/Container"; import { Container } from "../components/Container";
import { MessageTypes } from "../interfaces/IMessage"; import { MessageTypes } from "../interfaces/IMessage";
import Message from "../util/Message"; import Message from "../util/Message";
@ -28,6 +29,7 @@ const pingEvent = (ws: WebSocket) => {
}; };
const PlayerPage: NextPage<PlayerPageProps> = ({ URI, user }) => { const PlayerPage: NextPage<PlayerPageProps> = ({ URI, user }) => {
const playerRef = useRef<ReactPlayer>();
consola.wrapAll(); consola.wrapAll();
useEffect(() => { useEffect(() => {
if (typeof window === "undefined") return; if (typeof window === "undefined") return;
@ -63,7 +65,11 @@ const PlayerPage: NextPage<PlayerPageProps> = ({ URI, user }) => {
ws.close(); ws.close();
}; };
}, []); }, []);
return <Container height="100vh">{/* <Player /> */}</Container>; return (
<Container height="100vh">
<Player id="" ref={playerRef} />
</Container>
);
}; };
export const getServerSideProps: GetServerSideProps = async (context) => { export const getServerSideProps: GetServerSideProps = async (context) => {