Yoto Card App - Money Around Me

A dynamic Yoto Card App that provides educational content about money and finance, adapting to different regions and times of day.

🔒 Security Notice

IMPORTANT: This app uses sensitive API credentials. Never commit secrets to version control!

🚀 Quick Start

1. Set up environment variables:

   # Copy the example and fill in your values
   cp config.example.py config.py
   cp start.sh.example start.sh
   # Edit local.env with your actual credentials

2. Start the app:

   # Make start.sh executable
   chmod +x start.sh
   # Start the app (loads from local.env)
   ./start.sh

3. Set up ngrok for HTTPS:

   ngrok http 5000
   # Update YOTO_REDIRECT_URI in local.env

📁 Project Structure

Yoto2/
├── app.py                 # Main Flask application
├── config.py             # Configuration (SECURE - uses env vars)
├── config.example.py     # Template for configuration
├── local.env            # Local development secrets (DO NOT COMMIT)
├── load_env.py          # Script to load environment variables
├── .gitignore           # Protects secrets from being committed
├── static/
│   └── audio/           # Audio files for different variants
└── requirements.txt     # Python dependencies

🔐 Environment Variables

Required environment variables:

• YOTO_CLIENT_ID: Your Yoto API client ID
• YOTO_CLIENT_SECRET: Your Yoto API client secret
• BASE_URL: Your app's public HTTPS URL
• YOTO_REDIRECT_URI: OAuth callback URL
• FLASK_SECRET: Secret key for Flask sessions

🎵 Audio Content

The app serves 2 episodes with 12 variants total:

• 2 episodes × 3 regions × 2 times = 12 variants
• Regions: Europe, Americas, Asia
• Times: Morning, Evening

🧪 Testing

1. Test OAuth flow:

   • Visit https://your-domain.com/install
   • Complete Yoto login
   • Card should appear in your Yoto library

2. Test streaming:

   • Visit https://your-domain.com/stream/ep1.mp3
   • Should return audio content

3. Test dynamic icons:

   • Visit https://your-domain.com/icon.png?ep=1
   • Should return 16x16 PNG icon

🚨 Security Checklist

• .gitignore includes config.py and local.env
• No secrets in config.py (uses environment variables)
• local.env is not committed to git
• All sensitive data is in environment variables
• OAuth redirect URI is HTTPS
• Flask secret is secure and random

📝 Notes

• The app automatically detects country and time of day
• Audio content is generated dynamically based on context
• Icons are generated as 16x16 PNG images
• All content is kid-friendly and educational