!DOCTYPE HTML> <html> <head> <!-- Dołącz bibliotekę jQuery --> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <!-- Dołącz bibliotekę Soundmanager2 i jej zależności --> <script type="text/javascript" src="https://player.nadaje.com/static/sm2/2.97/soundmanager2-jsmin.js"></script> <script type="text/javascript" src="https://player.nadaje.com/static/sm2/2.97/../../js/bootstrap-slider.js"></script> <!-- Dołącz arkusze stylów --> <link rel="stylesheet" type="text/css" href="https://player.nadaje.com/static/sm2/2.97/skins/minimalist-light.css"> <link rel="stylesheet" type="text/css" href="https://player.nadaje.com/static/sm2/2.97/../../css/slider.css"> </head> <body> <script type="text/javascript"> $(document).ready(function(){ soundManager.setup({ flashVersion: 9, preferFlash: false, url: 'https://player.nadaje.com/static/sm2/2.97/soundmanager2.swf' }); $('.sm2-player').each(function() { var that = $(this); that.options = { showVolume: true, showPlaylist: false, showMetadata: true, showVolume: true, inactiveStreamMessage: 'Strunień jest niedostępny' }; soundManager.onready(function() { that.player = that; that.volume = 50; that.sm2Link = that.player.find('.sm2_link'); that.volumeControl = that.player.find('#id_volume'); that.sound = soundManager.createSound({ id: that.player.attr('id'), url: that.sm2Link.attr('href') }); that.sm2Link.bind('click', function(e) { e.preventDefault(); if (that.sound.playState === 0) { that.sound.play(); that.sm2Link.parent('span').toggleClass('play').toggleClass('playing'); } else { that.sound.stop(); that.sm2Link.parent('span').toggleClass('playing').toggleClass('play'); } }); if(that.options.showVolume) { that.volumeControl.slider({ min: 0, max: 100, step: 10, value: that.volume }).on('slideStop', function(e) { that.volumeControl.val(e.value); that.volume = e.value; that.sound.setVolume(that.volume); }); } if (!that.options.showPlaylist) { $(that.element).find('a.playlist').parent('li').hide(); } if (that.options.showMetadata) { var pncUrl = that.player.attr('data-pnc-url'); var _ = function(s) { return s; }; var metadataLabel = _('Now playing: '); var metadataContainer = that.player.find('span.metadata'); function getStatus() { $.ajax({ url: pncUrl, dataType: 'json', type: 'get', traditional: true }).done(function(result) { var _ = function(s) { return s; }; if(result !== null && result.length > 0) { result.forEach(function(streamStatus) { if(streamStatus.stream_url.split('/')[3] == that.sound.url.split('/')[3]) { metadataContainer.html(metadataLabel + streamStatus.metadata); } }); } else { metadataContainer.html('').append($('<span class="no-items">' + that.options.inactiveStreamMessage + '</span>')); } }).fail(function(xhr, textStatus, error) { metadataContainer.html('').append($('<span class="no-items">' + that.options.inactiveStreamMessage + '</span>')); }); } getStatus(); setInterval(function() { getStatus(); }, 20000); } }); }) }); </script> <div id="sound_id" class="sm2-player" data-pnc-url=""> <ul class="sm2-controls"> <li class="controls"><span class="play"><a class="sm2_link" href="http://stream4.nadaje.com:9000/test;stream"> </a></span></li> <li class="controls"><span class="volume-control"><input type="text" value="50" name="volume" id="id_volume"> </span></li> <li class="info metadata" title=""><span class="metadata"></span></li> </ul> </div> </body> </html>