Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Новые возможности форумов » Радио на форум (HTML5)


Радио на форум (HTML5)

Сообщений 41 страница 56 из 56

41

Скажите пожалуйста, умеет ли тег <audio>  в HTML5 проигрывать стрим?
Ну, то есть, если я ему в source всуну айпи радиостанции с портом (ну как пример:

Код:
http://more.fm:8000/KS128

) оно будет играть или откажется?
В инете смотрел примеры, там все усложнено. Самый простой способ был - подключали перед тегом кучу библиотек. Я попробовал, нифига не заработало. 
А мне хотелось просто одну конкретную радиостанцию в стандартном обрамлении браузера запустить.
Или это умеет <video>?

ПыСы флеш не предлагать, он уже давно покойник.

Спасибо.

0

42

Plushbear, если хотите радио в сообщениях, то
в мультитрековый плеер можете без проблем вставить и даже несколько радиостанций - Пример с вашей ссылкой на стрим

0

43

Romych,
большое спасибо за ответ!

Задумка у меня следующая: на форуме в "объявлении" у меня стоит радиоприемник (если интересно то это здесь: Ссылка)
По сути это обычный триггер - нажал, радио включилось, нажал второй раз - выключилось. Никаких других сервисных вещей нет, они не вписываются в дизайн да и в направленность форума.
Обычно я "заряжаю" в него пару-тройку мп3-ишек, но сейчас дорос до идеи сделать "радио" настоящим радио.
Во-от.

Ваш плеер смотрится великолепно, и функционал у него богатый, но мне нужно как раз наоборот - всего лишь  включить и выключить.

Был бы очень вам признателен, если бы вы выделили код ядра вашего плеера, то есть то, что непосредственно проигрывает стрим.
Потому что, кто лучше разбирается в коде, как не его творец? :)

А в объявлениях радио - мысль интересная, но у нас как-то больше принято с ютуба или куба клипы постить.

Спасибо.

0

44

Plushbear
посмотрел я ваш код, думаю что у и в данном у вас исполнении он воспроизведёт стрим.
Вы пробовали уже в ссылки песен вставить ссылку на стрим радио?

Код:
сюда имеется ввиду

song = new Array(1);
song[0]='http://forumstatic.ru/files/0018/1c/c9/42812.ogg',
song[1]='http://forumstatic.ru/files/0018/1c/c9/42229.ogg',
song[2]='http://forumstatic.ru/files/0018/1c/c9/25171.ogg',
song[3]='http://forumstatic.ru/files/0018/1c/c9/99324.ogg',
song[4]='http://forumstatic.ru/files/0018/1c/c9/77904.ogg'

вот стрим вашей тематики, смело вставляйте в код вашего плеера

Код:
http://icecast.goshen.edu:8000/wgcs-128vbr

Добавлено спустя 19 минут 7 секунд:
или вы созрели дизайн своего винтажного плеера поменять?

+1

45

Romych написал(а):

или вы созрели дизайн своего винтажного плеера поменять?

не, я консерватор.  :rofl:

Romych написал(а):

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

Еще не пробовал, я пытался что-то сымитировать в сообщениях.
Сейчас попробую! Спасибо.

0

46

Romych
Все отлично заработало, спасибо большое!

+1

47

Обновление для HTML Радио-плеера 08.2020
Исправлены ошибки подключения аудио-потока, улучшено качество звука.

