Merge pull request #12 from CascoArcilla/HU10

tecnicas/controllers/models_controller/palabras_controller.py

@@ -18,6 +18,7 @@ class PalabrasController():
         searched_words = list(Palabra.objects.filter(id__in=self.ids_words))
         if not len(searched_words):
             return controller_error("no se han encontrado registros")
+        self.words = searched_words
         return self.words
 
     @staticmethod

tecnicas/controllers/views_controller/main_tester_form_controller.py

@@ -51,6 +51,14 @@ class MainTesterFormController():
         try:
             participation = Participacion.objects.get(id=id_participation)
 
+            # ////////////////////////////////////////////////////////////// #
+            #
+            # Si numero_calificaciones_esperadas = productos * palabras
+            # Es igual a numero_calificaciones_actuales en la repetcion R
+            # Ha terminado la repeticion
+            #
+            # ////////////////////////////////////////////////////////////// #
+
             if participation.finalizado:
                 num_products = Producto.objects.filter(
                     id_tecnica=self.session.tecnica).count()
@@ -60,20 +68,18 @@ class MainTesterFormController():
                 num_words: int
 
                 if style_words.nombre_estilo == "atributos":
-                    e_atribues = EsAtributo.objects.get(
-                        id_tecnica=self.session.tecnica)
-                    num_words = e_atribues.palabras.count()
+                    num_words = EsAtributo.objects.get(
+                        id_tecnica=self.session.tecnica).palabras.count()
                 elif style_words.nombre_estilo == "vocabulario":
-                    e_vocabulary = EsVocabulario.objects.get(
-                        id_tecnica=self.session.tecnica)
-                    num_words = e_vocabulary.id_vocabulario.palabras.count()
+                    num_words = EsVocabulario.objects.get(
+                        id_tecnica=self.session.tecnica).id_vocabulario.palabras.count()
 
                 num_ratings_now = Calificacion.objects.filter(
                     id_tecnica=self.session.tecnica, id_catador=self.tester, num_repeticion=repetition).count()
 
-                num_ratings_max_by_tester = num_products * num_words
+                expected_ratings_repetition = num_products * num_words
 
-                return not num_ratings_now <= num_ratings_max_by_tester
+                return  num_ratings_now >= expected_ratings_repetition
             else:
                 return participation.finalizado
         except Participacion.DoesNotExist:

tecnicas/static/js/created-scale.js

