Add Flask app with OpenRouter models display

app.py

@@ -0,0 +1,155 @@
+from flask import Flask, jsonify, Response, render_template_string
+import requests
+from cachetools import TTLCache
+import json
+
+app = Flask(__name__)
+
+# Cache for 3 hours (10800 seconds)
+cache = TTLCache(maxsize=1, ttl=10800)
+
+def fetch_models():
+    """Fetch models from OpenRouter API."""
+    if 'models' in cache:
+        return cache['models']
+    
+    resp = requests.get('https://openrouter.ai/api/v1/models', timeout=30)
+    resp.raise_for_status()
+    data = resp.json()
+    models = data.get('data', [])
+    cache['models'] = models
+    return models
+
+HTML_TEMPLATE = '''
+<!DOCTYPE html>
+<html>
+<head>
+    <title>OpenRouter Models</title>
+    <meta charset="utf-8">
+    <style>
+        body { font-family: -apple-system, BlinkMacSystemFont, sans-serif; margin: 20px; background: #f5f5f5; }
+        .header { background: #1a1a2e; color: white; padding: 20px; border-radius: 8px; margin-bottom: 20px; }
+        .header h1 { margin: 0; }
+        .header p { margin: 10px 0 0; opacity: 0.8; }
+        .actions { margin: 20px 0; }
+        .btn { display: inline-block; padding: 10px 20px; margin-right: 10px; background: #4a9eff; color: white; text-decoration: none; border-radius: 5px; }
+        .btn:hover { background: #3a8eef; }
+        .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap: 15px; }
+        .card { background: white; padding: 15px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
+        .card h3 { margin: 0 0 10px; font-size: 14px; word-break: break-all; color: #333; }
+        .card .pricing { color: #28a745; font-weight: bold; margin: 5px 0; }
+        .card .context { color: #666; font-size: 12px; }
+        .badge { display: inline-block; padding: 2px 8px; border-radius: 12px; font-size: 11px; margin-right: 5px; }
+        .badge-free { background: #28a745; color: white; }
+        .badge-paid { background: #dc3545; color: white; }
+        .status { margin-top: 10px; padding-top: 10px; border-top: 1px solid #eee; }
+        .status-indicator { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; }
+        .status-up { background: #28a745; }
+        .status-down { background: #dc3545; }
+        .filters { margin-bottom: 15px; }
+        .filters input { padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; width: 300px; }
+        table { width: 100%; border-collapse: collapse; background: white; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
+        th, td { padding: 12px; text-align: left; border-bottom: 1px solid #eee; }
+        th { background: #1a1a2e; color: white; }
+        tr:hover { background: #f8f9fa; }
+        .mode-tag { font-size: 11px; padding: 2px 6px; border-radius: 3px; background: #e9ecef; }
+    </style>
+</head>
+<body>
+    <div class="header">
+        <h1>🤖 OpenRouter Models Directory</h1>
+        <p>Auto-updates every 3 hours • {{ models|length }} models available</p>
+    </div>
+    
+    <div class="actions">
+        <a href="/api/raw" class="btn">📄 View Raw JSON</a>
+        <a href="/api/download" class="btn">⬇️ Download JSON</a>
+    </div>
+    
+    <div class="filters">
+        <input type="text" id="search" placeholder="Search models..." onkeyup="filterTable()">
+    </div>
+    
+    <table id="modelsTable">
+        <thead>
+            <tr>
+                <th>Model</th>
+                <th>Provider</th>
+                <th>Pricing (Prompt/Completion)</th>
+                <th>Context</th>
+                <th>Status</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for m in models %}
+            <tr>
+                <td><strong>{{ m.name or m.id }}</strong><br><small style="color:#666">{{ m.id }}</small></td>
+                <td>{{ m.id.split('/')[0] if '/' in m.id else 'Unknown' }}</td>
+                <td class="pricing">
+                    ${{ m.pricing.prompt }}/1K → ${{ m.pricing.completion }}/1K
+                </td>
+                <td>{{ "{:,}".format(m.context_length) }} tokens</td>
+                <td>
+                    {% if m.id.startswith('openai/gpt-4') or m.id.startswith('anthropic/claude-3') %}
+                    <span class="badge badge-paid">Paid</span>
+                    {% else %}
+                    <span class="badge badge-free">Available</span>
+                    {% endif %}
+                    <div style="margin-top:5px;font-size:11px;color:#666">
+                        Supports: {{ ", ".join(m.architecture.modality or ['text']) }}
+                    </div>
+                </td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+    
+    <script>
+        function filterTable() {
+            var input = document.getElementById("search");
+            var filter = input.value.toLowerCase();
+            var table = document.getElementById("modelsTable");
+            var tr = table.getElementsByTagName("tr");
+            for (var i = 1; i < tr.length; i++) {
+                var td = tr[i].getElementsByTagName("td");
+                var found = false;
+                for (var j = 0; j < td.length; j++) {
+                    if (td[j] && td[j].textContent.toLowerCase().indexOf(filter) > -1) {
+                        found = true;
+                        break;
+                    }
+                }
+                tr[i].style.display = found ? "" : "none";
+            }
+        }
+    </script>
+</body>
+</html>'''
+
+@app.route('/')
+def index():
+    models = fetch_models()
+    return render_template_string(HTML_TEMPLATE, models=models)
+
+@app.route('/api/raw')
+def raw_json():
+    """Return raw JSON with indent=4."""
+    models = fetch_models()
+    return Response(
+        json.dumps({'data': models}, indent=4),
+        mimetype='application/json'
+    )
+
+@app.route('/api/download')
+def download_json():
+    """Download JSON file."""
+    models = fetch_models()
+    json_str = json.dumps({'data': models}, indent=4)
+    return Response(
+        json_str,
+        mimetype='application/json',
+        headers={'Content-Disposition': 'attachment; filename=openrouter_models.json'}
+    )
+
+if __name__ == '__main__':
+    app.run(host='0.0.0.0', port=7860)