sheptikhinv/timers
1
0
Fork 0
mirror of https://github.com/sheptikhinv/timers.git synced 2026-02-07 07:41:36 +05:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor some functions

Browse source
This commit is contained in:
Вячеслав 2025-06-14 15:06:39 +05:00
parent 981ef867fb
commit 8f69ed3b58
3 changed files with 19 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/components/Timer/Timer.tsx
View file

@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
import TimeManager from '../../helpers/TimeManager';
import Button from '../Button/Button';
import styles from './Timer.module.css'
import { formatTime } from '../../helpers/Formatters';
const Timer = () => {
const [timeManager, recreateTimeManager] = useState(() => new TimeManager(0))
@ -9,19 +10,15 @@ const Timer = () => {
const [startDate, setStartDate] = useState('00:00');
const [endDate, setEndDate] = useState('00:00');
const formatTime = (date: Date) => {
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
return `${hours}:${minutes}`;
};
useEffect(() => {
timeManager.start()
console.log("timer started")
const interval = setInterval(() => {
setRemainingTime(timeManager.getRemainingTime());
let startString = formatTime(timeManager.getStartDate());
let endString = formatTime(timeManager.getEndDate());
const startString = formatTime(timeManager.getStartDate());
const endString = formatTime(timeManager.getEndDate());
if (startString === endString) {
setStartDate('00:00');
setEndDate('00:00');

12
src/helpers/Formatters.ts Normal file
View file

@ -0,0 +1,12 @@
export const formatFullTime = (date: Date) => {
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${hours}:${minutes}:${seconds}`;
};
export const formatTime = (date: Date) => {
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
return `${hours}:${minutes}`;
};

11
src/pages/Timers/Timers.tsx
View file

@ -1,6 +1,7 @@
import { useEffect, useState } from 'react';
import {useEffect, useState} from 'react';
import Timer from '../../components/Timer/Timer';
import styles from './Timers.module.css';
import {formatFullTime} from "../../helpers/Formatters.ts";
const Timers = () => {
const [time, setTime] = useState(new Date());
@ -13,18 +14,12 @@ const Timers = () => {
return () => clearInterval(intervalId);
}, [])
const formatTime = (date: Date) => {
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${hours}:${minutes}:${seconds}`;
};
return (
<div className={styles.content}>
<header className={styles.header}>
<a className={`${styles.header_text} ${styles.title}`}>MetaTimer</a>
<a className={`${styles.header_text} ${styles.title}`}>{formatTime(time)}</a>
<a className={`${styles.header_text} ${styles.title}`}>{formatFullTime(time)}</a>
</header>
<div className={styles.timers_container}>
<Timer/>