Spaces:

DevNumb
/

faultdetectionchillers

Build error

App Files Files Community

DevNumb commited on 26 days ago

Commit

d8a0147

verified ·

1 Parent(s): 34b2711

Update app.py

Browse files

Files changed (1) hide show

app.py +277 -168

app.py CHANGED Viewed

@@ -1,6 +1,6 @@
-from fastapi import FastAPI, Request, Form
 from fastapi.responses import HTMLResponse
-from fastapi.templating import Jinja2Templates
 import numpy as np
 import torch
 import torch.nn as nn
@@ -8,7 +8,7 @@ from sklearn.ensemble import RandomForestClassifier
 from sklearn.svm import SVC
 from sklearn.preprocessing import StandardScaler
 import warnings
-import os
 warnings.filterwarnings('ignore')
 app = FastAPI(title="Chiller Fault Detection System")
@@ -60,7 +60,7 @@ class HybridFDDModel:
             "Condenser Fouling"
         ]
-        samples_per_class = 500
         for class_idx, fault_name in enumerate(fault_types):
             for _ in range(samples_per_class):
@@ -194,28 +194,32 @@ class HybridFDDModel:
         return fault_types
 # Initialize model
-print("Training model...")
 model = HybridFDDModel()
 fault_types = model.train_demo()
 print(f"Model ready! Trained on {len(fault_types)} classes")
-# HTML template
-HTML_TEMPLATE = """
-<!DOCTYPE html>
-<html>
 <head>
-    <title>Chiller Fault Detection System</title>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
     <style>
-        * { box-sizing: border-box; }
-        body {
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
             margin: 0;
-            padding: 20px;
             background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
             min-height: 100vh;
         }
         .container {
             max-width: 1400px;
             margin: 0 auto;
@@ -224,48 +228,70 @@ HTML_TEMPLATE = """
             box-shadow: 0 20px 60px rgba(0,0,0,0.3);
             overflow: hidden;
         }
         .header {
             background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
             color: white;
             padding: 30px;
             text-align: center;
         }
-        h1 { margin: 0; font-size: 2em; }
-        .subtitle { margin: 10px 0 0; opacity: 0.9; }
-        .content { display: flex; flex-wrap: wrap; }
         .inputs {
             flex: 2;
             padding: 30px;
             background: #f8f9fa;
         }
         .results {
             flex: 1;
             padding: 30px;
             background: white;
             border-left: 1px solid #e0e0e0;
         }
         .input-group {
             margin-bottom: 15px;
             display: flex;
             flex-wrap: wrap;
             align-items: center;
         }
         .input-group label {
             width: 250px;
             font-weight: 600;
             color: #333;
         }
         .input-group input {
             flex: 1;
-            padding: 8px 12px;
-            border: 1px solid #ddd;
-            border-radius: 5px;
             font-size: 14px;
         }
         .input-group input:focus {
             outline: none;
             border-color: #667eea;
         }
         button {
             background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
             color: white;
@@ -277,17 +303,25 @@ HTML_TEMPLATE = """
             cursor: pointer;
             width: 100%;
             margin-top: 20px;
-            transition: transform 0.2s;
         }
         button:hover {
             transform: translateY(-2px);
         }
         .result-card {
             background: #f8f9fa;
             border-radius: 10px;
             padding: 20px;
             margin-bottom: 20px;
         }
         .status {
             font-size: 24px;
             font-weight: bold;
@@ -296,37 +330,97 @@ HTML_TEMPLATE = """
             border-radius: 10px;
             margin-bottom: 20px;
         }
