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

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

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


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


Музыка в постах

Сообщений 641 страница 660 из 765

1

Актуальная на дынный момент версия - Мультитрековый плеер v2
Предыдущие версии с подробными инструкциями актуальными до сих пор:
Мультитрековый плеер в постах (плеер с плейлистом) v1.0
Мультитрековый плеер в постах (плеер с плейлистом) v1.1

+5

641

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

Ни наю.. выдает ошибку 503, даж не открывается

А что за браузер и антивирус? Может антивир блочит? Еще у одного человека с ним проблемы, но к сожалению аналогов других по выпрямлению ссылки с облака не нашел..

0

642

kolobdur74
Ну сейчас он у мну открылся, минут 40 назад пробовал - не открывался, мон сделать предположение, что сервис нестабильный и временами падает

0

643

Вот же ж
Действительно сегодня уже не работает музыка, ни из ВК ни из Яндекс-музыка.
Короче плеер мега, надо его финализировать так сказать и пользоваться этой красотой. Видимо его надо заливать себе на сайт, в файлы js?

Надо только наверное отдельную тему под него и несколько штук вариантов.
-Мне лично нужен будет вариант для вставки на свои страницы и без фото, только пластинка.
-И точно такой же вариант для форума как здесь выложен с фото исполнителей, но если есть такая возможность, то только для админов. (Тут можно по идее привести только вид кода для поста, так как сам стиль останется тот же, а код просто вставлять в разные посты меняя ссылки на песни).

0

644

kleo3333
Я же выложил вам вариант без фото, вы не заметили? И выложил вариант для отдельных страниц, тот что просили под Объявление

0

645

Заметил конечно. Но мню нужно без фото для объявления (на страницы). А вы дали для форума видимо  :blush:

Ещё такая штука, вставляя ссылку с яндекс-диска, музыка не проигрывается. Но когда нажимаешь редактировать и вставляешь ту же ссылку (она отображается уже вся и очень длинная), то песня играет.

Добавлено спустя 1 час 12 минут 21 секунду:
Ещё один неприятный (но легко исправляемый) момент. Я добавлял сейчас ссылки в плеер, это получается альбом исполнителя. Так вот вставить можно 16 треков. Далее меню для вставки уходит вниз за границу монитора и нажать кнопку Готово не представляется возможным. Приходится ещё пару треков удалить, кнопка появляется тогда.

Добавлено спустя 1 час 41 минуту 56 секунд:
И ещё просьба для обновы. Можно сделать нумерацию треков не с 1,2,3.... а с 01, 02, 03. Так как когда треков больше 9 уже не так красиво смотрится плейлист.
http://s2.uploads.ru/GMYzC.jpg

Отредактировано kleo3333 (Чт, 1 Дек 2016 14:39:04)

+1

646

Доброго времени суток,
подскажите, пожалуйста, наиболее удобный, небольшой плеер для музыки в постах, который остается активно используемым и по сей день. В каталоге есть множество вариантов, но как я успела заметить, некоторые сайты с аудио переехали/закрылись и скрипт под них больше не работает.
Нужен небольшой плеер, буквально строчка.

Воспользовались данным скриптом:

Код:
<!--audio в одном v.2.4-->
<script type="text/javascript">
var player;
$(function(){
$('td#button-code').before('<td style=\'background-image:url("http://uploads.ru/i/W/Q/P/WQPBO.gif")\' onclick="tag_play()"><img src="/i/blank.gif" title="Загрузить музыку"></td>');
$('div.post-content p').map(function () {
text = $(this).html();
if(text.indexOf("pleer.com") != -1) {
player = /\[audio\](.*?)\/tracks\/(.*?)\[\/audio\]/gi
$(this).html(text.replace(player, "<br /><embed src='http://embed.pleer.com/track?id=$2' type='application/x-shockwave-flash'  wmode='transparent' width='550' height='42'></embed>"));
}
if(text.indexOf(".mp3") != -1) {
player = /\[audio\](.*?)\[\/audio\]/gi
$(this).html(text.replace(player, "<br /><embed src='http://www.demo-music.ru/pleer/pleer4.swf' type='application/x-shockwave-flash' allowscriptaccess='always' wmode='transparent' flashvars='comment=demo-music.ru&amp;st=http://www.demo-music.ru/pleer/style_pleer.txt&amp;file=$1' width='470' height='33'>"));
}  });  });
function tag_play()
{var FoundErrors = '';
var enterURL = prompt("Введите ссылку на на музыку с pleer.com или прямую ссылку формата .mp3 ", "http://");
if (!enterURL)
{FoundErrors += " " + error_no_url;}
if (FoundErrors)
{alert("Ошибка!" + FoundErrors);
return;}
insert("[audio]" + enterURL + "[/audio]");}
</script>

Но, к сожалению, он не сработал, несмотря на то, что сделали все как нужно.
Использовали эту ссылку в посте:

Код:
[audio]http://vozmimp3.com/s1/down3/6-3v4-p7-d6bebcce13255b/Splin__Proch_Iz_Noej_Golovy.mp3[/audio]

Подскажите, пожалуйста, в чем проблема?

С уважением, Nordpolarmeer

Отредактировано Nordpolarmeer (Чт, 1 Дек 2016 14:36:38)

0

647

Возьмите этот

Код:
<!--audio в одном v.2.5.1-->
<script type="text/javascript">
var player;
$(function(){
$('td#button-code').before('<td style=\'background-image:url("http://uploads.ru/i/W/Q/P/WQPBO.gif");background-position:center center;\' onclick="tag_play()"><img src="/i/blank.gif" title="Загрузить музыку"></td>');
$('div.post-content p').map(function () {
text = $(this).html(); 
if(text.indexOf("zippyshare.com") != -1) {
player = /\[audio\]http:\/\/www(\d+)\.zippyshare\.com\/v\/(.*?)\/file\.html\[\/audio\]/gi
$(this).html(text.replace(player, "<br /><embed type='application/x-shockwave-flash' src='http://api.zippyshare.com/api/mediaplayer/mediaplayer.swf' flashvars='height=20&amp;width=400&amp;file=http://www$1.zippyshare.com/downloadMusic%3Fkey%3D$2%26&amp;volume=80&amp;autostart=false&amp;frontcolor=0x000000&amp;backcolor=0xffffff&amp;lightcolor=0x000000&amp;type=flv' quality='high' menu='false' wmode='transparent' allowscriptaccess='always' height='20' width='400' name='mp3player' border='0' style='margin-bottom: 6px;'/>"));}
if(text.indexOf("promodj.com") != -1) {
player = /\[audio\](.*?)promodj\.com\/(.*?)\/(\d+)\/(.*?)\[\/audio\]/gim
$(this).html(text.replace(player, "<br /><iframe src='http://promodj.com/embed/$3/big' width='100%' height='70' style='min-width: 450px; max-width: 900px' frameborder='0' allowfullscreen></iframe>"));
}
if(text.indexOf("prostopleer.com") != -1) {
player = /\[audio\](.*?)\/tracks\/(.*?)\[\/audio\]/gi
$(this).html(text.replace(player, "<br /><embed src='http://embed.prostopleer.com/track?id=$2' type='application/x-shockwave-flash'  wmode='transparent' width='411' height='28'></embed>"));
}
if(text.indexOf("soundcloud.com") != -1) {
player = /\[audio\]&lt;iframe width=\"100%\" height=\"166\" scrolling=\"no\" frameborder=\"no\" src=\"(.*?)soundcloud\.com(.*?)\"&gt;&lt;\/iframe&gt;\[\/audio\]/gim
$(this).html(text.replace(player, "<br /><iframe width='100%' height='166' scrolling='no' frameborder='no' src='$1soundcloud.com$2'></iframe>"));
}
if(text.indexOf(".mp3") != -1) {
player = /\[audio\](http:\/\/[^\s<"]+?.mp3)\[\/audio\]/gi
$(this).html(text.replace(player, "<br /><embed src='http://www.demo-music.ru/pleer/pleer4.swf' type='application/x-shockwave-flash' allowscriptaccess='always' wmode='transparent' flashvars='comment=demo-music.ru&amp;st=http://www.demo-music.ru/pleer/style_pleer.txt&amp;file=$1' width='470' height='33'>"));
}  });  });
function tag_play()
{var FoundErrors = '';
var enterURL = prompt("Введите ссылку на на музыку с promodj.com, zippyshare.com, prostopleer.com, soundcloud.com или прямую ссылку формата .mp3 ", "http://");
if (!enterURL)
{FoundErrors += " " + error_no_url;}
if (FoundErrors)
{alert("Ошибка!" + FoundErrors);
return;}
insert("[audio]" + enterURL + "[/audio]");}
</script>

Мне оч. нравится. Конечно надо понимать, что ссылки быстро умирают и трек уже не будет играть...

0

648

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

maxlength="100"size="30" placeholder="http://Ссылка на аудиофайл"

увеличил

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

Ещё один неприятный (но легко исправляемый) момент. Я добавлял сейчас ссылки в плеер, это получается альбом исполнителя. Так вот вставить можно 16 треков. Далее меню для вставки уходит вниз за границу монитора и нажать кнопку Готово не представляется возможным. Приходится ещё пару треков удалить, кнопка появляется тогда.

исправлено

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

И ещё просьба для обновы. Можно сделать нумерацию треков не с 1,2,3.... а с 01, 02, 03. Так как когда треков больше 9 уже не так красиво смотрится плейлист.

добавлено
все правки включены в первую версию - Музыка в постах

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

Но мню нужно без фото для объявления (на страницы).

с формой для составления плейлиста или вручную треки добавлять будете как я описывал в посте №658 ?

+3

649

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

А с облака мейл или яндекса считывать медиафайл есть варианты? Бо как все таки критично людям самим заливать и выкладывать, а вариантов куда залить почти не осталось..

кажется я нашёл способ выпрямления ссылок с Dropbox, у меня там хранится несколько в аудио файлов, протестировал их через вот этот выпрямитель
нас интересует ссылка на скачивание

http://s4.uploads.ru/vaHxt.png

0

650

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

кажется я нашёл способ выпрямления ссылок с Dropbox

Ну, значит есть выпрямители для Dropbox, мейла и яндекса.. Если бы еще был более стабильным выпрямитель https://rocld.com/ , то больше считай и ничего и не надо..

0

651

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

с формой для составления плейлиста или вручную треки добавлять будете как я описывал в посте №658 ?

вручную, там же все легко и понятно.

0

652

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

вручную, там же все легко и понятно.

kleo3333
испытайте такой вариант без фото для отдельных страниц

Код:
<style type="text/css"> 
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'), local('MaterialIcons-Regular'), url(https://fonts.gstatic.com/s/materialicons/v17/2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY.woff2) format('woff2'),
url('//forumstatic.ru/files/0017/d8/50/55034.woff') format('woff'),
url('//forumstatic.ru/files/0017/d8/50/69630.ttf') format('truetype');
}
 
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
 
#rad {
  background-color: #9f9f9f; 
  border: 2px solid #59add4; 
  background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
 -moz-border-radius: 4px;border-radius: 4px;khtml-border-radius:4px;-webkit-border-radius:4px;
 -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
 -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
margin:3px;z-index:200;overflow:hidden;width:430px;opacity: 0.9;
text-shadow: 0 1px 0 rgba(255,255,255,.4);font-weight: bold;padding: 10px;
}
 
