JS: сделать звук остановится через пробел - PullRequest
Новая
       20

JS: сделать звук остановится через пробел

0 голосов
/ 31 октября 2018

Я пытаюсь выяснить, как остановить / возобновить воспроизведение трека через пробел.

У меня все мои клавиши работают, просто нужно выяснить, как заставить его останавливаться при каждом нажатии пробела. 

<div class="keys">
   <div data-key="80" class="key">
      <kbd>P</kbd>
      <span class="sound">Sound 19</span>
   </div>
   <div data-key="32" class="stop">
      <kbd>Spacebar</kbd>
      <span class="sound">STOP</span>
   </div>
</div>

<audio data-key="79" src="sounds/Sound18.wav"></audio>
<audio data-key="80" src="sounds/Sound19.wav"></audio>

<script>
   function removeTransition(e) {
     if (e.propertyName !== 'transform') return;
      e.target.classList.remove('playing');
   }

   function playSound(e) {
      const audio = document.querySelector(`audio[data- 
      key="${e.keyCode}"]`);
      const key = document.querySelector(`div[data-key="${e.keyCode}"]`);
      if (!audio) return;
      key.classList.add('playing');
      audio.currentTime = 0;
      audio.play();
  }

  const keys = Array.from(document.querySelectorAll('.key'));
  keys.forEach(key => key.addEventListener('transitionend', 
  removeTransition));
  window.addEventListener('keydown', playSound);
</script>

Есть идеи, как это исправить?

...