CURRENT INVENTORY
When one door of happiness closes, another opens, but often we look so long at the closed door that we do not see the one that has been opened for us.
.vehicle {
border: 1px solid #ccc;
padding: 10px;
margin: 10px 0;
display: flex;
align-items: center;
gap: 20px;
}
.vehicle img {
width: 150px;
height: auto;
}
.vehicle div {
font-size: 16px;
}
.pagination {
display: flex;
justify-content: center;
margin-top: 20px;
}
.pagination button {
margin: 0 5px;
padding: 10px 20px;
border: 1px solid #ccc;
background-color: #f9f9f9;
cursor: pointer;
}
.pagination button.active {
font-weight: bold;
background-color: #ddd;
}
`;
vehicleList.appendChild(vehicleDiv);
});
}
function displayPagination(totalVehicles) {
const pagination = document.getElementById('pagination');
const totalPages = Math.ceil(totalVehicles / vehiclesPerPage);
pagination.innerHTML = '';
for (let i = 1; i {
currentPage = i;
updatePage();
});
pagination.appendChild(button);
}
}
function updatePage() {
const startIndex = (currentPage - 1) * vehiclesPerPage;
const endIndex = startIndex + vehiclesPerPage;
displayVehicles(vehicles.slice(startIndex, endIndex));
displayPagination(vehicles.length);
}
// Check if vehicleData is available
if (vehicleData && vehicleData.csv) {
vehicles = parseCSV(vehicleData.csv);
updatePage(); // Display the first page
} else {
console.error('No vehicle data available.');
document.getElementById('vehicle-list').innerHTML = '
Vehicles for Sale
document.addEventListener('DOMContentLoaded', () => { const vehiclesPerPage = 50; // Number of vehicles per page let vehicles = []; // To store all vehicles let currentPage = 1; // Track the current page function parseCSV(csv) { const lines = csv.replace(/\r\n/g, '\n').trim().split('\n'); const headers = lines.shift().split(',').map(header => header.replace(/"/g, '').trim()); return lines.map(line => { const values = line.split(',').map(value => value.replace(/"/g, '').trim()); return headers.reduce((acc, header, index) => { acc[header] = values[index]; return acc; }, {}); }); } function displayVehicles(vehiclesToDisplay) { const vehicleList = document.getElementById('vehicle-list'); vehicleList.innerHTML = ''; vehiclesToDisplay.forEach(vehicle => { const vehicleDiv = document.createElement('div'); vehicleDiv.className = 'vehicle'; const imageUrl = vehicle.ImageURLS ? vehicle.ImageURLS.split(',')[0] : ''; vehicleDiv.innerHTML = `${vehicle.Year} ${vehicle.Make} ${vehicle.Model}
Miles: ${vehicle.Miles || 'N/A'}
Error loading vehicle data.
'; } });