body {
font-family: Arial, sans-serif;
text-align: center;
}
#document-viewer {
width: 80%;
height: 400px;
border: 1px solid #ccc;
margin-bottom: 20px;
}
.carousel-container {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
margin-top: 20px;
overflow-x: auto;
white-space: nowrap;
scroll-behavior: smooth;
padding: 10px;
}
.doc-item {
display: inline-block;
padding: 10px;
border: 1px solid #000;
cursor: pointer;
white-space: normal;
width: 150px;
}
.filters {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
margin-top: 20px;
}
.filters select {
padding: 5px;
}
.nav-buttons {
margin-top: 10px;
}
button {
padding: 10px;
cursor: pointer;
}

Carrossel de Documentos

let documents = [];
let filteredDocuments = [];
let currentIndex = 0;

async function fetchDocuments() {
const url = “https://docs.google.com/spreadsheets/d/e/2PACX-1vStfJRo2RfkA5NDHuNnf3I_YVSJQjD6eAXSxkII5WTm34IHdGmizxJbdelVhrcaeTfQ7KlfqqiqOJDR/pub?output=csv”;

try {
const response = await fetch(url);
const text = await response.text();
const rows = text.split(“\n”).map(row => row.split(“,”));

documents = rows.slice(1).map(row => ({
url: convertDriveLink(row[0].trim()), // Coluna 1: Link
date: row[1] ? row[1].trim() : “Sem Data”, // Coluna 2: Data
name: row[2] ? row[2].trim() : “Documento sem nome” // Coluna 3: Nome
})).filter(doc => doc.url.startsWith(“http”));

generateYearMonthOptions();
filteredDocuments = […documents];
if (filteredDocuments.length > 0) {
loadDocument(0);
displayDocuments(filteredDocuments);
}
} catch (error) {
console.error(“Erro ao buscar dados da planilha”, error);
}
}

function convertDriveLink(link) {
const match = link.match(/\/d\/(.*)\/view/);
if (match) {
return `https://drive.google.com/file/d/${match[1]}/preview`;
}
return link;
}

function loadDocument(index) {
if (index >= 0 && index 0) {
loadDocument(currentIndex – 1);
}
}

function nextDocument() {
if (currentIndex < filteredDocuments.length – 1) {
loadDocument(currentIndex + 1);
}
}

function displayDocuments(docs) {
const docList = document.getElementById('doc-list');
docList.innerHTML = '';

if (docs.length === 0) {
docList.innerHTML = '

Nenhum documento encontrado

‘;
document.getElementById(‘document-viewer’).src = “”;
return;
}

docs.forEach((doc, index) => {
const docItem = document.createElement(‘div’);
docItem.classList.add(‘doc-item’);
docItem.textContent = `${doc.name} (${doc.date})`;
docItem.onclick = () => loadDocument(index);
docList.appendChild(docItem);
});

loadDocument(0);
}

function generateYearMonthOptions() {
const yearSelect = document.getElementById(“year”);
const monthSelect = document.getElementById(“month”);

const uniqueYears = […new Set(documents.map(doc => doc.date.split(“/”)[2]))].filter(Boolean).sort((a, b) => b – a);
const months = [“01”, “02”, “03”, “04”, “05”, “06”, “07”, “08”, “09”, “10”, “11”, “12”];

yearSelect.innerHTML = uniqueYears.map(year => `${year}`).join(“”);
monthSelect.innerHTML = months.map(month => `${month}`).join(“”);

if (uniqueYears.length > 0) {
yearSelect.value = uniqueYears[0];
}
filterDocuments();
}

function filterDocuments() {
const year = document.getElementById(‘year’).value;
const month = document.getElementById(‘month’).value;

filteredDocuments = documents.filter(doc => {
const docDate = doc.date.split(“/”);
return docDate.length === 3 && docDate[2] === year && docDate[1] === month;
});

displayDocuments(filteredDocuments);
}

fetchDocuments();

Fonte CSTJ