Se crea plano para napping

tecnicas/controllers/__init__.py

@@ -47,6 +47,7 @@ from .views_controller.sessions_tester.tests_forms.test_rata_controller import T
 from .views_controller.sessions_tester.tests_forms.test_cata_controller import TestCataController
 from .views_controller.sessions_tester.tests_forms.test_pf_controller import TestPFController
 from .views_controller.sessions_tester.tests_forms.test_sort_controller import TestSortController
+from .views_controller.sessions_tester.tests_forms.test_napping_controller import TestNappingController
 
 from .views_controller.sessions_tester.init_session.init_session_escalas_controller import InitSessionEscalasController
 from .views_controller.sessions_tester.init_session.init_session_rata_controller import InitSessionRATAController

tecnicas/controllers/views_controller/sessions_tester/init_session/init_session_napping_controller.py

@@ -10,12 +10,13 @@ class InitSessionNappingController(InitSessionController):
     def __init__(self, sensorial_session, user_tester):
         super().__init__(sensorial_session, user_tester)
         self.current_direction = "tecnicas/forms_tester/init_test_napping.html"
-        self.sort_direction = "cata_system:session_napping"
+        self.napping_direction = "cata_system:session_napping"
 
     def controllGet(self, request: HttpRequest):
         self.context = {
             "session": self.session,
             "type_technique": "napping",
+            "has_ended": self.isEndedSession()
         }
 
         if self.session.tecnica.repeticion == 1:
@@ -29,4 +30,45 @@ class InitSessionNappingController(InitSessionController):
         return render(request, self.current_direction, self.context)
 
     def isEndedSession(self):
-        pass
+        return Participacion.objects.get(
+            tecnica=self.session.tecnica, catador=self.tester).finalizado
+
+    def controllPost(self, request: HttpRequest):
+        context = {
+            "session": self.session,
+            "type_technique": self.session.tecnica.tipo_tecnica.nombre_tecnica
+        }
+
+        use_action = request.POST["action"]
+
+        if use_action == "start_posting":
+            parameters = {
+                "code_sesion": self.session.codigo_sesion
+            }
+
+            is_end = self.isEndedSession()
+            if is_end:
+                context["message"] = "El catador ha terminado de realizar su evaluación, espere instrucciones del presentador"
+                return render(request, self.current_direction, context)
+
+            update_participation = ParticipacionController.enterSession(
+                tester=request.user.user_catador, session=self.session)
+
+            if isinstance(update_participation, dict):
+                context["error"] = update_participation["error"]
+                return render(request, self.current_direction, context)
+
+            request.session["id_participation"] = update_participation.id
+
+            return redirect(reverse(self.napping_direction, kwargs=parameters))
+
+        elif use_action == "exit_session":
+            response = ParticipacionController.outSession(
+                tester=request.user.user_catador, session=self.session)
+            if isinstance(response, dict):
+                context["error"] = response["error"]
+            return render(request, self.current_direction, context)
+
+        else:
+            context["error"] = "Acción sin especificar"
+            return render(request, self.current_direction, context)

tecnicas/controllers/views_controller/sessions_tester/tests_forms/test_napping_controller.py

@@ -0,0 +1,41 @@
+from django.http import HttpRequest
+from django.shortcuts import redirect, render
+from django.urls import reverse
+from tecnicas.models import Participacion, Producto
+from .general_test_controller import GenetalTestController
+
+
+class TestNappingController(GenetalTestController):
+    def __init__(self, sensorial_session, user_tester):
+        super().__init__(sensorial_session, user_tester)
+        self.napping_test = "tecnicas/forms_tester/test_napping.html"
+
+    def controllGet(self, request: HttpRequest):
+        technique = self.session.tecnica
+
+        self.participation = Participacion.objects.get(
+            tecnica=technique, catador=request.user.user_catador)
+
+        # Comprobar que el Catador no haya finalizado
+        if self.participation.finalizado:
+            params = {
+                "code_sesion": self.session.codigo_sesion
+            }
+            return redirect(reverse(self.previus_directory, kwargs=params))
+
+        if technique.repeticion == 1:
+            return self.nappingTest(request)
+        else:
+            params = {
+                "code_sesion": self.session.codigo_sesion
+            }
+            return redirect(reverse(self.previus_directory, kwargs=params))
+
+    def nappingTest(self, request: HttpRequest):
+        self.context["session"] = self.session
+        technique = self.session.tecnica
+
+        products_in_technique = Producto.objects.filter(id_tecnica=technique)
+        self.context["products"] = products_in_technique
+
+        return render(request, self.napping_test, self.context)

