Right click changes - Githubissues

spd-max commented 3 weeks ago

// Ensure the correct environment is selected on initial load document.addEventListener('DOMContentLoaded', function () { document.getElementById('envDropdown').dispatchEvent(new Event('change')); });

// Environment dropdown change handler document.getElementById('envDropdown').addEventListener('change', function() { const selectedEnv = this.value; document.querySelectorAll('.left-pane .button').forEach(button => { // Click event for normal navigation button.addEventListener('click', function() { // Remove the selected class from all buttons document.querySelectorAll('.left-pane .button').forEach(btn => { btn.style.backgroundColor = ''; }); // Apply the new background color for the clicked button this.style.backgroundColor = '#db8337';

        // Load the correct content based on environment and link
        const link = `${selectedEnv}_${this.textContent.trim().replace(' ', '').toLowerCase()}.html`;
        document.getElementById('contentFrame').src = link;
    });

    // Right-click (contextmenu) event for opening in a new tab
    button.addEventListener('contextmenu', function(event) {
        event.preventDefault(); // Prevent the default context menu from appearing

        // Generate the link based on environment and menu
        const link = `${selectedEnv}_${this.textContent.trim().replace(' ', '').toLowerCase()}.html`;

        // Open the link in a new tab
        window.open(link, '_blank');
    });
});

});

spd-max commented 3 weeks ago

.left-pane { width: 200px; background-color: #07a475; color: #ffffff; height: calc(100vh - 40px); / Ensure it fills the screen height minus top pane / overflow-y: auto; / Enable vertical scrolling / padding: 10px; box-sizing: border-box; }

.left-pane .section-title { font-weight: bold; color: #000000; margin-top: 10px; margin-bottom: 5px; }

.left-pane .button { display: block; width: 100%; margin-bottom: 5px; padding: 10px; background-color: #ffffff; color: #07a475; text-align: left; border-radius: 5px; border: none; cursor: pointer; transition: background-color 0.3s ease; }

.left-pane .button:hover { background-color: #db8337; color: #ffffff; }

.left-pane .button.selected { background-color: #db8337; color: #ffffff; }

/ Ensure the collapsible button is centered / .left-pane .collapse-button { position: absolute; right: 0; transform: translateY(-50%); top: 50%; cursor: pointer; background-color: transparent; border: none; color: #ffffff; font-size: 18px; outline: none; }

.left-pane .button-hint { display: none; font-size: 10px; background-color: #ffffff; color: #000000; position: absolute; left: 220px; padding: 2px 5px; border-radius: 3px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }

/ Display hint on hover / .left-pane .button:hover + .button-hint { display: inline-block; }

@media screen and (max-height: 600px) { .left-pane { height: 100%; / Ensure it adjusts on smaller screens / } }

spd-max commented 3 weeks ago

document.getElementById('contentFrame').addEventListener('load', function() { const iframeWindow = document.getElementById('contentFrame').contentWindow;

if (iframeWindow) {
    // Override alert, confirm, and prompt inside the iframe to use the parent window
    iframeWindow.alert = function(message) {
        window.alert(message);
    };

    iframeWindow.confirm = function(message) {
        return window.confirm(message);
    };

    iframeWindow.prompt = function(message, defaultText) {
        return window.prompt(message, defaultText);
    };
}

});

spd-max commented 3 weeks ago

<!DOCTYPE html>

Table with Sections

Section 1 - Column 1	Section 1 - Column 2
Link 1	Link A
Link 2	Link B
Link 3	Link C
Section 2 - Column 1	Section 2 - Column 2
Link 4	Link D
Link 5	Link E
Link 6
Section 3 - Column 1	Section 3 - Column 2
Link 7	Link F
Link 8
Link 9	Link G

spd-max / Static_spa_webpage

Right click changes #4