solving persistence secrets and a iacre and mor

app/app.py

@@ -3,8 +3,14 @@ from flask_cors import CORS
 import os
 import uuid
 import json
+import requests
 from datetime import datetime
 from datasets import Dataset, load_dataset
+from huggingface_hub import HfApi, login
+import logging
+
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger(__name__)
 
 app = Flask(__name__)
 app.secret_key = os.environ.get('SECRET_KEY', 'educateenIA_secret_key_2024')
@@ -16,6 +22,56 @@ if not os.path.exists(DATA_DIR):
     os.makedirs(DATA_DIR, exist_ok=True)
 
 REPO_ID = os.environ.get('REPO_ID', None)
+HF_TOKEN = os.environ.get('HF_TOKEN', None)
+
+def get_hf_api():
+    if HF_TOKEN:
+        try:
+            login(token=HF_TOKEN)
+            return HfApi(token=HF_TOKEN)
+        except Exception as e:
+            logger.warning(f"Error al iniciar sesión en HF: {e}")
+    return None
+
+def load_from_hub(filename, fallback=None):
+    if not REPO_ID or not HF_TOKEN:
+        return load_from_disk(filename, fallback)
+    
+    try:
+        api = get_hf_api()
+        if api:
+            url = f"https://huggingface.co/datasets/{REPO_ID}/resolve/main/{filename}.json"
+            response = requests.get(url, headers={"Authorization": f"Bearer {HF_TOKEN}"})
+            if response.status_code == 200:
+                data = response.json()
+                return Dataset.from_list(data)
+    except Exception as e:
+        logger.warning(f"Error al cargar {filename} desde HF: {e}")
+    
+    return load_from_disk(filename, fallback)
+
+def save_to_hub(ds, filename):
+    if not REPO_ID or not HF_TOKEN:
+        save_to_disk(ds, filename)
+        return
+    
+    try:
+        api = get_hf_api()
+        if api:
+            data = ds.to_list()
+            json_str = json.dumps(data, indent=2)
+            api.upload_file(
+                path_or_fileobj=json_str.encode(),
+                path_in_repo=f"{filename}.json",
+                repo_id=REPO_ID,
+                repo_type="dataset",
+                commit_message=f"Update {filename}"
+            )
+            logger.info(f"Guardado {filename} en HF Hub")
+    except Exception as e:
+        logger.warning(f"Error al guardar {filename} en HF: {e}")
+    
+    save_to_disk(ds, filename)
 
 def load_from_disk(filename, fallback=None):
     filepath = os.path.join(DATA_DIR, f"{filename}.json")
@@ -34,10 +90,16 @@ COURSES_DATA = []
 
 CLASSROOMS_DATA = []
 
-courses_ds = load_from_disk("courses", COURSES_DATA)
-classrooms_ds = load_from_disk("classrooms", CLASSROOMS_DATA)
-users_ds = load_from_disk("users", [])
-progress_ds = load_from_disk("progress", [])
+courses_ds = load_from_hub("courses", COURSES_DATA)
+classrooms_ds = load_from_hub("classrooms", CLASSROOMS_DATA)
+users_ds = load_from_hub("users", [])
+progress_ds = load_from_hub("progress", [])
+
+QUIZZES_DATA = []
+QUIZ_RESPONSES_DATA = []
+
+quizzes_ds = load_from_hub("quizzes", QUIZZES_DATA)
+quiz_responses_ds = load_from_hub("quiz_responses", QUIZ_RESPONSES_DATA)
 
 def get_courses_list():
     return courses_ds.to_list()
@@ -45,7 +107,7 @@ def get_courses_list():
 def save_courses_list(data):
     global courses_ds
     courses_ds = Dataset.from_list(data)
-    save_to_disk(courses_ds, "courses")
+    save_to_hub(courses_ds, "courses")
 
 def get_classrooms_list():
     return classrooms_ds.to_list()
@@ -53,7 +115,7 @@ def get_classrooms_list():
 def save_classrooms_list(data):
     global classrooms_ds
     classrooms_ds = Dataset.from_list(data)
-    save_to_disk(classrooms_ds, "classrooms")
+    save_to_hub(classrooms_ds, "classrooms")
 
 def get_users_list():
     return users_ds.to_list()