tecnicas/static/js/test-napping.js

@@ -0,0 +1,92 @@
+
+const planeContainer = document.getElementById('napping-plane');
+const productsContainer = document.getElementById('items');
+const products = document.querySelectorAll('.item-product');
+
+// Configuration for the physical dimensions of the tablecloth (in cm)
+const PHYSICAL_WIDTH = 60;
+const PHYSICAL_HEIGHT = 40;
+
+let selectedProductCode = null;
+let selectedProductId = null;
+
+// Object to store coordinates: { "CODE": { x: 10.5, y: 20.1, id: 123 } }
+const placedPoints = {};
+
+// 1. Handle Product Selection
+products.forEach(product => {
+    product.addEventListener('click', () => {
+        // Remove selection from others
+        products.forEach(p => p.classList.remove('ring-4', 'ring-primary'));
+
+        // Select current
+        product.classList.add('ring-4', 'ring-primary');
+        selectedProductCode = product.dataset.code;
+        selectedProductId = product.dataset.idProduct;
+    });
+});
+
+// 2. Handle Plane Click (Placing Points)
+planeContainer.addEventListener('click', (e) => {
+    if (!selectedProductCode) {
+        spanNotifaction("Por favor, selecciona un producto primero")
+        return;
+    }
+
+    const rect = planeContainer.getBoundingClientRect();
+
+    // Calculate click position relative to the container (in pixels)
+    const xPixel = e.clientX - rect.left;
+    const yPixel = e.clientY - rect.top;
+
+    // Calculate scaled coordinates (0 to PHYSICAL_DIMENSIONS)
+    // X axis: 0 on left, 60 on right
+    const xCoord = (xPixel / rect.width) * PHYSICAL_WIDTH;
+
+    // Y axis: 0 on bottom, 40 on top (Invert Y because DOM Y is 0 at top)
+    const yCoord = PHYSICAL_HEIGHT - ((yPixel / rect.height) * PHYSICAL_HEIGHT);
+
+    // Update Data Object
+    placedPoints[selectedProductCode] = {
+        x: parseFloat(xCoord.toFixed(2)),
+        y: parseFloat(yCoord.toFixed(2)),
+        id: selectedProductId
+    };
+
+    // Render Point
+    renderPoint(selectedProductCode, xPixel, yPixel, xCoord, yCoord);
+});
+
+function renderPoint(code, xPx, yPx, xVal, yVal) {
+    // Remove existing point for this product if it exists
+    const existingPoint = document.getElementById(`point-${code}`);
+    if (existingPoint) {
+        existingPoint.remove();
+    }
+
+    const point = document.createElement('div');
+    point.id = `point-${code}`;
+    point.className = 'absolute w-4 h-4 bg-red-600 rounded-full transform -translate-x-1/2 -translate-y-1/2 cursor-pointer border-2 border-white shadow-md group';
+    point.style.left = `${xPx}px`;
+    point.style.top = `${yPx}px`;
+
+    // Tooltip/Label
+    const label = document.createElement('div');
+    label.className = 'absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 px-2 py-1 bg-gray-800 text-white text-xs rounded whitespace-nowrap z-10 hidden group-hover:block';
+    label.innerHTML = `
+            <strong>${code}</strong><br>
+            X: ${xVal.toFixed(1)}<br>
+            Y: ${yVal.toFixed(1)}
+        `;
+
+    point.appendChild(label);
+    planeContainer.appendChild(point);
+
+    // Also show a permanent label next to the point if desired, 
+    // or just rely on the hover. For now, let's add a small text label below it.
+    const textLabel = document.createElement('span');
+    textLabel.className = 'absolute top-4 left-1/2 transform -translate-x-1/2 text-xs font-bold text-gray-700 pointer-events-none';
+    textLabel.innerText = code;
+    point.appendChild(textLabel);
+}
+

