☰

HTML5 player for BBC News

Use a natively uncluttered hardware-accelerated player, no ads or annoyances. Also, easily downloadable videos.

当前为 2015-07-16 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        HTML5 player for BBC News
  3. // @match       http://www.bbc.com/*
  4. // @version     2015.07.16
  5. // @description Use a natively uncluttered hardware-accelerated player, no ads or annoyances. Also, easily downloadable videos.
  6. // @grant       GM_xmlhttpRequest
  7. // @namespace   https://greasyfork.org/users/4813
  8. // ==/UserScript==
  9.  
  10.  
  11. for (var i in (src = document.querySelectorAll('script:not([src])')))
  12. {
  13.     if (typeof src[i] !== 'object' || src[i].textContent.indexOf('externalId') === -1)
  14.     {
  15.         continue;
  16.     }
  17.  
  18.     var vpid = src[i].textContent.match(/externalId":"([^"]+)"/)[1];
  19.  
  20.     console.log(i, vpid);
  21. }
  22.  
  23. if (!vpid)
  24.   throw 'BBC HTML5: nothing to do :)';
  25.  
  26.   GM_xmlhttpRequest(
  27.   {
  28.     method: 'GET',
  29.     url: 'http://open.live.bbc.co.uk/mediaselector/5/select/version/2.0/vpid/' + vpid + '/format/json/mediaset/journalism-http-tablet/',
  30.  
  31.     onreadystatechange: function(e)
  32.     {
  33.       if (e.readyState !== XMLHttpRequest.DONE)
  34.       {
  35.         return;
  36.       }
  37.  
  38.       this.responseJSON = JSON.parse(e.responseText);
  39.  
  40.       /* just for taking a look, please don't mind me! :-) */
  41.       console.log(e, this.responseJSON);
  42.  
  43.       if (!this.responseJSON.media)
  44.       {
  45.         console.warn('BBC HTML5: the listing did not come with any video at all!', this.responseJSON); return;
  46.       }
  47.  
  48.       /* add a download button per result video */
  49.       for(var vid in this.responseJSON.media)
  50.       {
  51.         //console.log("=>", vid, this.responseJSON.media, this.responseJSON.media[vid], this.responseJSON.media[vid].connection[0].href);
  52.  
  53.         console.log("=>", vid, this.responseJSON.media[vid].width,
  54.                                this.responseJSON.media[vid].height,
  55.                                this.responseJSON.media[vid],
  56.                                this.responseJSON.media[vid].connection[0].href);
  57.  
  58.         dwnbutton = document.createElement("a");
  59.         dwnbutton.setAttribute('style', 'padding-left: 35px; padding-right:12px');
  60.  
  61.         dwnbutton.textContent = this.responseJSON.media[vid].width + 'x' +
  62.                                 this.responseJSON.media[vid].height;
  63.         dwnbutton.className   = 'icon video';
  64.         dwnbutton.href        = this.responseJSON.media[vid].connection[0].href;
  65.         dwnbutton.download    = document.querySelector('#media-asset-page-text > h1').textContent + '.' + dwnbutton.textContent + '.mp4';
  66.  
  67.         /* replace it on the page */
  68.         dwnbuttonHolderElement = document.querySelector('.player-wrapper');
  69.         dwnbuttonHolderElement.appendChild(dwnbutton);
  70.       }
  71.  
  72.       var hq = 2 // 0;
  73.  
  74.       /* build our own html5 player with our own stuff */
  75.       vplayer = document.createElement('video');
  76.  
  77.       vplayer.src      = this.responseJSON.media[hq].connection[0].href;
  78.       vplayer.poster   = document.querySelector('#media-asset-placeholder').src;
  79.  
  80.       vplayer.controls = 'true';
  81.       vplayer.autoplay = 'false';
  82.       vplayer.preload  = 'none';
  83.  
  84.       vplayer.volume   = '0.4';
  85.  
  86.       vplayer.style.width = '100%';
  87.  
  88.       /* replace it on the page */
  89.       videoHolderElement = document.querySelector('#media-asset-page-video');
  90.       videoHolderElement.parentElement.replaceChild(vplayer, videoHolderElement);
  91.     },
  92.  
  93.     onerror: function(e)
  94.     {
  95.       console.warn('BBC HTML5: Houston, we have an unidentified problem!', e);
  96.     }
  97.   });