Upload 5 files

README.md

@@ -1,13 +1,8 @@
----
-title: Math Solution Classifier
-emoji: 🔥
-colorFrom: blue
-colorTo: blue
-sdk: gradio
-sdk_version: 5.39.0
-app_file: app.py
-pinned: false
-short_description: Model for classifying solutions to math problems
----
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+title: Math Solution Classifier
+emoji: 🧮
+colorFrom: blue
+colorTo: purple
+sdk: gradio
+sdk_version: 4.7.1
+app_file: app.py
+pinned: false

app.py

@@ -0,0 +1,148 @@
+# app.py - FastAPI backend for Math Solution Classifier
+
+from fastapi import FastAPI, HTTPException
+from fastapi.middleware.cors import CORSMiddleware
+from fastapi.staticfiles import StaticFiles
+from fastapi.responses import FileResponse
+from pydantic import BaseModel
+import torch
+from transformers import AutoTokenizer, AutoModelForSequenceClassification
+import logging
+
+# Set up logging
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger(__name__)
+
+app = FastAPI(title="Math Solution Classifier API")
+
+# Add CORS middleware
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+# Global variables for model and tokenizer
+model = None
+tokenizer = None
+label_mapping = {0: "correct", 1: "conceptually-flawed", 2: "computationally-flawed"}
+
+class ClassificationRequest(BaseModel):
+    question: str
+    solution: str
+
+class ClassificationResponse(BaseModel):
+    classification: str
+    confidence: float
+
+def load_model():
+    """Load your trained model here"""
+    global model, tokenizer
+    
+    try:
+        # Replace these with your actual model path/name
+        # Option 1: Load from local files
+        # model = AutoModelForSequenceClassification.from_pretrained("./your_model_directory")
+        # tokenizer = AutoTokenizer.from_pretrained("./your_model_directory")
+        
+        # Option 2: Load from Hugging Face Hub (if you upload your model there)
+        # model = AutoModelForSequenceClassification.from_pretrained("your-username/your-model-name")
+        # tokenizer = AutoTokenizer.from_pretrained("your-username/your-model-name")
+        
+        # For now, we'll use a placeholder - replace this with your actual model loading
+        logger.warning("Using placeholder model loading - replace with your actual model!")
+        
+        # Placeholder model loading (replace this!)
+        model_name = "distilbert-base-uncased"  # Replace with your model
+        tokenizer = AutoTokenizer.from_pretrained(model_name)
+        model = AutoModelForSequenceClassification.from_pretrained(
+            model_name, 
+            num_labels=3,
+            ignore_mismatched_sizes=True
+        )
+        
+        logger.info("Model loaded successfully")
+        
+    except Exception as e:
+        logger.error(f"Error loading model: {e}")
+        raise
+
+def classify_solution(question: str, solution: str) -> tuple:
+    """
+    Classify the math solution
+    Returns: (classification_label, confidence_score)
+    """
+    try:
+        # Combine question and solution for input
+        text_input = f"Question: {question}\nSolution: {solution}"
+        
+        # Tokenize input
+        inputs = tokenizer(
+            text_input,
+            return_tensors="pt",
+            truncation=True,
+            padding=True,
+            max_length=512
+        )
+        
+        # Get model prediction
+        with torch.no_grad():
+            outputs = model(**inputs)
+            predictions = torch.nn.functional.softmax(outputs.logits, dim=-1)
+            predicted_class = torch.argmax(predictions, dim=-1).item()
+            confidence = predictions[0][predicted_class].item()
+        
+        classification = label_mapping[predicted_class]
+        
+        return classification, confidence
+        
+    except Exception as e:
+        logger.error(f"Error during classification: {e}")
+        raise HTTPException(status_code=500, detail=f"Classification error: {str(e)}")
+
+@app.on_event("startup")
+async def startup_event():
+    """Load model on startup"""
+    logger.info("Loading model...")
+    load_model()
+
+@app.post("/classify", response_model=ClassificationResponse)
+async def classify_math_solution(request: ClassificationRequest):
+    """
+    Classify a math solution as correct, conceptually flawed, or computationally flawed
+    """
+    if not model or not tokenizer:
+        raise HTTPException(status_code=503, detail="Model not loaded")
+    
+    if not request.question.strip() or not request.solution.strip():
+        raise HTTPException(status_code=400, detail="Both question and solution are required")
+    
+    try:
+        classification, confidence = classify_solution(request.question, request.solution)
+        
+        return ClassificationResponse(
+            classification=classification,
+            confidence=confidence
+        )
+        
+    except Exception as e:
+        logger.error(f"Classification failed: {e}")
+        raise HTTPException(status_code=500, detail="Classification failed")
+
+@app.get("/health")
+async def health_check():
+    """Health check endpoint"""
+    return {"status": "healthy", "model_loaded": model is not None}
+
+# Serve the frontend (for Hugging Face Spaces)
+app.mount("/static", StaticFiles(directory="static"), name="static")
+
+@app.get("/")
+async def serve_frontend():
+    return FileResponse("static/index.html")
+
+if __name__ == "__main__":
+    import uvicorn
+    uvicorn.run(app, host="0.0.0.0", port=7860)  # Port 7860 is standard for HF Spaces

