Настройка кода плеера и вывода информации
Общая информация и полезные параметры
Важно! Все примеры полностью рабочие, но в них не указаны ссылки на потоки и отсутствует загрузка скрипта player.js - код которого доступен в разделе Установка. Плеер от Myradio24 это не просто плеер, а уникальный конструктор позволяющий с легкостью создать любой свой современный плеер. Наш плеер поддерживает все современные браузеры и форматы вещания: mp3, aac+, ogg
Пример возможностей доступен тут: https://myradio24.com/?to=test
Полезные параметры. Обратите внимание, некоторые параметры должны передаваться в виде массива или в формате JSON:
Указание параметров плеера прямо в HTML теге
С недавнего времени настройки плеера можно задавать прямо в HTML элементе, при этом если в теге указан класс class="my_player", то плеер будет автоматически создан.
1. Пример создания сразу 2х плееров my_player и my_player2 на одной странице:
2. Настройка и запуск своего индивидуального custom плеера с идентификатором my_player_custom.
HTML плеера берется из скрытого div элемента my_player_custom_html, он с приставкой _html. Массив картинок задаётся в data параметре imagesurl.
Просто укажите свой массив картинок в imagesurl и свой HTML код плеера используя данный пример:
3. Перетягиваемый ползунок громкости для custom плеера, просто замените отделенный блок кода с my_volumediv в пункте 2 на этот код:
Бонус, чтобы сделать ползунок громкости вертикальным, просто поменяйте числовые значения размеров в 2х местах:
width:64px; height:7px; на width:7px; height:64px;
width:64px; height:5px; на width:5px; height:64px;
Примеры настройки и запуска плееров методом JavaScript
Возможность запуска плеера через JS с указанием параметров работает аналогично. При этом параметры переданные через JS всегда главнее тех что указаны прямо в HTML тегах. Рассмотрим пример запуска сразу нескольких плееров, обратите внимание на разные id плееров указанные в DIV элементах и в скриптах:
Примеры динамической смены потоков и управление Play / Stop / Volume
Функция $.fn.set_player() позволяет сменить поток вещания, регулировать громкость, а также включать и отключать плеер. Параметры и примеры ссылок с JS кодом для переключения потоков:
playerid - идентификатор плеера
volume - громкость от 0 до 100
autoplay - включение и выключение плеера (1 - включить, 0 - выключить, без autoplay - ничего не делать)
streamurl - новый URL адрес потока
Cкрываем различную информацию в плеере
На текущий момент скрывать различную информацию в плеерах можно добавив на страницу стиль, возьмите нужное:
Примеры настройки визуализации
Вы можете установить несколько визуализаций, однако учтите что одна визуализация создаёт нагрузку на процессор до 10%.
Используйте параметры для настройки визуализации:
width - ширина
height - высота
data-size - кол-во полосок визуализации
data-revert - разворот визуализации (0 - по умолчанию на право, 1 - на лево)
data-color - цвет визуализации (rgb - цветной, red - красный, green - зеленый, blue - синий)
Примеры визуализации:
Настройка вывода картинки вещающего DJ'я (аватарка)
В последней версии кода плеера с информацией появилась простая возможность задать картинки для вещающих диджеев. В информационный HTML блок достаточно добавить %htmlavatar% и потом задать картинки диджеев используя скрипт, который можно разместить перед кодом плеера: