Diep.io audio/music/sound beta

Please sent me game music ideas in the feedback! Plays background music with custom controls for skipping tracks, adjusting volume, and playing/pausing the music.

当前为 2023-03-05 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Diep.io audio/music/sound beta
// @namespace    http://tampermonkey.net/
// @version      1.01
// @homepage     https://greasyfork.org/en/scripts/461192
// @description  Please sent me game music ideas in the feedback! Plays background music with custom controls for skipping tracks, adjusting volume, and playing/pausing the music.
// @author       -{Abyss⌬}-ora
// @match        https://diep.io
// @grant        none
// @license      GNU GPLv3
// ==/UserScript==

(function() {
    'use strict';

    const audioPlayer = document.createElement("audio");
    audioPlayer.id = "audioPlayer";
    audioPlayer.controls = false;
    audioPlayer.loop = true;
    audioPlayer.autoplay = true;
    audioPlayer.volume = 0.05;

    const sources = [
        "https://github.com/Abyss-ora/dpaudio/raw/main/8-bit-arcade-138828.mp3",
        "https://github.com/Abyss-ora/dpaudio/raw/main/kim-lightyear-angel-eyes-chiptune-edit-110226.mp3",
        "https://github.com/Abyss-ora/dpaudio/raw/main/kim-lightyear-legends-109307.mp3"
    ];

    let currentTrack = 0;

    audioPlayer.src = sources[currentTrack];
    document.body.appendChild(audioPlayer);

    const container = document.createElement("div");
    container.style.opacity = "0.5";
    container.style.display = "flex";
    container.style.alignItems = "center";
    container.style.justifyContent = "center";
    container.style.position = "fixed";
    container.style.top = "10px";
    container.style.left = "350px";
    container.style.backgroundImage = "url('https://media.tenor.com/images/f3f5354b7c304bc61882dbb1183885e7/tenor.gif')";
    container.style.backgroundRepeat = "repeat";
    container.style.backgroundAttachment = "fixed";
    container.style.backgroundSize = "160px 100px";
    container.style.padding = "5px";
    container.style.borderRadius = "5 5px 5px 5";
    container.style.borderStyle = "solid";
    container.style.borderWidth = "thick";
    container.style.borderTopRightRadius = "20px 50px";
    container.style.borderTopLeftRadius = "20px 50px";
    container.style.borderStyle = "double";
    container.style.borderBottomRightRadius = "20px 50px";
    container.style.borderBottomLeftRadius = "20px 50px";
    container.style.borderTopColor = "lightpink";
    container.style.borderLeftColor = "lightgray";
    container.style.borderBottomColor = "lightpink";
    container.style.borderRightColor = "lightgray";
    document.body.appendChild(container);

    const previousButton = document.createElement("button");
    previousButton.innerText = "⏪";
    previousButton.style.fontSize = "24px";
    previousButton.style.marginRight = "10px";
    previousButton.style.borderTopColor = "lightpink";
    previousButton.style.backgroundTransparent = "0.01";
    container.appendChild(previousButton);

    const playButton = document.createElement("button");
    playButton.innerText = "▶️";
    playButton.style.fontSize = "24px";
    playButton.style.marginRight = "10px";
    playButton.style.borderTopColor = "lightpink";
    playButton.style.backgroundTransparent = "0.01";
    container.appendChild(playButton);

    const volumeBar = document.createElement("input");
    volumeBar.type = "range";
    volumeBar.min = "0";
    volumeBar.max = "1";
    volumeBar.step = "0.01";
    volumeBar.value = audioPlayer.volume;
    volumeBar.style.width = "100px";
    volumeBar.style.marginRight = "10px";
    container.appendChild(volumeBar);

    const skipButton = document.createElement("button");
    skipButton.innerText = "⏩";
    skipButton.style.fontSize = "24px";
    skipButton.style.marginRight = "10px";
    skipButton.style.borderTopColor = "lightpink";
    skipButton.style.backgroundTransparent = "0.01";
    container.appendChild(skipButton);

    function playPause() {
        if (audioPlayer.paused) {
            audioPlayer.play();
            playButton.innerText = "⏸";
        } else {
            audioPlayer.pause();
            playButton.innerText = "▶️";
        }
    }

    function previousTrack() {
        currentTrack = (currentTrack - 1 + sources.length) % sources.length;
        audioPlayer.src = sources[currentTrack];
        audioPlayer.play();
        playButton.innerText = "⏸";
    }

    function skipTrack() {
        currentTrack = (currentTrack + 1) % sources.length;
        audioPlayer.src = sources[currentTrack];
        audioPlayer.play();
        playButton.innerText = "⏸";
    }

    playButton.addEventListener("click", playPause);
    previousButton.addEventListener("click", previousTrack);
    skipButton.addEventListener("click", skipTrack);
    volumeBar.addEventListener("input", function() {
        audioPlayer.volume = volumeBar.value;
    });
})();