រាប់ចំនួនអនឡាញ ឥតគិតថ្លៃ

វាដំណើរការដោយរបៀបណា

ឧបករណ៍រាប់នេះដំណើរការទាំងស្រុងនៅក្នុងកម្មវិធីរុករករបស់អ្នកដោយប្រើ React state និង localStorage API ភ្ជាប់ជាមួយកម្មវិធីរុករក — គ្មានម៉ាស៊ីនមេ គ្មានគណនី និងគ្មានទិន្នន័យផ្ញើទៅកន្លែងណាមួយទេ។ ចំនួនរស់រានផ្ទុកទំព័រឡើងវិញដោយស្វ័យប្រវត្តិ ហើយរបៀបពេញអេក្រង់ប្រើ Screen Wake Lock API ដើម្បីរក្សាអេក្រង់របស់អ្នកឱ្យបើកពេលរាប់។

1. 1
   ស្ថានភាពរស់នៅក្នុង localStorage

   នៅពេលទំព័រផ្ទុក ឧបករណ៍អានឧបករណ៍រាប់ដែលបានរក្សាទុកពីមុនពី localStorage ក្រោមគន្លឹះថេរមួយ។ ឧបករណ៍រាប់នីមួយៗ — ស្លាក តម្លៃបច្ចុប្បន្ន ទំហំជំហាន និងសញ្ញាអនុញ្ញាតអវិជ្ជមាន — ត្រូវបាន serialize ជា JSON និងសរសេរត្រឡប់ទៅ localStorage រាល់ការផ្លាស់ប្តូរ ដូច្នេះចំនួនរបស់អ្នករស់រានពីការបិទផ្ទាំង ឬការផ្ទុកឡើងវិញដោយចៃដន្យ។
2. 2
   បង្កើន/បន្ថយតាម React state

   ការចុច + ឬប៊ូតុងកណ្តាលធំហៅកម្មវិធីធ្វើបច្ចុប្បន្នភាពដែលបន្ថែមតម្លៃជំហានដែលបានកំណត់ទៅតម្លៃបច្ចុប្បន្នរបស់ឧបករណ៍រាប់។ ប្រសិនបើអនុញ្ញាតអវិជ្ជមានបិទ លទ្ធផលត្រូវបានកំណត់ដល់សូន្យជាមួយ Math.max។ ផ្លូវកាត់ក្តារចុច (ចន្លោះ/+ ដើម្បីបង្កើន, -/Backspace ដើម្បីបន្ថយ) ត្រូវបានភ្ជាប់តាមរយៈកម្មវិធីស្តាប់ keydown របស់ window ដែលកំណត់គោលដៅឧបករណ៍រាប់ដែលសកម្ម។
3. 3
   របៀបពេញអេក្រង់ជាមួយ Screen Wake Lock

   ការចូលទៅរបៀបពេញអេក្រង់បង្ហាញស្រទាប់ត្រួតដែលអេក្រង់ទាំងមូលជាគោលដៅចុច។ ក្នុងពេលតែមួយ ឧបករណ៍នេះស្នើសុំការចាក់សោភ្ញាក់តាម navigator.wakeLock.request('screen') — API កម្មវិធីរុករកមួយដែលសុំប្រព័ន្ធប្រតិបត្តិការបញ្ឈប់ការគេងអេក្រង់។ ការចាក់សោត្រូវបានទទួលបានឡើងវិញដោយស្វ័យប្រវត្តិប្រសិនបើផ្ទាំងទទួលបានភាពមើលឃើញឡើងវិញបន្ទាប់ពីចូលទៅផ្ទៃខាងក្រោយ។
4. 4
   ឧបករណ៍រាប់ច្រើនជាមួយចំនួនសរុបរួមបញ្ចូលគ្នា

   ការបន្ថែមឧបករណ៍រាប់ទីពីរបង្កើតធាតុថ្មីជាមួយ ID ដែលបានបង្កើតដោយ crypto.randomUUID()។ នៅពេលមានច្រើនជាងឧបករណ៍រាប់មួយ ចំនួនសរុបរួមបញ្ចូលគ្នាត្រូវបានគណនាដោយបូកតម្លៃទាំងអស់ ហើយបង្ហាញនៅខាងលើបញ្ជីឧបករណ៍រាប់។ ឧបករណ៍រាប់នីមួយៗមានការកំណត់ជំហាន កំណត់ឡើងវិញ និងអនុញ្ញាតអវិជ្ជមានឯករាជ្យ។

ឧបករណ៍ពាក់ព័ន្ធ