मोफत ऑनलाइन टॅली काउंटर

हे कसे कार्य करते

हा टॅली काउंटर React state आणि ब्राउझरचे बिल्ट-इन localStorage API वापरून पूर्णपणे तुमच्या ब्राउझरमध्ये चालतो — सर्व्हर, अकाउंट किंवा कुठेही पाठवलेला डेटा नाही. काउंट पेज रिफ्रेशनंतरही आपोआप टिकतात, आणि फुलस्क्रीन मोड मोजत असताना तुमचा डिस्प्ले चालू ठेवण्यासाठी Screen Wake Lock API वापरतो.

1. 1
   स्थिती localStorage मध्ये राहते

   पेज लोड होताना, साधन localStorage मधून एका निश्चित की खाली आधी सेव्ह केलेले कोणतेही काउंटर वाचते. प्रत्येक काउंटर — त्याचे लेबल, सध्याचे मूल्य, स्टेप साइज, आणि allow-negative फ्लॅग — JSON म्हणून सीरियलाइझ होऊन प्रत्येक बदलावर localStorage मध्ये परत लिहिले जाते, त्यामुळे अपघाती टॅब बंद होणे किंवा रिफ्रेशनंतरही तुमचे काउंट टिकतात.
2. 2
   React state द्वारे वाढ/घट

   + किंवा मोठ्या मध्यवर्ती बटणावर टॅप केल्याने काउंटरच्या सध्याच्या मूल्यात कॉन्फिगर केलेली स्टेप व्हॅल्यू जोडणारा updater कॉल होतो. जर allow-negative बंद असेल, तर निकाल Math.max ने शून्यावर मर्यादित होतो. कीबोर्ड शॉर्टकट्स (वाढीसाठी Space/+, घटीसाठी -/Backspace) window keydown listener द्वारे जोडलेले आहेत जे सध्या सक्रिय असलेल्या काउंटरला लक्ष्य करतात.
3. 3
   Screen Wake Lock सह फुलस्क्रीन मोड

   फुलस्क्रीन मोडमध्ये प्रवेश केल्याने संपूर्ण स्क्रीन टॅप टार्गेट असलेला ओव्हरले तयार होतो. त्याचवेळी, साधन navigator.wakeLock.request('screen') द्वारे wake lock विनंती करते — हे ब्राउझर API OS ला स्क्रीन झोप थांबवण्यास सांगते. टॅब बॅकग्राउंडमधून पुन्हा दृश्यमान झाल्यावर lock आपोआप पुन्हा मिळवला जातो.
4. 4
   एकत्रित एकूणासह अनेक काउंटर

   दुसरा काउंटर जोडल्याने crypto.randomUUID()-निर्मित ID असलेली नवीन एंट्री तयार होते. एकापेक्षा जास्त काउंटर असताना, सर्व मूल्यांची बेरीज करून एकत्रित एकूण मोजले जाते आणि काउंटर यादीच्या वर दाखवले जाते. प्रत्येक काउंटरला स्वतंत्र स्टेप, रीसेट, आणि allow-negative सेटिंग्ज असतात.

संबंधित साधने