MediaWiki:MusicPlayer.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.

//Emulator iframe with one of my videos as the default src
//Meant to be used with [Template:MusicPlayer] for stories
document.getElementsByTagName('body')[0].onload = function() {
    if (document.getElementById('musicPlayerAllow') !== null) {
        var rail = document.getElementById('WikiaRail');
        var node = document.createElement("div");
        var textnode = document.createTextNode("Loading iframe...");
        node.appendChild(textnode);
        node.id = "EmulatorFrame";
        node.classList.add("EmulatorFrame");
        node.classList.add("rail-module");
       /* node.style.border = 0;
        node.style.frameborder = 0;
        node.style.height = 120;
        node.style.scrolling = 'no';
        node.src = 'https://www.youtube.com/embed/BHfqz68xEY8?version=3&enablejsapi=1';
        node.style.width = 160;
        node.style.position = "relative";
        node.style.display = "none";*/
        rail.insertBefore(node, document.getElementById('WikiaAdInContentPlaceHolder'));
        
        
        // 2. This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    }
};

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;
      var playerReady = false;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('EmulatorFrame', {
          height: '120',
          width: '160',
          videoId: 'BHfqz68xEY8',
          events: {
            'onReady': onPlayerReady
          }
        });
        //player.style = "none";
      }
      

function onPlayerReady(event) {
        playerReady = true;
      }
      
var mpa = document.getElementById('musicPlayerAllow');

mpa.addEventListener('click', allowMusic);

function allowMusic() {
    console.log("Allowing music...");
    if(playerReady) {
        player.playVideo();
        console.log("Music allowed");
    }
}