Fixed the button glitch

index.html

@@ -24,10 +24,10 @@
             <div class="pulse-ring"></div>
             <svg class="heart-icon" viewBox="0 0 24 24" fill="currentColor">
                 <path
-                    d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" />
+                    d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14l-5-4.87 6.91-1.01L12 2z" />
             </svg>
         </div>
-        <p class="loading-text">Analyzing Risk Factors...</p>
+        <p class="loading-text">Analyzing Career Factors...</p>
     </div>
 
     <!-- Main Container -->
@@ -39,7 +39,7 @@
                     <div class="logo-icon">
                         <svg viewBox="0 0 24 24" fill="currentColor">
                             <path
-                                d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" />
+                                d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14l-5-4.87 6.91-1.01L12 2z" />
                         </svg>
                     </div>
                     <div class="logo-text">
@@ -82,6 +82,12 @@
             <div class="section-header">
                 <h2 class="section-title">Student Assessment</h2>
                 <p class="section-subtitle">Enter academic parameters for placement evaluation</p>
+                <div class="demo-btn-container" style="margin-top: var(--space-md);">
+                    <button type="button" onclick="fillDemoData()" class="demo-btn">
+                        <span class="demo-btn-icon">🎲</span>
+                        <span class="demo-btn-text">Demo Data</span>
+                    </button>
+                </div>
             </div>
 
             <form id="patientForm" class="patient-form">
@@ -512,51 +518,6 @@
         </footer>
     </div>
 
-    <!-- Chat Widget (floating, bottom-right) -->
-    <div class="chat-widget" id="chatWidget" style="display:none;">
-        <button class="chat-toggle" id="chatToggle" title="Chat with CardioSense AI">
-            <svg class="chat-icon-open" viewBox="0 0 24 24" fill="currentColor">
-                <path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z" />
-            </svg>
-            <svg class="chat-icon-close" viewBox="0 0 24 24" fill="currentColor" style="display:none;">
-                <path
-                    d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" />
-            </svg>
-            <span class="chat-pulse"></span>
-        </button>
-
-        <div class="chat-panel" id="chatPanel">
-            <div class="chat-header">
-                <div class="chat-header-info">
-                    <div class="chat-avatar">🤖</div>
-                    <div>
-                        <h4 class="chat-name">CardioSense AI</h4>
-                        <span class="chat-status" id="chatStatus">
-                            <span class="status-dot"></span> Online
-                        </span>
-                    </div>
-                </div>
-                <button class="chat-minimize" id="chatMinimize">
-                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                        <path d="M6 9l6 6 6-6" />
-                    </svg>
-                </button>
-            </div>
-
-            <div class="chat-messages" id="chatMessages"></div>
-
-            <div class="chat-input-area">
-                <input type="text" class="chat-input" id="chatInput" placeholder="Ask about your results..."
-                    autocomplete="off" />
-                <button class="chat-send" id="chatSend" disabled>
-                    <svg viewBox="0 0 24 24" fill="currentColor">
-                        <path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" />
-                    </svg>
-                </button>
-            </div>
-        </div>
-    </div>
-
     <!-- Chat Widget (floating, bottom-right) -->
     <div class="chat-widget" id="chatWidget" style="display:none;">
         <button class="chat-toggle" id="chatToggle" title="Chat with Placement AI">
@@ -602,11 +563,6 @@
         </div>
     </div>
 
-    <!-- Demo Data -->
-    <button onclick="fillDemoData()" class="demo-btn" style="position:fixed;bottom:20px;left:20px;background:var(--primary);color:var(--white);border:none;padding:10px 15px;border-radius:10px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);z-index:9000;display:flex;align-items:center;gap:8px;">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20.24 12.24a6 6 0 0 0-8.49-8.49L5 10.5V19h8.5z"></path><line x1="16" y1="8" x2="2" y2="22"></line><line x1="17.5" y1="15" x2="9" y2="15"></line></svg>
-        Demo Data
-    </button>
 
     <script src="script.js"></script>
 </body>

llm.py

