मुफ़्त ऑनलाइन टैली काउंटर

यह कैसे काम करता है

यह टैली काउंटर पूरी तरह आपके ब्राउज़र में React स्टेट और ब्राउज़र के बिल्ट-इन localStorage API का उपयोग करके चलता है — कोई सर्वर नहीं, कोई अकाउंट नहीं, और कहीं कोई डेटा नहीं भेजा जाता। गिनती पेज रीफ़्रेश से अपने आप बच जाती है, और फ़ुलस्क्रीन मोड गिनती के दौरान आपकी डिस्प्ले चालू रखने के लिए Screen Wake Lock API उपयोग करता है।

1. 1
   स्टेट localStorage में रहता है

   जब पेज लोड होता है, टूल एक फ़िक्स्ड की के तहत localStorage से पहले सेव किए गए काउंटर पढ़ता है। हर काउंटर — उसका लेबल, वर्तमान वैल्यू, स्टेप साइज़, और allow-negative फ़्लैग — हर बदलाव पर JSON के रूप में सीरियलाइज़ होकर localStorage में वापस लिखा जाता है, इसलिए आपकी गिनती आकस्मिक टैब बंद होने या रीफ़्रेश से बच जाती है।
2. 2
   React स्टेट के ज़रिए बढ़ाना/घटाना

   + या बड़े सेंटर बटन को टैप करना एक अपडेटर को कॉल करता है जो कॉन्फ़िगर की गई स्टेप वैल्यू को काउंटर के वर्तमान वैल्यू में जोड़ता है। अगर allow-negative बंद है, तो परिणाम Math.max से शून्य पर क्लैंप हो जाता है। कीबोर्ड शॉर्टकट (Space/+ बढ़ाने के लिए, -/Backspace घटाने के लिए) एक window keydown लिसनर के ज़रिए जुड़े हैं जो जो भी काउंटर सक्रिय है उसे टारगेट करता है।
3. 3
   Screen Wake Lock के साथ फ़ुलस्क्रीन मोड

   फ़ुलस्क्रीन मोड में जाने से एक ओवरले रेंडर होता है जहाँ पूरी स्क्रीन टैप टारगेट होती है। साथ ही, टूल navigator.wakeLock.request('screen') के ज़रिए एक वेक लॉक माँगता है — एक ब्राउज़र API जो OS से स्क्रीन स्लीप को दबाने के लिए कहता है। अगर टैब बैकग्राउंड में जाने के बाद फिर से दिखाई देता है, तो लॉक अपने आप फिर से मिल जाता है।
4. 4
   मिले हुए कुल के साथ कई काउंटर

   दूसरा काउंटर जोड़ने से crypto.randomUUID()-जनरेट ID के साथ एक नई एंट्री बनती है। जब एक से ज़्यादा काउंटर मौजूद होते हैं, तो सभी वैल्यू को जोड़कर एक मिला हुआ कुल गणना किया जाता है और काउंटर लिस्ट के ऊपर दिखाया जाता है। हर काउंटर में स्वतंत्र स्टेप, रीसेट, और allow-negative सेटिंग्स होती हैं।

संबंधित टूल