Commit 491895fa authored by Simon Daron's avatar Simon Daron
Browse files

Make player more compact and ready for playlio

parent f2958412
......@@ -231,25 +231,33 @@ body{
/*#Home #player{ float: left; } */
#player .metas, #player img{border-color:#fff;}
#player .metas{border-left:1px solid white;}
#player .metas{padding-left:0.5em;border-width:0 0 0 2px;border-style:solid;}
#player{background-color:#ff6633; border-color:#fff;color:white !important;}
#player *{border-color:#fff; color:white !important;background-color:#ff6633;}
#player *{border-color:#fff; color:white !important;background-color:transparent;}
#player{
border-top:2px solid black;
border-bottom:2px solid black;
}
#player .wrapper{
#player #CurrentlyPlaying{
position:absolute;
margin-top:-1.5em;
margin-left:6em;
font-size:0.8em;
}
#player #player-container{
padding:3%;
max-width:350px;
margin:auto;
}
#player .metas{padding:0.5em;border-width:1px 0 0 0 ;border-style:solid;}
#player #audioPlayer{
padding-bottom:0.5em;
margin-bottom:0.5em;
}
#player #player-container .sub{
border-top:2px solid white;
}
#player .item{border-width:1px 0;border-style:solid;}
#player img {border-width:2px;border-style:solid;}
#player #WhatsOnAir{
padding:0.5em;
font-size:0.8em;
}
#player .playlist .item {
min-height:60px;
margin:20px 0;
......
<div id="player" class="simple cf">
<div class="wrapper">
<ul class="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 data-audio-id="DirectStreamPanik" >
<span class="control icon-volume-up resymbol huge"></span>
<span class="label">&nbsp;en direct</span>
</button>
<div id="CurrentlyPlaying">
<div class="inBlock">
<span id="BufferStateTODO"></span>
<button class="icon-refresh" id="RefreshWhatsOnAir"></button>
<div id="player-container">
<div id="audioPlayer">
<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 data-audio-id="DirectStreamPanik" >
<span class="control icon-volume-up resymbol huge"></span>
<span class="label">&nbsp;en direct</span>
</button>
<div id="CurrentlyPlaying">
<div class="inBlock">
<span id="BufferStateTODO"></span>
<button class="icon-refresh" id="RefreshWhatsOnAir"></button>
</div>
<div class="inBlock" id="WhatsOnAir"></div>
</div>
<div class="inBlock" id="WhatsOnAir"></div>
<audio
id="DirectStreamPanik"
preload="none"
class="hidden"
tabindex="0"
src="http://streaming.domainepublic.net:8000/radiopanik.ogg?&unique={{ uuid }}"
controls="controls"
></audio>
</div>
<audio
id="DirectStreamPanik"
preload="none"
class="hidden"
tabindex="0"
src="http://streaming.domainepublic.net:8000/radiopanik.ogg?&unique={{ uuid }}"
controls="controls"
></audio>
<article id="PlayerHelp" class="hidden help">
<hr class="marged"/>
<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>
</article>
</div>
<div id="localList" class="hidden sub">
<h5 class="center">Playlist</h5>
<div id="Playlist">
</div>
</div>
<style>#RefreshWhatsOnAir {display:block !important;float:right;position:relative;}</style>
<script type="text/javascript">
$(function() {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment