Вывод названия трека Icecast со скриптом автообновления

Внимание! Автообновление названия трека, сделанное описанным способом, создаёт немалую нагрузку на сервер.

Этот небольшой материал, как и другие в разделе, посвящённом онлайн радиовещанию, был написан после того, как я несколько дней потратил на поиск того, что мне было нужно. А искал я скрипт, позволяющий не только выводить название текущего трека из моего радиопотока, транслируемого через Icecast2, но и автоматически менять эту информацию без перезагрузки всей страницы раз в несколько секунд. Найти решение всё-таки удалось. Делюсь этим вариантом, чтобы Вы не искали его долго и нудно.

Для вывода текущей музыкальной композиции (в формате «Исполнитель - Название песни») на просторах сети я нашёл такой код:

<?php
$fl = file_get_contents('http://188.120.243.2:8000/status.xsl?mount=/enigma');
function antara($string, $start, $end){
$string = " ".$string;
$ini = strpos($string,$start);
if ($ini == 0) return "";
$ini += strlen($start);
$len = strpos($string,$end,$ini) - $ini;
return substr($string,$ini,$len);
}
$song = antara($fl, "<td>Current Song:</td>\n<td class=\"streamdata\">", "</td>");
echo "",$song;
?>

Разумеется, в данном примере нужно поменять IP адрес, порт и маунт (точку монтирования) на свои.

Этот код отлично выводит название трека, а если его обернуть в div, то ещё и оформить можно как хочется. Но информация выводится этим скриптом лишь в момент перезагрузки и затем не обновляется. То есть, запустил радио с треком «Enigma - Gravity Of Love» и так оно и будет отображаться до тех пор, пока вручную не обновишь страницу.

Поразмыслив, я пришёл к выводу, что мне нужен некий скрипт, заключающий весь предыдущий код для вывода названия трека внутрь себя и регулярно обновляющий это самое содержимое. Вот тут я нашёл три варианта таких скриптов. Один из них почему-то начал регулярно перезагружать всю страницу, второй отказался работать, лишь третий показал нужный мне результат - стал обновлять название трека через указанный промежуток времени, при этом не перезагружая всю страницу. Вот код этого третьего работающего на аяксе скрипта:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
setInterval("jQuery('#timeA').load('# dl#timeB');",60000);
});
</script>
<dl id="timeA"><dl id="timeB">Тут то, что надо обновлять</dl></dl>

Если честно, в языке JS я совсем не разбираюсь. Поэтому даю всё в таком виде, как я нашёл это в интернете. Цель этой статьи не дать авторский вариант решения вопроса, а описать найденный мною чужой, но работающий как мне надо вариант. Возможно, что-то можно (и правильнее будет) написать по-другому, но говорю честно, что не разбираюсь в этом. И буду благодарен более компетентным в этих вопросах людям за комментарии.

Эти два фрагмента кода объединяем следующим образом:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- ↑ Только если JQuery min ещё не подключён-->

<script type="text/javascript">
jQuery(document).ready(function(){
setInterval("jQuery('#timeA').load('# dl#timeB');",20000); //интервал обновления в миллисекундах =20секунд
});
</script>
<dl id="timeA"><dl id="timeB">
<?php
$fl = file_get_contents('http://188.120.243.2:8000/status.xsl?mount=/enigma');
function antara($string, $start, $end){
$string = " ".$string;
$ini = strpos($string,$start);
if ($ini == 0) return "";
$ini += strlen($start);
$len = strpos($string,$end,$ini) - $ini;
return substr($string,$ini,$len);
}
$song = antara($fl, "<td>Current Song:</td>\n<td class=\"streamdata\">", "</td>");
echo "",$song;
?>
</dl></dl>

В найденном мною скрипте для обновления данных используется библиотека jquery-1.5.min аж 2011 года. Актуальная на сегодня версия JQuery - 1.11.1. Вот ссылка на неё: http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js. Если JQuery ещё не подключена на сайте, то, думаю, лучше использовать эту свежую версию. Если же вы хотите всегда использовать только самую актуальную на данный момент библиотеку (как в готовом примере кода у меня), то тогда надо использовать такой код: http://code.jquery.com/jquery-latest.min.js.

На всякий случай добавлю, что для оформления названия выводимого трека (вида, размера, цвета шрифта) можно использовать #timeA в файле стилей сайта. Также можно прописать стили непосредственно в блоке div: например, <div id="timeA" style="color:green;font-size:2rem;">

Что касается интервала обновления, то есть мнение, что не стоит злоупотреблять слишком короткими промежутками в нём. Кое-кто даже уверяет, что не имеет смысл обновлять название трека чаще, чем раз в 1,5-2 минуты. Конечно, частое обращение к серверу с попыткой получить от него имя звучащего трека - это дополнительная нагрузка на него. Но насчёт 90-120 секунд, думаю, что это перебор. Промежуток в 20 секунд (20000 миллисекунд) вполне можно использовать. Не согласны? Поделитесь своими мыслями по этому поводу в комментариях.

Добавлю, что данный код у меня отлично работает с моими собственными радиостанциями на Icecast 2.3.2. Для других версий этой серверной программы код надо менять.

 

Поделиться страницей в соцсетях:

Поддержать проект материально