Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.07.2010, 08:28
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

тег <audio> в Opera, Chrome, Firefox
Заинтересовался новым тегом <audio> и его API Javascript

Хочу реализовать простой плеер с поддержкой плейлистов, но проблема в том что у меня не получается запустить следующую композицию в браузерах Chrome и Firefox. В Opera все элементрно, достаточно обьявить(заменить) параметр src, к примеру вот так:
audio.setAttribute('src', 'song.ogg')

и эта композиция сразу становится доступной для проигрывания.
Как я выше говорил в Chrome и Firefox это не работает.

Посоветуйте как реализовать переключение на другую композицию в Chrome и Firefox

Вот код моего, простого проигрывателя:
<script type="text/javascript">
		var balanUrl = 'http://dl.dropbox.com/u/6001712/player/audio-100/Dan%20Balan%20-%20Chica%20Bomb.ogg';
		var plumbUrl = 'http://dl.dropbox.com/u/6001712/player/audio-100/Plumb%20-%20Hang%20On.ogg';
		var sergeUrl = 'http://dl.dropbox.com/u/6001712/player/audio-100/Serge%20Devant%20Emma%20Hewitt%20-%20Take%20Me%20With%20You.ogg';
		
		var myAudio = new Audio();

		var play = document.getElementById('play');
			play.addEventListener('click', function(){myAudio.play();}, false);
		
		var pause = document.getElementById('pause');
			pause.addEventListener('click', function(){myAudio.pause();}, false);
			
		var balan = document.getElementById('balan');
			balan.addEventListener('click', function(){myAudio.setAttribute('src', balanUrl);myAudio.play();}, false);
		
		var plumb = document.getElementById('plumb');
			plumb.addEventListener('click', function(){myAudio.setAttribute('src', plumbUrl);myAudio.play();}, false);
			
		var serge = document.getElementById('serge');
			serge.addEventListener('click', function(){myAudio.setAttribute('src', sergeUrl);myAudio.play();}, false);
	</script>


Парочка ссылок на мои плеера:
Простой плеер с трема композициями
Более продвынутый плеер с плейлистом на 100 композицый и случайным проигрованием

П.С. Плееры коректно работают только в браузере Opera, поэтому не нужно писать что не работает в моем классном Chrome (IE, Firefox, Safari и т.д.)
Ответить с цитированием
  #2 (permalink)  
Старый 25.07.2010, 08:52
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

Сообщение от Magneto
не работает в моем классном Chrome
работает , только не сразу, секунд 10 ждать надо.
Ответить с цитированием
  #3 (permalink)  
Старый 25.07.2010, 08:57
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

Riim - интересно, Вы пробовали переключиться на другую композицию ?
Ответить с цитированием
  #4 (permalink)  
Старый 25.07.2010, 10:16
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

Сообщение от Magneto
Вы пробовали переключиться на другую композицию ?
после нажатия "стоп" вроде переключается, только почему-то всегда одно и тоже играет .

А если вместо: myAudio.setAttribute('src', balanUrl)
попробовать так: myAudio.src = balanUrl
?
Ответить с цитированием
  #5 (permalink)  
Старый 25.07.2010, 11:12
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

Сообщение от Riim Посмотреть сообщение
после нажатия "стоп" вроде переключается, только почему-то всегда одно и тоже играет .
Кнопка "стоп" это всего лишь чуточку расширенная "пауза".

Сообщение от Riim Посмотреть сообщение
А если вместо: myAudio.setAttribute('src', balanUrl)
попробовать так: myAudio.src = balanUrl
?
Я пробовал этот вариант - результат тот же (что не удивительно), вот ссылка
Ответить с цитированием
  #6 (permalink)  
Старый 25.07.2010, 11:37
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

Что если для каждой композиции свой "new Audio" создавать, а для переключения, один выключать, а другой включать?
Ответить с цитированием
  #7 (permalink)  
Старый 25.07.2010, 12:25
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

Сообщение от Riim Посмотреть сообщение
Что если для каждой композиции свой "new Audio" создавать, а для переключения, один выключать, а другой включать?
Я думал об этом, но мне кажется что это не совсем правильно.
Вот у меня есть 100 композиций, это значит что рано или поздно будет создано (запущено) 100 объектов Audio. Весьма вероятно что будет создана внушительная нагрузка на процессор и интернет канал пользователя.