Код:
<div id="radiobells_container">#radiobells_script_hash</div><link href="http://forumstatic.ru/files/0010/96/f7/39705.css" type="text/css" rel="stylesheet" /><script type="text/javascript">var rad_backcolor="#0d0d0d"; var rad_logo = "white"; var rad_autoplay = true; var rad_width = "responsive"; var rad_width_px = 330;var rad_stations =[['http://more.fm:8000/KS128','Киевстар'],['http://zaycevfm.cdnvideo.ru/ZaycevFM_electronic_256','Зайцев FM'],['http://176.101.223.52:8000/klassnoe','Классное радио'],['http://icecast.newradio.cdnvideo.ru/newradio3','Новое радио'],['http://radiomv.hostingradio.ru/radiomv256.mp3 ','Милицейская волна'],['http://emgregion.hostingradio.ru:8064/moscow.europaplus.mp3','Европа плюс'],['http://air.radiorecord.ru:805/rr_320','Рекорд'],['http://radio.dline-media.com/r13radio','Регион'],['http://online.pilotfm.ru:8000/pilot_dance_mp3','Пилот'],['http://213.159.214.57:8000/matryoshka ','Матрешка'],['http://online.radio-megapolis.ru:8000/megapolis_mp3 ','Мегаполис'],['http://media.luga.ru:8002/live ','Микс '],['http://retroserver.streamr.ru:8043/retro256.mp3 ','Ретро'],
['http://nashe1.hostingradio.ru/nashe-128.mp3','Наше']];</script><script type="text/javascript" src="http://forumstatic.ru/files/0010/96/f7/98952.js" charset="UTF-8"></script>

Обзор Радио-плеера

Отредактировано 103 (Вс, 9 Авг 2020 12:08:38)

+1

48

Romych написал(а):
Gifts написал(а):

