Splitview how to setHtml with Youtube iFrame

[tyladurdan]

I've been looking at rdougan's split view here:

I've managed to get it to load youtube in a list on the left, and I'm nearly there getting it to display the video on click in the detail panel.

The problem I am having is instead of the video appearing in the detail panel, I just get the link to the youtube video:

http://www.youtube.com/watch?v=HkljEYkdo-s&feature=youtube_gdata_player

The bit of code that is responsible for putting the link in the detail panel is this part:

var detailPanel;
      detailPanel = this.getMovieDetails();   // Get a reference to the panel
      detailPanel.setHtml(record.get('player_default'));  // Set the data in the panel

How would I go about appending an iFrame such as this in the setHtml part, something like:

 <iframe src="{player_default}" width="100%" height="40%" frameborder="0"></iframe>

...so it would set the HTML to this:

<iframe src="http://www.youtube.com/watch?v=HkljEYkdo-s&feature=youtube_gdata_player" width="100%" height="40%" frameborder="0"></iframe>

Any tips would be much appreciated, I'm close...

:-)

[bluehipy]

var src = record.get('player_default');
var iframe = "
<iframe src='"+src+"' width="100%" height="40%" frameborder="0"></iframe>";
 detailPanel.setHtml(iframe);

?

[tyladurdan]

Sorted, thanks a lot. You made me find the final solution which was:

var src = record.get('id');
var iframe = '<iframe width="560" height="315" src="http://www.youtube.com/embed/'+src+'" frameborder="0" allowfullscreen></iframe>';
var detailPanel;
detailPanel = this.getMovieDetails();
detailPanel.setHtml(iframe);

:-)