@@ -61,7 +123,7 @@ def get_users_list():
 def save_users_list(data):
     global users_ds
     users_ds = Dataset.from_list(data)
-    save_to_disk(users_ds, "users")
+    save_to_hub(users_ds, "users")
 
 def get_progress_list():
     return progress_ds.to_list()
@@ -69,7 +131,23 @@ def get_progress_list():
 def save_progress_list(data):
     global progress_ds
     progress_ds = Dataset.from_list(data)
-    save_to_disk(progress_ds, "progress")
+    save_to_hub(progress_ds, "progress")
+
+def get_quizzes_list():
+    return quizzes_ds.to_list()
+
+def save_quizzes_list(data):
+    global quizzes_ds
+    quizzes_ds = Dataset.from_list(data)
+    save_to_hub(quizzes_ds, "quizzes")
+
+def get_quiz_responses_list():
+    return quiz_responses_ds.to_list()
+
+def save_quiz_responses_list(data):
+    global quiz_responses_ds
+    quiz_responses_ds = Dataset.from_list(data)
+    save_to_hub(quiz_responses_ds, "quiz_responses")
 
 @app.route('/')
 def index():
@@ -425,6 +503,179 @@ def get_raspberry_guide():
         {"title": "Acceso Remoto", "description": "Configura SSH y VNC para acceder remotamente.", "code": "ssh pi@192.168.1.100\n# Contraseña: raspberry"}
     ])
 
