-
+{% load i18n paniktags %}
<div id="player-container" class="normal cf">
- <div id="player" class="wrapper cf">
+ <div id="player" class="cf">
<div id="audioPlayer" class="cf">
- <div class="padded">
- <ul class="metas custom right">
- <li><a class="button resymbol icon-download inBlock" title="Get the stream on your player!" href="http://streaming.domainepublic.net:8000/radiopanik.ogg.m3u"></a></li>
- <!--<li><button class="icon-eye-open " title="Show/Hidden HTML5 audio player" onclick="$('#DirectStreamPanik').toggleClass('hidden');$(this).toggleClass('icon-eye-open icon-eye-close');return false;"></button></li>-->
- <li><button title="Need some help?" onclick="$('#PlayerHelp').toggle();" class="icon-question-sign"></button></li>
- </ul>
- <button id="DirectStreamPanikControler" class="label">
- <span class="control icon-volume-up resymbol"></span>
- <span class=""> en direct</span>
- </button>
- <div id="CurrentlyPlaying" class="ellipsis">
- <button class="icon-refresh" id="RefreshWhatsOnAir"></button>
+ <div id="Live" class="padded cf">
+ <div class="metas custom">
+ <a id="ogg-m3u" class="button resymbol icon-download inBlock" title="{% trans 'Get the stream on your player!' %}" href="https://streaming.domainepublic.net/radiopanik.ogg.m3u"></a>
+ <a id="aac-m3u" style="display: none;" class="button icon-download inBlock" title="{% trans 'Get the stream on your player!' %}" href="https://streaming.domainepublic.net/radiopanik.aac.m3u"></a>
+ </div>
+ <div class="button" id="DirectStreamPanikControler">
+ <div id="streamSymbol" class="icon-volume-up resymbol"></div>
+ <div class="label">{% trans 'live' %}</div>
+ </div>
+ <div id="CurrentlyPlaying">
<span id="WhatsOnAir"></span>
</div>
+ <div id="CurrentlyChatting" style="display: none;">
+ <a href=""><div id="chatSymbol" class="icon-comments control"></div>
+ <div class="label">CHAT</div></a>
+ <span>La radio est ouverte</span>
+ </div>
<audio
id="DirectStreamPanik"
preload="none"
class="hidden"
tabindex="0"
- src="http://streaming.domainepublic.net:8000/radiopanik.ogg?&unique={{ uuid }}"
- controls="controls"
- ></audio>
- </div>
- </div>
- <div id="Playlist" class="sub cf">
- <div id="localList" class="padded">
- <div class="label"><span class="icon-headphones" ></span> Playlist</div>
-
+ controls="controls">
+ <source src="https://streaming.domainepublic.net/radiopanik.ogg?{{ unique }}" type="audio/ogg"/>
+ <source src="https://streaming.domainepublic.net/radiopanik.aac?{{ unique }}" type="audio/aac"/>
+ </audio>
</div>
</div>
- <div id="PlayerHelp" class="sub padded hidden help">
- <p>Le contenu des émissions n’étant pas limité à un niveau local, le stream permet de les écouter aux quatre coins du monde. Mais aussi et surtout, à Bruxelles, dans les zones où la radio n’est pas captée facilement.</p>
- <p>Le serveur de streaming a été mis en place par l’asbl A.C.T.I.C et est hébergé par <a href="http://www.domainepublic.net/" class='spip_out' rel='external'>Domainepublic.net</a> . Il fonctionne exclusivement grâce à des logiciels libres.</p>
- <p>Si votre logiciel ne parvient pas à lire le stream de Radio Panik, nous vous conseillons de télécharger <a href="http://framakey.org/Portables/PortableVLC" class='spip_out' rel='external'>VLC Media Player</a>, un lecteur multimedia impressionnant de par ses nombreuses fonctionnalités (supporte de nombreux formats de stream, d’audio, de vidéo, peut servir de relais streamcast), qui fonctionne aussi bien sous Linux que sous Windows ou Mac OS.</p>
- <p><dt>URL du stream</dt><dd class="ellipsis"><a href="http://streaming.domainepublic.net:8000/radiopanik.ogg">http://streaming.domainepublic.net:8000/radiopanik.ogg</a></dd></p>
- </div>
- <script type="text/javascript">
- $(function() {
- var timer = null,
- interval = 5000;
- $('#WhatsOnAir').on('load',function(){
- var WhatsOnAir = $(this);
- $.getJSON('/onair.json', function(onair) {
- WhatsOnAir.fadeOut();
- if(onair.data.episode || onair.data.emission){
- var result = '';
- result = result + ($.type(onair.data.emission) == 'object'?'<strong>'+onair.data.emission.title+'</strong> ':'');
- result = result + ($.type(onair.data.episode) == 'object'?'<span>'+onair.data.episode.title+'</span>':'');
- //var container = $('<a>',{class:"intercepted",href:onair.data.emission.url,html:result});
- var container = $('<span>').html(result);
- WhatsOnAir.append(container);
- } else if (onair.data.nonstop) {
- result = onair.data.nonstop.title;
- WhatsOnAir.html('<strong>' + result + '</strong>');
- }
- else{WhatsOnAir.html('<strong>Unknown (Probably Non-Stop)</strong>');}
- WhatsOnAir.fadeIn();
- });
- }).trigger('load');
- $('#RefreshWhatsOnAir').on('activate',function(e){
- $(this).addClass('spinning');
- $('#WhatsOnAir').trigger('load');
- timer = setInterval( "$('#WhatsOnAir').trigger('load');", interval);
- }).on('deactivate',function(e){
- $(this).removeClass('spinning');
- clearInterval(timer);
- }).on('click',function(e){
- $(this).toggleClass('spinning');
- if($(this).is('.spinning')){
- $(this).trigger('activate');
- }else{$(this).trigger('deactivate');}
- return false;
- });
- $("#DirectStreamPanikControler").on('click',function(e) {
- e.preventDefault();
- var stream = $('#DirectStreamPanik').get(0);
- if (stream.paused == false){
- stream.pause();
- }else{
- stream.play();
- }
- });
- $('#DirectStreamPanik').on('play',function(){
- $('audio:not(#DirectStreamPanik)').each(function(){this.pause();});
- $('#DirectStreamPanikControler').find('.control').removeClass('icon-volume-up').addClass('icon-pause');
- $('#RefreshWhatsOnAir').trigger('activate');
- }).on('pause',function(){
- //$('audio:not(#DirectStreamPanik)').each(function(){this.pause();});
- $('#DirectStreamPanikControler').find('.control').addClass('icon-volume-up').removeClass('icon-pause');
- $('#RefreshWhatsOnAir').trigger('deactivate');
- });
- });
- </script>
+ <div id="Playlist" class="cf">
+ <div id="localList" class="padded" style="display: none;">
+ <div id="playlistLabel">
+ <button title="{% trans "Empty playlist" %}" id="emptyList" class="icon-trash button" style="float:right;"><span class="sr-only">{% trans "Empty playlist" %}</span></button>
+ </div>
+ </div>
+ </div>
</div>
+
</div>