tecnicas/templates/tecnicas/forms_tester/test_napping.html

@@ -0,0 +1,131 @@
+{% extends 'tecnicas/layouts/base.html' %}
+
+{% load static %}
+
+{% block title %}Napping{% endblock %}
+
+{% block content %}
+<article class="cts-container-main">
+    <article class="cts-wrap-content text-black max-w-4xl">
+        <header class="text-center flex-row w-full items-stretch flex justify-around flex-wrap gap-2">
+            <h1 class="rounded font-bold text-2xl bg-surface-ligt p-4 flex-1">
+                Sesión usando <br>técnica
+                <span class="uppercase">{{ session.tecnica.tipo_tecnica }}</span>
+            </h1>
+            <button class="cts-btn-general cts-btn-error btn-push" onclick="exit_sesion('form-actions')">
+                Salir de la sesión
+            </button>
+        </header>
+
+        <article class="hidden">
+            <form action="{% url 'cata_system:catador_init_session' code_sesion=session.codigo_sesion %}" method="post"
+                class="form-actions">
+                {% csrf_token %}
+                <input type="hidden" name="action" class="action-input">
+            </form>
+        </article>
+
+        <section class="hidden">
+            <input type="hidden" value="{{ session.tecnica.id }}" name="id-tecnica" class="ct-input-id-tech">
+        </section>
+
+        {% if error %}
+        {% include "../components/error-message.html" with message=error %}
+        {% endif %}
+
+        <article class="rounded flex flex-col gap-4">
+            <section class="flex items-center justify-center bg-surface-ligt p-2 rounded-lg">
+                <p class="text-lg font-medium text-center">
+                    {{ session.tecnica.instrucciones }}
+                </p>
+            </section>
+
+            <section class="flex items-center justify-center flex-wrap gap-4 bg-surface-ligt p-2 rounded-lg">
+                <p class="text-xl font-bold text-center">
+                    Modalidad: Napping
+                </p>
+            </section>
+        </article>
+
+        <article class="container-rating-word p-2 py-6 space-y-6 bg-surface-ligt rounded min-w-3xl">
+            <h2 class="text-xl font-bold">Productos en la sesión</h2>
+            <div id="items" class="original-products flex gap-4 flex-wrap justify-center"
+                data-original-products="original">
+                {% for product in products %}
+                <div class="item-product bg-btn-secondary text-black font-bold px-4 py-2 rounded cursor-grab transition-all"
+                    data-id-product="{{ product.id }}" data-code="{{ product.codigoProducto }}">
+                    {{ product.codigoProducto }}
+                </div>
+                {% endfor %}
+            </div>
+
+            <!-- Cartesian Plane Container -->
+            <div class="flex justify-center w-full">
+                <div class="relative w-full max-w-[800px] aspect-[3/2] bg-white border-2 border-gray-400 shadow-inner cursor-crosshair"
+                    id="napping-plane"
+                    style="background-image: linear-gradient(#e5e7eb 1px, transparent 1px), linear-gradient(90deg, #e5e7eb 1px, transparent 1px); background-size: 20px 20px;">
+                    <!-- Axis Labels -->
+                    <span class="absolute bottom-1 right-2 text-xs text-gray-500 font-bold">60cm (X)</span>
+                    <span class="absolute top-2 left-1 text-xs text-gray-500 font-bold">40cm (Y)</span>
+                    <span class="absolute bottom-1 left-1 text-xs text-gray-500 font-bold">0</span>
+                </div>
+            </div>
+
+            <!-- <section role="alert" class="alert alert-info">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+                    class="h-6 w-6 shrink-0 stroke-current">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                        d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 0 0118 0z"></path>
+                </svg>
+                <span class="text-lg">
+                    Para guardar los datos sin finalizar su sesión use el botón
+                    <b>"Guardar progreso"</b>
+                </span>
+            </section>
+
+            <section role="alert" class="alert alert-warning">
+                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 shrink-0 stroke-current" fill="none"
+                    viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                        d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
+                </svg>
+                <div class="flex-col">
+                    <span class="text-lg block">
+                        Si usas el botón <b>“Salir de la sesión”</b> asegúrese de guardar el progreso de lo contrario
+                        perderás todo lo que no hayas guardado antes
+                    </span>
+                    <span class="text-lg block">
+                        Con el botón <b>��Finalizar la sesión”</b>, se guardan las palabras, sales de la sesión y no
+                        podrás ingresar otra vez
+                    </span>
+                </div>
+            </section> -->
+
+            <!-- <section class="flex justify-end gap-4 max-sm:flex-col">
+                <button id="save-progress" class="cts-btn-general cts-btn-primary btn-push">
+                    Guardar progreso
+                </button>
+                <div class="flex gap-2">
+                    <button id="question-save" class="cts-btn-general cts-btn-secondary btn-push flex-1">
+                        ¿Finalizar sesión?
+                    </button>
+                    <button id="finish-session" class="cts-btn-general cts-btn-tertiary btn-push hidden flex-1">
+                        Finalizar
+                    </button>
+                    <button id="cancel-save" class="cts-btn-general cts-btn-error btn-push hidden flex-1">
+                        Cancelar
+                    </button>
+                </div>
+                <span id="loading-data-save" class="loading loading-spinner loading-xl text-accent hidden"></span>
+            </section> -->
+        </article>
+
+        {% include "../components/toast-container.html" %}
+    </article>
+</article>
+{% endblock %}
+
+{% block extra_js %}
+<script src="{% static 'js/actions-form.js' %}"></script>
+<script src="{% static 'js/test-napping.js' %}"></script>
+{% endblock %}

