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