Inline Audio Player

Inline Mp3 Player (Button)

Add to every link to an mp3 file on page a tiny button for play music with inline player. Use Html5 <audio> tag.

目前為 2015-02-23 提交的版本，檢視最新版本。

安裝腳本 ?

Wrap lines

// ==UserScript==
// @name         Inline Mp3 Player (Button)
// @version      0.11
// @description  Add to every link to an mp3 file on page a tiny button for play music with inline player. Use Html5 <audio> tag.
// @author       Restpeace
// @match        *
// @include      *
// @grant        none
// @require 	 http://code.jquery.com/jquery-2.1.3.js
// @namespace https://gf.qytechs.cn/users/8668
// ==/UserScript==

    var audio_links = $("a[href*='.mp3']");
    var hasMp3 =  audio_links.length > 0;
	// console.log("Inline Mp3 Player start.... N. page links: " + audio_links.length);
	if (hasMp3) {
		for (var i = 0; i < audio_links.length; i++) {
            $(audio_links[i]).before ("<button id='B"+i+"'>Play</Button>");
            $("#B"+i).css("fontSize", "11px");
            $("#B"+i).css("fontFamily", "Trebuchet MS");
            $("#B"+i).css("padding", "2px 5px");
            $("#B"+i).css("marginRight", "6px");
            $("#B"+i).attr("formaction", audio_links[i].href);
            $("#B"+i).click (startPlay);  
            } 
    } //if hasMp3

function DestroyPlayer() {
        if ( $("#NewAudioPlayer").size() > 0) { 
             var buttonSelId = $("#NewAudioPlayer").attr("buttonSelId");
             $(buttonSelId).html("Play")
    		 $(buttonSelId).click(startPlay)
             $("#NewAudioPlayer").parent().remove()
        }
}            

function startPlay() {
    if (!hasMp3) {return false}
	DestroyPlayer();
	$ ("#" + this.id + " + a").after ("<div id='div" + this.id + "'></div>");
    
	$ ("#div"+this.id).append("<audio id='NewAudioPlayer'></audio>");
    $("#" + this.id).html("Stop")
    $("#" + this.id).click(stopPlay)
    $("#NewAudioPlayer").attr("controls", "controls");
    $("#NewAudioPlayer").attr("src", $("#"+this.id).attr("formaction"));
    $("#NewAudioPlayer").attr("buttonSelId", "#" + this.id);
    $("#NewAudioPlayer").get(0).play();
}

function stopPlay() {
    DestroyPlayer();
    $("#" + this.id).html("Play")
    $("#" + this.id).click(startPlay)
}

欢迎访问Greasy Fork镜像