-        .status.normal { background: #d4edda; color: #155724; }
-        .status.fault { background: #f8d7da; color: #721c24; }
         .metric {
             display: flex;
             justify-content: space-between;
-            padding: 10px 0;
             border-bottom: 1px solid #e0e0e0;
         }
-        .metric-label { font-weight: 600; }
-        .metric-value { color: #667eea; font-weight: bold; }
         .severity {
-            padding: 5px 10px;
             border-radius: 5px;
             display: inline-block;
             font-weight: bold;
         }
-        .severity.HIGH { background: #dc3545; color: white; }
-        .severity.MEDIUM { background: #ffc107; color: #333; }
-        .severity.LOW { background: #28a745; color: white; }
         .info {
             background: #e7f3ff;
             padding: 15px;
             border-radius: 10px;
             margin-top: 20px;
             font-size: 14px;
         }
-        h3 { margin-top: 0; color: #333; }
         @media (max-width: 768px) {
-            .inputs, .results { flex: 100%; }
-            .results { border-left: none; border-top: 1px solid #e0e0e0; }
-            .input-group label { width: 100%; margin-bottom: 5px; }
         }
     </style>
 </head>
@@ -338,153 +432,185 @@ HTML_TEMPLATE = """
             <div class="subtitle">Trained on ASHRAE RP-1043 Dataset | 95%+ Accuracy</div>
         </div>
-        <form method="POST" action="/predict">
-            <div class="content">
-                <div class="inputs">
-                    <h3>📊 Chiller Parameters</h3>
-                    <div class="input-group">
-                        <label>🌡️ Chilled Water Supply Temp (°C):</label>
-                        <input type="number" step="0.1" name="temp_chilled_supply" value="7.2" required>
-                    </div>
-                    <div class="input-group">
-                        <label>🌡️ Chilled Water Return Temp (°C):</label>
-                        <input type="number" step="0.1" name="temp_chilled_return" value="12.1" required>
-                    </div>
-                    <div class="input-group">
-                        <label>🌡️ Condenser Water Supply Temp (°C):</label>
-                        <input type="number" step="0.1" name="temp_cond_supply" value="28.5" required>
-                    </div>
-                    <div class="input-group">
-                        <label>🌡️ Condenser Water Return Temp (°C):</label>
-                        <input type="number" step="0.1" name="temp_cond_return" value="34.8" required>
-                    </div>
-                    <div class="input-group">
-                        <label>📊 Evaporator Pressure (kPa):</label>
-                        <input type="number" step="5" name="pressure_evap" value="345" required>
-                    </div>
-                    <div class="input-group">
-                        <label>📊 Condenser Pressure (kPa):</label>
-                        <input type="number" step="5" name="pressure_cond" value="795" required>
-                    </div>
-                    <div class="input-group">
-                        <label>⚡ Compressor Power (kW):</label>
-                        <input type="number" step="5" name="power_compressor" value="148" required>
-                    </div>
-                    <div class="input-group">
-                        <label>💧 Refrigerant Flow (kg/s):</label>
-                        <input type="number" step="0.1" name="flow_refrigerant" value="5.1" required>
-                    </div>
-                    <div class="input-group">
-                        <label>🛢️ Oil Temperature (°C):</label>
-                        <input type="number" step="1" name="temp_oil" value="44" required>
-                    </div>
-                    <div class="input-group">
-                        <label>🔥 Superheat (K):</label>
-                        <input type="number" step="0.1" name="superheat" value="5.2" required>
-                    </div>
-                    <div class="input-group">
-                        <label>❄️ Subcooling (K):</label>
-                        <input type="number" step="0.1" name="subcooling" value="4.1" required>
-                    </div>
-                    <div class="input-group">
-                        <label>📏 Evaporator Approach (K):</label>
-                        <input type="number" step="0.1" name="approach_evap" value="2.1" required>
-                    </div>
-                    <div class="input-group">
-                        <label>📏 Condenser Approach (K):</label>
-                        <input type="number" step="0.1" name="approach_cond" value="3.2" required>
-                    </div>
-                    <div class="input-group">
-                        <label>❄️ Cooling Capacity (kW):</label>
-                        <input type="number" step="10" name="capacity_cooling" value="495" required>
-                    </div>
-                    <div class="input-group">
-                        <label>📈 COP:</label>
-                        <input type="number" step="0.1" name="cop" value="4.6" required>
                     </div>
-                    <button type="submit">🔍 Diagnose System</button>
                 </div>
-                <div class="results">
-                    <h3>📋 Diagnosis Result</h3>
-                    {% if result %}
-                    <div class="status {{ 'normal' if result.Status == '✅ NORMAL OPERATION' else 'fault' }}">
-                        {{ result.Status }}
                     </div>
                     <div class="result-card">
                         <div class="metric">
                             <span class="metric-label">Detected Fault:</span>
-                            <span class="metric-value">{{ result.Detected_Fault }}</span>
                         </div>
                         <div class="metric">
                             <span class="metric-label">Confidence:</span>
-                            <span class="metric-value">{{ result.Confidence }}</span>
                         </div>
                         <div class="metric">
                             <span class="metric-label">Severity:</span>
                             <span class="metric-value">
-                                <span class="severity {{ result.Severity }}">{{ result.Severity }}</span>
                             </span>
                         </div>
                         <div class="metric">
                             <span class="metric-label">Fault Code:</span>
-                            <span class="metric-value">{{ result.Fault_Code }}</span>
                         </div>
                     </div>
                     <div class="info">
                         <strong>📝 Recommended Action:</strong><br>
-                        {{ result.Recommended_Action }}
-                    </div>
-                    {% else %}
-                    <div class="info">
-                        <strong>ℹ️ Instructions:</strong><br>
-                        Enter chiller parameters on the left and click "Diagnose System" to get fault analysis.
-                    </div>
-                    {% endif %}
-                    <div class="info" style="margin-top: 20px;">
-                        <strong>🏗️ Architecture:</strong><br>
-                        Random Forest (Feature Selection) → Neural Network (Representation Learning) → SVM (Classification)
                     </div>
-                </div>
-            </div>
-        </form>
-    </div>
 </body>
 </html>
 """
 @app.get("/", response_class=HTMLResponse)
 async def home():
-    return HTMLResponse(content=HTML_TEMPLATE.replace("{% if result %}", "{% if result %}").replace("{{ result.Status }}", "{{ result.Status }}").replace("{{ result.Detected_Fault }}", "{{ result.Detected_Fault }}").replace("{{ result.Confidence }}", "{{ result.Confidence }}").replace("{{ result.Severity }}", "{{ result.Severity }}").replace("{{ result.Fault_Code }}", "{{ result.Fault_Code }}").replace("{{ result.Recommended_Action }}", "{{ result.Recommended_Action }}"))
-@app.post("/predict", response_class=HTMLResponse)
-async def predict(
-    request: Request,
-    temp_chilled_supply: float = Form(...),
-    temp_chilled_return: float = Form(...),
-    temp_cond_supply: float = Form(...),
-    temp_cond_return: float = Form(...),
-    pressure_evap: float = Form(...),
-    pressure_cond: float = Form(...),
-    power_compressor: float = Form(...),
-    flow_refrigerant: float = Form(...),
-    temp_oil: float = Form(...),
-    superheat: float = Form(...),
-    subcooling: float = Form(...),
-    approach_evap: float = Form(...),
-    approach_cond: float = Form(...),
-    capacity_cooling: float = Form(...),
-    cop: float = Form(...)
-):
-    features = np.array([[temp_chilled_supply, temp_chilled_return, temp_cond_supply,
-                         temp_cond_return, pressure_evap, pressure_cond, power_compressor,
-                         flow_refrigerant, temp_oil, superheat, subcooling,
-                         approach_evap, approach_cond, capacity_cooling, cop]])
     features_scaled = model.scaler.transform(features)
     features_selected = features_scaled[:, model.top_features_idx]
@@ -513,7 +639,7 @@ async def predict(
     severity = "HIGH" if confidence > 80 else "MEDIUM" if confidence > 60 else "LOW"
-    result = {
         "Status": "⚠️ FAULT DETECTED" if is_fault else "✅ NORMAL OPERATION",
         "Detected_Fault": fault_name,
         "Confidence": f"{confidence:.1f}%",
@@ -521,23 +647,6 @@ async def predict(
         "Recommended_Action": recommendations.get(fault_name, "No action needed") if is_fault else "System operating normally",
         "Fault_Code": f"F{prediction}" if is_fault else "NORMAL"
     }
-    # Inject result into template
-    html = HTML_TEMPLATE.replace("{% if result %}", "{% if True %}")
-    html = html.replace("{{ result.Status }}", result["Status"])
-    html = html.replace("{{ result.Detected_Fault }}", result["Detected_Fault"])
-    html = html.replace("{{ result.Confidence }}", result["Confidence"])
-    html = html.replace("{{ result.Severity }}", result["Severity"])
-    html = html.replace("{{ result.Fault_Code }}", result["Fault_Code"])
-    html = html.replace("{{ result.Recommended_Action }}", result["Recommended_Action"])
-    # Fix status class
-    if result["Status"] == "✅ NORMAL OPERATION":
-        html = html.replace("{{ 'normal' if result.Status == '✅ NORMAL OPERATION' else 'fault' }}", "normal")
-    else:
-        html = html.replace("{{ 'normal' if result.Status == '✅ NORMAL OPERATION' else 'fault' }}", "fault")
-    return HTMLResponse(content=html)
 if __name__ == "__main__":
     import uvicorn

+from fastapi import FastAPI, Request
 from fastapi.responses import HTMLResponse
+from fastapi.staticfiles import StaticFiles
 import numpy as np
 import torch
 import torch.nn as nn
 from sklearn.svm import SVC
 from sklearn.preprocessing import StandardScaler
 import warnings
+import json
 warnings.filterwarnings('ignore')
 app = FastAPI(title="Chiller Fault Detection System")
             "Condenser Fouling"
         ]
+        samples_per_class = 400
         for class_idx, fault_name in enumerate(fault_types):
             for _ in range(samples_per_class):
         return fault_types
 # Initialize model
+print("Training model... This may take a moment")
 model = HybridFDDModel()
 fault_types = model.train_demo()
 print(f"Model ready! Trained on {len(fault_types)} classes")
+# HTML/CSS/JS Interface
+HTML_PAGE = """<!DOCTYPE html>
+<html lang="en">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Chiller Fault Detection System</title>
     <style>
+        * {
             margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
             background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
             min-height: 100vh;
+            padding: 20px;
         }
         .container {
             max-width: 1400px;
             margin: 0 auto;
             box-shadow: 0 20px 60px rgba(0,0,0,0.3);
             overflow: hidden;
         }
         .header {
             background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
             color: white;
             padding: 30px;
             text-align: center;
         }
+        h1 {
+            font-size: 2em;
+            margin-bottom: 10px;
+        }
+        .subtitle {
+            opacity: 0.9;
+            margin-top: 5px;
+        }
+        .content {
+            display: flex;
+            flex-wrap: wrap;
+        }
         .inputs {
             flex: 2;
             padding: 30px;
             background: #f8f9fa;
         }
         .results {
             flex: 1;
             padding: 30px;
             background: white;
             border-left: 1px solid #e0e0e0;
         }
         .input-group {
             margin-bottom: 15px;
             display: flex;
             flex-wrap: wrap;
             align-items: center;
         }
         .input-group label {
             width: 250px;
             font-weight: 600;
             color: #333;
+            font-size: 14px;
         }
         .input-group input {
             flex: 1;
+            padding: 10px 12px;
+            border: 2px solid #e0e0e0;
+            border-radius: 8px;
             font-size: 14px;
+            transition: border-color 0.3s;
         }
         .input-group input:focus {
             outline: none;
             border-color: #667eea;
         }
         button {
             background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
             color: white;
             cursor: pointer;
             width: 100%;
             margin-top: 20px;
+            transition: transform 0.2s, box-shadow 0.2s;
         }
         button:hover {
             transform: translateY(-2px);
+            box-shadow: 0 5px 20px rgba(102, 126, 234, 0.4);
         }
+        button:active {
+            transform: translateY(0);
+        }
         .result-card {
             background: #f8f9fa;
             border-radius: 10px;
             padding: 20px;
             margin-bottom: 20px;
         }
         .status {
             font-size: 24px;
             font-weight: bold;
             border-radius: 10px;
             margin-bottom: 20px;
         }
+        .status.normal {
+            background: #d4edda;
+            color: #155724;
+            border: 2px solid #c3e6cb;
+        }
+        .status.fault {
+            background: #f8d7da;
+            color: #721c24;
+            border: 2px solid #f5c6cb;
+        }
         .metric {
             display: flex;
             justify-content: space-between;
+            padding: 12px 0;
             border-bottom: 1px solid #e0e0e0;
         }
+        .metric:last-child {
+            border-bottom: none;
+        }
+        .metric-label {
+            font-weight: 600;
+            color: #555;
+        }
+        .metric-value {
+            color: #667eea;
+            font-weight: bold;
+        }
         .severity {
+            padding: 4px 10px;
             border-radius: 5px;
             display: inline-block;
             font-weight: bold;
+            font-size: 12px;
         }
+        .severity.HIGH {
+            background: #dc3545;
+            color: white;
+        }
+        .severity.MEDIUM {
+            background: #ffc107;
+            color: #333;
+        }
+        .severity.LOW {
+            background: #28a745;
+            color: white;
+        }
         .info {
             background: #e7f3ff;
             padding: 15px;
             border-radius: 10px;
             margin-top: 20px;
             font-size: 14px;
+            line-height: 1.5;
+        }
+        h3 {
+            margin-top: 0;
+            margin-bottom: 15px;
+            color: #333;
+        }
+        .loading {
+            text-align: center;
+            padding: 40px;
+            color: #667eea;
+            font-weight: bold;
         }
         @media (max-width: 768px) {
+            .inputs, .results {
+                flex: 100%;
+            }
+            .results {
+                border-left: none;
+                border-top: 1px solid #e0e0e0;
+            }
+            .input-group label {
+                width: 100%;
+                margin-bottom: 5px;
+            }
         }
     </style>
 </head>
             <div class="subtitle">Trained on ASHRAE RP-1043 Dataset | 95%+ Accuracy</div>
         </div>
+        <div class="content">
+            <div class="inputs">
+                <h3>📊 Chiller Parameters</h3>
+                <div class="input-group">
+                    <label>🌡️ Chilled Water Supply Temp (°C):</label>
+                    <input type="number" step="0.1" id="temp_chilled_supply" value="7.2">
+                </div>
+                <div class="input-group">
+                    <label>🌡️ Chilled Water Return Temp (°C):</label>
+                    <input type="number" step="0.1" id="temp_chilled_return" value="12.1">
+                </div>
+                <div class="input-group">
+                    <label>🌡️ Condenser Water Supply Temp (°C):</label>
+                    <input type="number" step="0.1" id="temp_cond_supply" value="28.5">
+                </div>
+                <div class="input-group">
+                    <label>🌡️ Condenser Water Return Temp (°C):</label>
+                    <input type="number" step="0.1" id="temp_cond_return" value="34.8">
+                </div>
+                <div class="input-group">
+                    <label>📊 Evaporator Pressure (kPa):</label>
+                    <input type="number" step="5" id="pressure_evap" value="345">
+                </div>
+                <div class="input-group">
+                    <label>📊 Condenser Pressure (kPa):</label>
+                    <input type="number" step="5" id="pressure_cond" value="795">
+                </div>
+                <div class="input-group">
+                    <label>⚡ Compressor Power (kW):</label>
+                    <input type="number" step="5" id="power_compressor" value="148">
+                </div>
+                <div class="input-group">
+                    <label>💧 Refrigerant Flow (kg/s):</label>
+                    <input type="number" step="0.1" id="flow_refrigerant" value="5.1">
+                </div>
+                <div class="input-group">
+                    <label>🛢️ Oil Temperature (°C):</label>
+                    <input type="number" step="1" id="temp_oil" value="44">
+                </div>
+                <div class="input-group">
+                    <label>🔥 Superheat (K):</label>
+                    <input type="number" step="0.1" id="superheat" value="5.2">
+                </div>
+                <div class="input-group">
+                    <label>❄️ Subcooling (K):</label>
+                    <input type="number" step="0.1" id="subcooling" value="4.1">
+                </div>
+                <div class="input-group">
+                    <label>📏 Evaporator Approach (K):</label>
+                    <input type="number" step="0.1" id="approach_evap" value="2.1">
+                </div>
+                <div class="input-group">
+                    <label>📏 Condenser Approach (K):</label>
+                    <input type="number" step="0.1" id="approach_cond" value="3.2">
+                </div>
+                <div class="input-group">
+                    <label>❄️ Cooling Capacity (kW):</label>
+                    <input type="number" step="10" id="capacity_cooling" value="495">
+                </div>
+                <div class="input-group">
+                    <label>📈 COP:</label>
+                    <input type="number" step="0.1" id="cop" value="4.6">
+                </div>
+                <button onclick="diagnose()">🔍 Diagnose System</button>
+            </div>
+            <div class="results">
+                <h3>📋 Diagnosis Result</h3>
+                <div id="result">
+                    <div class="info">
+                        <strong>ℹ️ Instructions:</strong><br>
+                        Enter chiller parameters on the left and click "Diagnose System" to get fault analysis.
                     </div>
                 </div>
+                <div class="info" style="margin-top: 20px;">
+                    <strong>🏗️ Architecture:</strong><br>
+                    Random Forest (Feature Selection) → Neural Network (Representation Learning) → SVM (Classification)
+                </div>
+            </div>
+        </div>
+    </div>
+    <script>
+        async function diagnose() {
+            const resultDiv = document.getElementById('result');
+            resultDiv.innerHTML = '<div class="loading">🔍 Analyzing system parameters...</div>';
+            const data = {
+                temp_chilled_supply: parseFloat(document.getElementById('temp_chilled_supply').value),
+                temp_chilled_return: parseFloat(document.getElementById('temp_chilled_return').value),
+                temp_cond_supply: parseFloat(document.getElementById('temp_cond_supply').value),
+                temp_cond_return: parseFloat(document.getElementById('temp_cond_return').value),
+                pressure_evap: parseFloat(document.getElementById('pressure_evap').value),
+                pressure_cond: parseFloat(document.getElementById('pressure_cond').value),
+                power_compressor: parseFloat(document.getElementById('power_compressor').value),
+                flow_refrigerant: parseFloat(document.getElementById('flow_refrigerant').value),
+                temp_oil: parseFloat(document.getElementById('temp_oil').value),
+                superheat: parseFloat(document.getElementById('superheat').value),
+                subcooling: parseFloat(document.getElementById('subcooling').value),
+                approach_evap: parseFloat(document.getElementById('approach_evap').value),
+                approach_cond: parseFloat(document.getElementById('approach_cond').value),
+                capacity_cooling: parseFloat(document.getElementById('capacity_cooling').value),
+                cop: parseFloat(document.getElementById('cop').value)
+            };
+            try {
+                const response = await fetch('/api/predict', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    body: JSON.stringify(data)
+                });
+                const result = await response.json();
+                const statusClass = result.Status === '✅ NORMAL OPERATION' ? 'normal' : 'fault';
+                const severityClass = result.Severity === 'HIGH' ? 'HIGH' : (result.Severity === 'MEDIUM' ? 'MEDIUM' : 'LOW');
+                resultDiv.innerHTML = `
+                    <div class="status ${statusClass}">
+                        ${result.Status}
                     </div>
                     <div class="result-card">
                         <div class="metric">
                             <span class="metric-label">Detected Fault:</span>
+                            <span class="metric-value">${result.Detected_Fault}</span>
                         </div>
                         <div class="metric">
                             <span class="metric-label">Confidence:</span>
+                            <span class="metric-value">${result.Confidence}</span>
                         </div>
                         <div class="metric">
                             <span class="metric-label">Severity:</span>
                             <span class="metric-value">
+                                <span class="severity ${severityClass}">${result.Severity}</span>
                             </span>
                         </div>
                         <div class="metric">
                             <span class="metric-label">Fault Code:</span>
+                            <span class="metric-value">${result.Fault_Code}</span>
                         </div>
                     </div>
                     <div class="info">
                         <strong>📝 Recommended Action:</strong><br>
+                        ${result.Recommended_Action}
                     </div>
+                `;
+            } catch (error) {
+                resultDiv.innerHTML = '<div class="info" style="background: #f8d7da; color: #721c24;"><strong>❌ Error:</strong> Failed to get diagnosis. Please try again.</div>';
+            }
+        }
+    </script>
 </body>
 </html>
 """
 @app.get("/", response_class=HTMLResponse)
 async def home():
+    return HTMLResponse(content=HTML_PAGE)
+@app.post("/api/predict")
+async def predict(request: Request):
+    data = await request.json()
+    features = np.array([[
+        data['temp_chilled_supply'], data['temp_chilled_return'],
+        data['temp_cond_supply'], data['temp_cond_return'],
+        data['pressure_evap'], data['pressure_cond'],
+        data['power_compressor'], data['flow_refrigerant'],
+        data['temp_oil'], data['superheat'], data['subcooling'],
+        data['approach_evap'], data['approach_cond'],
+        data['capacity_cooling'], data['cop']
+    ]])
     features_scaled = model.scaler.transform(features)
     features_selected = features_scaled[:, model.top_features_idx]
     severity = "HIGH" if confidence > 80 else "MEDIUM" if confidence > 60 else "LOW"
+    return {
         "Status": "⚠️ FAULT DETECTED" if is_fault else "✅ NORMAL OPERATION",
         "Detected_Fault": fault_name,
         "Confidence": f"{confidence:.1f}%",
         "Recommended_Action": recommendations.get(fault_name, "No action needed") if is_fault else "System operating normally",
         "Fault_Code": f"F{prediction}" if is_fault else "NORMAL"
     }
 if __name__ == "__main__":
     import uvicorn