QR

על האפליקציה

QR היא אפליקציה דו-כיוונית: גם סורקת קודי QR מהמצלמה האחורית בזמן אמת, וגם יוצרת קודים חדשים — ארבעה סוגים: טקסט, קישור, רשת WiFi, וכרטיס איש קשר vCard.

הסריקה משתמשת ב-BarcodeDetector API המקומי בדפדפן (Chrome/Edge על Android) — אין שום שליחת תמונה לשרת. ה-frame של המצלמה נצרך ישירות, זוהה, וזרוק.

ה-QR הוא הנקודה שבה העולם הפיזי פוגש את הדיגיטלי. אפליקציה אחת לשני הכיוונים.

לחצו לנסות בעצמכם → ofir.zbang.net/qr

האפליקציה רצה כאן בייצור — אפשר להתקין על המסך הבית. הסריקה דורשת טלפון עם Chrome/Edge (BarcodeDetector). היצירה עובדת בכל דפדפן.

יכולות מרכזיות

סריקה

• BarcodeDetector API מקומי — זיהוי על ה-device, לא בשרת. instant detect ב-30fps.
• Viewfinder מעוצב — corners מוארים, scan-line שמסתובבת, mask radial עדין.
• זיהוי סוג אוטומטי — URL / WiFi / vCard / email / phone / location / text. כפתור "פתח" יודע איך לטפל בכל אחד.
• dedup — אם סורק את אותו קוד פעמיים, לא מוסיף שכפול.
• רטט feedback ברגע הזיהוי.
• Wake Lock במהלך סריקה.

יצירה

• 4 סוגי קלט:
  • טקסט חופשי — עד 500 תווים
  • URL — עם validation אוטומטי
  • WiFi — SSID + password + WPA/WEP/none → קוד שטלפונים מתחברים אוטומטית
  • vCard — שם + טלפון + אימייל → קוד שמוסיף לרשימת אנשי קשר
• רינדור Canvas — auto-detect best version של QR, error correction level M (fallback ל-L לטקסטים ארוכים).
• הורדה PNG — הקוד נשמר כקובץ במכשיר.
• Web Share API עם תמיכה ב-files (אם הדפדפן תומך) — שיתוף הקוד עם הדמות לוואטסאפ/טלגרם.

היסטוריה

• שני trackers נפרדים — scans ו-gens, IndexedDB stores נפרדים עם indexes על createdAt.
• icons מסוננים לפי type של הקוד.

ארכיטקטורת ה-PWA

• BarcodeDetector API — new BarcodeDetector({ formats: ['qr_code'] }) עם detector.detect(video) בלולאת requestAnimationFrame.
• getUserMedia עם facingMode: { ideal: 'environment' } ו-resolution אופטימלי 1280x720.
• qrcode-generator — Kazuhiko Arase library (~20KB) — פעם אחת cached דרך SW, אחרי זה offline-first.
• Auto-version detection — qrcode(0, level) מחשב גרסה מתאימה לפי אורך הטקסט.
• Custom canvas rendering — לא ה-built-in img של ה-library, אלא ציור מותאם בצבעי האפליקציה (deep midnight purple על cream).
• Permissions-Policy — camera=(self) עבור הסריקה.
• Vanilla JS, dependency אחת (qrcode-generator), כ-50KB total.

עיצוב

• פלטה fuchsia/magenta — #d946ef fuchsia-500 + #f0abfc light + #6366f1 indigo gradient. רקע deep purple-midnight #0c0a1f.
• Cyberpunk feel — neon corners בviewfinder, scan-line זוהר, gradient orbs ברקע.
• Mode tabs מעוצבים — segmented control עם gradient pill על המצב הפעיל.
• QR בצבעי האפליקציה — לא שחור-לבן סטנדרטי, אלא midnight purple על cream.

פרטיות מוחלטת

• שום תמונה לא נשמרת ולא נשלחת לשרת. frame buffer נצרך וזורק.
• כל הסריקות וההיצירות נשמרות רק במכשיר ב-IndexedDB.
• אין רישום, אין tracking.