deployment_files.py

@@ -0,0 +1,49 @@
+# requirements.txt
+fastapi==0.104.1
+uvicorn==0.24.0
+torch==2.1.0
+transformers==4.35.0
+python-multipart==0.0.6
+pydantic==2.5.0
+
+# README.md for your Hugging Face Space
+---
+title: Math Solution Classifier
+emoji: 🧮
+colorFrom: blue
+colorTo: purple
+sdk: gradio
+sdk_version: 4.7.1
+app_file: app.py
+pinned: false
+---
+
+# Math Solution Classifier
+
+This application classifies math solutions into three categories:
+- **Correct**: Solution is mathematically sound
+- **Conceptually Flawed**: Wrong approach or understanding  
+- **Computationally Flawed**: Right approach, calculation errors
+
+## Usage
+
+1. Enter a math question
+2. Enter the proposed solution
+3. Click "Classify Solution"
+4. Get instant feedback on the solution quality
+
+Built with FastAPI and your custom trained model.
+
+# Dockerfile (optional, for other hosting platforms)
+FROM python:3.9-slim
+
+WORKDIR /app
+
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+COPY . .
+
+EXPOSE 7860
+
+CMD ["uvicorn", "app:app", "--host", "0.0.0.0", "--port", "7860"]

requirements.txt

@@ -0,0 +1,6 @@
+fastapi==0.104.1
+uvicorn==0.24.0
+torch==2.1.0
+transformers==4.35.0
+python-multipart==0.0.6
+pydantic==2.5.0

static/index.html

