inmake/stream.graff.tech-client
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

upd

Browse Source
This commit is contained in:
inmake
2023-08-15 13:16:47 +05:00
parent 1dac8116fb
commit 9a0dbe390e
4 changed files with 63 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/StreamPage.tsx
+14 -16
View File
@@ -9,7 +9,7 @@ import ky from "ky";
import { io } from "socket.io-client";
import userAgentParser from "ua-parser-js";
import { Player } from "./components/Player";
import { Trans } from "react-i18next";
import { Trans, useTranslation } from "react-i18next";
// import { useScreen } from "usehooks-ts";
import ShareIcon from "./components/icons/ShareIcon";
import ModalContainer from "./components/ModalContainer";
@@ -30,6 +30,7 @@ import HandOnIcon from "./components/icons/HandOnIcon";
import AlertIcon from "./components/icons/AlertIcon";
function StreamPage() {
const { t } = useTranslation();
const params = useParams();
const handleFullScreen = useFullScreenHandle();
const [streamUrl, setStreamUrl] = useState<string>("");
@@ -126,17 +127,16 @@ function StreamPage() {
const socket = io(import.meta.env.VITE_COORD_URL, {
query: { roomId: params.id },
});
setSocket(socket);
socket.on("connect", () => {
setSocket(socket);
// console.log("connect: ", socket.id);
});
socket.on("join", (_socketId, room) => {
setUsers(room.users);
// console.log("join: ", _socketId, room.users);
toastUser("Присоеденился новый участник");
toastUser(t("notification.newMember"));
});
socket.on("update", (_socketId, room) => {
@@ -167,7 +167,7 @@ function StreamPage() {
useEffect(() => {
if (me && me.allowControl && !me.admin) {
toastHandOn("Управление получено");
toastHandOn(t("notification.controlReceived"));
}
}, [me]);
@@ -194,16 +194,12 @@ function StreamPage() {
{new userAgentParser(me.ua).getDevice().type === "mobile" ? (
<div
className="absolute top-0 left-0 w-full h-full"
onTouchStart={() =>
toastWarn("Получите доступ у администратора трансляции!")
}
onTouchStart={() => toastWarn(t("notification.getAccess"))}
></div>
) : (
<div
className="absolute top-0 left-0 w-full h-full"
onMouseDown={() =>
toastWarn("Получите доступ у администратора трансляции!")
}
onMouseDown={() => toastWarn(t("notification.getAccess"))}
></div>
)}
</>
@@ -220,7 +216,9 @@ function StreamPage() {
>
<FullscreenIcon />
<span className="absolute left-12 top-[50%] -translate-y-[50%] invisible group-hover:visible opacity-0 group-hover:opacity-100 text-xs transition-all px-2 py-1 bg-[#131313] rounded">
Полноэкранный режим
<Trans i18nKey={"fullscreenMode"}>
Полноэкранный режим
</Trans>
</span>
</button>
) : (
@@ -230,7 +228,7 @@ function StreamPage() {
>
<WindowedModeIcon />
<span className="absolute left-12 top-[50%] -translate-y-[50%] invisible group-hover:visible opacity-0 group-hover:opacity-100 text-xs transition-all px-2 py-1 bg-[#131313] rounded">
Оконный режим
<Trans i18nKey={"windowedMode"}>Оконный режим</Trans>
</span>
</button>
)}
@@ -243,7 +241,7 @@ function StreamPage() {
>
<QRIcon />
<span className="absolute left-12 top-[50%] -translate-y-[50%] invisible group-hover:visible opacity-0 group-hover:opacity-100 text-xs transition-all px-2 py-1 bg-[#131313] rounded">
Пригласить по QR
<Trans i18nKey={"inviteByQRCode"}>Пригласить по QR коду</Trans>
</span>
</button>
@@ -253,7 +251,7 @@ function StreamPage() {
>
<ShareIcon />
<span className="absolute left-12 top-[50%] -translate-y-[50%] invisible group-hover:visible opacity-0 group-hover:opacity-100 text-xs transition-all px-2 py-1 bg-[#131313] rounded">
Пригласить по ссылке
<Trans i18nKey={"inviteByLink"}>Пригласить по ссылке</Trans>
</span>
</button>
@@ -271,7 +269,7 @@ function StreamPage() {
>
<PersonsIcon />
<span className="absolute left-12 top-[50%] -translate-y-[50%] invisible group-hover:visible opacity-0 group-hover:opacity-100 text-xs transition-all px-2 py-1 bg-[#131313] rounded">
Участники
<Trans i18nKey={"members"}>Участники</Trans>
</span>
</button>
</div>