CC1

contenido/01.html

@@ -16,9 +16,9 @@
               <img src="img/01.0.webp" class="img-fluid">
               <div class="position-absolute h-100 top-0 start-0" style="width: 65%;">
                 <div class="row justify-content-center align-items-center h-100">
-                  <div class="col-7">
+                  <div class="col-8">
                     <div class="position-relative d-inline-block animate__animated animate__bounceInDown">
-                      <h1 class="text-white fw-bold">Guía de entrenamiento para el paciente en Diálisis Peritoneal <strong
+                      <h1 class="text-white fw-bold">GUÍA DE ENTRENAMIENTO PARA EL PACIENTE EN DIÁLISIS PERITONEAL <strong
                           class="text-secondary">>>></strong></h1>
                       <hr class="border border-1 border-verde-claro hr-style mx-auto my-0 mb-3">
                     </div>

contenido/04.html

@@ -64,7 +64,7 @@
                   </div>
                   <div
                     class="position-relative w-100 bg-verde-claro-2 text-center px-3 py-2 mb-3 animate__animated animate__flipInX animate__delay-1s">
-                    <p class="mb-0 text-verde-oscuro">A la secuencia de pasos que incluye al drenaje, permanencia e infusión se le conoce como: <strong>recambio</strong>
+                    <p class="mb-0 text-verde-oscuro">A la secuencia de pasos que incluye al drenaje, permanencia e infusión se le conoce como: <strong>recambio</strong>.
                     </p>
                   </div>
                   <div class="position-relative w-100 text-center animate__animated animate__zoomIn animate__delay-2s">

contenido/05.html

@@ -539,6 +539,7 @@
         CourseNav.audioController.stopAllSoundsAndPlay(isCorrect ? good : bad);
 
         $(this).html(draggedItem.find('.col-12').text()).addClass('text-center d-flex align-items-center justify-content-center');
+        $(this).droppable('disable'); // Disable this drop zone
         draggedItem.hide();
 
         if (isCorrect) {

contenido/06.html

@@ -143,7 +143,7 @@
           </div>
           <div class="col-12 mb-3 text-center">
             <div class="position-relative d-inline-block">
-              <h2 class="text-primary mb-1 fw-bold">Vivir con enfermedad renal</h2>
+              <h2 class="text-primary mb-1 fw-bold">Acceso peritoneal y sus cuidados</h2>
               <hr class="border border-2 border-verde-oscuro hr-style my-0 opacity-100">
             </div>
           </div>

contenido/07.html

@@ -64,8 +64,7 @@
           <div class="col-12 text-center mb-3 animate__animated animate__flipInX">
             <p>La línea de transferencia y el catéter deben <strong class="text-lila-claro">mantenerse alejados de gérmenes</strong> que ponen en riesgo su
               salud y vida.</p>
-            <p class="mb-0">Por eso se utiliza una <strong class="text-lila-claro">técnica aséptica para la manipulación de su acceso peritoneal,</strong> ya sea para
+            <p class="mb-0">Por eso, se utiliza una <strong class="text-lila-claro">técnica aséptica para la manipulación de su acceso peritoneal</strong>, ya sea para realizar un recambio, explorar su orificio de salida o en procedimientos realizados por el personal de salud.</p>
-              realizar un recambio, explorar su orificio de salida o procedimientos realizados por el personal de salud.</p>
           </div>
           <div class="col-12 text-center animate__animated animate__lightSpeedInLeft animate__delay-1s mb-3">
             <div class="d-inline-block px-3 py-2 bg-verde-claro rounded-3 text-verde-oscuro fw-bold">
@@ -335,47 +334,17 @@
                 }
               });
               CourseNav.audioController.stopAllSoundsAndPlay(feedbackcorrect);
-
+              flippedCards = [];
-              Swal.fire({
+              checkGameCompletion();
-                target: document.getElementById('wrap-course-content'),
-                imageUrl: 'img/good.png',
-                showConfirmButton: true,
-                customClass: {
-                  popup: 'pop_retros bg-transparent border-0 rounded-0 shadow-none',
-                  confirmButton: 'btn text-primary bg-lila-rosa amor fw-semibold animate__animated animate__pulse animate__infinite'
-                },
-                confirmButtonText: "Cerrar",
-                backdrop: "rgba(65, 60, 60, .95)",
-                width: "35em",
-                didClose: () => {
-                  flippedCards = [];
-                  checkGameCompletion();
-                }
-              });
             } else {
               CourseNav.audioController.stopAllSoundsAndPlay(feedbackincorrect);
-
+              // Las tarjetas no coinciden, voltearlas de nuevo después de un breve retraso
-              Swal.fire({
+              setTimeout(() => {
-                target: document.getElementById('wrap-course-content'),
+                firstCard.flip(false);
-                imageUrl: 'img/bad.png',
+                secondCard.flip(false);
-                showConfirmButton: true,
+                flippedCards = [];
-                customClass: {
+                lastFlippedRow = ""; // Reiniciar el rastreo de fila
-                  popup: 'pop_retros bg-transparent border-0 rounded-0 shadow-none',
+              }, 1200);
-                  confirmButton: 'btn text-primary bg-lila-rosa amor fw-semibold animate__animated animate__pulse animate__infinite'
-                },
-                confirmButtonText: "Cerrar",
-                backdrop: "rgba(65, 60, 60, .95)",
-                width: "35em",
-                didClose: () => {
-                  // Las tarjetas no coinciden, voltearlas de nuevo después de un breve retraso
-                  setTimeout(() => {
-                    firstCard.flip(false);
-                    secondCard.flip(false);
-                    flippedCards = [];
-                    lastFlippedRow = ""; // Reiniciar el rastreo de fila
-                  }, 200);
-                }
-              });
             }
           }
         }

