Advertisement
BullFrog

Youtube Embed HD - Fixed + FullScreen/Pause button

Aug 13th, 2011
703
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // ==UserScript==
  2. // @name Youtube Embed HD fixed
  3. // @version 1.5
  4. // @namespace Youtube
  5. // @include *
  6. // ==/UserScript==
  7.  
  8. // added support for pure EMBED and IFRAME based embedding
  9.  
  10. trim = function (str)
  11. {
  12.     return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
  13. }
  14.  
  15. var YTEmbedHD =
  16. {
  17.     //Array of youtube embedded videos
  18.     ytEmbeds: new Array(),
  19.     //Searches the page for youtube players
  20.     findPlayers: function ()
  21.     {
  22.         var iframes = document.body.getElementsByTagName("iframe");
  23.         for (i in iframes)
  24.         {
  25.             var fr = iframes[i];
  26.             if (fr != null && fr.src != null && fr.src.indexOf("youtube") > -1)
  27.             {
  28.                 YTEmbedHD.ytEmbeds.push(fr);
  29.             }
  30.         }
  31.         var embeds = document.body.getElementsByTagName("embed");
  32.         for (i in embeds)
  33.         {
  34.             var em = embeds[i];
  35.             if (em != null && em.src != null && em.src.indexOf("youtube") > -1)
  36.             {
  37.                 YTEmbedHD.ytEmbeds.push(em);
  38.             }
  39.         }
  40.         var objects = document.body.getElementsByTagName("object");
  41.         for (i in objects)
  42.         {
  43.             var ob = objects[i];
  44.             if (ob != null && ob.innerHTML != null && ob.innerHTML.indexOf("embed") == -1 && ob.innerHTML.indexOf("youtube") > -1)
  45.             {
  46.                 YTEmbedHD.ytEmbeds.push(ob);
  47.             }
  48.         }
  49.         //If we have youtube elements, run the script!
  50.         if (YTEmbedHD.ytEmbeds.length > 0)
  51.         {
  52.             YTEmbedHD.run();
  53.         }
  54.     },
  55.     //Loads the required SWFObject
  56.     run: function ()
  57.     {
  58.         var waitForLibs, loadLibary;
  59.  
  60.         //Wait for libraries to load then call the libLoaded function
  61.         waitForLibs = function ()
  62.         {
  63.             if (typeof unsafeWindow.swfobject == 'undefined')
  64.             {
  65.                 window.setTimeout(waitForLibs, 100);
  66.             }
  67.             else
  68.             {
  69.                 YTEmbedHD.libLoaded();
  70.             }
  71.         }
  72.         //Add a javascript libary to the page
  73.         loadLibary = function (url, fn)
  74.         {
  75.             var head = document.getElementsByTagName('head')[0] || document.documentElement;
  76.             var script = document.createElement('script');
  77.             script.src = url;
  78.             script.type = 'text/javascript';
  79.             script.async = true;
  80.             head.insertBefore(script, head.firstChild);
  81.             if (typeof fn == 'function')
  82.             {
  83.                 fn();
  84.             }
  85.         }
  86.         //Check if the libary is already loaded on page
  87.         if (typeof unsafeWindow.swfobject == 'undefined') loadLibary('http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject_src.js', waitForLibs);
  88.         else waitForLibs();
  89.     },
  90.     //Write a script element to the page
  91.     addScript: function (str, fn)
  92.     {
  93.         var head = document.getElementsByTagName('head')[0] || document.documentElement;
  94.         var script = document.createElement('script');
  95.         script.type = 'text/javascript';
  96.         script.innerHTML = str + "\n" + fn;
  97.         head.insertBefore(script, head.firstChild);
  98.     },
  99.     //Called after the SWFObj lib has loaded
  100.     libLoaded: function ()
  101.     {
  102.         YTEmbedHD.swfobject = unsafeWindow.swfobject;
  103.         //Function that is called when the youtube player has been replaced sucessfully
  104.  
  105.         function onYouTubePlayerReady()
  106.         {
  107.             //Get the current player and add the correct onstatechange event hander for it
  108.             var yt = document.getElementById("ytPlayer" + YTEmbedHD.cID);
  109.             yt.addEventListener("onStateChange", "onStateChange" + YTEmbedHD.cID);
  110.             if (YTEmbedHD.cID == YTEmbedHD.ytEmbeds.length - 1)
  111.             {
  112.                 //alert("COMPLETED")
  113.             }
  114.             else
  115.             {
  116.                 //alert("NEXT")
  117.                 YTEmbedHD.cID++;
  118.                 YTEmbedHD.replacePlayer();
  119.             }
  120.         }
  121.  
  122.         //Write this object to the page and the ready function
  123.         YTEmbedHD.addScript("var YTEmbedHD = {}; var YT_EMBED_QUALTIY = '" + GM_getValue("qualityOrder", "1080p,720p,480p,360p,small") + "'", onYouTubePlayerReady);
  124.         unsafeWindow.YTEmbedHD = YTEmbedHD;
  125.         YTEmbedHD.cID = 0;
  126.         //Start replacing players on the page
  127.         YTEmbedHD.replacePlayer();
  128.     },
  129.     //Replaces the current embed element with a SWFObject to use the YoutubeAPI
  130.     replacePlayer: function ()
  131.     {
  132.         var embed = YTEmbedHD.ytEmbeds[YTEmbedHD.cID];
  133.         var src = embed.src;
  134.         if (embed.tagName == "IFRAME")
  135.         {
  136.             var n1 = src.indexOf("/embed/");
  137.             if (n1 != -1)
  138.                 src = src.substr(0, n1) + "/v/" + src.substr(n1 + 7);
  139.            
  140.             n1 = src.indexOf("?");
  141.             if (n1 != -1)
  142.                 src = src.substr(0, n1) + "?version=3&" + src.substr(n1 + 1);
  143.         }
  144.         if (src == null)
  145.         {
  146.             var params = embed.getElementsByTagName("param");
  147.             for (var n = 0; n < params.length; n++)
  148.             {
  149.                 var param = params[n];
  150.                 if (param.name == "src" || param.name == "movie")
  151.                 {
  152.                     src = param.value;
  153.                     break;
  154.                 }
  155.             }
  156.         }
  157.  
  158.         if (src == null)
  159.             return;
  160.  
  161.         var ytDiv = document.createElement("div");
  162.  
  163.         var _w, _h;
  164.         _h = embed.clientHeight;
  165.         _w = embed.clientWidth;
  166.         if (_w == "" || _w <= "0") _w = embed.parentNode.clientWidth;
  167.         if (_h == "" || _h <= "0") _w = embed.parentNode.clientHeight;
  168.  
  169.         ytDiv.id = "ytDiv" + YTEmbedHD.cID;
  170.         ytDiv.style.width = _w + "px";
  171.         ytDiv.style.height = _h + "px";
  172.         var embedToReplace = embed.tagName == "EMBED" ? embed.parentNode : embed;
  173.         embedToReplace.parentNode.replaceChild(ytDiv, embedToReplace);
  174.  
  175.         //Ugh crazy thing to select the quality in the order the user specified-
  176.         //needs re coding, like most of this. Ill do it at some point.
  177.  
  178.         function selectQuality(q)
  179.         {
  180.             var p = 0;
  181.             var f = false;
  182.             var pref = YT_EMBED_QUALTIY.split(",");
  183.             for (px in pref)
  184.             {
  185.                 if (pref[px] == "1080p") pref[px] = "hd1080";
  186.                 else if (pref[px] == "720p") pref[px] = "hd720"
  187.                 else if (pref[px] == "480p") pref[px] = "large"
  188.                 else if (pref[px] == "360p") pref[px] = "medium"
  189.             }
  190.             var find = function ()
  191.             {
  192.                 for (j in q)
  193.                 {
  194.                     if (q[j] == pref[p])
  195.                     {
  196.                         f = true;
  197.                         p = j;
  198.                         break;
  199.                     }
  200.                 }
  201.             };
  202.             for (c = 0; c < pref.length; c++)
  203.             {
  204.                 find();
  205.                 if (f == true)
  206.                 {
  207.                     break;
  208.                 }
  209.                 p++;
  210.             };
  211.             return q[p];
  212.         }
  213.  
  214.         //Create a onStateChange function for this specific player
  215.         YTEmbedHD.addScript("var qualitySet" + YTEmbedHD.cID + " = false;" + "\nfunction onStateChange" + YTEmbedHD.cID + "(newState) {" + "\n if(qualitySet" + YTEmbedHD.cID + "==false) {" + "\n var yt = document.getElementById('ytPlayer" + YTEmbedHD.cID + "');" + "\n var q = yt.getAvailableQualityLevels();" + "\n var sq = ''" + "\n for(j in q) {" + "\n sq = q[j]; break;" + "\n }" + "\n if(sq != '' && qualitySet" + YTEmbedHD.cID + "==false) {" + "\n qualitySet" + YTEmbedHD.cID + "=true;" + "\n yt.setPlaybackQuality(selectQuality(q));" + "\n }" + "\n }" + "\n}", selectQuality);
  216.         var params =
  217.         {
  218.             allowScriptAccess: "always",
  219.             wmode: "transparent",
  220.             allowFullScreen: "true"
  221.         };
  222.         var atts =
  223.         {
  224.             id: "ytPlayer" + YTEmbedHD.cID
  225.         };
  226.         //Embed the video player
  227.         YTEmbedHD.swfobject.embedSWF(src + "&version=3&rel=1&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&enablejsapi=1&playerapiid=ytplayer", ytDiv.id, _w, _h, "8", null, null, params, atts);
  228.     }
  229. }
  230.  
  231. createStuff = function ()
  232. {
  233.     var fill = document.createElement("div");
  234.     fill.setAttribute("style", "position: fixed; top: 0; width: 100%; height: 100%; z-index: 2147483645; background: black; opacity: 0.6; cursor: pointer");
  235.  
  236.     var cel = function (p, elm)
  237.     {
  238.         var el = document.createElement(elm);
  239.         p.appendChild(el);
  240.         return el;
  241.     }
  242.  
  243.     var addCSS = function (text)
  244.     {
  245.         var head = document.getElementsByTagName('head')[0] || document.documentElement;
  246.         var css = document.createElement('style');
  247.         css.type = 'text/css';
  248.         css.innerHTML = text;
  249.         head.insertBefore(css, head.firstChild);
  250.     }
  251.  
  252.     var settings = document.createElement("div");
  253.     settings.setAttribute("style", "width: 250px; border: 2px solid white;z-index: 2147483646; position: fixed; top: 0; margin-top: 100px; left: 50%;" + "margin-left: -150px; background: #333; -moz-border-radius: 10px; font-size: 11px; color: white; padding: 10px; font-family: Arial;" + "line-height: 13px;");
  254.     var head = cel(settings, "h1");
  255.     head.setAttribute("style", "font-size: 15px; color: white; font-family: Arial; margin: 0; padding: 5px; border: 0; border-bottom: 1px solid white; margin-bottom: 10px;");
  256.     head.appendChild(document.createTextNode("Youtube Embed HD Settings"));
  257.     settings.appendChild(head);
  258.  
  259.     var ctn = function (elem, text)
  260.     {
  261.         elem.appendChild(document.createTextNode(text));
  262.     }
  263.     ctn(settings, "Default video quality (Enter in order you wish them to be selected");
  264.  
  265.     addCSS("#ytEmbedHDList { padding: 10px; }" + "#ytEmbedHDList > div { border:1px solid white; padding: 3px; margin: 2px; width: 70px; float: left; clear: left;}" + "#ytEmbedHDList input {float: left; width: 20px; border: 1px solid white; margin-top: 2px; font-size: 11px; padding: 3px; color: white; background: #666}");
  266.  
  267.  
  268.     var order = GM_getValue("qualityOrder", "1080p,720p,480p,360p,small").split(",");
  269.     var items = [];
  270.     var list = cel(settings, "div");
  271.     list.id = "ytEmbedHDList";
  272.  
  273.     for (m = 0; m < order.length;)
  274.     {
  275.         ctn(cel(list, "div"), order[m]);
  276.         items[m] = cel(list, "input")
  277.         items[m].id = order[m];
  278.         items[m].value = ++m;
  279.     }
  280.  
  281.     var sx = cel(settings, "br");
  282.     var sbmt = cel(settings, "input");
  283.     sbmt.type = "button";
  284.     sbmt.value = "Save";
  285.     sbmt.setAttribute("style", "margin: 20px auto 0 auto; display: block;");
  286.  
  287.     var span = null;
  288.  
  289.     sbmt.addEventListener("click", function ()
  290.     {
  291.         var ord = []
  292.         for (i in items)
  293.         ord[items[i].value - 1] = items[i].id;
  294.         var err = false;
  295.         for (i = 0; i < items.length; i++)
  296.         {
  297.             if (ord[i] == null)
  298.             {
  299.                 err = true;
  300.                 break;
  301.             }
  302.         }
  303.         if (err && span == null)
  304.         {
  305.             cel(settings, "br");
  306.             span = cel(settings, "span");
  307.             span.style.color = "yellow";
  308.             span.style.marginLeft = "25px";
  309.             span.appendChild(document.createTextNode("Error invalid input"));
  310.         }
  311.         else
  312.         {
  313.             m = "";
  314.             for (i = 0; i < 4; i++)
  315.             {
  316.                 m += trim(ord[i]) + ",";
  317.             }
  318.             m += trim(ord[4]);
  319.             GM_setValue("qualityOrder", m);
  320.             YTEmbedHD.addScript("YT_EMBED_QUALTIY = '" + m + "'");
  321.             fill.parentNode.removeChild(fill);
  322.             settings.parentNode.removeChild(settings);
  323.         }
  324.     }, false);
  325.  
  326.     fill.addEventListener("click", function ()
  327.     {
  328.         fill.parentNode.removeChild(fill);
  329.         settings.parentNode.removeChild(settings);
  330.     }, false);
  331.    
  332.     document.body.appendChild(fill);
  333.     document.body.appendChild(settings);
  334.     settings.focus();
  335. }
  336.  
  337. GM_registerMenuCommand("Set playback quality settings", createStuff);
  338. setTimeout(YTEmbedHD.findPlayers, 500);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement