blob: d82423ba03998c56cb4c784e4b59ece52398f69b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
import React, { useState, useEffect } from "react";
import PieChartIcon from "./PieChartIcon";
export interface Props {
width: number;
height: number;
color?: string;
backgroundColor?: string;
}
export default function (props: Props) {
const maxTimeProgress = 1000;
const [timeProgress, setTimeProgress] = useState(0);
useEffect(() => {
// Get the current number of seconds to initialize timer.
const initialValue = Math.floor((new Date().getSeconds() % 30) / 30 * maxTimeProgress);
setTimeProgress(initialValue);
const interval = setInterval(() => {
const ms = new Date().getSeconds() * 1000.0 + new Date().getMilliseconds();
const value = (ms % 30000) / 30000 * maxTimeProgress;
setTimeProgress(value);
}, 100);
return () => clearInterval(interval);
}, []);
return (
<PieChartIcon width={props.width} height={props.height}
maxProgress={maxTimeProgress}
progress={timeProgress}
backgroundColor={props.backgroundColor} color={props.color} />
)
}
|