title: Controls and loop not working on Youtube video (YouTube API)
body: <p>I'm using YouTube's API to load a YouTube video on my page. I have <code>'controls': 0</code> and <code>'loop': 1</code> but the video title still shows and it doesn't loop once the video is complete. Unsure why?</p>
  
  <p><strong>Code</strong>:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>    //  Load  IFrame Player API 
      var tag = document.createElement('script');
  
      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
  
      // Creating iframe
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          videoId: 'jagIsKF8oVA',        
          playerVars: {'autoplay': 1, 'controls': 0, 'mute' : 1, 'loop': 1, 'rel': 0 },
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }
  
      //  Calls function
      function onPlayerReady(event) {
        event.target.playVideo();
      }
  
      var done = false;
      function onPlayerStateChange(event) {
        // if (event.data == YT.PlayerState.PLAYING &amp;&amp; !done) {
        //   setTimeout(stopVideo, 6000);
        //   done = true;
        // }
      }
      function stopVideo() {
        // player.stopVideo();
      }</code></pre>
  </div>
  </div>
  </p>