https://palermo-huila.gov.co/SiteAssets/Buscador/assets/js/ui.js

1// Importar la lista de todos los módulos desde el archivo main.js del buscador
2import { allModules } from "/SiteAssets/Buscador/assets/js/main.js";
3
4// Objeto con iconos para tipos de archivo web y PDF
5const icons = {
6  web: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="iconLink">
7            <path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418" />
8          </svg>`,
9  pdf: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="iconLink">
10            <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" />
11          </svg>`,
12};
13
14// Función para eliminar el texto "/_api/" de las URLs
15function eliminarApiDeUrl(url) {
16  return url.replace("/_api/", "/");
17}
18
19// Función para mostrar los resultados en un modal
20export function mostrarResultadosModal(resultados) {
21  currentPage = 1; // Reinicia la página al mostrar nuevos resultados
22  const resultadosCombinados = [
23    ...resultados.buscador,
24    ...resultados.normatividad,
25    ...resultados.noticias,
26  ]; // Combinar resultados
27  displayData(currentPage, resultadosCombinados); // Mostrar datos en la página actual
28  renderPagination(resultadosCombinados); // Renderizar la paginación
29
30  const seccionesPortalWeb = document.getElementById("seccionesPortalWeb");
31  seccionesPortalWeb.innerHTML = "";
32  seccionesPortalWeb.innerHTML =
33    '<option value="">Seleccione una sección</option>'; // Corregido: Eliminado el espacio en blanco
34
35  // Agregar la opción "Sitio Principal" al selector
36  seccionesPortalWeb.innerHTML += `<option value="SitioPrincipal">Sitio Principal</option>`;
37  // Agregar la opción "Noticias" al selector
38  seccionesPortalWeb.innerHTML += `<option value="Noticias">Noticias</option>`;
39
40  // Iterar sobre todos los módulos y agregar opciones al selector
41  allModules.forEach((item) => {
42    // Evitar agregar la opción "Noticias" y la opción vacía
43    if (item === "") {
44      // No hacer nada, este módulo se maneja con "Sitio Principal"
45    } else if (item !== "/NuestraAlcaldia/SaladePrensa/") {
46      seccionesPortalWeb.innerHTML += `<option value="${item}">${separarPorMayusculas(
47        item
48      )}</option>`;
49    }
50  });
51
52  // Agregar un event listener al selector para filtrar resultados por sección
53  seccionesPortalWeb.addEventListener("change", (e) => {
54    let arrayFilter;
55    if (e.target.value === "Noticias") {
56      // Si se selecciona "Noticias", filtrar los resultados para mostrar solo la sección "NuestraAlcaldia/SaladePrensa"
57      arrayFilter = resultadosCombinados.filter(
58        (link) => link.module === "/NuestraAlcaldia/SaladePrensa/"
59      );
60    } else if (e.target.value === "SitioPrincipal") {
61      // Si se selecciona "Sitio Principal", filtrar los resultados que contienen "_api" en la URL
62      arrayFilter = resultadosCombinados.filter((link) =>
63        link.url.includes("_api")
64      );
65    } else {
66      arrayFilter = resultadosCombinados.filter(
67        (link) => link.module === e.target.value
68      );
69    }
70    currentPage = 1; // Reiniciar la página al aplicar el filtro
71    displayData(currentPage, arrayFilter);
72    renderPagination(arrayFilter);
73  });
74
75  abrirModal();
76}
77
78function abrirModal() {
79  const modal = document.getElementById("ModalBuscador");
80  modal.style.display = "flex"; // Mostrar el modal
81}
82
83// Función para cerrar el modal
84function cerrarModal() {
85  const modal = document.getElementById("ModalBuscador");
86  modal.style.display = "none";
87  document.querySelector("#search").value = ""; // Ocultar el modal
88}
89
90// Asignar evento de clic al botón "Cerrar" del modal
91const btnCerrarModal = document.querySelector(
92  "#ModalBuscador .modal__footer button"
93);
94btnCerrarModal.addEventListener("click", cerrarModal);
95
96// Función para pintar los enlaces de los resultados
97function paintLinks(resultados) {
98  const resultadosLista = document.getElementById("resultadosBusqueda");
99  
100  // Limpiar el contenido anterior
101  resultadosLista.innerHTML = "";
102  
103  // Reiniciar las clases de estilo
104  resultadosLista.classList.remove("!flex", "!justify-center");
105  
106  if (resultados.length > 0) {
107    resultados.forEach((result) => {
108      const spliturl = result.url.split(".");
109      const fileType = spliturl[spliturl.length - 1];
110      const cleanUrl = eliminarApiDeUrl(result.url); // Eliminar /_api/ de la URL
111      const moduleName =
112        result.module === "/NuestraAlcaldia/SaladePrensa/"
113          ? "Noticias"
114          : result.module === "_api" || result.module === ""
115          ? "Sitio Principal"
116          : separarPorMayusculas(result.module);
117
118      // Agregar resultados a la lista
119      resultadosLista.innerHTML += `<li class="ListaResults">
120                <div>
121                ${fileType === "pdf" ? icons.pdf : icons.web}
122                    <a class="UrlBuscador" href="${cleanUrl}" target="__blank">${
123        result.Title
124          ? result.Title.length > 50
125            ? shortText(result.Title, 40)
126            : result.Title
127          : cleanUrl
128      }</a>
129                </div>
130                <p class="moduloPagina">Sección: <span>${moduleName}</span></p>
131            </li>`;
132    });

133  } else {
134    // Si no hay resultados, agrega clases para centrar el mensaje
135    resultadosLista.classList.add("!flex", "!justify-center");
136    resultadosLista.innerHTML += `<li class="ResultsnotFound">
137                <img src="/SiteAssets/Buscador/assets/img/PAGINA_NO_ENCONTRADA.svg"/>
138                <span class="msnResultsNot">Resultados no encontrados</span>
139            </li>`;
140  }
141}
142
143
144// Función para acortar texto si es demasiado largo
145function shortText(texto, longitudMaxima) {
146  if (texto.length <= longitudMaxima) {
147    return texto;
148  } else {
149    return texto.substring(0, longitudMaxima) + "...";
150  }
151}
152
153// Función para separar palabras por mayúsculas
154function separarPorMayusculas(palabra) {
155  let palabrasSeparadas = [palabra[0]];
156
157  for (let i = 1; i < palabra.length; i++) {
158    if (palabra[i] === palabra[i].toUpperCase()) {
159      palabrasSeparadas.push(palabra[i]);
160    } else {
161      palabrasSeparadas[palabrasSeparadas.length - 1] += palabra[i];
162    }
163  }
164
165  return palabrasSeparadas.join(" ");
166}
167
168// Definir el número de elementos por página y la página actual
169const itemsPerPage = 5;
170let currentPage = 1;
171
172// Función para mostrar datos en la página actual
173function displayData(page, resultados) {
174  const startIndex = (page - 1) * itemsPerPage;
175  const endIndex = startIndex + itemsPerPage;
176  const pageData = resultados.slice(startIndex, endIndex);
177  paintLinks(pageData);
178}
179
180// Función para renderizar la paginación
181function renderPagination(resultados) {
182  const pagination = document.getElementById("pagination");
183  const pageCount = Math.ceil(resultados.length / itemsPerPage);
184
185  pagination.innerHTML = "";
186  const maxPageButtons = 5; // Número máximo de botones de página que quieres mostrar
187  const startPage = Math.max(1, currentPage - Math.floor(maxPageButtons / 2));
188
189  for (
190    let i = startPage;
191    i <= Math.min(startPage + maxPageButtons - 1, pageCount);
192    i++
193  ) {
194    const li = document.createElement("li");
195    li.classList.add("page-item");
196    const a = document.createElement("a");
197    a.classList.add("page-link");
198    a.href = "#";
199    a.textContent = i;
200    li.appendChild(a);
201
202    a.addEventListener("click", (e) => {
203      e.preventDefault();
204      currentPage = i;
205      displayData(currentPage, resultados);
206      renderPagination(resultados);
207    });
208
209    if (i === currentPage) {
210      li.classList.add("active");
211    }
212
213    pagination.appendChild(li);
214  }
215
216  // Agregar botones de flechas
217  if (currentPage > 1) {
218    const prevButton = document.createElement("li");
219    prevButton.classList.add("page-item");
220    const prevLink = document.createElement("a");
221    prevLink.classList.add("page-link");
222    prevLink.href = "#";
223    prevLink.innerHTML = "&laquo;"; // Flecha izquierda
224    prevButton.appendChild(prevLink);
225
226    prevLink.addEventListener("click", (e) => {
227      e.preventDefault();
228      currentPage--;
229      displayData(currentPage, resultados);
230      renderPagination(resultados);
231    });
232
233    pagination.insertBefore(prevButton, pagination.firstChild);
234  }
235
236  if (currentPage < pageCount) {
237    const nextButton = document.createElement("li");
238    nextButton.classList.add("page-item");
239    const nextLink = document.createElement("a");
240    nextLink.classList.add("page-link");
241    nextLink.href = "#";
242    nextLink.innerHTML = "&raquo;"; // Flecha derecha
243    nextButton.appendChild(nextLink);
244
245    nextLink.addEventListener("click", (e) => {
246      e.preventDefault();
247      currentPage++;
248      displayData(currentPage, resultados);
249      renderPagination(resultados);
250    });
251
252    pagination.appendChild(nextButton);
253  }
254}