сможете WG FM  подключить к радио плееру , хочу на свой форум радио поставить а WG FM  не могу подключить (((?

Gifts
держите:

Код:
<style type="text/css">
input[type=range]#zvyk {-webkit-appearance: none;margin: 4px 0;}
input[type=range]#zvyk:focus {outline: none;}
input[type=range]#zvyk::-webkit-slider-runnable-track {height: 4px;cursor: pointer;box-shadow: 0.2px 0.2px 0.9px #0e0078, 0px 0px 0.2px #110092;background: rgba(47, 122, 205, 0.57);border-radius: 0.4px;border: 1px solid #006323;}
input[type=range]#zvyk::-webkit-slider-thumb {box-shadow: 2px 2px 9.7px rgba(232, 0, 237, 0.57), 0px 0px 2px rgba(250, 8, 255, 0.57);border: 2px solid #5c99c8;height: 12px;width: 12px;border-radius: 28px;background: #748a9d;cursor: pointer;-webkit-appearance: none;margin-top: -5px;}
input[type=range]#zvyk:focus::-webkit-slider-runnable-track {background: rgba(178, 206, 237, 0.57);}
input[type=range]#zvyk::-moz-range-track {height: 4px;cursor: pointer;box-shadow: 0.2px 0.2px 0.9px #0e0078, 0px 0px 0.2px #110092;background: rgba(47, 122, 205, 0.57);border-radius: 0.4px;border: 1px solid #006323;}

Установила на форуме Ваш скрипт. Подскажите, как вставить ссылку на стрим радио. Например, на Волнорезе есть радио сайта. 
input[type=range]#zvyk::-moz-range-thumb {box-shadow: 2px 2px 9.7px rgba(232, 0, 237, 0.57), 0px 0px 2px rgba(250, 8, 255, 0.57);border: 2px solid #5c99c8;height: 12px;width: 12px;border-radius: 28px;background: #748a9d;cursor: pointer;}
input[type=range]#zvyk::-ms-track {height: 4px;cursor: pointer;background: transparent;border-color: transparent;color: transparent;}
input[type=range]#zvyk::-ms-fill-lower {background: rgba(17, 43, 72, 0.57);border: 1px solid #006323;border-radius: 0.8px;box-shadow: 0.2px 0.2px 0.9px #0e0078, 0px 0px 0.2px #110092;}
input[type=range]#zvyk::-ms-fill-upper {background: rgba(47, 122, 205, 0.57);border: 1px solid #006323;border-radius: 0.8px;box-shadow: 0.2px 0.2px 0.9px #0e0078, 0px 0px 0.2px #110092;}
input[type=range]#zvyk::-ms-thumb {box-shadow: 2px 2px 9.7px rgba(232, 0, 237, 0.57), 0px 0px 2px rgba(250, 8, 255, 0.57);border: 2px solid #5c99c8;height: 12px;width: 12px;border-radius: 28px;background: #748a9d;cursor: pointer;height: 4px;}
input[type=range]#zvyk:focus::-ms-fill-lower {background: rgba(47, 122, 205, 0.57);}
input[type=range]#zvyk:focus::-ms-fill-upper {background: rgba(178, 206, 237, 0.57);}
#radio:hover{opacity: 1;}
#zvyk,#tracks,#stop {position:relative;}
#tracks{display:none;text-align: left;}
#tracks li{cursor: pointer;}
#tracks li.active {background: #bddeee;}
#zvyk{margin-top: 4px;}
#pred, #sled {border: 0 none;cursor: pointer;height: 10px;position:relative;width: 21px;vertical-align: middle;
}
#stop {background: transparent url("http://forumstatic.ru/files/0017/d8/50/88284.png") no-repeat scroll 0 -22px;
border: 0 none;cursor: pointer;display: inline-block;height: 31px;left: 13px;margin: 3px;width: 31px;
}
#pred {background: transparent url("http://forumstatic.ru/files/0017/d8/50/88284.png") no-repeat scroll 0 0;margin-right: -5px;}
#sled {background: transparent url("http://forumstatic.ru/files/0017/d8/50/88284.png") no-repeat scroll 0 -11px;margin-left: 14px;}
#trk-list {background: transparent url("http://forumstatic.ru/files/0017/d8/50/88284.png") no-repeat scroll 0 -85px;
border: 0 none;cursor: pointer;position:relative;height: 22px;width: 33px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
var radio=new Audio(),i=0,radiolist=[
{n:'WGFM-Главный канал',u:'http://wargaming.fm/1?source=player',c:'http://samara11x11.ucoz.ru/TRANS-radio/WarGaming_FM.png'},
{n:'WGFM-второй канал',u:'http://wargaming.fm/2?source=player',c:'https://ru-wotp.wgcdn.co/dcont/fb/image/wgfm-logo.png'},
{n:'WGFM-Trance',u:'http://wargaming.fm/3?source=player',c:'http://samara11x11.ucoz.ru/TRANS-radio/WarGaming_FM.png'},
{n:'WGFM-Rock',u:'http://wargaming.fm/4?source=player',c:'https://ru-wotp.wgcdn.co/dcont/fb/image/wgfm-logo.png'}
];
var x='<ul>';for(i=0;i<radiolist.length;i++){var nz=radiolist[i].n,url=radiolist[i].u,cv=radiolist[i].c;x+='<li data-audio-url="'+url+'" data-cover-src="'+cv+'">'+(i+1)+'. '+nz+'</li>';}
x+='</ul>';$('#tracks').append(x);if(!localStorage['vl']){localStorage['vl']=0.5;}
radio.volume=localStorage['vl'];$('#zvyk').attr('value',localStorage['vl']*10);$('#zvyk').on('change keyup input',function(){localStorage['vl']=parseFloat(this.value/10)
radio.volume=localStorage['vl'];});function active(){$('#tracks li').each(function(i){var a=$(this).data('audio-url'),b=radio.src;if(a.indexOf(b)!=-1){$(this).addClass('active').siblings('li').removeClass('active');!localStorage['cN']?localStorage['at']=radiolist[0].u:localStorage['at']=radiolist[i].u}});}
radio.src=localStorage['at'];if(!localStorage['cN']){localStorage['cN']='stop';};function radioActive(){localStorage['cN']!='stop'?radio.play():radio.pause()};radioActive();function cover(){var c=$('#radio li.active').data('cover-src');if(c==='undefined'||c==''){$('#layer').css({'background':'url(http://forumstatic.ru/files/0012/72/15/53582.png)','background-size':'cover','-webkit-filter':'blur(1px)','filter':'blur(1px)'});}else{$('#layer').css({'background':'url('+c+')','background-size':'cover','-webkit-filter':'blur(1px)','filter':'blur(1px)'});}}
cover();$('#stop').on('click',function(){if(radio.paused){radio.play();localStorage['cN']='play';active();cover();$(this).css({'background-position':'0 -53px'});}else{radio.pause();localStorage['cN']='stop';$(this).css({'background-position':'0 -22px'});$('#zvyk').attr('value',localStorage['vl']*10);$('.b1, .b2, .b3').css('height','0');}});$('#sled').on('click',function(){i=$('#tracks').find('li.active').index();i=++i<radiolist.length?i:0;radio.src=radiolist[i].u;radioActive();active();cover();});$('#pred').on('click',function(){i=$('#tracks').find('li.active').index();i=--i>-1?i:radiolist.length-1;radio.src=radiolist[i].u;radioActive();active();cover();});$('#tracks li').on('click',function(){radio.src=$(this).data('audio-url');radioActive();active();$('#stop').trigger('click');});$('#trk-list').live('click',function(){$('#tracks').toggle('slow');});});
</script>
 
