Offline Notepad View raw

Shared snapshot

Shared note

<script>
    function addIframes() {
        const urlInput = document.getElementById('urlInput');
        const urls = urlInput.value.trim().split('\n');
        urls.forEach(url => {
            if (url) {
                addIframe(url);
            }
        });
        urlInput.value = '';
    }

    function addIframe(url) {
        const iframeContainer = document.createElement('div');
        iframeContainer.className = 'iframe-container';

        iframeContainer.innerHTML = `
            <div class="iframe-controls">
                <button onclick="deleteIframe(this)">X</button>
                <button onclick="editUrl(this)">Edit URL</button>
            </div>
            <div class="top-right-controls">
                <button onclick="cloneIframe(this)">+</button>
            </div>
            <div class="resize-control">
                <button onclick="resizeIframe(this)">↔</button>
            </div>
            <iframe src="${url}" allowfullscreen></iframe>
        `;
        document.getElementById('iframeList').appendChild(iframeContainer);
    }

    function deleteIframe(button) {
        const iframeContainer = button.closest('.iframe-container');
        iframeContainer.remove();
    }

    function editUrl(button) {
        const iframeContainer = button.closest('.iframe-container');
        const newUrl = prompt('Enter new URL:', iframeContainer.querySelector('iframe').src);
        if (newUrl) {
            iframeContainer.querySelector('iframe').src = newUrl;
        }
    }

    function cloneIframe(button) {
        const iframeContainer = button.closest('.iframe-container');
        const iframeUrl = iframeContainer.querySelector('iframe').src;
        addIframe(iframeUrl);
    }

    function resizeIframe(button) {
        const iframe = button.closest('.iframe-container').querySelector('iframe');
        const currentHeight = parseInt(iframe.style.height.replace('px', ''));
        const newHeight = (currentHeight === 300) ? 500 : 300;  // Toggle between 300px and 500px
        iframe.style.height = `${newHeight}px`;
    }
</script>