Play videos retrieved from youtube api v3 -

Using YouTube API V3, I can remove the thumbnail of a user's activity feed (using the list from APIs).

What am I trying to achieve, when the user clicks on the video, the video must be played. I've seen iframes, though how does the list of activities on the API do not get the URL for the video, but a different resource shows the player. Embed HTML field, though I am confused, how do I integrate it into my code? var activityID, next pagetoken, prepaytocon, videocypet; // API Load Upload Playlist ID to get a function call after handlingloadloaded () {requestUserUploadsactivityId (); } // Upload Upload Playlist ID Function Request USERUploadsactivityId () {// https://developers.google.com/youtube/v3/docs/channels/list var request = gapi.client.youtube.activities.list ({/ / My: '' indicates that we want the certified user to retrieve the channel. Home: 'true', part: 'snippet'}); Request.execute (function (feedback) {// structure.details of the structure //https://developers.google.com/youtube/v3/docs/channels#resource console.log (feedback); activity ID = feedback.Items [ 0] .id; requestVideoPlaylist (activityId);}); } // Replay the playlist of the video function requestVideo playlists (Home, PageToken) {$ ('#VideoContainer'). Html (''); Var requestOptions = {home: 'true', section: 'snippet', maximum result: 12}; If (PageToken) {requestOptions.pageToken = pageToken; } Var request = gapi.client.youtube.activities.list (requestOptions); Request.execute {var activityItems = response.result.items; if (activityItems) {// shows a thumbnail for each result. JQuery.each (activityItems, functions (index, item) {createDisplayThumbnail (item Snippet);});} and {$ ('# video-container'). Html ('Sorry, there is no action on your feed');}}); } // Create a thumbnail for the video snippet. Function CreationTableNote (VideoSynipate) {var titleEl = $ ('& lt; h4 & gt;'); TitleEl.addClass ('Video Title'); $ (TitleEl) .html (videoSnippet.title); Var thumbnailUrl = videoSnippet.thumbnails.default.url; Console.log (videoSnippet); Var div = $ ('& lt; div & gt;'); Div.addClass ('Video Content'); DivCss ('background image', 'url ("' + thumbnailUrl + '")'); Div.append (titleEl); . $ ('# Video Container') attached (div); }

There are several types of activities in the list of activities: < P> upload, like, favorite, comment, subscription, playlist item, recommendation, bulletin, social ..

and only some types of activities are related to a video then you can only re-send the video ID Now when the type of activity is related to the video, you can watch the video. You can use the Yo ID.

There is a good example of you in "YouTube Theme Explorer". In this app you can retrieve social activities and you can recover the video ID from such activities.

  $ scope.social = function () {$ rootScope.topicResults = []; $ RootScope.spinner.spin ($ ('#spinner') [0]); YouTube ({method: 'GET', service: 'activities', parameters: {part: 'id, snippet, content description', home: true, maximum result: static. YOUTUBE_API_MAX_RESULTS}, callback: function (feedback) {if ( In the 'item' response) {$ scope.videoIds = []; $ scope.personalizedTopics = []; pre-rectangle for angular.teams, function (activity) {if ((activity. Snippet.type == constant. Social Livype) & amp; Amp; (activity.contentDetails.social.resourceId.videoId)) {$ scope.videoIds.push (activity.contentDetails.social.resourceId.videoId)}}})}} getTopicsForVideoIds ();} }); }   
 And you have an example of showing the video:  
  
  function play video (container, video id) {var Width = container.offsetWidth; Var Height = Container Offsite; New YT.Player (Container, {videoId: Video ID, width: width, height: height, player wars: {autoplay: 1, control: 2, minor branding: 1, rel: 0, showInfo: 0}});