tecnicas/urls.py

@@ -122,6 +122,10 @@ urlpatterns = [
          views.sortTest,
          name="session_sort"),
 
+    path("testers/init-session/<str:code_sesion>/nappping",
+         views.nappingTest,
+         name="session_napping"),
+
 
     # APIs
     path("presenter/api/nueva-etiqueta",

tecnicas/views/__init__.py

@@ -38,3 +38,4 @@ from .tester_forms.convencional_scales import convencionalScales
 from .tester_forms.cata_test import cataTest
 from .tester_forms.pf_test import pfTest
 from .tester_forms.sort_test import sortTest
+from .tester_forms.napping_test import nappingTest

tecnicas/views/tester_forms/init_tester_form.py

@@ -46,7 +46,7 @@ def initTesterForm(req: HttpRequest, code_sesion: str):
         return response
 
     elif req.method == "POST":
-        if type_technique == "escalas" or type_technique == "rata" or type_technique == "cata":
+        if type_technique in ["escalas", "rata", "cata"]:
             view_controller = InitSessionEscalasController(
                 sensorial_session=session, user_tester=req.user.user_catador)
             response = view_controller.controllPost(request=req)
@@ -60,7 +60,12 @@ def initTesterForm(req: HttpRequest, code_sesion: str):
             view_controller = InitSessionSortController(
                 sensorial_session=session, user_tester=req.user.user_catador)
             response = view_controller.controllPost(request=req)
-        
+
+        elif type_technique == "napping":
+            view_controller = InitSessionNappingController(
+                sensorial_session=session, user_tester=req.user.user_catador)
+            response = view_controller.controllPost(request=req)
+
         else:
             context = {
                 "session": session,

tecnicas/views/tester_forms/napping_test.py

@@ -0,0 +1,27 @@
+from django.http import HttpRequest
+from tecnicas.models import SesionSensorial
+from tecnicas.controllers import TestNappingController
+from tecnicas.utils import noValidTechnique
+
+
+def nappingTest(req: HttpRequest, code_sesion: str):
+    if req.method == "GET":
+        session = SesionSensorial.objects.get(codigo_sesion=code_sesion)
+        controll_view = TestNappingController(
+            sensorial_session=session, user_tester=req.user.user_catador)
+        return controll_view.controllGet(request=req)
+
+    elif req.method == "POST":
+        # Se usa para finalizar la sesión
+        session = SesionSensorial.objects.get(codigo_sesion=code_sesion)
+        controll_view = TestNappingController(
+            sensorial_session=session, user_tester=req.user.user_catador)
+        return controll_view.controllPost(request=req)
+
+    else:
+        return noValidTechnique(
+            name_view="cata_system:catador_init_session",
+            query_params={
+                "error": "Método no valido"
+            }
+        )