const slider  = document.getElementById('slider');
const display = document.getElementById('display');
const reset   = document.getElementById('reset');

// Gespeicherten Wert laden
chrome.storage.local.get('volume', ({ volume }) => {
    const val = volume ?? 100;
    slider.value = val;
    display.textContent = val;
});

// Schieberegler bewegen
slider.addEventListener('input', () => {
    const val = parseInt(slider.value);
    display.textContent = val;
    chrome.storage.local.set({ volume: val });

    // Aktiven Tab anweisen
    chrome.tabs.query(
        { active: true, currentWindow: true },
        ([tab]) => {
            chrome.tabs.sendMessage(tab.id, { volume: val });
        }
    );
});

// Zurücksetzen auf 100%
reset.addEventListener('click', () => {
    slider.value = 100;
    display.textContent = 100;
    chrome.storage.local.set({ volume: 100 });
    chrome.tabs.query(
        { active: true, currentWindow: true },
        ([tab]) => {
            chrome.tabs.sendMessage(tab.id, { volume: 100 });
        }
    );
});