fix width bug

main
alex 2024-08-11 00:09:54 +02:00
parent 2e9159d1c3
commit 1a6c185074
1 changed files with 8 additions and 5 deletions

View File

@ -66,11 +66,11 @@ function App() {
const [acceleration, setAcceleration] = useState(0); const [acceleration, setAcceleration] = useState(0);
const [direction, setDirection] = useState(0); const [direction, setDirection] = useState(0);
const remainingTimeRef = useRef(0); const remainingTimeRef = useRef(null);
const [processStatus, setProcessStatus] = useState(""); const [processStatus, setProcessStatus] = useState("");
const setRemainingTimeProgress = (time) => { const setRemainingTimeProgress = (time) => {
remainingTimeRef.current = time; remainingTimeRef.current = time * 1000;
}; };
const showErrorMessage = () => { const showErrorMessage = () => {
@ -120,6 +120,8 @@ function App() {
}, []); }, []);
useEffect(() => { useEffect(() => {
if (remainingTimeRef.current === null) return;
let elem = document.getElementById("progress-bar"); let elem = document.getElementById("progress-bar");
let width = 1; let width = 1;
let currentProgress = 0; let currentProgress = 0;
@ -136,7 +138,9 @@ function App() {
if (processStatus !== "Angehalten" && processStatus !== "") if (processStatus !== "Angehalten" && processStatus !== "")
setProcessStatus("Fertig"); setProcessStatus("Fertig");
} else { } else {
width = (100 / remainingTimeRef.current) * currentProgress + 1; width = (100 / remainingTimeRef.current) * currentProgress;
if (width > 100) width = 100;
currentProgress += PROGRES_BAR_INTERVAL_TIME; currentProgress += PROGRES_BAR_INTERVAL_TIME;
elem.style.width = width + "%"; elem.style.width = width + "%";
@ -181,7 +185,7 @@ function App() {
console.error(error); console.error(error);
showErrorMessage(); showErrorMessage();
setProcessStatus(""); setProcessStatus("");
setRemainingTimeProgress(0); setRemainingTimeProgress(10);
}); });
}) })
.catch((err) => console.error(err)); .catch((err) => console.error(err));
@ -397,7 +401,6 @@ function App() {
console.error(error); console.error(error);
showErrorMessage(); showErrorMessage();
setProcessStatus("Angehalten"); setProcessStatus("Angehalten");
setRemainingTimeProgress(0); setRemainingTimeProgress(0);
}); });
}} }}