[스크립트]audio_control.js : 초 단위로 MP3 파일을 실행시켜주는 스크립트
초 단위로 MP3 파일을 컨트롤 할 수 있는 스크립트입니다.
EPUB 3.0에서 사용할 수 있고, 나모 펍트리, 깃든뷰어에서 테스트 하였으며, 교보eBook 뷰어에서도 정상적으로 작동합니다.
단, 교보eBook 뷰어(V 2.4.7 기준)에서는 플레이버튼을 누를 때 메뉴나 페이지 넘김 액션이 함께 일어나는 문제가 있네요.
이 스크립트는 다음과 같은 기능을 지원합니다.
1. 오디오 실행, 정지, 볼륨조절 버튼을 기본 컨트롤러가 아닌 사용자가 디자인한 이미지나 텍스트로 편집 가능
2. MP3 전체 실행/정지 가능
3. 초 단위로 특정 구간을 지정해서 실행 가능
4. 볼륨을 10단계로 조절 가능(볼륨 조절 버튼을 페이지 넘김으로 사용할 때 필요함)
*단, 기기의 H/W 볼륨이 아닙니다. 예를 들어 스마트폰 볼륨이 5로 되어 있다면 이 볼륨 범위 내에서 조절이 됩니다.
사용 방법과 예제 파일을 첨부합니다.
예제 파일은 토마토 출판사의 '꼭 필요한 영어회화 베스트 표현 1200 <상황회화 편>'에 있는 내용 일부와 토마토 출판사 홈페이지에서 다운받은 MP3 파일을 사용했습니다.
출판사의 허락을 받지 못하고 사용했는데 저작권 문제가 있다면 바로 삭제를 하겠습니다.
* 스크립트 설명 : EPUB3 오디오 컨트롤러
* 적용 sample
<div>
<audio id="sample" src="../sample.mp3">Your viewer does not support the audio element.</audio>
<p>모두 듣기<button onclick="playAll()">▶</button><button onclick="playStop()">■</button><button onclick="volUp()">+</button><button onclick="volDown()">-</button></p>
<p>3초 ~ 8초 사이<button onclick="playSegment(3,8)">▶</button></p>
<p>10초 ~ 15초 사이<button onclick="playSegment(10,15)">▶</button></p>
<p><button onclick="playStop()">stop</button></p>
</div>
* 본 스크립트는 www.epubguide.net에서 제작하였으며, 누구나 자유롭게 사용 및 수정이 가능합니다.
* 단, 배포를 할 경우 내용을 일부 수정했다 하더라도 원본의 출처를 반드시 밝혀주시기 바랍니다.
var myAudio=document.getElementById("talk_mp3");
var segEnd;
myAudio.addEventListener("timeupdate", function (){
if (myAudio.currentTime >= segEnd) {
myAudio.pause();
}
console.log(myAudio.currentTime);
}, false);
function playSegment(startTime, endTime){
segEnd = endTime;
myAudio.currentTime = startTime;
myAudio.play();
}
function playAll()
{
myAudio.currentTime=0;
myAudio.play();
}
function playStop()
{
myAudio.currentTime=0;
myAudio.pause();
}
function playPause()
{
myAudio.pause();
}
function volUp()
{
myAudio.volume+=0.1
}
function volDown()
{
myAudio.volume-=0.1
}
audio_control.js