+@app.route('/api/quizzes', methods=['GET'])
+def get_quizzes_api():
+    classroom_id = request.args.get('classroom_id', type=int)
+    quizzes = get_quizzes_list()
+    
+    if classroom_id:
+        quizzes = [q for q in quizzes if q.get('classroom_id') == classroom_id]
+    
+    return jsonify(quizzes)
+
+@app.route('/api/quizzes', methods=['POST'])
+def create_quiz():
+    data = request.json
+    
+    quizzes = get_quizzes_list()
+    new_id = max([q['id'] for q in quizzes], default=0) + 1
+    
+    new_quiz = {
+        "id": new_id,
+        "title": data.get('title'),
+        "description": data.get('description', ''),
+        "classroom_id": int(data.get('classroom_id')),
+        "questions": json.dumps(data.get('questions', [])),
+        "active": False,
+        "created_at": datetime.now().isoformat()
+    }
+    
+    quizzes.append(new_quiz)
+    save_quizzes_list(quizzes)
+    
+    return jsonify(new_quiz), 201
+
+@app.route('/api/quizzes/<int:quiz_id>', methods=['PUT'])
+def update_quiz(quiz_id):
+    data = request.json
+    quizzes = get_quizzes_list()
+    
+    for quiz in quizzes:
+        if quiz['id'] == quiz_id:
+            if 'title' in data:
+                quiz['title'] = data['title']
+            if 'description' in data:
+                quiz['description'] = data['description']
+            if 'questions' in data:
+                quiz['questions'] = json.dumps(data['questions'])
+            if 'active' in data:
+                quiz['active'] = data['active']
+            break
+    
+    save_quizzes_list(quizzes)
+    return jsonify({'success': True})
+
+@app.route('/api/quizzes/<int:quiz_id>', methods=['DELETE'])
+def delete_quiz(quiz_id):
+    quizzes = get_quizzes_list()
+    quizzes = [q for q in quizzes if q['id'] != quiz_id]
+    save_quizzes_list(quizzes)
+    
+    responses = get_quiz_responses_list()
+    responses = [r for r in responses if r.get('quiz_id') != quiz_id]
+    save_quiz_responses_list(responses)
+    
+    return jsonify({'success': True})
+
+@app.route('/api/quizzes/<int:quiz_id>/toggle', methods=['POST'])
+def toggle_quiz(quiz_id):
+    quizzes = get_quizzes_list()
+    
+    for quiz in quizzes:
+        if quiz['id'] == quiz_id:
+            quiz['active'] = not quiz.get('active', False)
+            break
+    
+    save_quizzes_list(quizzes)
+    return jsonify({'success': True})
+
+@app.route('/api/student/quizzes')
+def get_student_quizzes():
+    student_id = request.args.get('student_id')
+    course_id = request.args.get('course_id', type=int)
+    
+    classrooms = get_classrooms_list()
+    classroom = next((c for c in classrooms if c.get('course_id') == course_id), None)
+    
+    if not classroom:
+        return jsonify([])
+    
+    quizzes = get_quizzes_list()
+    classroom_quizzes = [q for q in quizzes if q.get('classroom_id') == classroom['id']]
+    
+    responses = get_quiz_responses_list()
+    
+    result = []
+    for quiz in classroom_quizzes:
+        student_response = next((r for r in responses if r.get('quiz_id') == quiz['id'] and r.get('student_id') == student_id), None)
+        
+        result.append({
+            'id': quiz['id'],
+            'title': quiz.get('title'),
+            'description': quiz.get('description'),
+            'active': quiz.get('active', False),
+            'questions': json.loads(quiz.get('questions', '[]')),
+            'completed': student_response is not None,
+            'score': student_response.get('score') if student_response else None
+        })
+    
+    return jsonify(result)
+
+@app.route('/api/quizzes/<int:quiz_id>/submit', methods=['POST'])
+def submit_quiz(quiz_id):
+    data = request.json
+    student_id = data.get('student_id')
+    answers = data.get('answers', [])
+    
+    quizzes = get_quizzes_list()
+    quiz = next((q for q in quizzes if q['id'] == quiz_id), None)
+    
+    if not quiz:
+        return jsonify({'error': 'Cuestionario no encontrado'}), 404
+    
+    questions = json.loads(quiz.get('questions', '[]'))
+    
+    score = 0
+    total = len(questions)
+    for i, question in enumerate(questions):
+        correct_idx = question.get('correct', -1)
+        if i < len(answers) and answers[i] == correct_idx:
+            score += 1
+    
+    responses = get_quiz_responses_list()
+    
+    existing = next((r for r in responses if r.get('quiz_id') == quiz_id and r.get('student_id') == student_id), None)
+    
+    if existing:
+        existing['answers'] = json.dumps(answers)
+        existing['score'] = score
+        existing['total'] = total
+        existing['submitted_at'] = datetime.now().isoformat()
+    else:
+        responses.append({
+            'quiz_id': quiz_id,
+            'student_id': student_id,
+            'answers': json.dumps(answers),
+            'score': score,
+            'total': total,
+            'submitted_at': datetime.now().isoformat()
+        })
+    
+    save_quiz_responses_list(responses)
+    
+    return jsonify({'success': True, 'score': score, 'total': total})
+
+@app.route('/api/quizzes/<int:quiz_id>/responses')
+def get_quiz_responses(quiz_id):
+    responses = get_quiz_responses_list()
+    quizzes = get_quizzes_list()
+    users = get_users_list()
+    
+    quiz_responses = [r for r in responses if r.get('quiz_id') == quiz_id]
+    
+    result = []
+    for r in quiz_responses:
+        student = next((u for u in users if u.get('id') == r.get('student_id')), None)
+        result.append({
+            'student_name': student.get('name') if student else 'Desconocido',
+            'student_id': r.get('student_id'),
+            'score': r.get('score', 0),
+            'total': r.get('total', 0),
+            'submitted_at': r.get('submitted_at')
+        })
+    
+    return jsonify(result)
+
 if __name__ == '__main__':
     port = int(os.environ.get('PORT', 7860))
     app.run(host='0.0.0.0', port=port, debug=True)

app/static/js/app.js