<div id="radio" style="position:fixed;left:22px;bottom:70px;z-index:20000;overflow-x:visible;width:171px;opacity: 0.9;text-align: center;">
<div id="layer" style="position:absolute;height:100px;top:-2px;opacity: 0.6;width:170px;"></div>
<button id="pred" title="Предыдущая станция"> </button><button id="stop" title="Вкл/Выкл"></button>
<button id="sled" title="Следующая станция"></button><br>
<input id="zvyk" min="0" max="10" value="" type="range" step="1" title="Громкость"><br>
<button id="trk-list" title="Показать список станций"></button>
<div id="tracks"></div>
</div>

0

49

ВладаВ написал(а):

Установила на форуме Ваш скрипт. Подскажите, как вставить ссылку на стрим радио.

Дайте хотя бы ссылку на само радио.

0

50

Alex_63 написал(а):
ВладаВ написал(а):

Установила на форуме Ваш скрипт. Подскажите, как вставить ссылку на стрим радио.

Дайте хотя бы ссылку на само радио.

Я так понимаю что речь идёт о этом радио   http://vip.maminforum.com/pages/radio_html5_na_forum   из поста выше. И наверное вопрос был как туда вставить дорожки других популярных радио.


Теперь вопрос от меня:
Возможно ли сделать чтобы проигрывание не прерывалось при (переходе) перезагрузки страницы?

0

51

Alex_63 написал(а):

Дайте хотя бы ссылку на само радио

Радио сайта МузМикс я создала только вчера. Могу дать ссылку на поток радио моих знакомых.  https://stream.volnorez.com/live-app/773023   Пусть пока оно поиграет (одно). А когда заработает наше, заменю. Просто, чтобы была ссылка только на одно наше радио.

Отредактировано ВладаВ (Сб, 5 Сен 2020 17:39:11)

0

52

МАЧОнаДАЧЕ написал(а):

Я так понимаю что речь идёт о этом радио

Да. Именно об этом. Но нужно, чтобы играло только одно наше радио - радио сайта МузМикс. Но пока наше радио наполню-заполню, то пусть (как тест) играет радио знакомых. Потом просто заменить на наше и всё.

0

53

МАЧОнаДАЧЕ написал(а):

Возможно ли сделать чтобы проигрывание не прерывалось при (переходе) перезагрузки страницы?

Наверное, и мне это знать нужно :)))

0

54

МАЧОнаДАЧЕ написал(а):

Возможно ли сделать чтобы проигрывание не прерывалось при (переходе) перезагрузки страницы?

а сейчас что, прерывается разве? Скрипт во втором посте этой темы сделан с запоминанием состояния play pause? и рабочее демо это демонстрирует

0

55

Romych
Первая станция была глухая :yep: поэтому автоплея небыло.
Поправил. Работает. :cool:

0

56

103 написал(а):

Обновление для HTML Радио-плеера 08.2020
Исправлены ошибки подключения аудио-потока, улучшено качество звука.

