🌿 Heidi Malayalam — Kids PWA

A clean, modern Progressive Web App for watching Heidi cartoon in Malayalam — and only Heidi. Built for kids aged 2–4. No ads, no recommendations, no distractions.

• 📱 PWA — installs to home screen like a native app
• 🎬 Only Heidi — curated via YouTube API search, no random recommendations
• 👆 Swipe navigation — swipe up/down between episodes (like Reels/Shorts)
• 🚫 End-screen blocked — YouTube recommendation cards are hidden; only a "Play next" button shows
• 🔁 Auto-advance — next episode plays automatically after current ends
• 📵 Works offline — after first load, core app is cached
• 🌿 Malayalam UI — results filtered by Malayalam language

1. Open the app → tap Set up API key
2. Follow the steps to create a free YouTube Data API v3 key
3. Paste it in — the app will search YouTube for Heidi Malayalam videos automatically

Open app.js and find the CURATED_IDS array at the top. Add YouTube video IDs there:

CURATED_IDS: [
  'VIDEO_ID_1',  // from youtube.com/watch?v=VIDEO_ID_1
  'VIDEO_ID_2',
  // ...
],

To find Heidi Malayalam video IDs:

1. Go to YouTube and search "Heidi malayalam"
2. Open a video → copy the v=XXXXXXXXXX part from the URL
3. Add that ID to the list above

npx serve .
# or
python3 -m http.server 8080

Then open http://localhost:8080 on your phone (must be same WiFi network, or use ngrok).

• Vercel: npx vercel → done
• Netlify: drag the folder to netlify.com/drop
• GitHub Pages: push to a repo → enable Pages

⚠️ PWA features (install prompt, service worker) require HTTPS. All the above options provide HTTPS automatically.

heidi/
├── index.html        ← main app shell
├── style.css         ← premium dark UI styles
├── app.js            ← all app logic (swipe, YouTube API, PWA)
├── sw.js             ← service worker (caching, offline)
├── manifest.json     ← PWA manifest
├── icons/
│   ├── heidi-icon.svg   ← source SVG (Heidi character)
│   ├── icon-72.png
│   ├── icon-96.png
│   ├── icon-128.png
│   ├── icon-144.png
│   ├── icon-152.png
│   ├── icon-192.png   ← main icon
│   ├── icon-384.png
│   └── icon-512.png   ← splash screen icon
└── README.md

• The app only ever shows content matching "heidi malayalam cartoon" from YouTube
• Safe search is set to strict
• End-screens (YouTube recommendations) are covered by an overlay
• No navigation away from the app is possible

Built with ❤️ for little ones who love Heidi.