@@ -5,7 +5,7 @@
 const App = {
     currentPage: 'dashboard',
     user: null,
-    pages: ['dashboard', 'courses', 'classrooms', 'tools', 'ai-test', 'simulators', 'raspberry', 'progress', 'my-progress'],
+    pages: ['dashboard', 'courses', 'classrooms', 'tools', 'ai-test', 'simulators', 'raspberry', 'progress', 'my-progress', 'quizzes', 'quizzes-student'],
 
     init() {
         this.checkSession();

app/static/js/auth.js

@@ -5,6 +5,7 @@
 
 const Auth = {
     currentRole: 'student',
+    user: null,
 
     init() {
         this.loadCoursesForLogin();
@@ -16,6 +17,10 @@ const Auth = {
         });
     },
 
+    getUser() {
+        return this.user || App.user;
+    },
+
     selectRole(role) {
         this.currentRole = role;
         

app/static/js/student_quizzes.js

@@ -0,0 +1,139 @@
+const StudentQuizzes = {
+    quizzes: [],
+    currentQuiz: null,
+    answers: [],
+
+    async init() {
+        const user = Auth.getUser();
+        if (!user || user.role !== 'student') return;
+
+        await this.loadQuizzes();
+    },
+
+    async loadQuizzes() {
+        const user = Auth.getUser();
+        if (!user) return;
+
+        try {
+            const response = await fetch(`/api/student/quizzes?student_id=${user.id}&course_id=${user.course_id}`);
+            this.quizzes = await response.json();
+            this.renderQuizzes();
+        } catch (error) {
+            console.error('Error loading quizzes:', error);
+        }
+    },
+
+    renderQuizzes() {
+        const container = document.getElementById('studentQuizzesList');
+        if (!container) return;
+
+        if (this.quizzes.length === 0) {
+            container.innerHTML = '<p style="color: #6B7280; text-align: center;">No hay cuestionarios disponibles para tu curso</p>';
+            return;
+        }
+
+        container.innerHTML = this.quizzes.map(quiz => `
+            <div class="student-quiz-card">
+                <div class="student-quiz-header">
+                    <h3 class="student-quiz-title">${quiz.title}</h3>
+                    <span class="student-quiz-status ${quiz.active ? (quiz.completed ? 'completed' : 'pending') : 'pending'}">
+                        ${!quiz.active ? 'No disponible' : (quiz.completed ? 'Completado' : 'Pendiente')}
+                    </span>
+                </div>
+                <p style="color: #6B7280; margin-bottom: 1rem;">${quiz.description || 'Sin descripción'}</p>
+                ${quiz.completed ? `
+                    <div style="text-align: center; padding: 1rem; background: var(--light); border-radius: 8px;">
+                        <div class="student-quiz-score">${quiz.score}/${quiz.questions.length}</div>
+                        <p style="color: #6B7280; font-size: 0.875rem;">Puntuación obtained</p>
+                    </div>
+                ` : quiz.active ? `
+                    <button class="btn btn-primary" onclick="StudentQuizzes.openQuiz(${quiz.id})">
+                        <i class="fas fa-play"></i> Responder Cuestionario
+                    </button>
+                ` : `
+                    <p style="color: #9CA3AF; font-size: 0.875rem;">Espera a que el maestro active el cuestionario</p>
+                `}
+            </div>
+        `).join('');
+    },
+
+    async openQuiz(quizId) {
+        const quiz = this.quizzes.find(q => q.id === quizId);
+        if (!quiz || !quiz.active) {
+            alert('Este cuestionario no está disponible');
+            return;
+        }
+
+        this.currentQuiz = quiz;
+        this.answers = new Array(quiz.questions.length).fill(-1);
+
+        document.getElementById('quizAnswerTitle').textContent = quiz.title;
+        
+        const content = document.getElementById('quizAnswerContent');
+        content.innerHTML = quiz.questions.map((q, idx) => `
+            <div class="question-item">
+                <h4>Pregunta ${idx + 1}: ${q.question}</h4>
+                <div class="options-container">
+                    ${q.options.map((opt, optIdx) => `
+                        <div class="option-row">
+                            <input type="radio" name="question_${idx}" value="${optIdx}" id="q${idx}_opt${optIdx}" 
+                                onchange="StudentQuizzes.setAnswer(${idx}, ${optIdx})">
+                            <label for="q${idx}_opt${optIdx}" style="flex: 1; cursor: pointer;">${opt}</label>
+                        </div>
+                    `).join('')}
+                </div>
+            </div>
+        `).join('');
+
+        content.innerHTML += `
+            <div class="form-actions">
+                <button class="btn btn-secondary" onclick="StudentQuizzes.closeQuizModal()">Cancelar</button>
+                <button class="btn btn-primary" onclick="StudentQuizzes.submitQuiz()">Enviar Respuestas</button>
+            </div>
+        `;
+
+        document.getElementById('quizAnswerModal').style.display = 'block';
+    },
+
+    setAnswer(questionIdx, answerIdx) {
+        this.answers[questionIdx] = answerIdx;
+    },
+
+    async submitQuiz() {
+        if (this.answers.includes(-1)) {
+            alert('Por favor responde todas las preguntas');
+            return;
+        }
+
+        const user = Auth.getUser();
+        if (!user) return;
+
+        try {
+            const response = await fetch(`/api/quizzes/${this.currentQuiz.id}/submit`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    student_id: user.id,
+                    answers: this.answers
+                })
+            });
+
+            const result = await response.json();
+            
+            if (result.success) {
+                alert(`¡Cuestionario enviado!\nPuntuación: ${result.score}/${result.total}`);
+                this.closeQuizModal();
+                this.loadQuizzes();
+            }
+        } catch (error) {
+            console.error('Error submitting quiz:', error);
+            alert('Error al enviar el cuestionario');
+        }
+    },
+
+    closeQuizModal() {
+        document.getElementById('quizAnswerModal').style.display = 'none';
+        this.currentQuiz = null;
+        this.answers = [];
+    }
+};