Возможно следует поступить вот так:
1. Создать объект Audio для первой композиции
2. Уничтожить объект Audio для первой композиции
3. Создать объект Audio для второй композиции
и т.д.

Если Вы подскажите мне как можно удалить объект Audio то я попытаюсь реализовать данный алгоритм.

П.С. В яваскрипте я новичек .... ))
Ответить с цитированием
  #8 (permalink)  
Старый 25.07.2010, 12:54
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

Сообщение от Magneto
мне как можно удалить объект Audio
если удалить все существующие ссылки на объект, он будет автоматически уничтожен сборщиком мусора.

// ссылка на первый объект
var audio = new Audio();

// ссылка перезаписана, теперь на первый объект ссылок нет, он будет уничтожен автоматически.
audio = new Audio();
Ответить с цитированием
  #9 (permalink)  
Старый 25.07.2010, 16:25
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

Riim
Если я Вас правильно понял ...
Я написал следующий код:
<script type="text/javascript">
		var balanUrl = 'http://dl.dropbox.com/u/6001712/player/audio-100/Dan%20Balan%20-%20Chica%20Bomb.ogg';
		var plumbUrl = 'http://dl.dropbox.com/u/6001712/player/audio-100/Plumb%20-%20Hang%20On.ogg';
		var sergeUrl = 'http://dl.dropbox.com/u/6001712/player/audio-100/Serge%20Devant%20Emma%20Hewitt%20-%20Take%20Me%20With%20You.ogg';
		
		var myAudio = new Audio();

		var play = document.getElementById('play');
			play.addEventListener('click', function(){myAudio.play();}, false);
		
		var pause = document.getElementById('pause');
			pause.addEventListener('click', function(){myAudio.pause();}, false);
		
		var stop = document.getElementById('stop');
			stop.addEventListener('click', function(){myAudio.pause();myAudio.currentTime = 0;}, false);
			
		var balan = document.getElementById('balan');
			balan.addEventListener('click', function(){myAudio = new Audio();myAudio.setAttribute('src', balanUrl);myAudio.play();}, false);
		
		var plumb = document.getElementById('plumb');
			plumb.addEventListener('click', function(){myAudio = new Audio();myAudio.setAttribute('src', plumbUrl);myAudio.play();}, false);
			
		var serge = document.getElementById('serge');
			serge.addEventListener('click', function(){myAudio = new Audio();myAudio.setAttribute('src', sergeUrl);myAudio.play();}, false);
	</script>

В этом случае браузер запускает (создает) дополнительный поток и при этом не закрывает предыдущий - в итоге несколько одновременно звучащих песен. Можно одну и ту же композицию несколько раз запустить ссылка

Поэтому в каждую функцию для запуска песен я добавил:
myAudio.pause();

получилось:
.........
		var small = document.getElementById('small');
			small.addEventListener('click', function(){myAudio.pause();myAudio = new Audio();myAudio.setAttribute('src', smallUrl);myAudio.play();}, false);
.........


Теперь слышно только одну композицию.

Но как оказалось браузер продолжает докачивать все композиции которые были запущены, даже если их прервать запуском новой песни.
Причем это делают все 3 браузера Opera, Chrome и Firefox
Замечу что Opera при обычном изменении src сразу переставала качать предыдущий файл.

Вот ссылка здесь два файла 22мб и 260кб
Ответить с цитированием
  #10 (permalink)  
Старый 25.07.2010, 18:44
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

Сообщение от Magneto
Opera при обычном изменении src сразу переставала качать предыдущий файл
а остальные все равно продолжали? Может там есть какой-нибудь метод вроде "destroy"?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
AJAX + Firefox некорректное отображение checkbox shu7 Firefox/Mozilla 2 26.06.2015 15:23
свойство innerHTML в Opera и Firefox работает не корректно? figaro Javascript под браузер 1 05.11.2009 00:57
jQuery 1.2.6 Ajax: траблы в FireFox и Opera Russell jQuery 5 28.05.2009 22:22
Скрипт не работает в Opera, Firefox Faster Events/DOM/Window 2 08.08.2008 18:56