diff --git a/src/components/nowplayingbar/nowplayingbar.js b/src/components/nowplayingbar/nowplayingbar.js index 56fa2eaa15..fcbbc54f1a 100644 --- a/src/components/nowplayingbar/nowplayingbar.js +++ b/src/components/nowplayingbar/nowplayingbar.js @@ -187,14 +187,29 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader', volumeSliderContainer.classList.remove('hide'); } + var volumeSliderTimer; + function setVolume() { + clearTimeout(volumeSliderTimer); + volumeSliderTimer = null; + if (currentPlayer) { currentPlayer.setVolume(this.value); } } + + function setVolumeDelayed() { + if (!volumeSliderTimer) { + var that = this; + volumeSliderTimer = setTimeout(function () { + setVolume.call(that); + }, 700); + } + } + volumeSlider.addEventListener('change', setVolume); - volumeSlider.addEventListener('mousemove', setVolume); - volumeSlider.addEventListener('touchmove', setVolume); + volumeSlider.addEventListener('mousemove', setVolumeDelayed); + volumeSlider.addEventListener('touchmove', setVolumeDelayed); positionSlider = elem.querySelector('.nowPlayingBarPositionSlider'); positionSlider.addEventListener('change', function () { diff --git a/src/components/remotecontrol/remotecontrol.js b/src/components/remotecontrol/remotecontrol.js index be1fcd2754..df1b01367d 100644 --- a/src/components/remotecontrol/remotecontrol.js +++ b/src/components/remotecontrol/remotecontrol.js @@ -609,15 +609,27 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL return datetime.getDisplayRunningTime(ticks); }; - context.querySelector(".nowPlayingVolumeSlider").addEventListener("change", function () { + var volumeSliderTimer; + + function setVolume() { + clearTimeout(volumeSliderTimer); + volumeSliderTimer = null; + playbackManager.setVolume(this.value, currentPlayer); - }); - context.querySelector(".nowPlayingVolumeSlider").addEventListener("mousemove", function () { - playbackManager.setVolume(this.value, currentPlayer); - }); - context.querySelector(".nowPlayingVolumeSlider").addEventListener("touchmove", function () { - playbackManager.setVolume(this.value, currentPlayer); - }); + } + + function setVolumeDelayed() { + if (!volumeSliderTimer) { + var that = this; + volumeSliderTimer = setTimeout(function () { + setVolume.call(that); + }, 700); + } + } + + context.querySelector(".nowPlayingVolumeSlider").addEventListener("change", setVolume); + context.querySelector(".nowPlayingVolumeSlider").addEventListener("mousemove", setVolumeDelayed); + context.querySelector(".nowPlayingVolumeSlider").addEventListener("touchmove", setVolumeDelayed); context.querySelector(".buttonMute").addEventListener("click", function () { playbackManager.toggleMute(currentPlayer); });