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';
// 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 () {
// Make container and iframe cover the entire browser window
container.style.position = 'fixed';
container.style.top = '0';
container.style.left = '0';
container.style.width = '100%';
container.style.height = '100%';
container.style.zIndex = '9999'; // Ensure it overlays all other elements
container.style.margin = '0'; // Remove margins
container.style.padding = '0'; // Remove padding
// Set iframe to cover full browser window without scrollbars
iframe.style.width = '100%';
iframe.style.height = '100%';
iframe.style.overflow = 'hidden'; // Disable iframe scrollbars
maximizeButton.style.display = 'none';
minimizeButton.style.display = 'inline-block';
});
// Add click event for minimize button
minimizeButton.addEventListener('click', function () {
// Restore original iframe and container dimensions
container.style.position = 'relative';
container.style.width = 'auto';
container.style.height = 'auto';
container.style.margin = '10px'; // Restore original margin
container.style.padding = '10px'; // Restore original padding
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>