// ==UserScript==
// @name         Notion Audio Player Enhancements
// @version      1.0
// @description  Enhances Notion audio player with loop functionality and a floating button for loop toggle.
// @author       caxuuuu
// @match        https://www.notion.so/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Create loop button element
    const loopButton = document.createElement('div');
    loopButton.innerHTML = 'LOOP';
    loopButton.style.position = 'fixed';
    loopButton.style.right = '20px';
    loopButton.style.bottom = '20px';
    loopButton.style.background = 'white';
    loopButton.style.padding = '10px';
    loopButton.style.border = '1px solid black';
    loopButton.style.borderRadius = '5px';
    loopButton.style.cursor = 'pointer';
    loopButton.style.zIndex = '9999';
    loopButton.style.textTransform = 'uppercase';
    loopButton.style.fontWeight = 'bold';
    loopButton.style.textAlign = 'center';
    loopButton.style.userSelect = 'none';
    loopButton.style.webkitUserSelect = 'none';
    loopButton.style.mozUserSelect = 'none';
    loopButton.style.msUserSelect = 'none';

    // Append loop button to the document body
    document.body.appendChild(loopButton);

    // Get all audio elements on the page
    const audioElements = document.getElementsByTagName('audio');

    // Loop through each audio element
    for (let audio of audioElements) {
        // Add loop attribute to each audio element
        audio.loop = false;
    }

    // Add click event listener to the loop button
    loopButton.addEventListener('click', function() {
        // Toggle the loop attribute for all audio elements
        for (let audio of audioElements) {
            audio.loop = !audio.loop;
        }

        // Toggle the button's background color to indicate loop status
        loopButton.style.background = audioElements[0].loop ? 'skyblue' : 'white';
    });
})();