Almazq
@Almazq
Новичок в мире IT

Почему после обновления страницы аудио не работает?

привет !
есть аудио файл ее надо воспроизвести с визуализации на wavesurfer.js сделал. сделал play , stop все работает но надо еще сделать так что бы аудио само начиналось. это сделал как document.querySelector(".play").click(); . когда на страницу заходишь по ссылке из другой страницы сайт все работает нормально а когда обновляешь не работает.
можете помочь решить эту проблему . спасибо.

class AudioMessage {
		constructor(container, audioLink) {
			this.audioLink = audioLink;
			this.speed = 1;

			this.elements = {};
			this.elements.container = container;
			this.elements.playToggle = container.querySelector('[data-play-toggle]');
			this.elements.wave = container.querySelector('[data-wave]');
			this.elements.time = container.querySelector('[data-time]');
			this.elements.speedToggle = container.querySelector('[data-speed-toggle]');

			this.wavesurfer = WaveSurfer.create({
				container: this.elements.wave,
				waveColor: '#E0E0E0',
				progressColor: '#00D45D',
				barWidth: 2,
				barHeight: 3, // the height of the wave
				barGap: 2,
				height: 40,
				cursorWidth: 0,
			});
			this.wavesurfer.load(this.audioLink);
			this.wavesurfer.on('ready', () => {
				this.setTime(this.wavesurfer.getDuration());
				this.elements.playToggle.addEventListener('click', this.togglePlay.bind(this));
				this.elements.speedToggle.addEventListener('click', this.toggleSpeed.bind(this));

				this.wavesurfer.on('audioprocess', () => {
					this.setTime(this.wavesurfer.getCurrentTime());
				});
        
				this.wavesurfer.on('seek', () => {
					this.play();
				});
			});
		}
		togglePlay(state) {
          this.elements.container.classList.toggle('AudioMessage--active');
          this.wavesurfer.playPause();
          
		}

		play() {
			this.elements.container.classList.add('AudioMessage--active');
			this.wavesurfer.play();


		}

		toggleSpeed() {
			this.speed += 0.5;
			if (this.speed > 2) {
				this.speed = 0.5;
			}
			this.wavesurfer.setPlaybackRate(this.speed);
			this.updateSpeed();
		}

		setTime(seconds) {
			const intSeconds = Math.trunc(seconds);
			const padMinutes = String(div(intSeconds, 60)).padStart(2, '0');
			const padSeconds = String(mod(intSeconds, 60)).padStart(2, '0');

			this.elements.time.textContent = `${padMinutes}:${padSeconds}`;
		}

		updateSpeed() {
			this.elements.speedToggle.textContent = `${this.speed}x`;
		}
	}
 
	const messages = [];

	document.querySelectorAll('[data-audio-message]').forEach((message) => {
    let mess = new AudioMessage(message, audioGolos)
		messages.push(mess);
    
	});
  • Вопрос задан
  • 47 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы