julius/cutt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: open automatically

Browse Source
This commit is contained in:
julius 2025-01-29 17:28:17 +01:00
parent bb7f795175
commit 16a6814d69
Signed by: julius
GPG Key ID: C80A63E6A5FD7092
1 changed files with 31 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
src/Rankings.tsx
View File

@ -1,4 +1,4 @@
import { Dispatch, SetStateAction, useMemo, useState } from "react";
import { Dispatch, SetStateAction, useEffect, useMemo, useState } from "react";
import { ReactSortable, ReactSortableProps } from "react-sortablejs";
import api, { baseUrl } from "./api";
@ -268,33 +268,10 @@ export function MVP({ user, players }: PlayerInfoProps) {
);
}
function openPage(pageName: string, color: string) {
// Hide all elements with class="tabcontent" by default */
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
(tabcontent[i] as HTMLElement).style.display = "none";
}
// Remove the background color of all tablinks/buttons
tablinks = document.getElementsByClassName("tablink");
for (i = 0; i < tablinks.length; i++) {
let button = tablinks[i] as HTMLElement;
button.style.opacity = "50%";
}
// Show the specific tab content
(document.getElementById(pageName) as HTMLElement).style.display = "block";
// Add the specific color to the button used to open the tab content
let activeButton = document.getElementById(
pageName + "Button"
) as HTMLElement;
activeButton.style.fontWeight = "bold";
activeButton.style.opacity = "100%";
document.body.style.backgroundColor = color;
}
export default function Rankings() {
const [user, setUser] = useState<Player[]>([]);
const [players, setPlayers] = useState<Player[]>([]);
const [openTab, setOpenTab] = useState("Chemistry");
async function loadPlayers() {
const response = await fetch(`${baseUrl}player/list`, {
@ -308,6 +285,35 @@ export default function Rankings() {
loadPlayers();
}, []);
useEffect(() => {
user.length === 1 && openPage(openTab, "aliceblue");
}, [user]);
function openPage(pageName: string, color: string) {
// Hide all elements with class="tabcontent" by default */
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
(tabcontent[i] as HTMLElement).style.display = "none";
}
// Remove the background color of all tablinks/buttons
tablinks = document.getElementsByClassName("tablink");
for (i = 0; i < tablinks.length; i++) {
let button = tablinks[i] as HTMLElement;
button.style.opacity = "50%";
}
// Show the specific tab content
(document.getElementById(pageName) as HTMLElement).style.display = "block";
// Add the specific color to the button used to open the tab content
let activeButton = document.getElementById(
pageName + "Button"
) as HTMLElement;
activeButton.style.fontWeight = "bold";
activeButton.style.opacity = "100%";
document.body.style.backgroundColor = color;
setOpenTab(pageName);
}
return (
<>
<SelectUser {...{ user, setUser, players, setPlayers }} />