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 href="skin/blue.monday/css/jplayer.blue.monday.min.css" rel="stylesheet" type="text/css" />
  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: "Radio Proxy",
  43                 mp3: "http://radio.wpitchoune.net:8080/mp3"
  44         };
  45
  46         $("#jquery_jplayer_1").jPlayer({
  47                 ready: function (event) {
  48                         ready = true;
  49                         $(this).jPlayer("setMedia", stream);
  50                 },
  51                 pause: function() {
  52                         $(this).jPlayer("clearMedia");
  53                 },
  54                 error: function(event) {
  55                         if(ready && event.jPlayer.error.type === $.jPlayer.error.URL_NOT_SET) {
  56                                 $(this).jPlayer("setMedia", stream).jPlayer("play");
  57                         }
  58                 },
  59                 swfPath: "js",
  60                 supplied: "mp3",
  61                 preload: "none",
  62                 wmode: "window",
  63                 useStateClassSkin: true,
  64                 autoBlur: false,
  65                 keyEnabled: true
  66         });
  67
  68 });
  69         </script>
  70
  71         <title>Proxy Radio</title>
  72 </head>
  73
  74 <body>
  75         <nav>
  76                 <ul>
  77                         <li class="selected">Proxy Radio</li>
  78                         <li><a href="last_songs.html">Played songs</a></li>
  79                         <li><a href="songs.html">All songs</a></li>
  80                 </ul>
  81         </nav>
  82
  83         <section>
  84
  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-controls">
  90                                 <button class="jp-play" role="button" tabindex="0">play</button>
  91                                 <button class="jp-stop" role="button" tabindex="0">stop</button>
  92                         </div>
  93                         <div class="jp-progress">
  94                                 <div class="jp-seek-bar">
  95                                         <div class="jp-play-bar"></div>
  96                                 </div>
  97                         </div>
  98                         <div class="jp-volume-controls">
  99                                 <button class="jp-mute" role="button" tabindex="0">mute</button>
 100                                 <button class="jp-volume-max" role="button" tabindex="0">max volume</button>
 101                                 <div class="jp-volume-bar">
 102                                         <div class="jp-volume-bar-value"></div>
 103                                 </div>
 104                         </div>
 105                         <div class="jp-time-holder">
 106                                 <div class="jp-current-time" role="timer" aria-label="time">&nbsp;</div>
 107                                 <div class="jp-duration" role="timer" aria-label="duration">&nbsp;</div>
 108                                 <div class="jp-toggles">
 109                                         <button class="jp-repeat" role="button" tabindex="0">repeat</button>
 110                                 </div>
 111                         </div>
 112                 </div>
 113                 <div class="jp-details">
 114                         <div id="track-title" class="jp-title" aria-label="title">&nbsp;</div>
 115                 </div>
 116                 <div class="jp-no-solution">
 117                         <span>Update Required</span>
 118                         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>.
 119                 </div>
 120         </div>
 121 </div>
 122
 123                 <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
 124                         <a href="songs.html">songs</a> with credits and licensing information. No changes have been made to the songs.
 125                 </p>
 126         </section>
 127
 128         <footer>
 129                 <ul>
 130                         <li><a href="mailto:proxyradio@wpitchoune.net">Contact</a></li>
 131                 </ul>
 132         </footer>
 133 </body>
 134
 135 </html>