]> git.0d.be Git - panikweb.git/blobdiff - panikweb_templates/templates/includes/player.html
misc: run manage.py with python3
[panikweb.git] / panikweb_templates / templates / includes / player.html
index baf0f9f714c4fc380d67b36b6cdef1d1f9cc1dae..56bfc6d0e5a1499f3ead10f6e14f344a174144af 100644 (file)
@@ -1,99 +1,42 @@
-
+{% 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="">&nbsp;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>&nbsp;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&#8217;é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&#8217;est pas captée facilement.</p>
-                       <p>Le serveur de streaming a été mis en place par l&#8217;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&#8217;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>&nbsp;':'');
-                                                       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>