app/static/js/teacher.js

@@ -6,6 +6,7 @@
 const TeacherProgress = {
     students: [],
     allStudents: [],
+    classrooms: [],
 
     async init() {
         await this.loadProgress();
@@ -173,3 +174,220 @@ const TeacherProgress = {
         }
     }
 };
+
+const QuizManager = {
+    quizzes: [],
+    classrooms: [],
+    currentEdit: null,
+
+    async init() {
+        await this.loadClassrooms();
+        await this.loadQuizzes();
+    },
+
+    async loadClassrooms() {
+        try {
+            const response = await fetch('/api/classrooms');
+            this.classrooms = await response.json();
+        } catch (error) {
+            console.error('Error loading classrooms:', error);
+            this.classrooms = [];
+        }
+    },
+
+    async loadQuizzes() {
+        try {
+            const response = await fetch('/api/quizzes');
+            this.quizzes = await response.json();
+            this.renderQuizzes();
+        } catch (error) {
+            console.error('Error loading quizzes:', error);
+        }
+    },
+
+    renderQuizzes() {
+        const container = document.getElementById('quizzesList');
+        if (!container) return;
+
+        if (this.quizzes.length === 0) {
+            container.innerHTML = '<p style="color: #6B7280; text-align: center;">No hay cuestionarios creados</p>';
+            return;
+        }
+
+        container.innerHTML = this.quizzes.map(quiz => {
+            const classroom = this.classrooms.find(c => c.id === quiz.classroom_id);
+            const questions = JSON.parse(quiz.questions || '[]');
+            return `
+                <div class="quiz-card">
+                    <div class="quiz-header">
+                        <h3>${quiz.title}</h3>
+                        <span class="quiz-badge ${quiz.active ? 'active' : 'inactive'}">
+                            ${quiz.active ? 'Activo' : 'Inactivo'}
+                        </span>
+                    </div>
+                    <p class="quiz-description">${quiz.description || 'Sin descripción'}</p>
+                    <p class="quiz-meta">Aula: ${classroom ? classroom.name : 'Sin aula'} | Preguntas: ${questions.length}</p>
+                    <div class="quiz-actions">
+                        <button class="btn btn-primary" onclick="QuizManager.toggleQuiz(${quiz.id})">
+                            ${quiz.active ? 'Desactivar' : 'Activar'}
+                        </button>
+                        <button class="btn btn-info" onclick="QuizManager.viewResponses(${quiz.id})">
+                            Ver Respuestas
+                        </button>
+                        <button class="btn btn-danger" onclick="QuizManager.deleteQuiz(${quiz.id})">
+                            Eliminar
+                        </button>
+                    </div>
+                </div>
+            `;
+        }).join('');
+    },
+
+    async createQuiz() {
+        const title = document.getElementById('quizTitle').value.trim();
+        const description = document.getElementById('quizDescription').value.trim();
+        const classroomId = document.getElementById('quizClassroom').value;
+        const questionsContainer = document.getElementById('questionsList');
+
+        if (!title || !classroomId) {
+            alert('Por favor completa el título y selecciona un aula');
+            return;
+        }
+
+        const questions = [];
+        const questionElements = questionsContainer.querySelectorAll('.question-item');
+        
+        for (let i = 0; i < questionElements.length; i++) {
+            const qEl = questionElements[i];
+            const questionText = qEl.querySelector('.question-text').value.trim();
+            const options = [
+                qEl.querySelector('.option-0').value.trim(),
+                qEl.querySelector('.option-1').value.trim(),
+                qEl.querySelector('.option-2').value.trim(),
+                qEl.querySelector('.option-3').value.trim()
+            ];
+            const correct = parseInt(qEl.querySelector('.correct-select').value);
+
+            if (!questionText || options.some(o => !o)) {
+                alert(`Por favor completa la pregunta ${i + 1}`);
+                return;
+            }
+
+            questions.push({ question: questionText, options, correct });
+        }
+
+        if (questions.length === 0) {
+            alert('Agrega al menos una pregunta');
+            return;
+        }
+
+        try {
+            const response = await fetch('/api/quizzes', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    title,
+                    description,
+                    classroom_id: parseInt(classroomId),
+                    questions
+                })
+            });
+
+            if (response.ok) {
+                alert('Cuestionario creado exitosamente');
+                this.loadQuizzes();
+                this.closeModal();
+            }
+        } catch (error) {
+            console.error('Error creating quiz:', error);
+            alert('Error al crear cuestionario');
+        }
+    },
+
+    addQuestionField() {
+        const container = document.getElementById('questionsList');
+        const questionNum = container.children.length + 1;
+
+        const html = `
+            <div class="question-item">
+                <h4>Pregunta ${questionNum}</h4>
+                <input type="text" class="question-text" placeholder="Escribe la pregunta" style="width: 100%; padding: 8px; margin-bottom: 10px;">
+                <div class="options-container">
+                    ${[0,1,2,3].map(i => `
+                        <div class="option-row">
+                            <input type="radio" name="correct-${questionNum}" value="${i}" ${i === 0 ? 'checked' : ''}>
+                            <input type="text" class="option-${i}" placeholder="Opción ${i + 1}" style="flex: 1; padding: 8px;">
+                        </div>
+                    `).join('')}
+                </div>
+                <select class="correct-select" style="margin-top: 10px;">
+                    ${[0,1,2,3].map(i => `<option value="${i}">Respuesta correcta: Opción ${i + 1}</option>`).join('')}
+                </select>
+                <button class="btn btn-danger btn-sm" onclick="this.parentElement.remove()" style="margin-top: 10px;">Eliminar pregunta</button>
+            </div>
+        `;
+
+        container.insertAdjacentHTML('beforeend', html);
+    },
+
+    async toggleQuiz(quizId) {
+        try {
+            await fetch(`/api/quizzes/${quizId}/toggle`, { method: 'POST' });
+            this.loadQuizzes();
+        } catch (error) {
+            console.error('Error toggling quiz:', error);
+        }
+    },
+
+    async deleteQuiz(quizId) {
+        if (!confirm('¿Estás seguro de eliminar este cuestionario?')) return;
+
+        try {
+            await fetch(`/api/quizzes/${quizId}`, { method: 'DELETE' });
+            this.loadQuizzes();
+        } catch (error) {
+            console.error('Error deleting quiz:', error);
+        }
+    },
+
+    async viewResponses(quizId) {
+        try {
+            const response = await fetch(`/api/quizzes/${quizId}/responses`);
+            const responses = await response.json();
+
+            if (responses.length === 0) {
+                alert('No hay respuestas aún');
+                return;
+            }
+
+            const quiz = this.quizzes.find(q => q.id === quizId);
+            let message = `Respuestas de: ${quiz.title}\n\n`;
+
+            responses.forEach(r => {
+                message += `${r.student_name}: ${r.score}/${r.total} puntos\n`;
+            });
+
+            alert(message);
+        } catch (error) {
+            console.error('Error loading responses:', error);
+        }
+    },
+
+    openModal() {
+        document.getElementById('quizModal').style.display = 'block';
+        document.getElementById('quizTitle').value = '';
+        document.getElementById('quizDescription').value = '';
+        document.getElementById('quizClassroom').value = '';
+        document.getElementById('questionsList').innerHTML = '';
+        
+        const classroomSelect = document.getElementById('quizClassroom');
+        classroomSelect.innerHTML = '<option value="">Selecciona un aula</option>' +
+            this.classrooms.map(c => `<option value="${c.id}">${c.name}</option>`).join('');
+        
+        this.addQuestionField();
+    },
+
+    closeModal() {
+        document.getElementById('quizModal').style.display = 'none';
+    }
+};