contenido/08.html

@@ -72,7 +72,7 @@
                   </div>
                   <div
                     class="position-relative w-100 bg-verde-claro-2 text-verde-oscuro px-3 py-2 mb-3 animate__animated animate__flipInX animate__delay-1s">
-                    <p class="mb-0 fw-bold text-center">Para un recambio seguro bajo ningún motivo debe tocar las zonas estériles (libres de gérmenes) en el sistema de DP.</p>
+                    <p class="mb-0 fw-bold text-center">Para un recambio seguro, bajo ningún motivo debe tocar las zonas estériles (libres de gérmenes) en el sistema de DP.</p>
                   </div>
                   <div class="position-relative w-100 text-center animate__animated animate__zoomIn animate__delay-2s">
                     <div

contenido/09.html

@@ -145,7 +145,7 @@
               <div class="col-6">
                 <div class="card bg-white border-0 rounded-3 p-0 bx-shadow">
                   <div class="p-3 pb-0 position-relative mb-3 w-100 animate__animated animate__flipInX text-center">
-                    <p class="mb-0">El lavado de manos también es un paso fundamental en el proceso de diálisis peritoneal.</p>
+                    <p class="mb-0">El lavado de manos también es una fase fundamental en el proceso de diálisis peritoneal.</p>
                   </div>
                   <div
                     class="position-relative w-100 bg-lila-rosa text-primary text-center px-3 py-2 mb-3 animate__animated animate__flipInX animate__delay-1s">

contenido/12.html

@@ -177,9 +177,7 @@
                     <div class="col-12">
                       <div class="d-flex flex-row justify-content-center align-items-center gap-3 ps-4">
                         <img src="img/book1.png" class="img-fluid">
-                        <p class="mb-0"><strong>Instrucciones:</strong> De clic en la ruleta y conteste correctamente la pregunta acerca
+                        <p class="mb-0"><strong>Instrucciones:</strong> Gire la ruleta y conteste correctamente la pregunta acerca de la alimentación o actividad física del paciente en diálisis peritoneal para ganar los puntos.</p>
-                          de la alimentación o actividad física del paciente en
-                          diálisis peritoneal para ganar los puntos.</p>
                       </div>
                     </div>
                   </div>
@@ -388,7 +386,9 @@
     function mostrarPregunta(puntajeEnJuego) {
       if (questions.length === 0) return;
 
-      const preguntaAleatoria = questions[Math.floor(Math.random() * questions.length)];
+      const indiceAleatorio = Math.floor(Math.random() * questions.length);
+      const preguntaAleatoria = questions[indiceAleatorio];
+      questions.splice(indiceAleatorio, 1); // Eliminar la pregunta usada
       const opcionesBarajadas = shuffleArray([...preguntaAleatoria.opciones]);
 
       let opcionesHTML = '';
@@ -491,8 +491,9 @@
     }
 
     function finalizarJuego() {
-      const porcentaje = (totalPuntos / (7 * 700)) * 100;
+      const puntajeMaximo = 7 * 700; // 7 giros × 700 puntos máximos
-      const aprobado = porcentaje >= 60;
+      const porcentaje = (totalPuntos / puntajeMaximo) * 100;
+      const aprobado = porcentaje >= 80;
 
       $('.wrap-course-content').addClass('fake2').removeClass('fake1');
 

contenido/13.html

@@ -94,8 +94,8 @@
           <div class="col-5 text-center mb-3 animate__animated animate__flipInX">
             <div class="card bg-white border-0 rounded-3 px-0 pt-2 pb-0 bx-shadow">
               <div class="position-relative w-100 px-3">
-                <p>Como se ha visto, la enfermedad crónica de los riñones causa signos y síntomas que en parte, son controlados mediante
+                <p>Como se ha visto, la enfermedad crónica de los riñones causa signos y síntomas que, en parte, son controlados mediante
-                  la DP, sin embargo, es necesario el apoyo de medicamentos que solo su médico puede y debe prescribir.</p>
+                la DP, sin embargo, es necesario el apoyo de medicamentos que solo su médico puede y debe prescribir.</p>
               </div>
               <div
                 class="position-relative w-100 bg-lila-rosa text-primary px-3 py-2 mb-3 animate__animated animate__flipInX animate__delay-1s">

contenido/15.html

@@ -175,7 +175,7 @@
                 <div class="col-10">
                   <div class="d-flex flex-row justify-content-center align-items-center gap-3">
                     <img src="img/book1.png" class="img-fluid">
-                    <p class="mb-0"><strong>Instrucciones:</strong> De clic en cada una de las salas y conteste la pregunta sobre cómo atender la incidencia para ganar los puntos.</p>
+                    <p class="mb-0"><strong>Instrucciones:</strong> Dé clic en cada una de las salas y conteste la pregunta sobre cómo atender la incidencia para ganar los puntos.</p>
                   </div>
                 </div>
               </div>

contenido/16.html

@@ -188,9 +188,9 @@
                             <hr class="border border-2 border-verde-oscuro hr-style my-0 mb-1 opacity-100">
                         </div>
                     </div>
-                    <!-- <div class="col-12 mb-3 text-center">
+                  <div class="col-12 mb-1 text-center animate__animated animate__zoomIn">
-                        <h4 class="fw-bold text-verde-pino">Alimentación y actividad física</h4>
+                    <h4 class="fw-bold text-verde-pino mb-0">DPA</h4>
-                    </div> -->
+                  </div>
                     <div class="col-5 text-center intro mb-3 animate__animated animate__flipInX">
                         <div class="card bg-white border-0 rounded-3 p-3 pb-0 bx-shadow">
                             <p class="my-0">Existen dos modalidades de Diálisis Peritoneal: <b class="text-primary">la
@@ -202,7 +202,7 @@
                             <p class="my-0">En la siguiente actividad podrá poner a prueba sus conocimientos sobre los
                                 <b class="text-primary">procedimientos de conexión y desconexión de la DPA.</b>
                             </p>
-                            <div class="w-100 position-relative text-center">
+                            <div class="w-100 position-relative text-center mt-3">
                                 <div
                                     class="btn-comenzar bg-primary d-inline-block px-3 py-2 text-center animate__animated animate__pulse animate__infinite">
                                     <h5 class="text-white fw-bold mb-0">COMENZAR ACTIVIDAD</h5>

contenido/17.html

@@ -191,9 +191,7 @@
                                             <div
                                                 class="d-flex flex-row justify-content-center align-items-center gap-3 ps-4">
                                                 <img src="img/book3.png" class="img-fluid">
-                                                <p class="mb-0"><strong>Instrucciones:</strong> Lea con atención cada
+                                                <p class="mb-0"><strong>Instrucciones:</strong> Lea con atención cada descripción y arrastre hacia ella el sobre con el nombre del paso al que corresponde.
-                                                    descripción y arrástrela hacia el sobre con el nombre del paso al
-                                                    que corresponde.
                                                 </p>
                                             </div>
                                         </div>

contenido/18.html

@@ -292,7 +292,9 @@
             if (questions.length === 0) return;
 
             const QuestionPop = false;
-            const preguntaAleatoria = questions[Math.floor(Math.random() * questions.length)];
+            const indiceAleatorio = Math.floor(Math.random() * questions.length);
+            const preguntaAleatoria = questions[indiceAleatorio];
+            questions.splice(indiceAleatorio, 1); // Eliminar la pregunta usada
             const opcionesBarajadas = shuffleArray([...preguntaAleatoria.opciones]);
 
             let opcionesHTML = '';

css/style.scss

@@ -110,7 +110,7 @@ body {
       }
       &[data-coursenavvisited='false'] {
         &::before {
-          content: '\f023'; // unicode de fa-check
+          content: '\f023'; // unicode de fa-lock
           font-family: 'Font Awesome 6 Pro';
           font-weight: lighter; // solid
           display: inline-block;

js/coursenav.js

@@ -361,21 +361,17 @@ var CourseNav = (function (COURSE_CONFIG) {
 
     const idx = courseData.contentArray.findIndex((c) => c.content === item.content && c.title === item.title);
     link.dataset.coursenavindex = idx;
-    link.dataset.coursenavvisited = idx >= 0 && courseData.contentArray[idx].visited;
+    link.dataset.coursenavvisited = true;
     wdiv.appendChild(link);
 
     link.addEventListener("click", () => {
       CLICK_SOUND.play();
       const index = parseInt(link.dataset.coursenavindex, 10);
       if (index >= 0) {
-        if (DEBUG || courseData.contentArray[index].visited) {
+        // Permitir navegación libre desde el menú
-          currentIndex = index;
+        currentIndex = index;
-          closeSidebar();
+        closeSidebar();
-          loadContent();
+        loadContent();
-        } else {
-          closeSidebar();
-          showLockedContentWarning();
-        }
       } else {
         const toggle = wdiv.querySelector(".toggle-icon");
         toggle && toggle.click();
@@ -504,8 +500,8 @@ var CourseNav = (function (COURSE_CONFIG) {
       const idx = parseInt(link.dataset.coursenavindex, 10);
       const item = courseData.contentArray[idx];
       if (item) {
-        link.dataset.coursenavvisited = item.visited;
+        link.dataset.coursenavvisited = true;
-        item.visited ? link.classList.add("visited") : link.classList.remove("visited");
+        link.classList.add("visited");
       }
     });
   }