Share via

Skriva plugin-program för Azure Media Player

  • Artikel

Ett plugin-program är JavaScript skrivet för att utöka eller förbättra spelaren. Du kan skriva plugin-program som ändrar Azure Media Players utseende, dess funktioner eller till och med har gränssnittet med andra tjänster. Du kan göra detta i två enkla steg:

Steg 1

Skriv din JavaScript i en funktion så här:


    (function () {
        amp.plugin('yourPluginName', function (options) {
        var myPlayer = this;
           myPlayer.addEventListener(amp.eventName.ready, function () {
        console.log("player is ready!");
            });
        });
    }).call(this);

Du kan skriva koden direkt på HTML-sidan i <script> taggar eller i en extern JavaScript-fil. Om du gör det senare måste du inkludera JavaScript-filen på <head> HTML-sidan efter AMP-skriptet.

Exempel:

    <!--*****START OF Azure Media Player Scripts*****-->
    <script src="//amp.azure.net/libs/amp/latest/azuremediaplayer.min.js"></script>
    <link href="//amp.azure.net/libs/amp/latest/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
    <!--*****END OF Azure Media Player Scripts*****-->
    <!--Add Plugins-->
    <script src="yourPluginName.js"></script>

Steg 2

Initiera plugin-programmet med JavaScript på något av två sätt:

Metod 1:

    var myOptions = {
        autoplay: true,
        controls: true,
        width: "640",
        height: "400",
        poster: "",
        plugins: {
            yourPluginName: {
                [your plugin options]: [example options]
           }
        }
    };
    var myPlayer = amp([videotag id], myOptions);

Metod 2:

    var video = amp([videotag id]);
    video.yourPluginName({[your plugins option]: [example option]});

Plugin-alternativ krävs inte, inklusive dem tillåter bara utvecklare som använder ditt plugin-program att konfigurera sitt beteende utan att behöva ändra källkoden.

Om du vill ha inspiration och fler exempel på hur du skapar ett plugin-program kan du titta på vårt galleri

Anteckning

Plugin-kod ändrar dynamiskt objekt i DOM under livslängden för tittarens spelarupplevelse, det gör aldrig permanenta ändringar i spelarens källkod. Det är här som en förståelse för webbläsarens utvecklarverktyg är praktisk. Om du till exempel vill ändra utseendet på ett element i spelaren kan du hitta dess HTML-element efter dess klassnamn och sedan lägga till eller ändra attribut därifrån. Här är en bra resurs för att ändra HTML-attribut.

Integrerade plugin-program

Det finns för närvarande två plugin-program bakade i AMP: tidstipset och snabbtangenterna. Dessa plugin-program utvecklades ursprungligen för att vara modulära plugin-program för spelaren men ingår nu i spelarens källkod.