// ==UserScript==
// @name        NPR.org HTML5 player
// @description Listen to NPR without having to install Flash, downloads, no ads.
// @namespace   https://greasyfork.org/users/4813-swyter
// @match       *://www.npr.org/player/v2/mediaPlayer.html*
// @version     1
// @grant       GM_addStyle
// @run-at      document-start
// @downloadURL none
// ==/UserScript==

// https://api.npr.org/query?id=466555217&format=json&apiKey=MDAzMzQ2MjAyMDEyMzk4MTU1MDg3ZmM3MQ010

// http://www.npr.org/player/v2/mediaPlayer.html?action=1&t=1&islist=false&id=466555217&m=468149502
// http://www.npr.org/player/v2/mediaPlayer.html?action=1&t=1&islist=false&id=468901493&m=468940337
// http://www.npr.org/player/v2/mediaPlayer.html?action=1&t=1&islist=false&id=468933562&m=469337177&live=1

if (!(id = location.search.split('id=')[1].split('&')[0]))
  throw "Invalid identifier, it's not possible to guess what item we want.";

window.xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.npr.org/query?id=' + id + '&format=json&apiKey=MDAzMzQ2MjAyMDEyMzk4MTU1MDg3ZmM3MQ010');
xhr.responseType = 'json';
xhr.onload = function(e)
{
  console.log(this.response);

  container = document.createElement("fieldset");
  selector = document.createElement("select");
  aplayer = document.createElement("audio");

  flash_sucks = document.querySelector('#homepageFlash, body');
  flash_sucks.parentElement.replaceChild(container, flash_sucks);

  legend = document.createElement("legend");
  legend.textContent = this.response.list.story[0].title.$text;

  
  container.style.backgroundImage = "url(" + this.response.list.story[0].image[0].src + ")";
  aplayer.src=this.response.list.story[0].audio[0].format.mp3[0].$text;
  aplayer.controls=true;

  selector.size=10;

  audios=this.response.list.story[0].audio;

  for(var entry in audios)
  {
    console.log("=> ", audios[entry]);

    elem = document.createElement("option");
    elem.value = audios[entry].title.$text;

    selector.add(new Option((entry|0 + 1) + ". " + audios[entry].title.$text + " - " + audios[entry].duration.$text, entry));
  }

  container.appendChild(legend);

  container.appendChild(selector);
  container.appendChild(aplayer);
  
  document.addEventListener('change', function(e)
  {
    console.log("(*)", e);
  });
};

xhr.send();

GM_addStyle("audio, select{display:block; width:100%;} fieldset {padding-left:200px;}");