@@ -0,0 +1,314 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Math Solution Classifier</title>
+    <style>
+        * {
+            box-sizing: border-box;
+            margin: 0;
+            padding: 0;
+        }
+
+        body {
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            min-height: 100vh;
+            padding: 20px;
+        }
+
+        .container {
+            max-width: 800px;
+            margin: 0 auto;
+            background: rgba(255, 255, 255, 0.95);
+            border-radius: 20px;
+            padding: 40px;
+            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px);
+        }
+
+        h1 {
+            text-align: center;
+            color: #333;
+            margin-bottom: 30px;
+            font-size: 2.5em;
+            background: linear-gradient(135deg, #667eea, #764ba2);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+        }
+
+        .form-group {
+            margin-bottom: 25px;
+        }
+
+        label {
+            display: block;
+            margin-bottom: 8px;
+            font-weight: 600;
+            color: #333;
+            font-size: 1.1em;
+        }
+
+        textarea {
+            width: 100%;
+            min-height: 120px;
+            padding: 15px;
+            border: 2px solid #e1e5e9;
+            border-radius: 12px;
+            font-size: 16px;
+            font-family: 'Courier New', monospace;
+            background: #fafbfc;
+            transition: all 0.3s ease;
+            resize: vertical;
+        }
+
+        textarea:focus {
+            outline: none;
+            border-color: #667eea;
+            background: white;
+            box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
+        }
+
+        .classify-btn {
+            width: 100%;
+            padding: 18px;
+            background: linear-gradient(135deg, #667eea, #764ba2);
+            color: white;
+            border: none;
+            border-radius: 12px;
+            font-size: 18px;
+            font-weight: 600;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            text-transform: uppercase;
+            letter-spacing: 1px;
+        }
+
+        .classify-btn:hover:not(:disabled) {
+            transform: translateY(-2px);
+            box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3);
+        }
+
+        .classify-btn:disabled {
+            background: #ccc;
+            cursor: not-allowed;
+            transform: none;
+        }
+
+        .result {
+            margin-top: 30px;
+            padding: 25px;
+            border-radius: 12px;
+            text-align: center;
+            font-size: 18px;
+            font-weight: 600;
+            opacity: 0;
+            transform: translateY(20px);
+            transition: all 0.5s ease;
+        }
+
+        .result.show {
+            opacity: 1;
+            transform: translateY(0);
+        }
+
+        .result.correct {
+            background: linear-gradient(135deg, #4facfe, #00f2fe);
+            color: white;
+            border: 3px solid #4facfe;
+        }
+
+        .result.conceptually-flawed {
+            background: linear-gradient(135deg, #fa709a, #fee140);
+            color: white;
+            border: 3px solid #fa709a;
+        }
+
+        .result.computationally-flawed {
+            background: linear-gradient(135deg, #ff6b6b, #ffa500);
+            color: white;
+            border: 3px solid #ff6b6b;
+        }
+
+        .result.error {
+            background: #f8f9fa;
+            color: #dc3545;
+            border: 3px solid #dc3545;
+        }
+
+        .loading {
+            display: inline-block;
+            width: 20px;
+            height: 20px;
+            border: 3px solid rgba(255, 255, 255, 0.3);
+            border-radius: 50%;
+            border-top-color: white;
+            animation: spin 1s ease-in-out infinite;
+            margin-right: 10px;
+        }
+
+        @keyframes spin {
+            to { transform: rotate(360deg); }
+        }
+
+        .example {
+            background: #f8f9fa;
+            border-left: 4px solid #667eea;
+            padding: 15px;
+            margin: 20px 0;
+            border-radius: 0 8px 8px 0;
+        }
+
+        .example h3 {
+            color: #667eea;
+            margin-bottom: 10px;
+        }
+
+        .example-text {
+            font-family: 'Courier New', monospace;
+            font-size: 14px;
+            color: #555;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <h1>🧮 Math Solution Classifier</h1>
+        
+        <div class="example">
+            <h3>How to use:</h3>
+            <p>Enter a math question and a solution attempt. The AI will classify the solution as:</p>
+            <ul style="margin: 10px 0 0 20px;">
+                <li><strong>Correct:</strong> Solution is mathematically sound</li>
+                <li><strong>Conceptually Flawed:</strong> Wrong approach or understanding</li>
+                <li><strong>Computationally Flawed:</strong> Right approach, calculation errors</li>
+            </ul>
+        </div>
+
+        <form id="classifyForm">
+            <div class="form-group">
+                <label for="question">Math Question:</label>
+                <textarea 
+                    id="question" 
+                    name="question" 
+                    placeholder="e.g., Solve for x: 2x + 5 = 13"
+                    required
+                ></textarea>
+            </div>
+
+            <div class="form-group">
+                <label for="solution">Proposed Solution:</label>
+                <textarea 
+                    id="solution" 
+                    name="solution" 
+                    placeholder="e.g., 2x + 5 = 13&#10;2x = 13 - 5&#10;2x = 8&#10;x = 4"
+                    required
+                ></textarea>
+            </div>
+
+            <button type="submit" class="classify-btn" id="submitBtn">
+                Classify Solution
+            </button>
+        </form>
+
+        <div id="result" class="result"></div>
+    </div>
+
+    <script>
+        const form = document.getElementById('classifyForm');
+        const submitBtn = document.getElementById('submitBtn');
+        const resultDiv = document.getElementById('result');
+
+        // Replace this URL with your actual API endpoint
+        const API_URL = 'https://your-huggingface-space.hf.space/classify';
+
+        form.addEventListener('submit', async (e) => {
+            e.preventDefault();
+            
+            const question = document.getElementById('question').value.trim();
+            const solution = document.getElementById('solution').value.trim();
+            
+            if (!question || !solution) {
+                showResult('Please fill in both fields', 'error');
+                return;
+            }
+
+            // Show loading state
+            submitBtn.disabled = true;
+            submitBtn.innerHTML = '<div class="loading"></div>Classifying...';
+            resultDiv.className = 'result';
+            resultDiv.textContent = '';
+
+            try {
+                const response = await fetch(API_URL, {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    body: JSON.stringify({
+                        question: question,
+                        solution: solution
+                    })
+                });
+
+                if (!response.ok) {
+                    throw new Error(`HTTP error! status: ${response.status}`);
+                }
+
+                const data = await response.json();
+                
+                // Display result
+                showResult(formatResult(data.classification), data.classification);
+                
+            } catch (error) {
+                console.error('Error:', error);
+                showResult('Error connecting to the classification service. Please try again.', 'error');
+            } finally {
+                // Reset button
+                submitBtn.disabled = false;
+                submitBtn.innerHTML = 'Classify Solution';
+            }
+        });
+
+        function formatResult(classification) {
+            const messages = {
+                'correct': '✅ Correct Solution!\nThe mathematical approach and calculations are both sound.',
+                'conceptually-flawed': '🤔 Conceptually Flawed\nThe approach or understanding has fundamental issues.',
+                'computationally-flawed': '🔢 Computationally Flawed\nThe approach is correct, but there are calculation errors.'
+            };
+            
+            return messages[classification] || `Classification: ${classification}`;
+        }
+
+        function showResult(message, type) {
+            resultDiv.textContent = message;
+            resultDiv.className = `result ${type} show`;
+        }
+
+        // For demo purposes - remove this when you have a real API
+        if (API_URL.includes('your-huggingface-space')) {
+            // Mock API for testing
+            form.addEventListener('submit', async (e) => {
+                e.preventDefault();
+                
+                submitBtn.disabled = true;
+                submitBtn.innerHTML = '<div class="loading"></div>Classifying...';
+                
+                // Simulate API delay
+                await new Promise(resolve => setTimeout(resolve, 2000));
+                
+                // Mock classification (randomly choose one for demo)
+                const classifications = ['correct', 'conceptually-flawed', 'computationally-flawed'];
+                const randomClassification = classifications[Math.floor(Math.random() * classifications.length)];
+                
+                showResult(formatResult(randomClassification), randomClassification);
+                
+                submitBtn.disabled = false;
+                submitBtn.innerHTML = 'Classify Solution';
+            });
+        }
+    </script>
+</body>
+</html>