diff --git a/modern-bas.user.js b/modern-bas.user.js index 7b94f53..5686dfb 100644 --- a/modern-bas.user.js +++ b/modern-bas.user.js @@ -1,10 +1,13 @@ // ==UserScript== // @name BAS - Modern Style Toggle // @namespace https://git.ntnu.no/M365-Drift/MonkeyMagic -// @version 1.0.5 +// @version 1.0.8 // @description Apply modern styling to BAS/Cereweb with toggle between modern and classic // @author Øyvind Nilsen (on@ntnu.no) // @match https://bas.ntnu.no/* +// @exclude https://bas.ntnu.no/groupadmin/* +// @exclude https://bas.ntnu.no/userclient/* +// @exclude https://bas.ntnu.no/login // @resource modernCSS https://raw.git.ntnu.no/M365-Drift/MonkeyMagic/main/modern-bas.css // @grant GM_addStyle // @grant GM_getResourceText @@ -19,50 +22,19 @@ let modernStyleElement = null; let isModernMode = GM_getValue('modernMode', true); // Default to modern - + const helpLinkDiv = document.getElementById('help_link'); // Create toggle button function createToggleButton() { - const toggleButton = document.createElement('div'); - toggleButton.id = 'bas-style-toggle'; - toggleButton.innerHTML = ` - - `; - - // Add hover effects - const button = toggleButton.querySelector('#style-toggle-btn'); - button.addEventListener('mouseenter', () => { - button.style.transform = 'scale(1.05)'; - button.style.boxShadow = '0 4px 12px rgba(0,0,0,0.3)'; - }); - - button.addEventListener('mouseleave', () => { - button.style.transform = 'scale(1)'; - button.style.boxShadow = '0 2px 8px rgba(0,0,0,0.2)'; - }); - - // Add click handler - button.addEventListener('click', toggleStyle); - - document.body.appendChild(toggleButton); - return button; + // Create and append style link if it doesn't exist + if (helpLinkDiv && !document.getElementById('modern-style-toggler')) { + const styleToggleLink = document.createElement('a'); + var ToggleText = isModernMode ? 'Style: Modern' : 'Style: Classic'; + styleToggleLink.innerText = ToggleText; + styleToggleLink.href = '#'; + styleToggleLink.id = 'modern-style-toggler'; + styleToggleLink.addEventListener('click', toggleStyle); + helpLinkDiv.appendChild(styleToggleLink); + } } function applyModernStyle() { @@ -87,23 +59,26 @@ } }); + // Create and append logout link const loggedinDiv = document.getElementsByClassName("loggedin")[0]; if (loggedinDiv) { const logoutLink = loggedinDiv.querySelector('a.logoutlink'); - const helpLinkDiv = document.getElementById('help_link'); + if (logoutLink && helpLinkDiv) { // Avoid duplicating the link if (!helpLinkDiv.querySelector('a[href="/logout"]')) { const newLogoutLink = document.createElement('a'); newLogoutLink.href = logoutLink.href; - const usr_name = document.getElementsByClassName("loggedin")[0].innerText.split(' ')[0] + newLogoutLink.id = 'modern-logout-link'; + const usr_name = document.getElementsByClassName("loggedin")[0].innerText.trim().split(' ')[0] newLogoutLink.innerHTML = 'Log out (' + usr_name + ')'; helpLinkDiv.appendChild(newLogoutLink); } } } + } function applyClassicStyle() { @@ -125,7 +100,7 @@ // Remove the modern logout link if it exists const helpLinkDiv = document.getElementById('help_link'); if (helpLinkDiv) { - const modernLogoutLink = helpLinkDiv.querySelector('a[href="/logout"]'); + const modernLogoutLink = helpLinkDiv.querySelector('#modern-logout-link'); if (modernLogoutLink) { modernLogoutLink.remove(); } @@ -138,16 +113,14 @@ isModernMode = !isModernMode; GM_setValue('modernMode', isModernMode); - const button = document.getElementById('style-toggle-btn'); + const button = document.getElementById('modern-style-toggler'); if (isModernMode) { applyModernStyle(); - button.textContent = '🎨 Modern'; - button.style.background = '#0d6efd'; + button.textContent = 'Style: Modern'; } else { applyClassicStyle(); - button.textContent = '📰 Classic'; - button.style.background = '#6c757d'; + button.textContent = 'Style: Classic'; } // Add a brief animation to show the change @@ -181,16 +154,4 @@ } else { initializeStyles(); } - - // Handle page navigation (for SPAs) - let currentUrl = location.href; - new MutationObserver(() => { - if (location.href !== currentUrl) { - currentUrl = location.href; - // Re-create toggle button if it was removed - if (!document.getElementById('bas-style-toggle')) { - setTimeout(createToggleButton, 100); - } - } - }).observe(document, { subtree: true, childList: true }); })(); \ No newline at end of file