Skip to content

Instantly share code, notes, and snippets.

@cereal-s
Created December 5, 2019 22:57
Show Gist options
  • Save cereal-s/a503f634bfc1b4f468ccebdaa4e11d82 to your computer and use it in GitHub Desktop.
Save cereal-s/a503f634bfc1b4f468ccebdaa4e11d82 to your computer and use it in GitHub Desktop.
Convert YouTube to thumbnail
<?php
/**
* Get video info
* @param string $code
* @return object | null
*/
function _get_info($code)
{
$yt = json_decode(file_get_contents("https://www.youtube.com/oembed?url=https://youtu.be/{$code}&format=json"));
if(is_object($yt))
return $yt;
return ;
}
$result = false;
if ( $_POST ) {
/**
* URL format:
* https://www.youtube.com/watch?v=LQiOA7euaYA
*/
if( isset($_POST['url']) ) {
$post_url = filter_input(INPUT_POST, 'url', FILTER_SANITIZE_URL);
$url = parse_url($post_url);
parse_str($url['query'], $out);
if( isset($out['v']) ) {
$code = $out['v'];
$yt = _get_info($code);
$yt_template = '<style>
#video a {
display: block; position: relative; width: '. $yt->width .'px; height: '. $yt->height .'px; background-image: linear-gradient(to top, transparent 70%, rgba(0, 0, 0, 0.3) 90%), url(https://img.youtube.com/vi/'. $code .'/hqdefault.jpg);
}
.play {
position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background-color: rgba(0, 0, 0, 1); border-radius: 50% / 10%; color: #FFFFFF; font-size: 2em; height: 50px; padding: 0; text-align: center; text-indent: 0.1em; transition: all 150ms ease-out; width: 4vw;
}
.play::before {
background: inherit; border-radius: 5% / 50%; bottom: 9%; content: ""; left: -5%; position: absolute; right: -5%; top: 9%;
}
.play::after {
border-style: solid; border-width: 1em 0 1em 1.732em; border-color: transparent transparent transparent rgba(255, 255, 255, 1); content: ""; font-size: 0.75rem; height: 0; margin: -1em 0 0 -0.75em; top: 50%; position: absolute; width: 0;
}
</style>
<div id="video">
<a href="https://youtu.be/'. $code .'" target="_blank" title="'. $yt->title .'"><i class="play"></i></a>
<h3>'. $yt->title .'</h3>
</div>' . PHP_EOL;
$result = true;
}
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>YouTube convert to preview</title>
<style type="text/css">
#wrap {
width: 35vw;
margin: 4vh auto;
}
label {
font-weight: 600;
display: inline-block;
margin-bottom: 8px;
}
input[type="submit"] {
font-weight: 600;
padding: 0.4rem;
font-variant: small-caps;
}
input[type="url"] {
width: 100%;
padding: 0.4rem;
}
textarea {
width: 100%;
height: 100px;
font-family: 'Ubuntu Mono', monospace;
}
</style>
</head>
<body>
<div id="wrap">
<h2>Submit the video to get the thumbnail</h2>
<form method="post">
<p>
<label>YouTube link</label>
<input type="url" name="url" id="url">
</p>
<p>
<input type="submit" name="submit" value="submit">
</p>
</form>
<?php
if( true === $result ) {
print '<h3>The video</h3>';
print $yt_template;
print '<h3>Copy the code</h3>';
print '<textarea>'. $yt_template .'</textarea>';
}
?>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment