Lanzamiento de la Versión 2.0.1

.github/workflows/release.yml

@@ -95,9 +95,9 @@ jobs:
         id: changelog
         run: |
           # Extraer changelog para la versión actual
-          if [ -f "RELEASES.md" ]; then
+          if [ -f "CHANGELOG.md" ]; then
             # Buscar la sección de la versión actual
-            awk '/## \["'"${{ needs.check-version.outputs.version }}"'"\]/{flag=1; next} /## \[/{flag=0} flag' RELEASES.md > current_changelog.md
+            awk '/## \['"${{ needs.check-version.outputs.version }}"'\]/{flag=1; next} /## \[/{flag=0} flag' CHANGELOG.md > current_changelog.md
 
             if [ -s current_changelog.md ]; then
               echo "Found changelog entry for version ${{ needs.check-version.outputs.version }}"
@@ -106,7 +106,7 @@ jobs:
             else
               echo "No specific changelog entry found, using default message"
               echo "### Cambios en esta versión" > current_changelog.md
-              echo "- Consultar RELEASES.md para detalles completos" >> current_changelog.md
+              echo "- Consultar CHANGELOG.md para detalles completos" >> current_changelog.md
               echo "- Version: ${{ needs.check-version.outputs.version }}" >> current_changelog.md
             fi
           else

CHANGELOG.md

@@ -2,6 +2,15 @@
 
 Todas las modificaciones importantes del proyecto se documentarán en este archivo.
 
+## [2.0.1] — 2026-01-08
+- Paginación en la lista de estudiantes en el panel de administración.
+- Nueva forma de mostrar las estadísticas generales en el panel de administración.
+- Uso de arquitectura de plantillas Mustache para todas las vistas del bloque.
+- Refactorización completa del código para separar lógica de presentación.
+- Mejora en la mantenibilidad y escalabilidad del código.
+- Optimización del rendimiento en búsquedas.
+- Pequeñas mejoras de seguridad.
+
 ## [2.0.0] — Inicio de registro
 - A partir de la versión 2.0.0 se comienza a documentar este CHANGELOG.
 - Renovación completa y moderna de la UI/UX del bloque, test, panel de administración y vistas individuales (Todas con diseño responsivo).

README.md

@@ -105,7 +105,7 @@ El profesor cuenta con una vista ejecutiva desde el bloque, donde puede monitori
 Un panel de administración que centraliza el seguimiento grupal. Permite visualizar quiénes han completado el proceso, quiénes están en curso y gestionar los resultados colectivos para adaptar la estrategia pedagógica del aula.
 
 <p align="center">
-  <img src="https://github.com/user-attachments/assets/258d6fe2-4468-450d-8ec1-f53e01ffb0e0" alt="Panel de Administración" width="800">
+  <img src="https://github.com/user-attachments/assets/bcb983b3-fce0-4346-8693-095d86008932" alt="Panel de Administración" width="800">
 </p>
 
 **Seguimiento Individualizado y Detallado**

amd/src/radar_handler.js

@@ -0,0 +1,74 @@
+define(['core/chartjs'], function(Chart) {
+    "use strict";
+
+    return {
+        init: function(params) {
+            var canvas = document.getElementById(params.canvasId);
+            if (!canvas) { return; }
+            var ctx = canvas.getContext('2d');
+
+            return new Chart(ctx, {
+                type: 'radar',
+                data: {
+                    labels: params.labels,
+                    datasets: [{
+                        label: params.datasetLabel,
+                        data: [
+                            params.data.vis,
+                            params.data.sen,
+                            params.data.act,
+                            params.data.glo,
+                            params.data.vrb,
+                            params.data.int,
+                            params.data.ref,
+                            params.data.seq
+                        ],
+                        backgroundColor: 'rgba(21, 103, 249, 0.2)',
+                        borderColor: 'rgba(21, 103, 249, 1)',
+                        borderWidth: 2,
+                        pointBackgroundColor: 'rgba(21, 103, 249, 1)'
+                    }]
+                },
+                options: {
+                    responsive: true,
+                    scales: {
+                        r: {
+                            min: 0,
+                            max: 11,
+                            angleLines: { 
+                                display: true,
+                                color: 'rgba(0, 0, 0, 0.1)'
+                            },
+                            grid: {
+                                color: function(context) {
+                                    if (context.tick.value % 2 === 1) {
+                                        return 'transparent';
+                                    }
+                                    return 'rgba(0, 0, 0, 0.1)';
+                                },
+                                lineWidth: 1
+                            },
+                            ticks: {
+                                stepSize: 1,
+                                display: true,
+                                backdropColor: 'transparent',
+                                callback: function(value) {
+                                    return value % 2 !== 0 ? value : '';
+                                },
+                                font: {
+                                    size: 12
+                                }
+                            },
+                            pointLabels: {
+                                font: {size: 14}
+                            }
+                        }
+                    },
+                    plugins: {
+                        legend: { display: false }
+                    }
+                }
+            });
+        }
+    };
+});

amd/src/view_handler.js

@@ -0,0 +1,195 @@
+define(['jquery', 'core/ajax'], function($, Ajax) {
+    "use strict";
+
+    return {
+        init: function(params) {
+
+            // Auto-save functionality (silent, no visual feedback)
+            var autoSaveTimer = null;
+            var isSaving = false;
+            var formUrl = params.formUrl;
+
+            function autoSaveProgress() {
+                if (isSaving) return;
+
+                isSaving = true;
+                var formData = new FormData(document.getElementById('learningStyleForm'));
+                formData.set('action', 'autosave');
+
+                fetch(formUrl, {
+                    method: 'POST',
+                    body: formData
+                })
+                .then(function(response) { return response.json(); })
+                .then(function(data) {
+                    // Silent save - no visual feedback
+                    isSaving = false;
+                })
+                .catch(function(error) {
+                    // console.error('Auto-save error:', error);
+                    isSaving = false;
+                });
+            }
+
+            // Listen to changes in selects for auto-save
+            $('.select-q').on('change', function() {
+                // Remove red highlight when user answers the question
+                var select = $(this);
+                var listItem = select.closest('.learning_style_item');
+
+                // Remove error styling if present
+                if (listItem.hasClass('question-error-highlight')) {
+                    listItem.css({
+                        'border': '',
+                        'background-color': '',
+                        'border-radius': '',
+                        'padding': '',
+                        'margin-bottom': '',
+                        'box-shadow': ''
+                    });
+                    listItem.removeClass('question-error-highlight');
+                }
+
+                // Clear previous timer
+                if (autoSaveTimer) {
+                    clearTimeout(autoSaveTimer);
+                }
+
+                // Auto-save after 2 seconds of inactivity
+                autoSaveTimer = setTimeout(autoSaveProgress, 2000);
+            });
+
+            // Handle form submission for navigation
+            $('#learningStyleForm').on('submit', function(e) {
+                // Determine which button triggered the submit
+                // Note: e.originalEvent.submitter is supported in modern browsers
+                var submitter = e.originalEvent.submitter;
+                var action = submitter ? submitter.value : 'next';
+
+                // For "previous" button, always allow navigation without validation
+                if (action === 'previous') {
+                    return true;
+                }
+
+                // Only validate for "next" and "finish" actions
+                if (action !== 'next' && action !== 'finish') {
+                    return true;
+                }
+
+                // Validate current page for next/finish
+                var selectsOnPage = $('.select-q');
+                var allAnswered = true;
+                var firstUnanswered = null;
+
+                selectsOnPage.each(function() {
+                    if ($(this).val() === '') {
+                        allAnswered = false;
+                        var listItem = $(this).closest('.learning_style_item');
+
+                        if (listItem.length) {
+                            listItem.css({
+                                'border': '3px solid #d32f2f',
+                                'background-color': '#ffebee',
+                                'border-radius': '10px',
+                                'padding': '24px 28px',
+                                'margin-bottom': '1.5rem',
+                                'box-shadow': '0 4px 8px rgba(211, 47, 47, 0.3)'
+                            });
+                            listItem.addClass('question-error-highlight');
+
+                            if (!firstUnanswered) {
+                                firstUnanswered = listItem;
+                            }
+                        }
+                    }
+                });
+
+                if (!allAnswered) {
+                    e.preventDefault();
+
+                    // Scroll to first unanswered question (card)
+                    if (firstUnanswered) {
+                        firstUnanswered[0].scrollIntoView({
+                            behavior: 'smooth',
+                            block: 'center'
+                        });
+                    }
+
+                    return false;
+                }
+            });
+
+            // Auto-scroll to first unanswered question when continuing test
+            if (params.shouldAutoScroll) {
+                // Wait a bit for the page to fully render
+                setTimeout(function() {
+                    // Find first unanswered question on current page
+                    var found = false;
+                    $('.select-q').each(function() {
+                        if (found) return; 
+
+                        if ($(this).val() === '') {
+                            var listItem = $(this).closest('.learning_style_item');
+
+                            // Add green highlight to the entire card
+                            if (listItem.length) {
+                                listItem.css({
+                                    'border': '3px solid #28a745',
+                                    'background-color': '#d4edda',
+                                    'border-radius': '10px',
+                                    'padding': '24px 28px',
+                                    'margin-bottom': '1.5rem',
+                                    'box-shadow': '0 4px 8px rgba(40, 167, 69, 0.3)',
+                                    'transition': 'all 0.3s ease'
+                                });
+
+                                // Scroll to it
+                                listItem[0].scrollIntoView({
+                                    behavior: 'smooth',
+                                    block: 'center'
+                                });
+
+                                // Remove highlight after 5 seconds
+                                setTimeout(function() {
+                                    listItem.css({
+                                        'border': '',
+                                        'background-color': '',
+                                        'border-radius': '',
+                                        'padding': '',
+                                        'margin-bottom': '',
+                                        'box-shadow': ''
+                                    });
+                                }, 5000);
+                            }
+                            found = true;
+                        }
+                    });
+                }, 300);
+            }
+
+            // Scroll to finish button when coming from block with all questions answered
+            if (params.scrollToFinish) {
+                setTimeout(function() {
+                    var finishBtn = $('#submitBtn');
+                    if (finishBtn.length) {
+                        finishBtn[0].scrollIntoView({
+                            behavior: 'smooth',
+                            block: 'center'
+                        });
+
+                        // Add green pulsing highlight to the button
+                        finishBtn.css({
+                            'box-shadow': '0 0 20px rgba(40, 167, 69, 0.8)',
+                            'transition': 'all 0.3s ease'
+                        });
+
+                        // Remove highlight after 5 seconds
+                        setTimeout(function() {
+                            finishBtn.css('box-shadow', '');
+                        }, 5000);
+                    }
+                }, 300);
+            }
+        }
+    };
+});