/TypeScript/Embed youtube search results into website

Embed youtube search results into website

<!doctype html>
<html>
  <head>
  <title>Search</title>
  </head>
  <body>
    <div id="buttons">
    <label> <input id="query" value='cats' type="text"/><button id="search-button"    onclick="keyWordsearch()">Search</button></label>    
    <div id="container">
    <h1>Search Results</h1>
    <ul id="results"></ul>
    </div>           
<script>
 function keyWordsearch(){
    gapi.client.setApiKey('api_key_here');
    gapi.client.load('youtube', 'v3', function(){
            makeRequest();
    });
}
function makeRequest(){
    var q = $('#query').val();
    var request = gapi.client.youtube.search.list({
            q: q,
            part: 'snippet', 
            maxResults: 10
    });
    request.execute(function(response)  {                                                                                    
            $('#results').empty()
            var srchItems = response.result.items;                      
            $.each(srchItems, function(index, item){
            vidTitle = item.snippet.title;  
            vidThumburl =  item.snippet.thumbnails.default.url;                 
            vidThumbimg = '<pre><img id="thumb" src="'+vidThumburl+'" alt="No  Image  Available." style="width:204px;height:128px"></pre>';                   

            $('#results').append('<pre>' + vidTitle + vidThumbimg +   '</pre>');                      
    })  
  })  
}
 </script> 
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
 <script src="https://apis.google.com/js/client.js?onload=googleApiClientReady">   </script>
</body>
</html>

Source: stackoverflow.com

Similar codes

0 vote110 views1 answer
Install typescript mac
TypeScript
0 vote107 views1 answer
Pandas value_counts sort descending
TypeScript
6 votes104 views1 answer
Replace string in typescript
TypeScript
0 vote146 views1 answer
- laravel/ui[v3.2.0, ..., 3.x-dev] require illuminate/console ^8.0 -> found illuminate/console[v8.0.0, ..., 8.x-dev] but these were not loaded, likely because it conflicts with another require.
TypeScript
1 vote104 views2 answers
Css inputs outofill color
TypeScript
1 vote103 views1 answer
Retrieve data from firebase flutter
TypeScript
0 vote98 views1 answer
Which of the following are elements associated with the html table layout?
TypeScript
2 votes108 views1 answer
Expected 2 arguments but got 1. viewchild angular
TypeScript
0 vote114 views1 answer
From __future__ import unicode_literals import youtube_dl ydl_opts = {} with youtube_dl.YoutubeDL(ydl_opts) as ydl: ydl.download(['VideoURL'])
TypeScript
0 vote119 views1 answer
Npm run multiple scripts sequentially
TypeScript