WPCODEbox IDE - Front End / Backend Icon

TaperMonky

// ==UserScript==
// @name         Open WPCodeBoxIDE Frontend with Overlay
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Click floating icon on WP Admin or front-end to open WPCodeBoxIDE frontend.php
// @match        *://*/*
// @grant        GM_openInTab
// @grant        GM_registerMenuCommand
// @run-at       document-idle
// ==/UserScript==

(function() {
    'use strict';

    function openFrontend() {
        const path = location.pathname;
        const base = path.split(/\/wp-(?:content|admin)/i)[0];
        const url  = `${location.protocol}//${location.host}${base}/wp-content/plugins/wpcodeboxide/YOURURL/frontend.php`;
        GM_openInTab(url, { active: true });
    }

    // Register menu command (no keyboard shortcut)
    GM_registerMenuCommand('Open WPCodeBoxIDE Frontend', openFrontend);

    // Detect if this is part of a WordPress install (admin or front-end)
    const isAdminPath = /\/wp-admin/i.test(location.pathname);
    const hasWpContent = document.querySelector('link[href*="/wp-content"], script[src*="/wp-content"], img[src*="/wp-content"], a[href*="/wp-content"]');

    if (isAdminPath || hasWpContent) {
        const icon = document.createElement('div');
        icon.style.cssText = [
            'position:fixed',
            'bottom:20px',
            'right:20px',
            'width:48px',
            'height:48px',
            'cursor:pointer',
            'opacity:0.8',
            'z-index:9999'
        ].join(';');
        icon.title = 'Open WPCodeBoxIDE Frontend';

        // Insert SVG image
        icon.innerHTML = `<img src="https://techarticles.co.uk/wp-content/uploads/2025/05/favicon.svg" alt="IDE" style="width:100%;height:100%;display:block;"/>`;

        icon.addEventListener('mouseenter', () => icon.style.opacity = '1');
        icon.addEventListener('mouseleave', () => icon.style.opacity = '0.8');
        icon.addEventListener('click', openFrontend);

        document.body.appendChild(icon);
    }
})();