Add Youtube Preview image and URL
This commit is contained in:
@@ -17,8 +17,8 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#RadioBox{
|
#RadioBox{
|
||||||
width: 410px;
|
width: 450px;
|
||||||
height: 350px;
|
height: 490px;
|
||||||
background-color: rgba(0, 0, 0, 0.7);
|
background-color: rgba(0, 0, 0, 0.7);
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
|
|||||||
14
index.html
14
index.html
@@ -14,10 +14,7 @@
|
|||||||
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
|
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
|
||||||
crossorigin="anonymous">
|
crossorigin="anonymous">
|
||||||
</script>
|
</script>
|
||||||
<!--
|
|
||||||
<script src="js/lastfm.api.md5.js" type="text/javascript"></script>
|
|
||||||
<script src="js/lastfm.api.js" type="text/javascript"></script>
|
|
||||||
-->
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
@@ -29,6 +26,15 @@
|
|||||||
|
|
||||||
<div id="PlayStat">Stopped</div>
|
<div id="PlayStat">Stopped</div>
|
||||||
<br>
|
<br>
|
||||||
|
|
||||||
|
<a name="YouTubeURL" href="" target="_blank">
|
||||||
|
<img name="YouTubeThumb" width="210" height="170"
|
||||||
|
src="">
|
||||||
|
</img>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
<div class="tagWindow">
|
<div class="tagWindow">
|
||||||
<form name="artistURL" action="" target="_blank">
|
<form name="artistURL" action="" target="_blank">
|
||||||
<button class="tagA">
|
<button class="tagA">
|
||||||
|
|||||||
28
js/radio.js
28
js/radio.js
@@ -1,5 +1,5 @@
|
|||||||
var MPDartist, MPDsong, MPDfile, MPDCurr;
|
var MPDartist, MPDsong, MPDfile, MPDCurr, YouURL;
|
||||||
MPDartist = MPDsong = MPDfile = MPDCurr = 'empty';
|
MPDartist = MPDsong = MPDfile = MPDCurr = YouURL = 'empty';
|
||||||
|
|
||||||
function show()
|
function show()
|
||||||
{
|
{
|
||||||
@@ -32,10 +32,11 @@ function show()
|
|||||||
MPDsong = MPDfile.replace(/^.*\s-/,'').replace(/^\s*/,'').replace(/\s*$/,'');
|
MPDsong = MPDfile.replace(/^.*\s-/,'').replace(/^\s*/,'').replace(/\s*$/,'');
|
||||||
getArtistURL(MPDartist);
|
getArtistURL(MPDartist);
|
||||||
$("#trackname span").text(MPDartist+" - "+MPDsong);
|
$("#trackname span").text(MPDartist+" - "+MPDsong);
|
||||||
|
getYouTubeRequest(MPDfile);
|
||||||
} else if (MPDCurr != MPDfile) {
|
} else if (MPDCurr != MPDfile) {
|
||||||
getArtistURL(MPDartist);
|
getArtistURL(MPDartist);
|
||||||
$("#trackname span").text(MPDartist+" - "+MPDsong);
|
$("#trackname span").text(MPDartist+" - "+MPDsong);
|
||||||
|
getYouTubeRequest(MPDfile);
|
||||||
}
|
}
|
||||||
MPDCurr = MPDfile;
|
MPDCurr = MPDfile;
|
||||||
});
|
});
|
||||||
@@ -66,3 +67,24 @@ function getSongURL(MPDartist, MPDsong)
|
|||||||
document.querySelector('form[name="songURL"]').setAttribute('action', MPDsong);
|
document.querySelector('form[name="songURL"]').setAttribute('action', MPDsong);
|
||||||
console.log(MPDsong)
|
console.log(MPDsong)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Функция для поиска по YouTube
|
||||||
|
function getYouTubeRequest(MPDfile) {
|
||||||
|
var url = 'https://www.googleapis.com/youtube/v3/search';
|
||||||
|
var params = {
|
||||||
|
// part: 'id',
|
||||||
|
part: 'snippet',
|
||||||
|
key: 'AIzaSyCqebfGlbbqoM0oEbbBsK87IZhlS3_Urcg',
|
||||||
|
q: MPDfile
|
||||||
|
};
|
||||||
|
|
||||||
|
$.getJSON(url, params, showResults);
|
||||||
|
}
|
||||||
|
|
||||||
|
function showResults(results) {
|
||||||
|
var entries = results.items;
|
||||||
|
thumb = entries[0].snippet.thumbnails.medium.url;
|
||||||
|
YouURL = entries[0].id.videoId;
|
||||||
|
document.querySelector('img[name="YouTubeThumb"]').setAttribute('src', thumb);
|
||||||
|
document.querySelector('a[name="YouTubeURL"]').setAttribute('href', "https://www.youtube.com/watch?v="+YouURL);
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user