html/index.html

   1 <!DOCTYPE html>
   2 <html>
   3
   4 <head>
   5         <meta charset="UTF-8" />
   6
   7         <link rel="stylesheet" type="text/css" media="all" href="style.css" />
   8
   9         <script type="text/javascript"
  10                 language="javascript"
  11                 src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js">
  12         </script>
  13
  14         <link type="text/css" href="skin/blue.monday/css/jplayer.blue.monday.min.css" rel="stylesheet" />
  15         <script type="text/javascript" src="js/jquery.jplayer.min.js"></script>
  16
  17         <script>
  18
  19         function radioTitle() {
  20                 console.log("radioTitle");
  21                 var url = 'http://radio.wpitchoune.net:8080/current.xsl';
  22                 var mountpoint = '/mp3';
  23
  24                 $.ajax({  type: 'GET',
  25                 url: url,
  26                 async: true,
  27                 jsonpCallback: 'parseMusic',
  28                 contentType: "application/json",
  29                 dataType: 'jsonp',
  30                 success: function (json) {
  31                         $('#track-title').text(json[mountpoint].title);
  32                 }, error: function (e) {    console.log(e.message);
  33                 }
  34                 });
  35         }
  36
  37 $(document).ready(function(){
  38         setTimeout(function () {radioTitle();}, 2000);
  39         setInterval(function () {radioTitle();}, 10000);
  40
  41           var stream = {
  42                 title: "Proxy Radio",
  43                 mp3: "http://radio.wpitchoune.net:8080/mp3"
  44         },
  45         ready = false;
  46
  47         $("#jquery_jplayer_1").jPlayer({
  48                 ready: function (event) {
  49                         ready = true;
  50                         $(this).jPlayer("setMedia", stream);
  51                 },
  52                 pause: function() {
  53                         $(this).jPlayer("clearMedia");
  54                 },
  55                 error: function(event) {
  56                         if(ready && event.jPlayer.error.type === $.jPlayer.error.URL_NOT_SET) {
  57                                 // Setup the media stream again and play it.
  58                                 $(this).jPlayer("setMedia", stream).jPlayer("play");
  59                         }
  60                 },
  61                 swfPath: "js",
  62                 supplied: "mp3",
  63                 preload: "none",
  64                 wmode: "window",
  65                 useStateClassSkin: true,
  66                 autoBlur: false,
  67                 keyEnabled: true
  68         });
  69 });
  70         </script>
  71
  72         <title>Proxy Radio</title>
  73 </head>
  74
  75 <body>
  76         <nav>
  77                 <ul>
  78                         <li class="selected">Proxy Radio</li>
  79                         <li><a href="last_songs.html">Played songs</a></li>
  80                         <li><a href="songs.html">All songs</a></li>
  81                 </ul>
  82         </nav>
  83
  84         <section>
  85 <div id="jquery_jplayer_1" class="jp-jplayer"></div>
  86 <div id="jp_container_1" class="jp-audio" role="application" aria-label="media player">
  87         <div class="jp-type-single">
  88                 <div class="jp-gui jp-interface">
  89                         <div class="jp-volume-controls">
  90                                 <button class="jp-mute" role="button" tabindex="0">mute</button>
  91                                 <button class="jp-volume-max" role="button" tabindex="0">max volume</button>
  92                                 <div class="jp-volume-bar">
  93                                         <div class="jp-volume-bar-value"></div>
  94                                 </div>
  95                         </div>
  96                         <div class="jp-controls-holder">
  97                                 <div class="jp-controls">
  98                                         <button class="jp-play" role="button" tabindex="0">play</button>
  99                                         <button class="jp-stop" role="button" tabindex="0">stop</button>
 100                                 </div>
 101                                 <div class="jp-progress">
 102                                         <div class="jp-seek-bar">
 103                                                 <div class="jp-play-bar"></div>
 104                                         </div>
 105                                 </div>
 106                                 <div class="jp-current-time" role="timer" aria-label="time">&nbsp;</div>
 107                         </div>
 108                 </div>
 109                 <div class="jp-details">
 110                         <div class="jp-title" aria-label="title">&nbsp;</div>
 111                 </div>
 112                 <div class="jp-no-solution">
 113                         <span>Update Required</span>
 114                         To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
 115                 </div>
 116         </div>
 117 </div>
 118
 119                 <p>Current track: <span id="track-title">LIVE</span>.</p>
 120
 121                 <p>If the above player does not work you can play directly the
 122                         <a href="http://radio.wpitchoune.net:8080/mp3">stream</a>.</p>
 123
 124                 <p>The name of the current song can be read on
 125                         <a href="http://radio.wpitchoune.net:8080">the icecast
 126                                    page</a>.</p>
 127
 128                 <p>See the list of <a href="last_songs.html">recently played songs</a>.</p>
 129
 130                 <p>All songs have been downloaded from the <a href="http://freemusicarchive.org/">Free Music Archive</a> and as far as I know can be shared on this stream. Feel free to send me an email to <a href="mailto:proxyradio@wpitchoune.net">proxyradio@wpitchoune.net</a>                        if you have a concern about a song. Read the list of
 131                         <a href="songs.html">songs</a> with credits and licensing information. No changes have been made to the songs.
 132                 </p>
 133         </section>
 134
 135         <footer>
 136                 <p><address><a href="mailto:proxyradio@wpitchoune.net">Proxy Radio</a></address</p>
 137         </footer>
 138 </body>
 139
 140 </html>