mediaelement.js 여러 동영상의 볼륨 동기화

Question

일련의 페이지에 각각 동영상 모음이 있습니다. 원한다면 비디오 재생 목록 일종. 내가 외부 컨트롤을 할 수 있도록하기위한

var mediaArray = []; 
$(".class").each(function (index) { 
    $(this).mediaelementplayer({ 
     success: function (mediaElement, domObject) { 
      mediaArray[index] = mediaElement; 
     } 
    }); 
}); 

이 잘 작동 : 쉽게 비디오의 각을 해결하기 위해, 나는 mediaelement.js 그들에-에 연결하고이 같은 배열의 MediaElement에 객체를 저장할 실행 mediaElement.js 플레이어의 다양한 mediaElement 객체를 처리합니다. 예를 들어 사용자가 다음 동영상의 제목을 클릭하여 해당 동영상을 재생하게 할 수 있습니다.

문제가 발생하는 이유는 사용자가 동영상 중 하나에서 볼륨을 변경하고 다음 비디오 재생을 시작할 때 해당 볼륨을 유지하도록 허용하려고 할 때입니다.

난 쉽게 이런 기능을 쓸 수 있습니다 :

setAllVolume = function (value) { 
     for (var i=0, il=mediaArray.length; i<il; i++) { 
      mediaArray[i].setVolume(value); 
     } 
    } 

을 그리고 나는 mediaelement.js 컨트롤의 외부 볼륨 컨트롤이있는 경우 그 잘 작동합니다. (. 나는 보편적 인 볼륨 제어를위한 jQueryUI의 슬라이더를 구축 할 경우 예는) 내가 무엇을 시도했다

이 같은 "changevolume"이벤트에 대한 이벤트 리스너를 추가하고 화재 내 setAllVolume 기능을하는 것입니다 :

$(".class").each(function (index) { 
    $(this).mediaelementplayer({ 
     success: function (mediaElement, domObject) { 
      mediaArray[index] = mediaElement; 
      mediaElement.addEventListener("volumechange", function() { 
       setAllVolume(mediaElement.volume); 
      }); 
}); 

이 방법으로 볼륨을 설정하면 각 mediaElement가 자체 "volumechange"이벤트를 발생시키고 계단식 오류 더미에서 재귀 적으로 setAllVolume 함수를 호출하여 브라우저가 과정을 반복적으로.

그래서이 재귀를 실행하지 않고도 다른 비디오에 반영된 한 비디오의 볼륨을 변경할 수 있습니까? (필자는 H.264 비디오를 사용하고 있는데이 문제는 Flash 플러그인을 사용하여 브라우저에서이 형식을 재생할 때만 나타나는 것으로 보입니다.)

Answer 1

내 문제에 대한 가장 빠른 해결책은 배열을 반복하면서 저장되는 mediaElement의 현재 볼륨에 대한 검사를 실행하려면 :

setAllVolume = function (value) { 
    for (var i=0, il=mediaArray.length; i<il; i++) { 
     if (mediaArray[i].volume !== value) { 
      mediaArray[i].setVolume(value); 
     } 
    } 
}