#play {background: transparent url(//forumstatic.ru/files/0012/72/15/89476.png) no-repeat scroll 0 -22px;
border: 0 none;cursor: pointer;display: block;float: left;height: 31px;left: 13px;margin: 7px;vertical-align: super;width: 31px;}
#prev,#next {border: 0 none;cursor: pointer;height: 10px;margin-left: 9px;width: 21px; vertical-align: middle;}
#prev {background: transparent url(//forumstatic.ru/files/0012/72/15/89476.png) no-repeat scroll 0 0;}
#next {background: transparent url(//forumstatic.ru/files/0012/72/15/89476.png) no-repeat scroll 0 -11px;}
#volume{-webkit-appearance:none;border-radius:4px;box-shadow:inset 0 0 1px#333;
background-color:#999;cursor: pointer;height:4px;left: 40px;position: absolute;top: 9px;vertical-align: bottom;width:70px;}
input[type='range']::-moz-range-progress {background:url(//papercraft.su/plate/img/plate_progress.png) repeat-x scroll 0 -45px;}
input[type='range']::-moz-range-track{-moz-appearance:none;border-radius:4px;box-shadow:inset 0 0 1px#333;height:4px;}
input[type='range']::-moz-range-thumb{-webkit-appearance:none !important;
background: url(http://forumstatic.ru/files/0012/b1/41/89973.png) no-repeat scroll 0 0; 
border: 0; 
height: 19px;
width:19px;
cursor: pointer;
filter: drop-shadow(3px 3px 7px slategrey);
}
input[type='range']::-webkit-slider-thumb{-webkit-appearance:none !important;
background: url(http://forumstatic.ru/files/0012/b1/41/89973.png) no-repeat scroll 0 0;
border:0;height:19px;width:19px;cursor: pointer;-webkit-filter: drop-shadow(3px 3px 7px slategrey);
}
#seekbar { -webkit-appearance:none !important;background: #999;border-radius:4px; box-shadow:inset 0 0 1px#333;height:4px;width: 160px; vertical-align: super;}
.volume{background:url(//forumstatic.ru/files/0012/72/15/67036.png)no-repeat scroll 0-75px rgba(0,0,0,0);content:"";display:inline-block;height:25px;margin-top:0;position:relative;right:-5px;vertical-align:middle;width:25px;}
button:focus, input:focus {outline:none;}
#duration, #end {font-size: 0.8em; vertical-align: super;}
#timebox {margin: 2px;}
#track { font-size: 0.8em;overflow: hidden;padding: 5px; text-align: left;width: 420px;}
#track li{cursor: pointer;}
#track li:nth-child(odd) {background: #dadada;}
#track li:nth-child(even) {background:#cdcdcd;}
#track li.active {background:#bddeee;}
.spin {-webkit-animation: spin 1.8s infinite linear;-moz-animation: spin 1.8s infinite linear;-o-animation: spin 1.8s infinite linear;animation: spin 1.8s infinite linear;}
@-moz-keyframes spin {
0% {-moz-transform: rotate(0deg);}
100% {-moz-transform: rotate(359deg);}
}
@-webkit-keyframes spin {
0% {-webkit-transform: rotate(0deg);}
100% {-webkit-transform: rotate(359deg);}
}
@-o-keyframes spin {
0% {-o-transform: rotate(0deg);}
100% {-o-transform: rotate(359deg);}
}
@keyframes spin {
0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
100% {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
}
#action {color: #fffff0;display: inline-block;float: right;font-size: 15px;overflow: hidden;text-shadow: 0px 3px 2px rgba(150, 150, 150, 1);width: 250px;animation: marquee 15s linear infinite;}
#action:hover {animation-play-state: paused}
 
@-moz-keyframes marquee {
0% {-moz-transform: translate(0, 0);}
100% {-moz-transform: translate(-30%, 0);}
}
@-webkit-keyframes marquee {
0% {-webkit-transform: translate(0, 0);}
100% {-webkit-transform: translate(-30%, 0);}
}
@keyframes marquee {
0%{ transform: translate(0, 0); }
100% { transform: translate(-30%, 0); }
}
</style>
 
<script type="text/javascript">
$(function() {
var playlist = [
{n:"Nigger rap", u:"http://kolber.github.io/audiojs/demos/mp3/01-dead-wrong-intro.mp3"},
{n:"Radio 2", u:"http://ic3.101.ru:8000/v13_1?userid=0&setst=c90sm1ju2r53vof0v6q7cf8g75}"},
{n:"Soundgarden - My wave", u:"http://cdndl.zaycev.net/93892/1894598/soundgarden_-_my_wave.mp3", c:'http://www.guitaristka.ru/imagegallery/albums/userpics/10001/thumb_Soundgarden_003.jpg'},
{n:"Диcкач", u:"http://mp3.stream.tb-group.fm/trb.mp3?/;.mp3"},
{n:"The Black Queen - The End Where We Start (2016 live version)",u:"http://cdndl.zaycev.net/834698/3963010/The+Black+Queen_-_The+End+Where+We+Start.mp3"},
{n:"The Black Queen - Distanced (2016 live version)",u:"http://rorg.zf.fm/3/8a/the_black_queen_-_distanced_(zv.fm).mp3?download=force"},
{n:"The Black Queen - Secret Scream (2016 live version)",u:"http://cdndl.zaycev.net/834698/3963007/The+Black+Queen_-_Secret+Scream.mp3"},
{n:"The Black Queen - Maybe We Should Non-Consent",u:"http://cdndl.zaycev.net/834698/3963003/The+Black+Queen_-_Maybe+We+Should+%2F+Non-Consent.mp3"},
{n:"The Black Queen - Ice To Never (2016 live version)",u:"http://cdndl.zaycev.net/834698/3963011/The+Black+Queen_-_Ice+to+Never.mp3"},
{n:"The Black Queen – Apocalypse Morning",u:"http://rorg.zf.fm/e/4c/the_black_queen_-_apocalypse_morning_(zf.fm).mp3?download=force"},
{n:"The Black Queen — That Death Cannot Touch",u:"http://rorg.zf.fm/0/f6/the_black_queen_-_that_death_cannot_touch_(zv.fm).mp3?download=force"}
];
 
var audio=new Audio();var i=0;if(!playlist){return;};audio.src=playlist[0].u;var t='<ul>';for(var i=0,max=playlist.length;i<max;i++){var nm=playlist[i].n;var ur=playlist[i].u;i<9?t+='<li data-audio-url="'+ur+'">0'+(i+1)+'. '+nm+'</li>':t+='<li data-audio-url="'+ur+'">'+(i+1)+'. '+nm+'</li>';}t+='</ul>';$('#track').append(t);audio.volume=0.5;$('#volume').live('change keyup input',function(){audio.volume=parseFloat(this.value/10);if(this.value<=2){$('.volume').css('background-position','0 0');}else if(this.value<=4){$('.volume').css('background-position','0 -25px');}else if(this.value<=6){$('.volume').css('background-position','0 -50px');}else{$('.volume').css('background-position','0 -75px');};return false;});if(!sessionStorage['act']){sessionStorage['act']='stop';};function playAct(){sessionStorage['act']!='stop'?audio.play():audio.pause()};function listAct(){$('#track li').each(function(){var a=$(this).data('audio-url');var b=audio.src;var ti=$(this).text();if(a.indexOf(b)!=-1){$(this).addClass('active').siblings('li').removeClass('active');$('#action').text(ti);}});}function vinil(){$('#cover img').addClass('spin');}$('#play').live('click',function(){if(audio.paused){err();audio.play();sessionStorage['act']='play';listAct();vinil();$(this).css({'background-position':'0 -53px','filter':'drop-shadow(0px 1px 2px deepskyblue)','-webkit-filter':'drop-shadow(0px 1px 2px deepskyblue)'});}else{audio.pause();sessionStorage['act']='stop';$(this).css({'background-position':'0 -22px','filter':'none','-webkit-filter':'none'});$('#cover img').removeClass('spin');$('#action').text('');}});var seekbar=$('#seekbar')[0];function setupSeekbar(){seekbar.max=audio.duration;var min=parseInt(audio.duration/60,10);var sec=parseInt(audio.duration%60);var endTime=min+'.'+sec;if(seekbar.max=='Infinity'){endTime='<i class="material-icons" style="font-size: 1.4em;vertical-align: sub;">all_inclusive</i>'};$('#end').html(endTime);}
audio.ondurationchange=setupSeekbar;audio.addEventListener('durationchange',setupSeekbar);audio.addEventListener('timeupdate',function(){var s=parseInt(audio.currentTime%60);var m=parseInt((audio.currentTime/60)%60);$('#duration').html(m+'.'+s);$('#seekbar').attr('max',audio.duration);$('#seekbar').val(audio.currentTime);var p=Math.ceil((audio.currentTime/audio.duration)*100);$('#seekbar').css({'height':'4px','background-image':'-webkit-linear-gradient(left, #6ac3d4 '+p+'%, #999 '+p+'%)','background-image':'linear-gradient(to right, #6ac3d4 '+p+'%, #999 '+p+'%)'});return false;});$('#seekbar').live('change',function(){audio.currentTime=$(this).val();});$('#next').live('click',function(){i=$('#track').find('li.active').index();i=++i<playlist.length?i:0;audio.src=playlist[i].u;listAct();vinil();audio.currentTime=0;playAct();});$('#prev').live('click',function(){i=$('#track').find('li.active').index();i=--i>-1?i:playlist.length-1;audio.src=playlist[i].u;listAct();vinil();audio.currentTime=0;playAct();});$(audio).live('ended',function(){$('#next').trigger('click');});$('#track li').live('click',function(){audio.src=$(this).data('audio-url');listAct();playAct();$('#play').trigger('click');});function err(){audio.addEventListener('error',function failed(e){switch(e.target.error.code){case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:$.jGrowl('Утраченная ссылка на аудио. Или неподдерживаемый этим браузером формат');break;}},true);}
$('#plist').live('click',function(){$('#track ul').slideToggle('slow');});
});
</script>
<div id="rad">
<div id="cover">
<img height="86" width="86" align="left" src="http://forumstatic.ru/files/0012/72/15/53582.png"style="overflow: hidden; left: 0px; top: 0px; margin: 0px; max-width: none; max-height: none; border: medium none; line-height: 1; background-color: transparent; backface-visibility: hidden; width: 86px; height: 86px;filter: drop-shadow(0px 1px 3px DimGrey); -webkit-filter: drop-shadow(0px 1px 3px DimGrey); opacity: 1;">
</div>
<button id="play"title="play/stop"></button><button id="prev"title="предыдущий"></button>&nbsp;<button id="next"title="следующий"></button><span class="volume"style="padding-right: 5px;"><input id="volume" min="0" max="10" value="5" type="range"step="1" title="громкость"></span><div id="timebox"><span id="duration">0.0</span>&nbsp;<input type="range" step="any" id="seekbar" value="0" max="">&nbsp;<span id="end"></span><i id="plist"class="material-icons"style="cursor: pointer;margin-left: 5px;vertical-align: sub;"title="показать/скрыть плейлист">list</i></div><div id="action"></div>
<div id="track"></div></div>

+2

653

Код:
[quote="Romych"]<style type="text/css">
    #form-audio {background: url(//forumstatic.ru/files/0017/d8/50/90072.png) no-repeat 50% 5px;}
     
    @font-face {
      font-family: 'Material Icons';
      font-style: normal;
      font-weight: 400;
      src: local('Material Icons'), local('MaterialIcons-Regular'), url(https://fonts.gstatic.com/s/materialicons/v17/2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY.woff2) format('woff2'),
    url('//forumstatic.ru/files/0017/d8/50/55034.woff') format('woff'),
    url('//forumstatic.ru/files/0017/d8/50/69630.ttf') format('truetype');
    }
     
    .material-icons {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      display: inline-block;
      white-space: nowrap;
      word-wrap: normal;
      direction: ltr;
      -webkit-font-feature-settings: 'liga';
      -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    }
     
    div[id^="r-"] {
      background-color: #9f9f9f; 
      border: 2px solid #59add4; 
      background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
     -moz-border-radius: 4px;border-radius: 4px;khtml-border-radius:4px;-webkit-border-radius:4px;
     -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
     -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
      box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
    margin:3px;z-index:200;overflow:hidden;width:430px;opacity: 0.9;
    text-shadow: 0 1px 0 rgba(255,255,255,.4);font-weight: bold;padding: 10px;
    }
     
    #play {background: transparent url(//forumstatic.ru/files/0012/72/15/89476.png) no-repeat scroll 0 -22px;
    border: 0 none;cursor: pointer;display: block;float: left;height: 31px;left: 13px;margin: 7px;vertical-align: super;width: 31px;}
    #prev,#next {border: 0 none;cursor: pointer;height: 10px;margin-left: 9px;width: 21px; vertical-align: middle;}
    #prev {background: transparent url(//forumstatic.ru/files/0012/72/15/89476.png) no-repeat scroll 0 0;}
    #next {background: transparent url(//forumstatic.ru/files/0012/72/15/89476.png) no-repeat scroll 0 -11px;}
    #volume{-webkit-appearance:none;border-radius:4px;box-shadow:inset 0 0 1px#333;
    background-color:#999;cursor: pointer;height:4px;left: 40px;position: absolute;top: 9px;vertical-align: bottom;width:70px;}
    input[type='range']::-moz-range-progress {background:url(//papercraft.su/plate/img/plate_progress.png) repeat-x scroll 0 -45px;}
    input[type='range']::-moz-range-track{-moz-appearance:none;border-radius:4px;box-shadow:inset 0 0 1px#333;height:4px;}
    input[type='range']::-moz-range-thumb{-webkit-appearance:none !important;
    background: url(//forumstatic.ru/files/0012/b1/41/89973.png) no-repeat scroll 0 0; 
    border: 0; 
    height: 19px;
    width:19px;
    cursor: pointer;
    filter: drop-shadow(3px 3px 7px slategrey);
    }
    input[type='range']::-webkit-slider-thumb{-webkit-appearance:none !important;
    background: url(//forumstatic.ru/files/0012/b1/41/89973.png) no-repeat scroll 0 0;
    border:0;height:19px;width:19px;cursor: pointer;-webkit-filter: drop-shadow(3px 3px 7px slategrey);
    }
    #seekbar { -webkit-appearance:none !important;background: #999;border-radius:4px; box-shadow:inset 0 0 1px#333;height:4px;width: 160px; vertical-align: super;}
    .volume{background:url(//forumstatic.ru/files/0012/72/15/67036.png)no-repeat scroll 0-75px rgba(0,0,0,0);content:"";display:inline-block;height:25px;margin-top:0;position:relative;right:-5px;vertical-align:middle;width:25px;}
    button:focus, input:focus {outline:none;}
    #duration, #end {font-size: 0.8em; vertical-align: super;}
    #timebox {margin: 2px;}
    #track { font-size: 0.8em;overflow: hidden;padding: 5px; text-align: left;width: 420px;}
    #track li{cursor: pointer;}
    #track li:nth-child(odd) {background: #dadada;}
    #track li:nth-child(even) {background:#cdcdcd;}
    #track li.active {background:#bddeee;}
    .spin {-webkit-animation: spin 1.8s infinite linear;-moz-animation: spin 1.8s infinite linear;-o-animation: spin 1.8s infinite linear;animation: spin 1.8s infinite linear;}
    @-moz-keyframes spin {
    0% {-moz-transform: rotate(0deg);}
    100% {-moz-transform: rotate(359deg);}
    }
    @-webkit-keyframes spin {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(359deg);}
    }
    @-o-keyframes spin {
    0% {-o-transform: rotate(0deg);}
    100% {-o-transform: rotate(359deg);}
    }
    @keyframes spin {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    100% {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
    }
    #action {color: #fffff0;display: inline-block;float: right;font-size: 15px;overflow: hidden;text-shadow: 0px 3px 2px rgba(150, 150, 150, 1);width: 250px;animation: marquee 15s linear infinite;}
    #action:hover {animation-play-state: paused}
     
    @-moz-keyframes marquee {
    0% {-moz-transform: translate(0, 0);}
    100% {-moz-transform: translate(-30%, 0);}
    }
    @-webkit-keyframes marquee {
    0% {-webkit-transform: translate(0, 0);}
    100% {-webkit-transform: translate(-30%, 0);}
    }
    @keyframes marquee {
    0%{ transform: translate(0, 0); }
    100% { transform: translate(-30%, 0); }
    }
     
    .adinput {display: table;}
    .adinput::before {color: #888;content: attr(data-i) ". ";}
    span[data-i="1"] #deltrack {display: none !important;}
    #addtrack {
    color: #009900;
    background: linear-gradient(#009900, #006600); 
    background: -webkit-linear-gradient(#009900, #006600);
    background: -o-linear-gradient(#009900, #006600);
    background: -ms-linear-gradient(#009900, #006600);
    }
    #deltrack {
    color: #cc0000;
    background: linear-gradient(#cc0000, #990000); 
    background: -webkit-linear-gradient(#cc0000, #990000);
    background: -o-linear-gradient(#cc0000, #990000);
    background: -ms-linear-gradient(#cc0000, #990000);
    }
    #addtrack,#deltrack {
    cursor: pointer;
    font-size: 20px;
    vertical-align: sub;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
     
    input[name="n"]::-moz-placeholder {background:#f0fdf0;font-size: 11px;}
    input[name="n"]::-webkit-input-placeholder {background:#f0fdf0;font-size: 11px;}
    input[name="n"]:-ms-input-placeholder {background:#f0fdf0;font-size: 11px;}
    input[name="u"]::-moz-placeholder {background:#ffffe0;font-size: 11px;}
    input[name="u"]::-webkit-input-placeholder {background:#ffffe0;font-size: 11px;}
    input[name="u"]:-ms-input-placeholder {background:#ffffe0;font-size: 11px;}
    input[name="c"]::-moz-placeholder {font-size: 11px;}
    input[name="c"]::-webkit-input-placeholder {font-size: 11px;}
    input[name="c"]:-ms-input-placeholder {font-size: 11px;}
     
    form#tr-list {max-height:600px;position: fixed;right: 30%;bottom: 15%;margin: 0 auto;overflow-y:auto;z-index: 9;}
    </style>
     
    <script type="text/javascript">
    $('#form-buttons tr').append('<td id="form-audio" title="Музыка"><img src="/i/blank.gif"></td>');var fr='<form id="tr-list" class="container" autocomplete="off" style="display:none;min-width:40%;"><h1>Плейлист для плеера <i style="cursor: pointer;float: right;" class="material-icons" onclick="changeVisibility(\'tr-list\')" title="Закрыть">clear</i></h1><div class="a-box" style="text-align: center;"><p class="adsubmit"style="text-align: left;"><span data-i="1" class="adinput"><input type="text"maxlength="100" size="30" placeholder="Название трека (исполнитель)" name="n" required> <input type="url" pattern="https?://.+" required maxlength="100"size="30" placeholder="http://Ссылка на аудиофайл" name="u">&nbsp;<input type="url" pattern="https?://.+" maxlength="100" size="38" placeholder="http://Ссылка на изображение (неважно)" name="c" title="необязательно"><i class="material-icons" id="addtrack" title="добавить ещё один трек">add_circle_outline</i>&nbsp;<i class="material-icons" id="deltrack" title="удалить трек" onclick="var d=this.parentNode; d.parentNode.removeChild(d);">highlight_off</i></span></p><br><input type="submit" id="fin" value=" Готово " class="button" onclick="gotovo()"></div></form>';$('form#post').before(fr);$('#form-audio').on('click',function(){changeVisibility('tr-list');});var j=2;$('#addtrack').live('click',function(e){e.preventDefault();$(this).parents('.adinput').clone().attr('data-i',j++).appendTo('.adsubmit');});window.gotovo=function(){$('#tr-list').submit(function(e){e.preventDefault();});var ss,ee=[];$('[name="u"]').each(function(i){ee[i]=$(this).val();if(ee[i].length<=13){return;}else{ss=$('#tr-list').serializeArray();}});s=JSON.stringify(ss);var emp=$('[name="u"]');s=s.replace(/\{"name":"n","value":"(.*?)"},{"name":"u","value":"(.*?)"},{"name":"c","value":"(.*?)"\}/g,'{n:"$1",u:"$2",c:"$3"}');s=s.replace(/\}\,/g,"},\n");insert('[player]'+s+'[/player]');changeVisibility('tr-list');}
    $('div[id$="-content"] p:contains("[/player]")').map(function(){var ud=$(this).parent('.post-content').attr('id').split('-')[0];var txt=$(this).html();txt=txt.replace(/\[player\](\[\{n\:\".*?\"\,u\:\".*?\"\}\])\[\/player\]/gm,'<div id="r-'+ud+'"><div id="cover"><img height="86"width="86"align="left"src="http://forumstatic.ru/files/0012/72/15/53582.png"style="overflow: hidden; left: 0px; top: 0px; margin: 0px; max-width: none; max-height: none; border: medium none; line-height: 1; background-color: transparent; backface-visibility: hidden; width: 86px; height: 86px;filter: drop-shadow(0px 1px 3px DimGrey); -webkit-filter: drop-shadow(0px 1px 3px DimGrey); opacity: 1;"></div><button id="play"title="play/stop"></button><button id="prev"title="предыдущий"></button>&nbsp;<button id="next"title="следующий"></button><span class="volume"style="padding-right: 5px;"><input id="volume" min="0" max="10" value="5" type="range"step="1" title="громкость"></span><div id="timebox"><span id="duration">0.0</span>&nbsp;<input type="range" step="any" id="seekbar" value="0" max="">&nbsp;<span id="end"></span><i id="plist"class="material-icons"style="cursor: pointer;margin-left: 5px;vertical-align: sub;"title="показать/скрыть плейлист">list</i></div><div id="action"></div><div id="track"></div><audio id="audio-'+ud+'"></audio><div id="pl" style="display:none">$1</div></div>');$(this).html(txt);var pt=$('#r-'+ud+' #pl').text();var audio=new Audio();var i=0;var playlist=(new Function('return '+pt+';')());if(!playlist){return;};audio.src=playlist[0].u;var t='<ul>';
    for(var i=0,max=playlist.length;i<max;i++){var nm=playlist[i].n;var ur=playlist[i].u;var cov=playlist[i].c;i<9?t+='<li data-audio-url="'+ur+'" data-cover-src="'+cov+'">0'+(i+1)+'. <img src="'+cov+'" height="16"width="16"> '+nm+'</li>':t+='<li data-audio-url="'+ur+'" data-cover-src="'+cov+'">'+(i+1)+'. <img src="'+cov+'" height="16"width="16"> '+nm+'</li>';}t+='</ul>';$('#r-'+ud+' #track').append(t);audio.volume=0.5;$('#r-'+ud+' #volume').live('change keyup input',function(){audio.volume=parseFloat(this.value/10);if(this.value<=2){$('#r-'+ud+' .volume').css('background-position','0 0');}
    else if(this.value<=4){$('#r-'+ud+' .volume').css('background-position','0 -25px');}else if(this.value<=6){$('#r-'+ud+' .volume').css('background-position','0 -50px');}
    else{$('#r-'+ud+' .volume').css('background-position','0 -75px');};return false;});if(!sessionStorage['act']){sessionStorage['act']='stop';};function playAct(){sessionStorage['act']!='stop'?audio.play():audio.pause()};function listAct(){$('#r-'+ud+' #track li').each(function(){var a=$(this).data('audio-url');var b=audio.src;var ti=$(this).text();if(a.indexOf(b)!=-1){$(this).addClass('active').siblings('li').removeClass('active');$('#r-'+ud+' #action').text(ti);}});}
    function vinil(){var c=$('#r-'+ud+' li.active').data('cover-src');if(c=='undefined'||c==''){$('#r-'+ud+' #cover img').attr('src','http://forumstatic.ru/files/0012/72/15/53582.png').addClass('spin');}else{$('#r-'+ud+' #cover img').attr('src',c).removeClass('spin');}}
    $('#r-'+ud+' #play').live('click',function(){if(audio.paused){err();audio.play();sessionStorage['act']='play';listAct();vinil();$(this).css({'background-position':'0 -53px','filter':'drop-shadow(0px 1px 2px deepskyblue)','-webkit-filter':'drop-shadow(0px 1px 2px deepskyblue)'});}else{audio.pause();sessionStorage['act']='stop';$(this).css({'background-position':'0 -22px','filter':'none','-webkit-filter':'none'});$('#r-'+ud+' #cover img').removeClass('spin');$('#r-'+ud+' #action').text('');}});var seekbar=$('#r-'+ud+' #seekbar')[0];function setupSeekbar(){seekbar.max=audio.duration;var min=parseInt(audio.duration/60,10);var sec=parseInt(audio.duration%60);var endTime=min+'.'+sec;if(seekbar.max=='Infinity'){endTime='<i class="material-icons" style="font-size: 1.4em;vertical-align: sub;">all_inclusive</i>'};$('#r-'+ud+' #end').html(endTime);}
    audio.ondurationchange=setupSeekbar;audio.addEventListener('durationchange',setupSeekbar);audio.addEventListener('timeupdate',function(){var s=parseInt(audio.currentTime%60);var m=parseInt((audio.currentTime/60)%60);$('#r-'+ud+' #duration').html(m+'.'+s);$('#r-'+ud+' #seekbar').attr('max',audio.duration);$('#r-'+ud+' #seekbar').val(audio.currentTime);var p=Math.ceil((audio.currentTime/audio.duration)*100);$('#r-'+ud+' #seekbar').css({'height':'4px','background-image':'-webkit-linear-gradient(left, #6ac3d4 '+p+'%, #999 '+p+'%)','background-image':'linear-gradient(to right, #6ac3d4 '+p+'%, #999 '+p+'%)'});return false;});$('#r-'+ud+' #seekbar').live('change',function(){audio.currentTime=$(this).val();});$('#r-'+ud+' #next').live('click',function(){i=$('#r-'+ud+' #track').find('li.active').index();i=++i<playlist.length?i:0;audio.src=playlist[i].u;listAct();vinil();audio.currentTime=0;playAct();});$('#r-'+ud+' #prev').live('click',function(){i=$('#r-'+ud+' #track').find('li.active').index();i=--i>-1?i:playlist.length-1;audio.src=playlist[i].u;listAct();vinil();audio.currentTime=0;playAct();});$(audio).live('ended',function(){$('#r-'+ud+' #next').trigger('click');});$('#r-'+ud+' #track li').live('click',function(){audio.src=$(this).data('audio-url');listAct();playAct();$('#r-'+ud+' #play').trigger('click');});function err(){audio.addEventListener('error',function failed(e){switch(e.target.error.code){case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:$.jGrowl('Утраченная ссылка на аудио. Или неподдерживаемый этим браузером формат');break;}},true);}
    $('#r-'+ud+' #plist').live('click',function(){$('#r-'+ud+' #track ul').slideToggle('slow');});});
    </script>[/quote]

Вот он долгожданный аудиоплеер!!! Выражаю огромную БЛАГОДАРНОСТЬ автору!!! проделана колоссальная работа, которая заслуживает только одного: БРАВО!!! Ну. и соответственно самый жирный ПЛЮС!!!

Отредактировано Вдумчивый (Пн, 5 Дек 2016 08:32:37)

+2

654

Здравствуйте ребята . Да давно ждали что то подобное . Но у меня ничего не получается помогите.
у меня на раб. столе лежит песня в мп3 как её вставить в этот плеер ???? я не понимаю

0

655

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

у меня на раб. столе лежит песня в мп3

Начать нужно с того, что песня не должа лежать на рабочем столе а быть доступна по онлайн ссылке.
Если это ваша песня (записанный вами трек), рекомендую хостинг realmusic.ru, он сделан для музыкантов, ссылки вставляются оттуда ок, статичные и никогда не меняются.
Если это коммерческий продукт (пиратская копия), то ищите ее аналог на тех же zaycev.net и копируйте ссылку оттуда (в инструкции к скрипту все это есть).

+1

656

t3945
Здравствуйте . Я попробую Вам пояснить . Я знаю прекрасно где и что должно лежать .
Вы не внимательно прочитали то.что я написал. Я обратился за помощью .а не за нравоучениями .
Об этом плеере давно шёл разговор и я писал и просил его сделать . Щас я хотел узнать можно ли вставить туда ссылку вот эту например залитую на яндекс диск . https://yadi.sk/d/04G_vdsu32FrKU
и как оформить этот плеер .

0

657

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

я писал и просил его сделать

И не только Вы. Первая заявка была от меня.

0

658

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

t3945
Здравствуйте . Я попробую Вам пояснить . Я знаю прекрасно где и что должно лежать .
Вы не внимательно прочитали то.что я написал. Я обратился за помощью .а не за нравоучениями .
Об этом плеере давно шёл разговор и я писал и просил его сделать . Щас я хотел узнать можно ли вставить туда ссылку вот эту например залитую на яндекс диск . https://yadi.sk/d/04G_vdsu32FrKU
и как оформить этот плеер .

Выкать мне не надо.
Как было написано, так и пояснил, дыши ровнее.

0

659

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

Щас я хотел узнать можно ли вставить туда ссылку вот эту например залитую на яндекс диск . https://yadi.sk/d/04G_vdsu32FrKU

Выпрямить ссылку с яндекса и мейла можно через этот сокращатель ссылок: https://rocld.com/ - с его ссылками данный плеер работает нормально, но сам сокращатель работает не стабильно, на данный момент он опять лежит. Других вариантов с яндекса и мейла пока не найдено.

0

660

Я проверял ссылки с яндекс-диска и яндекс-музыка, soundcloud
Песни играют 1 день или чуть дольше...  Так что их не стоит даже обсуждать

0


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