app/templates/index.html

@@ -319,6 +319,35 @@
         .my-activity-score { font-size: 0.875rem; color: var(--dark); }
         .my-activity-attempts { font-size: 0.75rem; color: #6B7280; }
 
+        .quiz-card { background: white; border-radius: 12px; padding: 1.5rem; margin-bottom: 1rem; border: 1px solid var(--light-secondary); }
+        .quiz-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
+        .quiz-header h3 { margin: 0; color: var(--dark); }
+        .quiz-badge { padding: 0.25rem 0.75rem; border-radius: 20px; font-size: 0.75rem; font-weight: 600; }
+        .quiz-badge.active { background: #D1FAE5; color: var(--secondary); }
+        .quiz-badge.inactive { background: #FEF3C7; color: var(--accent); }
+        .quiz-description { color: #6B7280; font-size: 0.9rem; margin-bottom: 0.5rem; }
+        .quiz-meta { font-size: 0.8rem; color: #9CA3AF; margin-bottom: 1rem; }
+        .quiz-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
+        .btn-danger { background: var(--danger); color: white; }
+        .btn-danger:hover { background: #DC2626; }
+        .btn-info { background: #3B82F6; color: white; }
+        .btn-info:hover { background: #2563EB; }
+        .btn-sm { padding: 0.375rem 0.75rem; font-size: 0.8rem; }
+        
+        .student-quiz-card { background: white; border-radius: 12px; padding: 1.5rem; margin-bottom: 1rem; border: 1px solid var(--light-secondary); }
+        .student-quiz-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
+        .student-quiz-title { font-size: 1.1rem; font-weight: 600; color: var(--dark); margin: 0; }
+        .student-quiz-status { padding: 0.25rem 0.75rem; border-radius: 20px; font-size: 0.75rem; font-weight: 600; }
+        .student-quiz-status.pending { background: #FEF3C7; color: var(--accent); }
+        .student-quiz-status.completed { background: #D1FAE5; color: var(--secondary); }
+        .student-quiz-score { font-size: 1.5rem; font-weight: 700; color: var(--primary); }
+        
+        .question-item { background: var(--light); padding: 1rem; border-radius: 8px; margin-bottom: 1rem; }
+        .question-item h4 { margin: 0 0 0.75rem; color: var(--dark); }
+        .options-container { display: flex; flex-direction: column; gap: 0.5rem; }
+        .option-row { display: flex; align-items: center; gap: 0.5rem; }
+        .option-row input[type="radio"] { width: auto; }
+
         @media (max-width: 1024px) {
             .sidebar { width: 80px; padding: 1rem 0.5rem; }
             .logo-text, .nav-section-title, .nav-item span { display: none; }
@@ -402,11 +431,13 @@
             <div class="nav-section" id="teacherNav" style="display: none;">
                 <div class="nav-section-title">Gestión</div>
                 <a class="nav-item" data-page="progress"><i class="fas fa-chart-bar"></i><span>Progreso</span></a>
+                <a class="nav-item" data-page="quizzes"><i class="fas fa-clipboard-list"></i><span>Cuestionarios</span></a>
             </div>
 
             <div class="nav-section" id="studentNav" style="display: none;">
                 <div class="nav-section-title">Aprendizaje</div>
                 <a class="nav-item" data-page="ai-test"><i class="fas fa-robot"></i><span>Test de IA</span></a>
+                <a class="nav-item" data-page="quizzes-student"><i class="fas fa-clipboard-check"></i><span>Cuestionarios</span></a>
                 <a class="nav-item" data-page="simulators"><i class="fas fa-microchip"></i><span>Simuladores</span></a>
                 <a class="nav-item" data-page="raspberry"><i class="fas fa-server"></i><span>Raspberry Pi</span></a>
                 <a class="nav-item" data-page="my-progress"><i class="fas fa-chart-line"></i><span>Mi Progreso</span></a>
@@ -473,6 +504,14 @@
                     </div>
                 </div>
 
+                <!-- STUDENT QUIZZES -->
+                <div class="page" id="quizzes-student">
+                    <div class="card">
+                        <div class="card-header"><h3 class="card-title">Mis Cuestionarios</h3></div>
+                        <div class="card-body" id="studentQuizzesList"></div>
+                    </div>
+                </div>
+
                 <!-- SIMULATORS -->
                 <div class="page" id="simulators">
                     <div class="sim-tabs">
@@ -566,6 +605,17 @@ void loop() {
                     </div>
                 </div>
 
+                <!-- QUIZZES (Teacher Only) -->
+                <div class="page" id="quizzes">
+                    <div class="card">
+                        <div class="card-header">
+                            <h3 class="card-title">Cuestionarios</h3>
+                            <button class="btn btn-primary" onclick="QuizManager.openModal()"><i class="fas fa-plus"></i>Nuevo Cuestionario</button>
+                        </div>
+                        <div class="card-body" id="quizzesList"></div>
+                    </div>
+                </div>
+
                 <!-- STUDENT PROGRESS -->
                 <div class="page" id="my-progress">
                     <div class="card">
@@ -625,6 +675,52 @@ void loop() {
         </div>
     </div>
 
+    <!-- MODAL CREAR CUESTIONARIO -->
+    <div class="modal" id="quizModal">
+        <div class="modal-content" style="max-width: 700px;">
+            <div class="modal-header">
+                <h3 class="modal-title">Nuevo Cuestionario</h3>
+                <button class="modal-close" onclick="QuizManager.closeModal()"><i class="fas fa-times"></i></button>
+            </div>
+            <div class="modal-body">
+                <div class="form-group">
+                    <label class="form-label">Título del Cuestionario</label>
+                    <input type="text" class="form-input" id="quizTitle" placeholder="Ej: Examen parcial de IA" required>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">Descripción</label>
+                    <textarea class="form-textarea" id="quizDescription" placeholder="Instrucciones o descripción..."></textarea>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">Aula</label>
+                    <select class="form-select" id="quizClassroom" required>
+                        <option value="">Selecciona un aula</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">Preguntas</label>
+                    <div id="questionsList"></div>
+                    <button type="button" class="btn btn-secondary" onclick="QuizManager.addQuestionField()" style="margin-top: 0.5rem;"><i class="fas fa-plus"></i> Agregar Pregunta</button>
+                </div>
+                <div class="form-actions">
+                    <button type="button" class="btn btn-secondary" onclick="QuizManager.closeModal()">Cancelar</button>
+                    <button type="button" class="btn btn-primary" onclick="QuizManager.createQuiz()">Crear Cuestionario</button>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- MODAL RESPONDER CUESTIONARIO -->
+    <div class="modal" id="quizAnswerModal">
+        <div class="modal-content" style="max-width: 700px;">
+            <div class="modal-header">
+                <h3 class="modal-title" id="quizAnswerTitle">Cuestionario</h3>
+                <button class="modal-close" onclick="StudentQuizzes.closeQuizModal()"><i class="fas fa-times"></i></button>
+            </div>
+            <div class="modal-body" id="quizAnswerContent"></div>
+        </div>
+    </div>
+
     <script src="/static/js/modal.js"></script>
     <script src="/static/js/app.js"></script>
     <script src="/static/js/auth.js"></script>
@@ -637,6 +733,7 @@ void loop() {
     <script src="/static/js/raspberry.js"></script>
     <script src="/static/js/teacher.js"></script>
     <script src="/static/js/student_progress.js"></script>
+    <script src="/static/js/student_quizzes.js"></script>
     <script>
         document.addEventListener('DOMContentLoaded', () => {
             Auth.init();
@@ -651,6 +748,8 @@ void loop() {
                     if (page === 'raspberry') Raspberry.init();
                     if (page === 'progress') TeacherProgress.init();
                     if (page === 'my-progress') StudentProgress.init();
+                    if (page === 'quizzes') QuizManager.init();
+                    if (page === 'quizzes-student') StudentQuizzes.init();
                 });
             });
 

requirements.txt

@@ -2,3 +2,5 @@ flask>=2.3.0
 flask-cors>=4.0.0
 gunicorn>=21.0.0
 datasets>=2.14.0
+huggingface_hub>=0.19.0
+requests>=2.31.0