Blendet Haupt- und Subnavigation auf MyDealz aus und fügt einen globalen Toggle-Button hinzu.
当前为
// ==UserScript==
// @name MyDealz Global Nav Toggle
// @namespace http://tampermonkey.net/
// @version 1.1
// @description Blendet Haupt- und Subnavigation auf MyDealz aus und fügt einen globalen Toggle-Button hinzu.
// @author MD928835
// @match https://www.mydealz.de/*
// @grant GM_addStyle
// @grant GM_getValue
// @grant GM_setValue
// @license MIT
// @run-at document-idle
// ==/UserScript==
(function() {
'use strict';
// --- Konfiguration ---
// Liste der CSS-Selektoren für die Elemente, die ausgeblendet werden sollen [1]
const SELECTORS_TO_TOGGLE = [
'.nav', // Hauptnavigationsleiste
'.subNav--light' // Sub-Navigationsleiste unter der Hauptleiste
// Fügen Sie hier bei Bedarf weitere Selektoren hinzu, z.B. '.some-other-element'
];
// Container, in den der Button eingefügt wird (das <header>-Element selbst)
const HEADER_SELECTOR = 'header[role="banner"].header';
const BUTTON_ID = 'mydealzGlobalNavToggle';
const STORAGE_KEY = 'mydealzGlobalNavVisible'; // Zustandsspeicherung
const HIDDEN_CLASS = 'mydealz-nav-hidden-by-script'; // Eigene Klasse zum Ausblenden
const ICON_SHOW = '>';
const ICON_CLOSE = '<';
// --- CSS hinzufügen ---
GM_addStyle(`
/* Klasse zum Ausblenden der Navigationsbereiche */
.${HIDDEN_CLASS} {
display: none !important; /* Wichtig, um andere Styles zu überschreiben */
visibility: hidden !important; /* Zusätzliche Maßnahme */
height: 0 !important; /* Nimmt keinen Platz mehr ein */
overflow: hidden !important; /* Verhindert Überlaufen */
margin: 0 !important;
padding: 0 !important;
}
/* Styling für den Toggle-Button */
#${BUTTON_ID} {
position: fixed; /* Bleibt beim Scrollen sichtbar */
top: 8px; /* Abstand von oben */
left: 10px; /* Abstand von links */
z-index: 10001; /* Muss über anderen Elementen liegen */
background-color: rgba(240, 240, 240, 0.9); /* Leicht transparenter Hintergrund */
border: 1px solid #cccccc;
border-radius: 5px;
padding: 6px 12px;
font-size: 22px; /* Größe des Icons */
line-height: 1;
cursor: pointer;
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
transition: background-color 0.2s;
color: #333; /* Deutlichere Icon-Farbe */
}
#${BUTTON_ID}:hover {
background-color: rgba(220, 220, 220, 0.95);
}
`);
// --- Elemente selektieren ---
const headerElement = document.querySelector(HEADER_SELECTOR);
// --- Prüfen, ob das Header-Element vorhanden ist (Button-Anker) ---
if (!headerElement) {
console.error('MyDealz Global Nav Toggle: Header (<header>) nicht gefunden. Button kann nicht platziert werden. Skript wird beendet.');
return;
}
// --- Toggle-Button erstellen (falls noch nicht vorhanden) ---
let toggleButton = document.getElementById(BUTTON_ID);
if (!toggleButton) {
toggleButton = document.createElement('button');
toggleButton.id = BUTTON_ID;
toggleButton.title = "Navigation ein-/ausblenden";
headerElement.prepend(toggleButton); // Fügt Button am Anfang des Headers ein
console.log('MyDealz Global Nav Toggle: Button erstellt und eingefügt.');
} else {
console.log('MyDealz Global Nav Toggle: Button existiert bereits.');
}
// --- Zustand initialisieren (aus Speicher oder Standard = unsichtbar) ---
let isVisible = GM_getValue(STORAGE_KEY, false);
// --- Funktion zum Aktualisieren des Navigationszustands ---
function updateNavState(visible) {
let foundElements = false;
SELECTORS_TO_TOGGLE.forEach(selector => {
const elements = document.querySelectorAll(selector);
if (elements.length > 0) {
foundElements = true;
elements.forEach(element => {
// Fügt die Klasse hinzu, wenn NICHT sichtbar (!visible)
// Entfernt die Klasse, wenn sichtbar (visible)
element.classList.toggle(HIDDEN_CLASS, !visible);
});
} else {
// Optional: Loggen, falls ein Selektor nichts findet (kann normal sein, z.B. subNav auf manchen Seiten)
// console.log(`MyDealz Global Nav Toggle: Kein Element für Selektor "${selector}" gefunden.`);
}
});
if (!foundElements) {
console.warn("MyDealz Global Nav Toggle: Keines der zu toggelnden Elemente wurde gefunden.");
}
// Button-Icon ändern
toggleButton.textContent = visible ? ICON_CLOSE : ICON_SHOW;
// Zustand speichern
GM_setValue(STORAGE_KEY, visible);
}
// --- Initialen Zustand beim Laden setzen ---
updateNavState(isVisible);
// --- Event Listener für den Klick auf den Button hinzufügen ---
toggleButton.addEventListener('click', () => {
isVisible = !isVisible; // Zustand umschalten
updateNavState(isVisible); // Anzeige aktualisieren und speichern
});
})();