Код:
<div id="radiobells_container">#radiobells_script_hash</div><link href="http://forumstatic.ru/files/0010/96/f7/39705.css" type="text/css" rel="stylesheet" /><script type="text/javascript">var rad_backcolor="#0d0d0d"; var rad_logo = "white"; var rad_autoplay = true; var rad_width = "responsive"; var rad_width_px = 330;var rad_stations =[['http://more.fm:8000/KS128','Киевстар'],['http://zaycevfm.cdnvideo.ru/ZaycevFM_electronic_256','Зайцев FM'],['http://176.101.223.52:8000/klassnoe','Классное радио'],['http://icecast.newradio.cdnvideo.ru/newradio3','Новое радио'],['http://radiomv.hostingradio.ru/radiomv256.mp3 ','Милицейская волна'],['http://emgregion.hostingradio.ru:8064/moscow.europaplus.mp3','Европа плюс'],['http://air.radiorecord.ru:805/rr_320','Рекорд'],['http://radio.dline-media.com/r13radio','Регион'],['http://online.pilotfm.ru:8000/pilot_dance_mp3','Пилот'],['http://213.159.214.57:8000/matryoshka ','Матрешка'],['http://online.radio-megapolis.ru:8000/megapolis_mp3 ','Мегаполис'],['http://media.luga.ru:8002/live ','Микс '],['http://retroserver.streamr.ru:8043/retro256.mp3 ','Ретро'],
['http://nashe1.hostingradio.ru/nashe-128.mp3','Наше']];</script><script type="text/javascript" src="http://forumstatic.ru/files/0010/96/f7/98952.js" charset="UTF-8"></script>

Обзор Радио-плеера


Я упорядочила )

Код:
<div id="radiobells_container">#radiobells_script_hash</div><link href="http://forumstatic.ru/files/0010/96/f7/39705.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">var rad_backcolor="#0d0d0d"; var rad_logo = "white"; var rad_autoplay = true; var rad_width = "responsive"; var rad_width_px = 330;var rad_stations =[
['http://more.fm:8000/KS128','Киевстар'],
['http://zaycevfm.cdnvideo.ru/ZaycevFM_electronic_256','Зайцев FM'],
['http://176.101.223.52:8000/klassnoe','Классное радио'],
['http://icecast.newradio.cdnvideo.ru/newradio3','Новое радио'],
['http://radiomv.hostingradio.ru/radiomv256.mp3 ','Милицейская волна'],
['http://emgregion.hostingradio.ru:8064/moscow.europaplus.mp3','Европа плюс'],
['http://air.radiorecord.ru:805/rr_320','Рекорд'],
['http://radio.dlinemedia.com/r13radio','Регион'],
['http://online.pilotfm.ru:8000/pilot_dance_mp3','Пилот'],
['http://213.159.214.57:8000/matryoshka ','Матрешка'],
['http://online.radio-megapolis.ru:8000/megapolis_mp3 ','Мегаполис'],
['http://media.luga.ru:8002/live ','Микс '],
['http://retroserver.streamr.ru:8043/retro256.mp3 ','Ретро'],
['http://nashe1.hostingradio.ru/nashe-128.mp3','Наше'],
];</script><script type="text/javascript" src="http://forumstatic.ru/files/0010/96/f7/98952.js" charset="UTF-8"></script>

Минус в этом плеере то что, при переходе на любую страницу форума, начинает играть Радио "Киевстар" а не тот которую слушала. И ещё минус - в том что, извините за такое выражение слово "Недержание", то есть при переходе на другие страницы форума, музыка автоматический начинает играть. Постоянно получается музыка в ушах )))) Хотелось бы между делом чтоб не играла музыка, захотела плей, захотела стоп.
Извините, пришлось удалить плеер.

Отредактировано Светлана Ильисовна (Пн, 26 Окт 2020 18:39:41)

+1


Вы здесь » Единый форум поддержки » Новые возможности форумов » Радио на форум (HTML5)