Created
December 5, 2019 22:57
-
-
Save cereal-s/a503f634bfc1b4f468ccebdaa4e11d82 to your computer and use it in GitHub Desktop.
Convert YouTube to thumbnail
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?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