El Paso Election Results Embed
/* Basic styles for the container and iframe */
#container {
width: 95%;
max-width: 1000px;
margin: 20px auto;
border: 1px solid #ddd;
padding: 10px;
border-radius: 8px;
overflow: hidden;
}
iframe {
width: 100%;
border: none;
overflow: hidden;
display: block;
min-height: 200px;
transition: height 0.5s ease-in-out;
}
.loading-indicator {
text-align: center;
margin-bottom: 10px;
font-size: 14px;
color: #555;
}
.error-message {
text-align: center;
color: red;
font-size: 16px;
margin-top: 10px;
}
El Paso Election Results
Loading Results...
const resultsIframe = document.getElementById('results-iframe');
const loadingIndicator = document.getElementById('iframe-loading');
const errorMessage = document.getElementById('iframe-error');
let attempts = 0;
const maxAttempts = 30;
const initialTimeout = 500;
let previousHeight = 0;
let lastReportedHeight = 0;
let maxHeight = 2000;
let intervalId = null; // To store the interval ID
function iframeLoaded() {
attempts = 0;
startResizing(); // Start using interval
}
function startResizing() {
intervalId = setInterval(resizeIframe, 200); // Check every 200ms
}
function resizeIframe() {
attempts++;
try {
const scrollHeight = resultsIframe.contentWindow.document.body.scrollHeight;
const offsetHeight = resultsIframe.contentWindow.document.body.offsetHeight;
const newHeight = Math.max(scrollHeight, offsetHeight);
console.log(
`Attempt ${attempts}: scrollHeight=${scrollHeight}, offsetHeight=${offsetHeight}, newHeight=${newHeight}, previousHeight=${previousHeight}, lastReportedHeight=${lastReportedHeight}`
);
if (newHeight > 0 && newHeight !== previousHeight) {
previousHeight = newHeight;
let actualHeight = Math.min(newHeight, maxHeight);
resultsIframe.style.height = actualHeight + 'px';
loadingIndicator.style.display = 'none';
errorMessage.style.display = 'none';
lastReportedHeight = actualHeight;
if (newHeight >= maxHeight) {
errorMessage.textContent += " Some content may be cut off. Maximum height reached.";
errorMessage.style.display = 'block';
clearInterval(intervalId); // Stop interval
return;
}
} else if (attempts >= maxAttempts) {
handleResizeError();
clearInterval(intervalId); // Stop interval
}
} catch (error) {
console.error("Error resizing iframe:", error, "Attempts:", attempts);
if (attempts >= maxAttempts) {
handleResizeError();
clearInterval(intervalId); // Stop interval
}
}
}
function handleResizeError() {
loadingIndicator.style.display = 'none';
errorMessage.textContent =
"The election results could not be automatically resized. You may need to scroll. Maximum height applied.";
errorMessage.style.display = 'block';
resultsIframe.style.height = maxHeight + 'px';
}
