Widget:Ppplanner05
<img id="runImage" src="https://docs.analytica.com/images/d/d2/Ppplanner03.png" style="width: 800px; height: 406px;">
<script> document.addEventListener('DOMContentLoaded', function () {
let iframeAdded = false;
const container = document.getElementById('container');
const runImage = document.getElementById('runImage');
function showIframe() {
// Hide the initial image
runImage.style.display = 'none';
if (!iframeAdded) {
// Create and configure the iframe
const iframe = document.createElement('iframe');
iframe.src = 'https://acp.analytica.com/view0?invite=4711&code=3885603542485212689';
iframe.style.width = '800px';
iframe.style.height = '406px';
iframe.style.border = 'none';
iframe.style.overflow = 'hidden'; // Disable iframe scrollbars
// Append the iframe to the container
container.appendChild(iframe);
iframeAdded = true;
// Create maximize button
const maximizeButton = document.createElement('button');
maximizeButton.textContent = 'Maximize';
maximizeButton.style.position = 'absolute';
maximizeButton.style.bottom = '10px';
maximizeButton.style.right = '10px';
// Create minimize button, initially hidden
const minimizeButton = document.createElement('button');
minimizeButton.textContent = 'Minimize';
minimizeButton.style.position = 'absolute';
minimizeButton.style.bottom = '10px';
minimizeButton.style.right = '80px';
minimizeButton.style.display = 'none';
// Add click event for maximize button
maximizeButton.addEventListener('click', function () {
// Set container to fixed position and remove page scroll
container.style.position = 'fixed';
container.style.top = '0';
container.style.left = '0';
container.style.right = '0';
container.style.bottom = '0';
container.style.zIndex = '9999';
container.style.margin = '0';
container.style.padding = '0';
container.style.backgroundColor = 'white';
// Make iframe full screen within container
iframe.style.width = '100%';
iframe.style.height = '100%';
iframe.style.overflow = 'hidden'; // Ensure no scrollbars in fullscreen
maximizeButton.style.display = 'none';
minimizeButton.style.display = 'inline-block';
});
// Add click event for minimize button
minimizeButton.addEventListener('click', function () {
// Restore original container and iframe dimensions
container.style.position = 'relative';
container.style.width = 'auto';
container.style.height = 'auto';
container.style.margin = '10px';
container.style.padding = '10px';
container.style.zIndex = '1';
iframe.style.width = '800px';
iframe.style.height = '406px';
minimizeButton.style.display = 'none';
maximizeButton.style.display = 'inline-block';
});
// Append buttons to the container
container.appendChild(maximizeButton);
container.appendChild(minimizeButton);
}
}
// Add click event listener to the image container
container.addEventListener('click', showIframe);
}); </script>