title: Putting a Youtube clip in the Google Map infoWindow using Ajax
body: <p>For a Udacity project, I'm trying to create a neighborhood map using Google Maps API as well as Knockout and Ajax to use another 3rd party API.  Since nobody else in my class has used Youtube, I decided to focus on bars in my neighborhood and use Ajax to search Youtube for any relevant videos for that bar ( I looked each bar us to ensure that at least one video existed for each ).  I got my map working with just an embedded video, just to ensure that would work, but I'm getting a console error when trying to Ajax call infoWindow specific videos.  Here's the Ajax call.</p>
  
  <pre><code>var yt_url = "https://www.googleapis.com/youtube/v3/search" + markerList[i];
          var ytRequestTimeout = setTimeout(function(){
          console.log("failed to get Youtube resources");
      }, 8000);
          google.maps.event.addListener(marker, "click", function(){
            //make some room for youtube ajax call and supporting code here.
          $.ajax({
            type: "GET",
            url: yt_url,
            datatype: "jsonp",
            success: function(response){
              var ytWindow = new google.maps.InfoWindow({
                content: '&lt;object width="425" height="344"&gt;&lt;param name="movie" value="am name="allowFullScreen" value="true"&gt;&lt;/param&gt;&lt;param name="allowscriptaccess" value="always"&gt;&lt;/param&gt;&lt;embed src=yt_url type="application/x-shockwave-flash" width="425" height="344" allowscriptaccess="always" allowfullscreen="true"&gt;&lt;/embed&gt;&lt;/object&gt;'
                })
              ytWindow.open(map, marker);
  
            }
  
          })
  </code></pre>
  
  <p>Here's my Codepen if you want to see the related HTML and CSS as well as the entire JS file.  <a href="http://codepen.io/anon/pen/azMGBq" rel="nofollow">http://codepen.io/anon/pen/azMGBq</a></p>
  
  <p>Thanks</p>