Gait Analyzer

GaitAI - Iframe Embed Example

How to Embed in Your Website

Start the Flask server: Run python gait_analyzer.py or python start_server.py
Copy the iframe code: Use the code example below
Update the URL: Change localhost:5000 to your server's URL
Paste into your website: Add the iframe to your HTML page

Iframe Code

<!-- Basic iframe embed -->
<iframe 
    src="http://localhost:5000" 
    width="100%" 
    height="800px" 
    frameborder="0"
    title="GaitAI Analysis Platform">
</iframe>
        

Responsive Iframe (Recommended)

This version adapts to different screen sizes:

<!-- Responsive iframe embed -->
<div style="position: relative; width: 100%; height: 0; padding-bottom: 100%;">
    <iframe 
        src="http://localhost:5000" 
        style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;"
        title="GaitAI Analysis Platform">
    </iframe>
</div>
        

Customization Options

<!-- Custom height and styling -->
<iframe 
    src="http://localhost:5000" 
    width="100%" 
    height="600px" 
    frameborder="0"
    style="border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.1);"
    title="GaitAI Analysis Platform">
</iframe>

<!-- With loading message -->
<div style="position: relative;">
    <iframe 
        src="http://localhost:5000" 
        width="100%" 
        height="800px" 
        frameborder="0"
        onload="this.style.opacity='1'"
        style="opacity: 0; transition: opacity 0.3s;"
        title="GaitAI Analysis Platform">
    </iframe>
    <div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">
        Loading GaitAI...
    </div>
</div>
        

Production Deployment

Deploy Flask app: Use services like Heroku, Railway, or DigitalOcean
Update URL: Replace localhost:5000 with your production URL
Add HTTPS: Ensure your server uses HTTPS for security
Test thoroughly: Verify the iframe works on all devices

Troubleshooting

<!-- If you see a blank iframe, check: -->
1. Is the Flask server running? (python gait_analyzer.py)
2. Is the URL correct? (http://localhost:5000)
3. Are there any CORS issues?
4. Check browser console for errors

<!-- For CORS issues, add to your Flask app: -->
from flask_cors import CORS
app = Flask(__name__)
CORS(app)
        