Custom Video Embed Generator|
201 |
300 | 301 | |
302 |
303 | Embed Code 304 | 305 |
329 | Click on the images below to open video settings page (must be logged into YouTube) 330 |
343 | Preview: 344 | 345 | 346 | |
347 |
![](\"\/\/img.youtube.com\/vi\/'+document.getElementById('ytid').value+'\/1.jpg\")
<\/a>![](\"\/\/img.youtube.com\/vi\/'+document.getElementById('ytid').value+'\/2.jpg\")
<\/a>![](\"\/\/img.youtube.com\/vi\/'+document.getElementById('ytid').value+'\/3.jpg\")
<\/a>';
143 | var tbactive = '![](\"\/\/img.youtube.com\/vi\/'+document.getElementById('ytid').value+'\/default.jpg\")
<\/a>
';
552 | });
553 |
554 | $('#video-info, #video-links, #video-thumbnails').show();
555 |
556 | return getVideoMetadata(video_id);
557 | };
558 |
559 | var form_id = 'youtube-options';
560 | var YOUTUBE_API_KEY = 'AIzaSyAKX2c_yQUOehC3bLDFA5NonWqmtp8cmRU';
561 | window.errors = {
562 | 'video_id_invalid':{
563 | 'active': false,
564 | 'message': 'The value you entered does not appear to be a valid video URL.'
565 | },
566 | 'video_embed_too_small':{
567 | 'active': false,
568 | 'message': 'Warning: YouTube does not support video embed sizes smaller than 200x200.'
569 | },
570 | 'video_metadata_fetch_failed': {
571 | 'active': false,
572 | 'message': 'There was a problem fetching metadata for the specified video.'
573 | }
574 | };
575 |
576 | // TODO: limit the rate at which the listeners fire
577 |
578 | var last_video_id = document.getElementById('youtube-id').value;
579 |
580 | // If any form values change
581 | document.forms[form_id].onchange = function(){
582 | // If video ID changed (api requests happen)
583 | var current_video_id = document.getElementById('youtube-id').value;
584 | if (current_video_id !== last_video_id){
585 | parseVideoId(current_video_id);
586 | updateVideoInfo();
587 |
588 | last_video_id = current_video_id;
589 | }
590 |
591 | updateEmbedAndPreview();
592 | checkVideoDimensions();
593 | alertMessage();
594 | };
595 |
596 | // On page load
597 | updateVideoInfo().finally(updateEmbedAndPreview);
598 | });
599 |
600 | // Polyfills
601 | // From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
602 | if (!Object.keys) {
603 | Object.keys = (function() {
604 | 'use strict';
605 | var hasOwnProperty = Object.prototype.hasOwnProperty,
606 | hasDontEnumBug = !({ toString: null }).propertyIsEnumerable('toString'),
607 | dontEnums = [
608 | 'toString',
609 | 'toLocaleString',
610 | 'valueOf',
611 | 'hasOwnProperty',
612 | 'isPrototypeOf',
613 | 'propertyIsEnumerable',
614 | 'constructor'
615 | ],
616 | dontEnumsLength = dontEnums.length;
617 |
618 | return function(obj) {
619 | if (typeof obj !== 'function' && (typeof obj !== 'object' || obj === null)) {
620 | throw new TypeError('Object.keys called on non-object');
621 | }
622 |
623 | var result = [], prop, i;
624 |
625 | for (prop in obj) {
626 | if (hasOwnProperty.call(obj, prop)) {
627 | result.push(prop);
628 | }
629 | }
630 |
631 | if (hasDontEnumBug) {
632 | for (i = 0; i < dontEnumsLength; i++) {
633 | if (hasOwnProperty.call(obj, dontEnums[i])) {
634 | result.push(dontEnums[i]);
635 | }
636 | }
637 | }
638 | return result;
639 | };
640 | }());
641 | }
642 |
643 |