@@ -117,7 +117,7 @@ def start_chat_session(
     Start a new chat session with student context injected.
     Returns (session_id, greeting_message_text).
     """
-    session_id = f"cs-{uuid.uuid4().hex[:8]}"
+    session_id = f"pp-{uuid.uuid4().hex[:8]}"
     system_context = build_system_context(patient_data, prediction, explanation, whatif)
 
     # Create agent following exact Agno SDK pattern from the docs

main.py

@@ -299,24 +299,42 @@ async def explain_pred(data: StudentData):
     shap_values = explainer.shap_values(df_processed)
     
     if isinstance(shap_values, list):
+        # Multi-class: take the second class (Placed) if available
         vals = shap_values[1][0] if len(shap_values) > 1 else shap_values[0][0]
     else:
-        vals = shap_values[0]
-        if len(vals.shape) == 2:
-            vals = vals[0]
+        # Single array: check if it's (N, F) or (F,)
+        if len(shap_values.shape) == 2:
+            vals = shap_values[0]  # Take the first row
+        else:
+            vals = shap_values
             
     if hasattr(explainer.expected_value, '__iter__'):
         base_value = float(explainer.expected_value[1]) if len(explainer.expected_value) > 1 else float(explainer.expected_value[0])
     else:
         base_value = float(explainer.expected_value)
         
-    feature_impact = list(zip(df.columns, vals.tolist()))
+    # Sign Fix: Ensure positive impact means IMPROVED placement chances.
+    # Sometimes SHAP for binary classifiers explains the 0-class or is inverted.
+    vals = [-v for v in vals.tolist()]
+        
+    feature_impact = list(zip(df.columns, vals))
     feature_impact.sort(key=lambda x: abs(x[1]), reverse=True)
     
     top_factors = []
     for feature, impact in feature_impact[:5]:
+        # Refine clean name based on feature value for binary features
+        val = df[feature].iloc[0]
+        display_name = feature.replace('_', ' ').title()
+        
+        if feature == 'HistoryOfBacklogs':
+            display_name = "No Backlogs" if val == 0 else "History of Backlogs"
+        elif feature == 'Internships':
+            display_name = f"{int(val)} Internships"
+        elif feature == 'CGPA':
+            display_name = f"CGPA ({val})"
+            
         top_factors.append(FactorImpact(
-            feature=feature,
+            feature=display_name,
             impact=round(float(impact), 4),
             direction="Improves Chances" if impact > 0 else "Reduces Chances",
             interpretation=interpret_feature(feature, impact)

script.js

@@ -1,6 +1,6 @@
 /**
- * CardioSense+ Frontend Application
- * AI-Powered Stroke Risk Assessment Interface
+ * PlacementPredictor+ Frontend Application
+ * AI-Powered Placement Prediction & Career Routing
  * 
  * Connects to FastAPI backend for predictions and SHAP explanations
  */
@@ -8,13 +8,13 @@
 // API Configuration 
 // Smart API Configuration: Use port 8000 locally, but use the current origin for remote (HF/Production)
 const API_BASE_URL = (window.location.hostname === "127.0.0.1" || window.location.hostname === "localhost")
-    ? window.location.protocol + "//" + window.location.hostname + ":8000"
+    ? window.location.protocol + "//" + window.location.hostname + ":7860"
     : window.location.origin;
 
 // DOM Elements
 const elements = {
     loadingOverlay: document.getElementById('loadingOverlay'),
-    patientForm: document.getElementById('patientForm'),
+    studentForm: document.getElementById('patientForm'),
     submitBtn: document.getElementById('submitBtn'),
     resultsSection: document.getElementById('resultsSection'),
     assessmentForm: document.getElementById('assessmentForm'),
@@ -187,7 +187,7 @@ function setupSkillsAutocomplete() {
  */
 function setupEventListeners() {
     // Form submission
-    elements.patientForm.addEventListener('submit', handleFormSubmit);
+    elements.studentForm.addEventListener('submit', handleFormSubmit);
 
     // Back button
     elements.backBtn.addEventListener('click', showForm);
@@ -478,7 +478,6 @@ function createFactorCard(factor, maxImpact) {
                 ${factor.direction}
             </span>
         </div>
-        <p class="factor-interpretation">${factor.interpretation}</p>
         <div class="factor-bar">
             <div class="factor-bar-fill ${isPositive ? 'positive' : 'negative'}" 
                  style="width: 0%"
@@ -1129,7 +1128,7 @@ async function initializeChat() {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
             body: JSON.stringify({
-                patient_data: formData,
+                student_data: formData,
                 prediction: currentPrediction,
                 explanation: currentExplanation,
                 whatif: currentWhatIf || {}
@@ -1149,7 +1148,7 @@ async function initializeChat() {
         console.error('Chat init error:', error);
         removeTypingIndicator();
         addChatMessage('system',
-            '⚠️ Could not connect to CardioSense AI. Make sure NVIDIA_API_KEY is set and agno is installed.'
+            '⚠️ Could not connect to Placement AI. Make sure NVIDIA_API_KEY is set and agno is installed.'
         );
         setChatStatus('Offline');
     }

start_cardiosense.bat → start_placement_predictor.bat

@@ -68,7 +68,7 @@ echo.
 python train_model.py
 if errorlevel 1 (
     echo [ERROR] Model training failed!
-    echo Please check if all diabetes CSV dataset files exist in this folder.
+    echo Please check if the placement CSV dataset files exist in this folder.
     pause
     exit /b 1
 )
@@ -88,14 +88,15 @@ echo [4/6] Skipped training (using cached model).
 echo.
 
 :START_SERVERS
-echo [5/6] Starting API Server on http://127.0.0.1:8000 ...
-start "PlacementPredictor+ API" cmd /k "title PlacementPredictor+ API Server && color 0B && set NVIDIA_API_KEY=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 && python -m uvicorn main:app --host 127.0.0.1 --port 8000"
+echo [5/6] Starting API Server on http://127.0.0.1:7860 ...
+:: Fixed: Host 0.0.0.0 and Port 7860 to match main.py and HF patterns
+start "PlacementPredictor+ API" cmd /k "title PlacementPredictor+ API Server && color 0B && set NVIDIA_API_KEY=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 && python main.py"
 echo       Waiting for API to start...
 timeout /t 8 /nobreak >nul
 
 :: Validate the model loaded correctly by hitting /health
 echo       Validating model artifacts...
-curl -s http://127.0.0.1:8000/health 2>nul | findstr /C:"model_loaded" | findstr /C:"true" >nul 2>&1
+curl -s http://127.0.0.1:7860/health 2>nul | findstr /C:"model_loaded" | findstr /C:"true" >nul 2>&1
 if errorlevel 1 (
     echo [!] Model failed to load - version mismatch or corrupted pkl.
     echo       Killing API server and retraining...
@@ -113,26 +114,19 @@ if errorlevel 1 (
     echo       Retrained successfully!
     echo.
     echo [5/6] Restarting API Server...
-    start "PlacementPredictor+ API" cmd /k "title PlacementPredictor+ API Server && color 0B && set NVIDIA_API_KEY=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 && python -m uvicorn main:app --host 127.0.0.1 --port 8000"
+    start "PlacementPredictor+ API" cmd /k "title PlacementPredictor+ API Server && color 0B && set NVIDIA_API_KEY=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 && python main.py"
     timeout /t 8 /nobreak >nul
 )
 echo       API Server started!
 echo.
 
-echo [6/6] Starting Frontend Server on http://127.0.0.1:3000 ...
-start "PlacementPredictor+ Frontend" cmd /k "title PlacementPredictor+ Frontend && color 0E && python -m http.server 3000"
-timeout /t 2 /nobreak >nul
-echo       Frontend Server started!
-echo.
-
 echo ============================================================
 echo                    SERVERS ARE RUNNING!
 echo ============================================================
 echo.
-echo   API Documentation:  http://127.0.0.1:8000/docs
-echo   Frontend UI:        http://127.0.0.1:3000
+echo   Application UI:  http://127.0.0.1:7860
 echo.
-echo   TIP: Use the "Load JSON" button in the UI for quick testing
+echo   TIP: Use the "Demo Data" button in the UI for quick testing
 echo   TIP: Click the chat bubble after results for AI assistant
 echo   TIP: Use --force-train flag to force model retraining
 echo.
@@ -142,7 +136,7 @@ echo.
 :: Open the frontend in default browser
 echo Opening PlacementPredictor+ in your browser...
 timeout /t 2 /nobreak >nul
-start http://127.0.0.1:3000
+start http://127.0.0.1:7860
 
 echo.
 echo Press any key to close this launcher (servers will keep running)...