diff --git a/src/app/_components/timer.tsx b/src/app/_components/timer.tsx index 1f6d37a..a64fccb 100644 --- a/src/app/_components/timer.tsx +++ b/src/app/_components/timer.tsx @@ -1,52 +1,55 @@ "use client"; import React, { useState, useEffect } from "react"; -import { useRouter, useSearchParams } from "next/navigation"; interface TimerProps { + // Props are now optional since we'll calculate from IST initialHours?: number; initialMinutes?: number; initialSeconds?: number; } const CountdownTimer = ({ - initialHours = 30, - initialMinutes = 0, - initialSeconds = 0, }: TimerProps) => { - const searchParams = useSearchParams(); - - // Initialize time from URL params or use default values - const getInitialTime = () => { - const urlHours = searchParams.get("h"); - const urlMinutes = searchParams.get("m"); - const urlSeconds = searchParams.get("s"); - - return { - hours: urlHours ? parseInt(urlHours) : initialHours, - minutes: urlMinutes ? parseInt(urlMinutes) : initialMinutes, - seconds: urlSeconds ? parseInt(urlSeconds) : initialSeconds, - }; + // Function to get current IST time - FIXED + const getISTTime = () => { + const now = new Date(); + // Use toLocaleString to get proper IST time + const istString = now.toLocaleString('en-US', { + timeZone: 'Asia/Kolkata' + }); + return new Date(istString); }; - const [timeLeft, setTimeLeft] = useState(getInitialTime); - const [isRunning, setIsRunning] = useState(false); - const [isHovered, setIsHovered] = useState(false); - - // Update URL params when time changes - const updateUrlParams = (hours: number, minutes: number, seconds: number) => { - const params = new URLSearchParams(window.location.search); - params.set("h", hours.toString()); - params.set("m", minutes.toString()); - params.set("s", seconds.toString()); - const newUrl = `${window.location.pathname}?${params.toString()}`; - window.history.replaceState({}, "", newUrl); + // Function to get target time: July 27, 2025, 4:00 PM IST - FIXED + const getTargetTime = () => { + + // Alternative method: create the exact target time + const targetIST = new Date(2025, 6, 27, 16, 0, 0); // Month is 0-indexed, so 6 = July + return targetIST; }; - const getTotalSeconds = (h: number, m: number, s: number) => - h * 3600 + m * 60 + s; + // Calculate initial time remaining - FIXED + const calculateTimeRemaining = () => { + const istNow = getISTTime(); + const target = getTargetTime(); + const timeDiff = target.getTime() - istNow.getTime(); + + if (timeDiff <= 0) { + return { hours: 0, minutes: 0, seconds: 0 }; + } + + const hours = Math.floor(timeDiff / (1000 * 60 * 60)); + const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60)); + const seconds = Math.floor((timeDiff % (1000 * 60)) / 1000); + return { hours, minutes, seconds }; + }; + const [timeLeft, setTimeLeft] = useState(calculateTimeRemaining); + const [isRunning, setIsRunning] = useState(true); // Auto-start + const [isHovered, setIsHovered] = useState(false); + const [currentISTTime, setCurrentISTTime] = useState(getISTTime()); const getCheckpoint = () => { const hoursLeft = @@ -104,52 +107,22 @@ const CountdownTimer = ({ return Math.max(0, Math.min(100, progressWithinCheckpoint)); }; - // Timer countdown effect + // Timer countdown effect - updates every second based on real IST time useEffect(() => { let interval: NodeJS.Timeout; if (isRunning) { interval = setInterval(() => { - setTimeLeft((prev) => { - // Check if timer has reached zero - if (prev.hours === 0 && prev.minutes === 0 && prev.seconds === 0) { - setIsRunning(false); - return prev; - } - - let newSeconds = prev.seconds - 1; - let newMinutes = prev.minutes; - let newHours = prev.hours; - - if (newSeconds < 0) { - newSeconds = 59; - newMinutes -= 1; - } - - if (newMinutes < 0 && newHours > 0) { - newMinutes = 59; - newHours -= 1; - } - - // Ensure we don't go below zero - if (newHours < 0) { - newHours = 0; - newMinutes = 0; - newSeconds = 0; - setIsRunning(false); - } - - const newTime = { - hours: Math.max(0, newHours), - minutes: Math.max(0, newMinutes), - seconds: Math.max(0, newSeconds), - }; - - // Update URL params with new time - updateUrlParams(newTime.hours, newTime.minutes, newTime.seconds); - - return newTime; - }); + const newTimeRemaining = calculateTimeRemaining(); + const newISTTime = getISTTime(); + + setTimeLeft(newTimeRemaining); + setCurrentISTTime(newISTTime); + + // Check if timer has reached zero + if (newTimeRemaining.hours === 0 && newTimeRemaining.minutes === 0 && newTimeRemaining.seconds === 0) { + setIsRunning(false); + } }, 1000); } @@ -163,20 +136,52 @@ const CountdownTimer = ({ }; const handleReset = () => { - setIsRunning(false); - const resetTime = { - hours: initialHours, - minutes: initialMinutes, - seconds: initialSeconds, - }; + setIsRunning(true); // Auto-restart + const resetTime = calculateTimeRemaining(); setTimeLeft(resetTime); - updateUrlParams(resetTime.hours, resetTime.minutes, resetTime.seconds); + setCurrentISTTime(getISTTime()); }; const currentCheckpoint = getCheckpoint(); + // Format IST time for display - FIXED + const formatISTTime = (date: Date) => { + return date.toLocaleString('en-IN', { + timeZone: 'Asia/Kolkata', + weekday: 'short', + year: 'numeric', + month: 'short', + day: '2-digit', + hour: '2-digit', + minute: '2-digit', + second: '2-digit', + hour12: true + }); + }; + + return ( -