You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
123 lines
3.2 KiB
HTML
123 lines
3.2 KiB
HTML
<html>
|
|
<head>
|
|
<title></title>
|
|
<meta charset="utf-8" />
|
|
<style type="text/css">
|
|
#ytplayer {
|
|
padding: 20px;
|
|
width: 320px;
|
|
}
|
|
#playerdiv {
|
|
width: 360px;
|
|
background: white;
|
|
}
|
|
#playerdiv.detected {
|
|
background: red;
|
|
}
|
|
#playerdiv.undetected {
|
|
background: green;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="alllinks">
|
|
<div class="detected">
|
|
<div>COPYRIGHT DETECTED</div>
|
|
<div>
|
|
<a href="https://www.youtube.com/watch?v=4ExUF1khFOQ">pitch-25</a>
|
|
<a href="https://www.youtube.com/watch?v=06fUhmj3uws">pitch+25</a>
|
|
<a href="https://www.youtube.com/watch?v=B3Y66QAqoOs">time+25</a>
|
|
<a href="https://www.youtube.com/watch?v=0B3rpUz_LMc">time-25</a>
|
|
<a href="https://www.youtube.com/watch?v=AJfvyxbIYlk">resample@11025Hz</a>
|
|
<a href="https://www.youtube.com/watch?v=u9DS7cFg4G4">noise recording only noise</a>
|
|
<a href="https://www.youtube.com/watch?v=L3sUb5_jTW8">2songs</a>
|
|
</div>
|
|
</div>
|
|
<div class="undetected">
|
|
<div>Copyright NOT detected</div>
|
|
<a href="https://www.youtube.com/watch?v=Lw9GcLTx6qE">reversed</a>
|
|
<a href="https://www.youtube.com/watch?v=HdWtRLQNzq4">noise recording crowd music same distance</a>
|
|
<a href="https://www.youtube.com/watch?v=NSNipke4ka8">noise recording crowd music far</a>
|
|
<a href="https://www.youtube.com/watch?v=0p_5MvfQnWw">chunks mixed 15s</a>
|
|
<a href="https://www.youtube.com/watch?v=NgPeKflGqtM">vocals isolated</a>
|
|
<a href="https://www.youtube.com/watch?v=PzlmAnD1JmI">vocals removed</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="playerdiv" class="">
|
|
<div id="ytplayer"></div>
|
|
</div>
|
|
|
|
<script>
|
|
// Load the IFrame Player API code asynchronously.
|
|
var tag = document.createElement('script');
|
|
tag.src = "https://www.youtube.com/player_api";
|
|
var firstScriptTag = document.getElementsByTagName('script')[0];
|
|
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
|
|
|
|
// Replace the 'ytplayer' element with an <iframe> and
|
|
// YouTube player after the API code downloads.
|
|
var player = null;
|
|
var playerdiv = document.getElementById("playerdiv");
|
|
|
|
function onYouTubePlayerAPIReady() {}
|
|
|
|
function extract_ytid (href) {
|
|
return href.match(/v=?(.+)/)[1]
|
|
}
|
|
|
|
function play (youtubeid) {
|
|
if (player === null) {
|
|
player = new YT.Player('ytplayer', {
|
|
height: '80',
|
|
width: '320',
|
|
autoplay: true,
|
|
videoId: youtubeid,
|
|
events: {
|
|
'onReady': onPlayerReady
|
|
}
|
|
});
|
|
} else {
|
|
player.loadVideoById({'videoId': youtubeid, 'events': { 'onReady': onPlayerReady }})
|
|
}
|
|
}
|
|
|
|
function onPlayerReady () {
|
|
player.playVideo();
|
|
}
|
|
|
|
function $ (sel, callback) {
|
|
var ll = document.querySelectorAll(sel);
|
|
return Array.prototype.slice.call(ll);
|
|
}
|
|
|
|
$(".detected a").forEach(function (a) {
|
|
a.addEventListener("click", function (e) {
|
|
play(extract_ytid(this.href));
|
|
e.preventDefault();
|
|
playerdiv.setAttribute("class", "");
|
|
// show the "result" after a delay
|
|
window.setTimeout(function () {
|
|
playerdiv.setAttribute("class", "detected");
|
|
}, 2500);
|
|
});
|
|
});
|
|
$(".undetected a").forEach(function (a) {
|
|
a.addEventListener("click", function (e) {
|
|
play(extract_ytid(this.href));
|
|
e.preventDefault();
|
|
playerdiv.setAttribute("class", "");
|
|
// show the "result" after a delay
|
|
window.setTimeout(function () {
|
|
playerdiv.setAttribute("class", "undetected");
|
|
}, 2500);
|
|
});
|
|
});
|
|
|
|
</script>
|
|
|
|
|
|
|
|
</body>
|
|
</html> |