既存のMediaElementPlayerを取得する方法

Question

私のページでは、$('#video-id').medialementplayer(options)を使用して<video>要素用にMediaElementPlayerを作成しました。この要素は（display: noneを使用して）非表示になり、jQuery UIを使用してモーダルダイアログに変わります。

私はこのダイアログでopen/closeイベントをバインドして、palyerを開始/一時停止しようとしています。 $(...).dialog(options)を処理するスクリプトは、$(...).medialementplayer(options)を処理するスクリプトとは分離されており、作成されたMediaElementPlayerにはアクセスできません。

私は純粋にHTML5のvideo要素を使用していた場合、私は$('video', dialogContentElement).get(O)を使用してプレーヤーを取得することができますが、私はMediaElement.jsを使用しているので、私は実際のプレーヤーを取得するには、この方法に頼ることはできません。

MediaElement.jsは、<video>または<audio>要素の既存のMediaElementPlayer（またはMediaElement）インスタンスを取得する方法を提供しますか？または私自身のプレーヤーを管理する必要がありますレジストリ？

Answer 1

MediaElementを初期化するストレートJQuery関数に加えて、MEを後でthe APIを使用できるようにvarとして初期化することができます。 .dialog（オプション）スクリプトがMediaElementのスクリプトから分離されているので

var player = new MediaElementPlayer('video', 
    {defaultVideoWidth:960, defaultVideoHeight:410, 
    features: ['playpause', 'progress', 'current', 'duration', 'volume', 'fullscreen'], 
    success: function (mediaElement, domObject) { ... } 
    }); 

// then bind the modal window's open and close callback function to the API: 
// code below from the JQuery UI documentation at **http://docs.jquery.com/UI/Dialog** 

$(".selector").dialog({ 
    open: function(event, ui) { player.play(); }, 
    close: function (event, ui) { player.pause(); } 
}); 

は、あなたが var playerがグローバルであるか、または適切な.dialog（）のinitを囲む関数に渡されていることを確認する必要があります。

---

この回答はMatt Bergsmaからa postに基づいています。

Answer 2

私は（唯一のjQueryの方法は私の作品）、「新MediaElementPlayer」のように動作するようにプレーヤーを得ることができないので、私は図書館がmejs.playersアレイに選手を追加しているという事実に依存するこのハックを考案：

$('#my-video-id'). 
    mediaelementplayer(myopts). 
    data('MEP',mejs.players[mejs.players.length-1]); 

// ... 

$('#my-video-id').data('MEP').play(); 

これは、プレイヤーを1つずつ作成する限り（正確に1つの要素を持つjQueryオブジェクトに毎回）動作します。それとも、この（未テスト）のようなものを危険にさらす可能性：

var n = mejs.players.length; 

$(myselector).mediaelementplayer(myopts).each(function(k,elt){ 

    $(elt).data('MEP',mejs.players[n+k]); 
}); 

// ... 

$('#my-video-id').data('MEP').pause(); 

Answer 3

私はサンプル以下のコードのいくつかの他のビットを削除したが、我々はmediaelements.jsを使用して行くか、これは本質的です。動画プレーヤーが初期化された後、動画プレーヤーを制御することができます。

これは、我々が何をすべきかです：

var videoPlayer; 

$(function() { 
    var whatever = $('#videoPlayer').mediaelementplayer({ 
     success: function (player, node) { 
      videoPlayer = player; 
     } 
    }); 
}); 

はその後、我々はプログラムで、基本的にこれを使用して再生する動画を設定します。

var vidArray = [{ src: "/media/vid.mp4", type: 'video/mp4' }]; 
videoPlayer.setSrc(vidArray); 
videoPlayer.play(); 

videoPlayerは、一時停止、再生するために私たちのビデオプレーヤーへのアクセスを提供します変更など

私たちを困惑させたのは、HTMLマークアップにソース要素がないかぎり、うまくいかなかったということでした。それがなければ、あらゆる種類の奇妙な誤りが見られました。例：

<video id="videoPlayer" width="100%" height="100%"> 
    <source src="/media/default.mp4" type="video/mp4" /> 
</video> 

これをベースに使用すると、動画プレーヤーを完全に制御する必要があります。

これが役に立ちます。

Answer 4

あなたは、私がmejs.players.lengthを取得することはできません

var player = new MediaElementPlayer('#player'); 

player.pause(); 

player.play();