Bandcamp Volume Bar

adds a volume bar to Bandcamp
换行
// ==UserScript==
// @name         Bandcamp Volume Bar
// @version      1.8.0
// @description  adds a volume bar to Bandcamp
// @author       @HiImBlu, forked by @stib
// @match        *://*.bandcamp.com/*
// @exclude      *://bandcamp.com/
// @grant        GM_addStyle
// @license      DWTFYWWI https://github.com/avar/DWTFYWWI/blob/master/DWTFYWWI
// @require      http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.js
// @namespace https://pureandapplied.com.au/bandcampVolumeBar
// ==/UserScript==
/* global $ */

//Awesome Tags!
$("audio").attr("id", "audioSource");
$("<div class='volumeControl'></div>").insertAfter(".inline_player");
$(".volumeControl").append("<div class='speaker'></div>");
$(".volumeControl").append("<div class='volume'></div>");
$(".volume").append("<span class='volumeInner'></span>");

//CSS Time!
let savedPercentage = getCookie("bandCampVolumeBar_volume");
let percentage = isNaN (parseFloat(savedPercentage))?
    50:
    parseFloat(savedPercentage);

let color = $("#pgBd").css("background-color");
console.log (color);
const css = ".volumeControl { margin-bottom: 6px; }" +
          ".speaker {" +
            "position: relative;" +
            "float: left;" +
            "width: 54px;" +
            "height: 8px;" +
            "border-radius: 1px;"+
            "cursor: pointer;" +
            "background-color: rgba(2,2,2,.1);" +
            "border: 1px solid rgba(190,190,190,.5);" +
          "}" +
          ".volumeInner {" +
            "position: absolute;" +
            "bottom: 0;" +
            "width: "+percentage+"%;" +
            "height: 8px;" +
            "background-color: #fff;" +
          "}" +
          ".volume {" +
            "position: relative;" +
            "width: 82%;" +
            "height: 8px;" +
            "float: right;" +
            "cursor: pointer;" +
            "background-color: rgba(2,2,2,.1);" +
            "border: 1px solid rgba(190,190,190,.5);" +
          "}";
GM_addStyle(css);

//Sexy Script!
$("#audioSource")[0].volume = percentage/100;

function setCookie(cname, cvalue, exdays) {
    const d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    let expires = "expires=" + d.toUTCString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/;domain=bandcamp.com";
}

function getCookie(cname) {
    let name = cname + "=";
    let ca = document.cookie.split(';');
    for (let i = 0; i < ca.length; i++) {
        let c = ca[i];
        while (c.charAt(0) == ' ') {
            c = c.substring(1);
        }
        if (c.indexOf(name) == 0) {
            return c.substring(name.length, c.length);
        }
    }
    return false;
}

function changeVolume(e) {
	var clickPos = (e.pageX) - $(".volume").offset().left;
	var maxWidth = $(".volume").width();
	percentage = Math.floor(clickPos / maxWidth * 100);
    if(percentage > 100) {
        percentage = 100;
        $(".volumeInner").css("width", "100%");
    } else if(percentage < 0) {
        percentage = 0;
        $(".volumeInner").css("width", "0%");
    } else {
        $(".volumeInner").css("width", percentage + "%");
    }

	$("#audioSource")[0].volume = percentage/100;
}

$(".volume").mousedown(function(e){
    //console.log("volume bar clicked");
    changeVolume(e);
    $("body").css({
        "-webkit-user-select": "none",
        "-moz-user-select": "none"
    });

	$("body").mousemove(function(e){ changeVolume(e); });
});

$(document).mouseup(function(){
    $("body").off("mousemove");
    $("body").css({
        "-webkit-user-select": "all",
        "-moz-user-select": "all"
    });
    setCookie("bandCampVolumeBar_volume", percentage, 365);
    console.log("saved cookie: " + getCookie("bandCampVolumeBar_volume"));
});

var mute = false;
$(".speaker").click(function(){
    if(mute) {
        mute = false;
        $(".speaker").css("background-color", "rgba(2,2,2,.1)");
        $(".volumeInner").css("width", percentage + "%");
        $("#audioSource")[0].volume = percentage/100;
    } else {
        mute = true;
        $(".speaker").css("background-color", "#f88");
        $("#audioSource")[0].volume = 0;
        $(".volumeInner").css("width", "0%");
    }
});
欢迎访问Greasy Fork镜像
