Առցանց հաշվիչ անվճար

Ինչպես է այն աշխատում

Այս հաշվիչը լիովին աշխատում է ձեր դիտարկիչում՝ օգտագործելով React state-ը և դիտարկիչի ներկառուցված localStorage API-ն — չկա սերվեր, չկա հաշիվ, և տվյալները ոչ մի տեղ չեն ուղարկվում։ Հաշվարկները ինքնաբերաբար գոյատևում են էջի թարմացումներից, և լիաէկրան ռեժիմն օգտագործում է Screen Wake Lock API-ն՝ ձեր էկրանը հաշվելու ընթացքում միացած պահելու համար։

1. 1
   Վիճակը պահվում է localStorage-ում

   Երբ էջը բեռնվում է, գործիքը կարդում է localStorage-ից նախկինում պահված ցանկացած հաշվիչ՝ ֆիքսված բանալու տակ։ Յուրաքանչյուր հաշվիչ — իր պիտակը, ընթացիկ արժեքը, քայլի չափը և բացասական թվերի թույլտվության դրոշակը — սերիալացվում է որպես JSON և գրվում է հետ localStorage-ում ամեն փոփոխության ժամանակ, ուստի ձեր հաշվարկները գոյատևում են ներդիրի պատահական փակումներից կամ թարմացումներից։
2. 2
   Ավելացում/նվազեցում React state-ի միջոցով

   + սեղմելը կամ մեծ կենտրոնական կոճակը կանչում են թարմացնող ֆունկցիա, որն ավելացնում է կարգավորված քայլի արժեքը հաշվիչի ընթացիկ արժեքին։ Եթե բացասական թվերի թույլտվությունն անջատված է, արդյունքը սահմանափակվում է զրոյով՝ Math.max-ով։ Ստեղնաշարի դյուրանցումները (Space/+ ավելացնելու, -/Backspace նվազեցնելու համար) միացված են window keydown ունկնդրի միջոցով, որը թիրախավորում է ցանկացած ակտիվ հաշվիչ։
3. 3
   Լիաէկրան ռեժիմ՝ Screen Wake Lock-ով

   Լիաէկրան ռեժիմ մտնելը ցուցադրում է ծածկույթ, որտեղ ամբողջ էկրանը հպման թիրախ է։ Միաժամանակ գործիքը հարցում է անում wake lock-ի համար՝ navigator.wakeLock.request('screen')-ով — դիտարկիչի API, որը խնդրում է օպերացիոն համակարգից կանխել էկրանի քնելը։ Կողպեքը ինքնաբերաբար վերականգնվում է, եթե ներդիրը կրկին տեսանելի է դառնում ֆոնից հետո։
4. 4
   Մի քանի հաշվիչ՝ ընդհանուր գումարով

   Երկրորդ հաշվիչ ավելացնելը ստեղծում է նոր մուտք՝ crypto.randomUUID()-ով ստեղծված ID-ով։ Երբ կա մեկից ավելի հաշվիչ, ընդհանուր գումարը հաշվարկվում է բոլոր արժեքները գումարելով և ցուցադրվում է հաշվիչների ցանկից վերև։ Յուրաքանչյուր հաշվիչ ունի անկախ քայլ, զրոյացում և բացասական թվերի թույլտվության կարգավորումներ։

Առնչվող գործիքներ