-
Notifications
You must be signed in to change notification settings - Fork 2
/
testing-youtubeAPI.html
99 lines (72 loc) · 2.65 KB
/
testing-youtubeAPI.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body { background: #f5c9c5; }
header { margin-top: 30px; }
header a { color: black; text-decoration: none; }
header a:hover { text-decoration: none; }
form { margin-top: 20px; }
form, #results { padding: 0 20px; }
.item { margin-bottom: 25px; }
.w100 { width: 100%; }
.btn-primary { background: #952b2b; border-color: #957575; }
.btn-primary:hover, .btn-primary:active, .btn-primary:focus { background: #782b2b; border-color: #952b2b; }
</style>
</head>
<body>
<input id="searchquery" />
<div id="results"></div>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#searchquery').keyup(function () {
// the search term
var q = $('#searchquery').val().trim();
// container to display search results
var $results = $('#results');
// YouTube Data API base URL (JSON response)
var url = "http://gdata.youtube.com/feeds/api/videos/?v=2&alt=jsonc&callback=?"
// set paid-content as false to hide movie rentals
url = url + '&paid-content=false';
// set duration as long to filter partial uploads
url = url + '&duration=long';
// order search results by view count
url = url + '&orderby=viewCount';
// we can request a maximum of 50 search results in a batch
url = url + '&max-results=50';
$.getJSON(url + "&q=" + q, function (json) {
var count = 0;
if (json.data.items) {
var items = json.data.items;
var html = "";
items.forEach(function (item) {
// Check the duration of the video,
// full-length movies are generally longer than 1 hour
var duration = Math.round((item.duration) / (60 * 60));
// Filter out videos that aren't in the Film or Movies category
if ((duration > 1) && (item.category == "Movies" || item.category == "Film")) {
// Include the YouTube Watch URL youtu.be
html += '<p><a href="http://youtu.be/' + item.id + '">';
// Add the default video thumbnail (default quality)
html += '<img src="http://i.ytimg.com/vi/' + item.id + '/default.jpg">';
// Add the video title and the duration
html += '<h2>' + item.title + ' ' + item.duration + '</h2></a></p>';
count++;
}
});
}
// Did YouTube return any search results?
if (count === 0) {
$results.html("No videos found");
} else {
// Display the YouTube search results
$results.html(html);
}
});
});
});
</script>
</body>
</html>