@@ -117,7 +117,7 @@ function addBtnNextWord() {
 
   const btnNesxtWord = document.createElement("button");
   btnNesxtWord.classList.add(...BTN_CLASS_STYLE, "ct-btn-next-word");
-  btnNesxtWord.textContent = "Siguiente palabra";
+  btnNesxtWord.textContent = "Siguiente producto";
   btnNesxtWord.addEventListener("click", nextWord);
 
   const articleContainer = document.createElement("article");

tecnicas/static/js/start-tester-test.js

@@ -2,3 +2,9 @@ function startTest() {
   const actionForms = document.querySelector(".ct-action-form");
   actionForms.submit();
 }
+
+function closeSession() {
+  const actionForms = document.querySelector(".ct-action-form");
+  actionForms.querySelector(".action-option").value = "close_session"
+  actionForms.submit();
+}

tecnicas/templates/tecnicas/auth.html

@@ -3,29 +3,35 @@
 {% block title %}Login{% endblock %}
 
 {% block content %}
-<article class="w-full h-full flex flex-col justify-center items-center bg-gray-600">
-    <form action="/auth" method="post" class="bg-gray-200 w-xl p-8 rounded-xl">
-        <header class="text-center">
-            <h1 class="text-5xl font-bold">Cateo System</h1>
-            <p class="text-2xl font-medium mt-3">Presentador</p>
-        </header>
-        <section class="flex flex-col gap-6 items-center w-full mt-5">
-            <label for="id">
-                <input type="text" name="id" id="id" placeholder="Ingrese Indentifiacion"
-                    class="placeholder:text-gray-100 placeholder:text-xl bg-gray-400 py-3 px-6 rounded-xl w-sm border-b-2 border-blue-700" required>
-            </label>
+<article class="cts-container-main">
+    <article class="cts-wrap-content">
+        <form action="" method="post" class="p-8 rounded-xl text-black">
+            <header class="text-center">
+                <h1 class="text-5xl max-sm:text-3xl font-bold">Cata System</h1>
+                <p class="text-2xl max-sm:text-xl font-semibold mt-3">Presentador</p>
+            </header>
+            <section class="flex flex-col gap-6 items-center w-full mt-5">
+                <label for="id">
+                    <input type="text" name="id" id="id" placeholder="Ingrese Indentifiacion"
+                        class="placeholder:text-gray-400 placeholder:font-semibold text-xl max-sm:text-base bg-surface-ligt py-3 px-6 rounded-xl lg:w-sm border-b-2 border-surface-sweet"
+                        required>
+                </label>
 
-            <label for="id">
-                <input type="text" name="id" id="id" placeholder="Ingrese Contraseña"
-                    class="placeholder:text-gray-100 placeholder:text-xl bg-gray-400 py-3 px-6 rounded-xl w-sm border-b-2 border-blue-700" required>
-            </label>
+                <label for="id">
+                    <input type="text" name="id" id="id" placeholder="Ingrese Contraseña"
+                        class="placeholder:text-gray-400 placeholder:font-semibold text-xl max-sm:text-base bg-surface-ligt py-3 px-6 rounded-xl lg:w-sm border-b-2 border-surface-sweet"
+                        required>
+                </label>
 
-            <section class="flex flex-row flex-wrap gap-4 w-f ull justify-center">
-                <button type="submit"
-                    class="text-white bg-blue-600 hover:bg-blue-700 active:outline-none active:ring-4 active:ring-blue-300 font-medium rounded-xl text-xl px-8 py-2 text-center uppercase">Ingresar</button>
-            </section>
+                <section class="flex flex-row flex-wrap gap-4 w-f ull justify-center">
+                    <button type="submit"
+                        class="cts-btn-general cts-btn-primary btn-push uppercase lg:w-sm">
+                        Ingresar
+                    </button>
+                </section>
 
-        </section>
-    </form>
+            </section>
+        </form>
+    </article>
 </article>
 {% endblock %}

tecnicas/templates/tecnicas/cata-login.html

@@ -3,50 +3,56 @@
 {% block title %}Login{% endblock %}
 
 {% block content %}
-<article class="w-full h-full flex flex-col justify-center items-center bg-gray-600">
-    <form action="" method="post" class="bg-gray-200 w-xl p-8 rounded-xl">
-        {% csrf_token %}
-        <header class="text-center">
-            <h1 class="text-5xl font-bold">Cateo System</h1>
-            <p class="text-2xl font-medium mt-3">Catadores</p>
-        </header>
-
-        {% if error %}
-        <article class="bg-red-600 p-4 text-white rounded-xl ct-notification-error">
-            <p class="block font-sans text-white text-xl antialiased font-bold uppercase tracking-wider text-center">
-                {{ error }}
-            </p>
-        </article>
-        {% endif %}
-
-        <article class="flex flex-col gap-6 items-center w-full mt-5">
-            <label for="id">
-                <input type="text" name="code_session" id="id" placeholder="Codigo de sesion"
-                    class="placeholder:text-gray-100 placeholder:text-xl bg-gray-400 py-3 px-6 rounded-xl w-sm border-b-2 border-blue-700"
-                    required>
-            </label>
-
-            <label for="id">
-                <input type="text" name="user_tester" id="id" placeholder="Nombre de usuario"
-                    class="placeholder:text-gray-100 placeholder:text-xl bg-gray-400 py-3 px-6 rounded-xl w-sm border-b-2 border-blue-700"
-                    required>
-            </label>
-
-            <section class="flex flex-row flex-wrap gap-4 w-f ull justify-center">
-                <button type="submit"
-                    class="text-white bg-blue-600 hover:bg-blue-700 active:outline-none active:ring-4 active:ring-blue-300 font-medium rounded-xl text-xl px-8 py-2 text-center uppercase">Ingresar</button>
-            </section>
-
-        </article>
-    </form>
+<article class="cts-container-main">
+    <article class="cts-wrap-content">
+        <form action="" method="post" class="p-8 rounded-xl text-black">
+            {% csrf_token %}
+            <header class="text-center">
+                <h1 class="text-5xl max-sm:text-3xl font-bold">Cata System</h1>
+                <p class="text-2xl max-sm:text-xl font-semibold mt-3">Catadores</p>
+            </header>
+
+            {% if error %}
+            <article class="bg-ct-error p-4 text-white rounded-xl ct-notification-error">
+                <p
+                    class="block font-sans text-white text-xl antialiased font-bold uppercase tracking-wider text-center">
+                    {{ error }}
+                </p>
+            </article>
+            {% endif %}
+
+            <article class="flex flex-col gap-6 items-center w-full mt-5">
+                <label for="id">
+                    <input type="text" name="code_session" id="id" placeholder="Codigo de sesion"
+                        class="placeholder:text-gray-400 placeholder:font-semibold text-xl max-sm:text-base bg-surface-ligt py-3 px-6 rounded-xl lg:w-sm border-b-2 border-surface-sweet"
+                        required>
+                </label>
+
+                <label for="id">
+                    <input type="text" name="user_tester" id="id" placeholder="Nombre de usuario"
+                        class="placeholder:text-gray-400 placeholder:font-semibold text-xl max-sm:text-base bg-surface-ligt py-3 px-6 rounded-xl lg:w-sm border-b-2 border-surface-sweet"
+                        required>
+                </label>
+
+                <section class="flex flex-row flex-wrap gap-4 w-f ull justify-center">
+                    <button type="submit" class="cts-btn-general cts-btn-primary btn-push uppercase lg:w-sm">
+                        Ingresar
+                    </button>
+                </section>
+
+            </article>
+        </form>
+    </article>
 </article>
 {% endblock %}
 
 {% block extra_js %}
 <script>
     const error = document.querySelector(".ct-notification-error")
-    setTimeout(() => {
-        error.classList.add("hidden")
-    }, 4000)
+    if (error) {
+        setTimeout(() => {
+            error.classList.add("hidden")
+        }, 4000)
+    }
 </script>
 {% endblock %}

tecnicas/templates/tecnicas/forms_tester/convencional.html

@@ -27,26 +27,19 @@
     @media (width < 40rem) {
         .container-forms {
             width: inherit;
-
-        }
-
-        .container-input {
-            overflow-x: scroll;
         }
     }
 </style>
 {% endblock %}
 
 {% block content %}
-<article class="w-full flex flex-col justify-center items-center bg-gray-600 mt-10 mb-10 max-sm:">
-    <article class="flex flex-col gap-8 bg-gray-400 p-10 max-sm:py-10 max-sm:px-3 rounded container-forms">
+<article class="cts-container-main">
+    <article class="cts-wrap-content text-black">
         <header class="text-center flex-row w-full items-stretch flex justify-around flex-wrap gap-2">
-            <h1 class="text-white rounded font-bold text-2xl bg-gray-600 p-4 flex-1">
+            <h1 class="rounded font-bold text-2xl bg-surface-ligt p-4 flex-1">
                 Sesión usando <br>técnica Convencional
             </h1>
-            <button
-                class="text-lg font-bold tracking-wider p-2 px-8 border-b-4 active:border-b-0 active:border-t-2 active:border-blue-500 border-blue-800  transition-all rounded-xl bg-blue-500 text-gray-300"
-                onclick="exit_sesion('form-actions')">
+            <button class="cts-btn-general cts-btn-error btn-push" onclick="exit_sesion('form-actions')">
                 Salir de la sesión
             </button>
         </header>
@@ -68,13 +61,13 @@
         {% endif %}
 
         <article class="rounded flex flex-col gap-4">
-            <section class="flex items-center justify-center bg-gray-200 p-2 rounded-lg">
+            <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">
-                <div class="bg-gray-200 p-2 rounded-lg flex-1">
+                <div class="bg-surface-ligt p-2 rounded-lg flex-1">
                     <p class="text-lg font-bold text-center">
                         Producto:
                     </p>
@@ -83,7 +76,7 @@
                         <span class="hidden id-product">{{ product.id }}</span>
                     </p>
                 </div>
-                <div class="bg-gray-200 p-2 rounded-lg flex-1">
+                <div class="bg-surface-ligt p-2 rounded-lg flex-1">
                     <p class="text-lg font-bold text-center">
                         Repetición:
                     </p>
@@ -101,23 +94,22 @@
         </article>
 
         <article
-            class="scales-container [&>*:not(:last-child)]:mb-5 min-lg:grid min-lg:items-start grid-cols-2 gap-3 flex flex-col items-center justify-center">
+            class="scales-container [&>*:not(:last-child)]:mb-5 min-lg:grid min-lg:items-start grid-cols-2 gap-3 justify-center items-center">
             {% if type_scale == "continua" %}
             {% for word in words %}
             <form action="" method="post" class="form-rating-{{word}} w-full">
                 {% csrf_token %}
-                <article class="container-input w-full">
-                    <article class="bg-gray-200 p-6 rounded-lg mb-3 w-fit">
+                <article class="overflow-x-scroll w-full">
+                    <article class="bg-surface-card p-6 rounded-lg mb-3 w-fit">
                         <label for="id-range-word-{{word}}"
                             class="text-xl font-bold tracking-wide block mb-6 first-letter:uppercase">{{ word }}</label>
 
                         <span class="hidden id-word">{{ word.id }}</span>
 
                         <section class="block">
-                            <div class="relative">
-                                <input id="id-range-word-{{word}}" type="range" min="0" max="1000" value="500"
-                                    name="rating-word"
-                                    class="h-2 bg-gray-400 rounded-lg appearance-none cursor-pointer slider"
+                            <div class="relative mx-6">
+                                <input type="range" type="range" min="0" max="1000" value="500" name="rating-word"
+                                    class="range range-md text-blue-400 [--range-bg:orange] [--range-thumb:blue] [--range-fill:0]"
                                     style="width: {{scale.longitud}}cm;">
 
                                 <div
@@ -156,15 +148,72 @@
                 <article class="flex flex-col justify-center gap-2 items-end actions-{{word}}">
                     <section class="flex justify-end items-center gap-2 btns-container">
                         <button type="button" onclick="checkSendRating('{{word}}')"
-                            class="ct-btn-check-{{word}} text-lg tracking-wider font-medium p-2 px-4 border-b-2 active:border-b-0 active:border-t-2 active:border-blue-500 border-blue-800  transition-all rounded-xl bg-blue-500 text-white w-fit disabled:bg-amber-600">
+                            class="ct-btn-check-{{word}} cts-btn-general-compress py-2 px-4 cts-btn-secondary btn-push">
                             ¿Guardar calificación?
                         </button>
                         <button type="button" onclick="sendRating('{{word}}')"
-                            class="ct-btn-submit-{{word}} text-lg tracking-wider font-medium p-2 px-4 border-b-2 active:border-b-0 active:border-t-2 active:border-green-500 border-green-800  transition-all rounded-xl bg-green-500 text-white w-fit disabled:bg-amber-600 hidden">
+                            class="ct-btn-submit-{{word}} cts-btn-general-compress py-2 px-4 cts-btn-primary btn-push hidden">
                             Estoy seguro
                         </button>
                         <button type="button" onclick="cancelSendRating('{{word}}')"
-                            class="ct-btn-cancel-{{word}} text-lg tracking-wider font-medium p-2 px-4 border-b-2 active:border-b-0 active:border-t-2 active:border-orange-500 border-orange-800  transition-all rounded-xl bg-orange-500 text-white w-fit disabled:bg-amber-600 hidden">
+                            class="ct-btn-cancel-{{word}} cts-btn-general-compress py-2 px-4 cts-btn-error btn-push hidden">
+                            Cancelar
+                        </button>
+                    </section>
+                </article>
+            </form>
+            {% endfor %}
+            {% elif type_scale == "estructurada" %}
+            {% for word in words %}
+            <form action="" method="post" class="form-rating-{{ word }} w-full">
+                {% csrf_token %}
+                <article class="overflow-x-scroll w-full">
+                    <article class="bg-surface-card p-6 rounded-lg mb-3 w-fit">
+                        <label for="id-scale-word-{{ word }}"
+                            class="text-xl font-bold tracking-wide block mb-6 first-letter:uppercase">{{ word }}</label>
+                        <span class="hidden id-word">{{ word.id }}</span>
+
+                        <section>
+                            <div class="w-full min-w-xs">
+                                <div class="relative mx-6">
+                                    <input type="range" min="1" max="{{scale.longitud}}" step="1" name="rating-word"
+                                        class="w-full range range-md text-blue-400 [--range-bg:orange] [--range-thumb:blue] [--range-fill:0] z-5">
+                                    <div
+                                        class="absolute top-0 left-0 w-full h-full z-10 flex justify-between pointer-events-none">
+                                        {% for tag in tags %}
+                                        <div class="w-0.5 transform -translate-x-1/2 h-full bg-red-500">
+                                        </div>
+                                        {% endfor %}
+                                    </div>
+                                </div>
+
+                                <div class="flex justify-between mt-4 text-xs gap-1">
+                                    {% for tag in tags %}
+                                    <div class="flex items-center justify-center text-center w-[70px]">
+                                        <span
+                                            class="text-xs font-medium text-gray-700 break-words first-letter:capitalize">
+                                            {{ tag.id_etiqueta }}
+                                        </span>
+                                    </div>
+                                    {% endfor %}
+                                </div>
+                            </div>
+                        </section>
+                    </article>
+                </article>
+
+                <article class="flex flex-col justify-center gap-2 items-end actions-{{ word }}">
+                    <section class="flex justify-end items-center gap-2 btns-container">
+                        <button type="button" onclick="checkSendRating('{{ word }}')"
+                            class="ct-btn-check-{{ word }} cts-btn-general-compress py-2 px-4 cts-btn-secondary btn-push">
+                            ¿Guardar calificación?
+                        </button>
+                        <button type="button" onclick="sendRating('{{ word }}')"
+                            class="ct-btn-submit-{{ word }} cts-btn-general-compress py-2 px-4 cts-btn-primary btn-push hidden">
+                            Estoy seguro
+                        </button>
+                        <button type="button" onclick="cancelSendRating('{{ word }}')"
+                            class="ct-btn-cancel-{{ word }} cts-btn-general-compress py-2 px-4 cts-btn-error btn-push hidden">
                             Cancelar
                         </button>
                     </section>

tecnicas/templates/tecnicas/forms_tester/main_tester.html

@@ -4,16 +4,16 @@
 {% block title %}Detalles Sesion{% endblock %}
 
 {% block content %}
-<article class="w-full flex flex-col justify-center items-center bg-gray-600 mt-10 mb-10">
-    <article class="flex flex-col gap-8 bg-gray-400 p-10 rounded-2xl">
+<article class="cts-container-main">
+    <article class="cts-wrap-content text-black">
         <header class="text-center flex-row w-full flex justify-around items-center flex-wrap gap-10">
-            <h1 class="text-white rounded-xl font-bold text-2xl bg-gray-600 p-4 flex-1">
+            <h1 class="rounded-xl font-bold text-2xl bg-surface-ligt p-4 flex-1">
                 Panel principal de Catadores
             </h1>
         </header>
 
         <article>
-            <p class="text-2xl font-medium text-center bg-gray-200 p-4 rounded-lg">
+            <p class="text-2xl font-medium text-center bg-surface-sweet p-4 rounded-lg">
                 Información sobre la sesión en la que participa
             </p>
         </article>
@@ -31,8 +31,8 @@
         {% if message %}
         <hr>
 
-        <article class="bg-blue-600 p-4 text-white rounded-xl ct-notification-error">
-            <p class="block font-sans text-white text-xl antialiased font-bold uppercase tracking-wider text-center">
+        <article class="bg-surface-alter-card p-4 rounded-xl max-w-2xl">
+            <p class="block text-xl antialiased font-bold text-center">
                 {{ message }}
             </p>
         </article>
@@ -41,7 +41,7 @@
         <hr>
 
         <article
-            class="text-white rounded-xl grid grid-cols-1 gap-3 text-center *:bg-gray-500 *:flex *:flex-wrap *:items-center *:justify-center *:gap-x-2 *:p-4 *:rounded-2xl">
+            class="rounded-xl grid grid-cols-1 gap-3 text-center *:bg-surface-card *:flex *:flex-wrap *:items-center *:justify-center *:gap-x-2 *:p-4 *:rounded-2xl">
             {% if session %}
             <section>
                 <p class="text-xl font-bold">
@@ -99,13 +99,12 @@
 
         <article class="flex flex-wrap gap-10">
             {% if has_ended %}
-            <button
-                class="ct-btn-start-repition flex-1 uppercase text-lg tracking-wider p-4 border-b-2 active:border-b-0 active:border-t-2 active:border-green-500 border-green-800  transition-all rounded-xl bg-green-600 text-white font-bold disabled:bg-amber-600 flex flex-col justify-center items-center gap-2" disabled>
-                Finalizaste la sesión
-            </button>
+            <div class="text-2xl font-semibold flex-1 cts-btn-secondary p-4 flex justify-center items-center rounded-lg select-none">
+                <p class=" text-black">Finalizaste la repetición</p>
+            </div>
             {% else %}
             <button
-                class="ct-btn-start-repition flex-1 uppercase text-lg tracking-wider p-4 border-b-2 active:border-b-0 active:border-t-2 active:border-green-500 border-green-800  transition-all rounded-xl bg-green-600 text-white font-bold disabled:bg-amber-600 flex flex-col justify-center items-center gap-2"
+                class="ct-btn-start-repition flex-1 uppercase text-lg tracking-wider cts-btn-general cts-btn-primary btn-push flex flex-col justify-center items-center gap-2"
                 onclick="startTest()">
                 Iniciar técnica
                 <figure class="w-10">
@@ -114,7 +113,8 @@
             </button>
             {% endif %}
             <button
-                class="flex-1 uppercase text-lg tracking-wider p-4 border-b-2 active:border-b-0 active:border-t-2 active:border-red-500 border-red-800 transition-all rounded-xl bg-red-600 text-white font-bold disabled:bg-amber-600 flex flex-col justify-center items-center gap-2">
+                class="flex-1 uppercase text-lg tracking-wider cts-btn-general cts-btn-error btn-push flex flex-col justify-center items-center gap-2"
+                onclick="closeSession()">
                 Salir se la sesión
                 <figure class="w-10">
                     <img src="{% static 'img/exit.svg' %}" alt="bote de basura" class="invert">
@@ -124,7 +124,7 @@
 
         <form action="" method="post" class="hidden ct-action-form">
             {% csrf_token %}
-            <input type="hidden" name="action" value="start_posting">
+            <input type="hidden" class="action-option" name="action" value="start_posting">
         </form>
     </article>
 </article>

tecnicas/views/sessions_config/create_session.py

@@ -118,7 +118,7 @@ def createSession(req: HttpRequest):
             words_using = style_controller.relatedWords()
             if isinstance(words_using, dict):
                 controllerTechnique.deleteTechnique()
-                return general_error("error")
+                return general_error(words_using["error"])
 
             # //////////////////////////////////////////////////////// #
             #
@@ -148,6 +148,12 @@ def createSession(req: HttpRequest):
                 }
             }
 
+            # /////////////////////////////// #
+            #
+            # Final step: Delete session keys #
+            #
+            # /////////////////////////////// #
+
             keys_forms = [
                 "form_basic",
                 "form_tags",

tecnicas/views/tester_forms/main_tester_form.py

@@ -20,7 +20,11 @@ def mainTesterForm(req: HttpRequest):
 
         if not isinstance(order, dict):
             req.session["id_order"] = order.id
-            if view_controller.isEndedSession(id_participation=req.session["id_participation"], repetition=session.tecnica.repeticion):
+            is_end = view_controller.isEndedSession(
+                id_participation=req.session["id_participation"], repetition=session.tecnica.repeticion)
+            
+            if is_end:
+                print("Estoy dentro y termine [0_0]")
                 context["message"] = "El catador ha terminado de realizar su evaluación, espere instrucciones del presentador"
                 context["has_ended"] = True
 

theme/static_src/src/styles.css

@@ -14,6 +14,10 @@
   @apply font-bold rounded-lg text-xl p-4 text-center;
 }
 
+.cts-btn-general-compress {
+  @apply font-bold rounded-lg text-xl text-center;
+}
+
 .cts-btn-primary {
   @apply text-white bg-btn-primary border-green-800;
 }