audio.addEventListener('timeupdate', updateTime);
audio.addEventListener('durationchange', eventLogger);
audio.addEventListener('durationchange', updateDuration);
+ audio.addEventListener('ratechange', eventLogger);
+ audio.addEventListener('ratechange', updateRate);
}
function formatTime(time) {
function updateTime() {
var time = document.getElementById('time');
- time.innerText = formatTime(audio.currentTime);
+ var currentTime = audio.currentTime;
+ time.innerText = formatTime(currentTime);
var timeline = document.getElementById('timeline');
- timeline.value = audio.currentTime;
+ timeline.value = currentTime;
}
function updateDuration() {
timeline.max = audio.duration;
}
+ function updateRate() {
+ var rate = document.getElementById('rate');
+ rate.value = audio.playbackRate;
+ }
+
</script>
</head>
<body onload="onload()">
</select>
</div>
<div>
- <input type="range" min="0" max="1" step="0.01" value="1" onchange="audio.volume = event.target.value" />
+ <input type="range" min="0" max="1" step="0.01" value="1" oninput="audio.volume = event.target.value" />
<button onclick="audio.play()">play</button>
<button onclick="audio.pause()">pause</button>
<button onclick="audio.muted = !audio.muted">mute</button>
<span id="time">--:--</span>
- <input id="timeline" type="range" min="0" max="1" step="0.01" value="0" onchange="audio.currentTime = event.target.value" />
+ <input id="timeline" type="range" min="0" max="1" step="0.01" value="0" oninput="audio.currentTime = event.target.value" />
<span id="duration">--:--</span>
<button onclick="audio.loop = !audio.loop">loop</button>
<button onclick="audio.playbackRate = -audio.playbackRate">reverse</button>
+ <input id="rate" type="range" min="-1" max="1" step="0.01" value="1" oninput="audio.playbackRate = event.target.value" />
</div>
</body>
return;
if (this._ended) {
- if this._playbackRate > 0)
+ if (this._playbackRate > 0)
this.setCurrentTime(0);
else
this.setCurrentTime(this.duration)
},
setCurrentTime: function(time) {
- this.nextStartTime = time;
+ this.nextStartTime = parseFloat(time);
this.dispatchEventAsync(new CustomEvent('timeupdate'));
if (!this.node)
return;
setPlaybackRate: function(rate) {
var oldPlaybackRate = this._playbackRate;
- this._playbackRate = rate;
+ this._playbackRate = parseFloat(rate);
+ this.dispatchEventAsync(new CustomEvent('ratechange'));
- if (this.buffer) {
+ if (this.node) {
this.nextStartTime = oldPlaybackRate * (Sound.audioContext.currentTime - this.startTime);
- this.stopInternal();
- this.playInternal();
+ this.node.playbackRate.value = this._playbackRate;
}
},
},
setDefaultPlaybackRate: function(rate) {
- this._defaultPlaybackRate = rate;
+ this._defaultPlaybackRate = parseFloat(rate);
+ this.dispatchEventAsync(new CustomEvent('ratechange'));
},
getVolume: function() {
if (this._volume === volume)
return;
- this._volume = volume;
+ this._volume = parseFloat(volume);
this.dispatchEventAsync(new CustomEvent('volumechange'));
if (this.gainNode)