1/* jquery.youtube-background v1.0.4 | Nikola Stamatovic <@stamat> | MIT */ 2 3var tag = document.createElement('script'); 4tag.src = "https://www.youtube.com/player_api"; 5var firstScriptTag = document.getElementsByTagName('script')[0]; 6firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 7 8(function ($) { 9 $.fn.youtube_background = function(params) { 10 var YOUTUBE = /(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/ ]{11})/i; 11 var $this = $(this); 12 13 var defaults = { 14 'pause': false, //deprecated 15 'play-button': false, 16 'mute-button': false, 17 'autoplay': true, 18 'muted': true, 19 'loop': true, 20 'mobile': false, 21 'load-background': true 22 } 23 24 if (!params) { 25 params = defaults; 26 } else { 27 for (var k in defaults) { 28 //load in defaults 29 if (!params.hasOwnProperty(k)) { 30 params[k] = defaults[k]; 31 } 32 } 33 } 34 35 //pause deprecated 36 if (params.pause) { 37 params['play-button'] = params.pause; 38 } 39 40 function onVideoPlayerReady(event) { 41 if (params.autoplay) { 42 event.target.playVideo(); 43 } 44 45 $(event.target.a).css({ 46 "top" : "50%", 47 "left" : "50%", 48 "transform": "translateX(-50%) translateY(-50%)", 49 "position": "absolute" 50 }); 51 52 var $root = $(event.target.a).parent(); 53 54 function onResize() { 55 var h = $root.outerHeight() + 100; // since showinfo is deprecated and ignored after September 25, 2018. we add +100 to hide it in the overflow 56 var w = $root.outerWidth() + 100; 57 var res = 1.77777778; 58 59 if (res > w/h) { 60 $root.find('iframe').width(h*res).height(h); 61 ytp.height = h + 200 ; 62 ytp.width = h*res + 200 ; 63 } else { 64 $root.find('iframe').width(w).height(w/res); 65 ytp.height = w/res + 200 ; 66 ytp.width = w + 200 ; 67 } 68 } 69 $(window).on('resize', onResize); 70 onResize(); 71 } 72 73 function onVideoStateChange(event) { 74 //video loop 75 if (event.data === 0 && params.loop) { 76 event.target.playVideo(); 77 } 78 } 79 80 function build() { 81 if (!window.hasOwnProperty('__ytbg_index')) { 82 window.__ytbg_index = {}; 83 } 84 85 //iterate elements 86 for (var i = 0; i < $this.length; i++) { 87 var $elem = $($this[i]); 88 89 if ($elem.parent().hasClass('youtube-background')) { 90 continue; 91 } 92 93 var ytid = $elem.data('youtube'); 94 95 if (!ytid) { 96 continue; 97 } 98 99 var pts = ytid.match(YOUTUBE); 100 if (pts && pts.length) { 101 ytid = pts[1]; 102 YOUTUBE.lastIndex = 0; //regex needs a reset in for loops, I always forget this 103 } else { 104 continue; 105 } 106 107 for (var k in params) { 108 var data = $elem.data('ytbg-'+k); 109 if (data !== undefined && data !== null) { 110 params[k] = data; 111 } 112 } 113 114 //pause deprecated 115 if (params.pause) { 116 params['play-button'] = params.pause; 117 } 118 119 $elem.wrap('<div class="youtube-background" />'); 120 var $root = $elem.parent(); 121 122 //set css rules 123 $root.css({ 124 "height" : "100%", 125 "width" : "100%", 126 "z-index": "0", 127 "position": "absolute", 128 "overflow": "hidden", 129 "top": 0, // added by @insad 130 "left": 0, 131 "bottom": 0, 132 "right": 0, 133 "pointer-events": "none" // avoid right mouse click popup menu 134 }); 135 136 if (params['load-background']) { 137 $root.css({ 138 'background-image': 'url(https://img.youtube.com/vi/'+ytid+'/maxresdefault.jpg)', 139 'background-size': 'cover', 140 'background-repeat': 'no-repeat', 141 'background-position': 'center' 142 }); 143 } 144 145 $root.parent().css({ 146 "position": "relative" 147 }); 148 149 //if mobile browser break 150 var is_mobile = false;
151 (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) is_mobile = true;})(navigator.userAgent||navigator.vendor||window.opera); 152 153 if (is_mobile && !params.mobile) { 154 continue; 155 } 156 157 if (params['play-button'] || params['mute-button']) { 158 var $vbc = $('<div class="video-background-controls" />'); 159 $vbc.css({ 160 'position': 'absolute', 161 'z-index': 2, 162 'top': '10px', 163 'right': '10px' 164 }); 165 $root.parent().append($vbc); 166 } 167 168 //add a play toggle button 169 if (params['play-button']) { 170 var $btn = $('<button class="play-toggle"><i class="fa fa-pause-circle"></i></button>'); 171 172 if (!params.autoplay) { 173 $btn.addClass('paused'); 174 $this.find('i').removeClass('fa-pause-circle').addClass('fa-play-circle'); 175 } 176 177 $btn.on('click', function() { 178 var $this = $(this); 179 var player = $this.parent().parent().find('.youtube-background').data('yt-player'); 180 181 if ($this.hasClass('paused')) { 182 $this.removeClass('paused'); 183 $this.find('i').addClass('fa-pause-circle').removeClass('fa-play-circle'); 184 if (player) { 185 player.playVideo(); 186 } 187 } else { 188 $this.addClass('paused'); 189 $this.find('i').removeClass('fa-pause-circle').addClass('fa-play-circle'); 190 if (player) { 191 player.pauseVideo(); 192 } 193 } 194 }); 195 $root.parent().find('.video-background-controls').append($btn); 196 } 197 198 if (params['mute-button']) { 199 var $btn = $('<button class="mute-toggle"><i class="fa fa-volume-up"></i></button>'); 200 201 if (params.muted) { 202 $btn.addClass('muted'); 203 $btn.find('i').addClass('fa-volume-mute').removeClass('fa-volume-up'); 204 } 205 206 $btn.on('click', function() { 207 var $this = $(this); 208 var player = $this.parent().parent().find('.youtube-background').data('yt-player'); 209 210 if (!$this.hasClass('muted')) { 211 $this.addClass('muted'); 212 $this.find('i').addClass('fa-volume-mute').removeClass('fa-volume-up'); 213 if (player) { 214 player.mute(); 215 } 216 } else { 217 $this.removeClass('muted'); 218 $this.find('i').removeClass('fa-volume-mute').addClass('fa-volume-up'); 219 if (player) { 220 player.unMute(); 221 } 222 } 223 }); 224 $root.parent().find('.video-background-controls').append($btn); 225 } 226 227 //index the instance 228 function getRandomIntInclusive(min, max) { 229 min = Math.ceil(min); 230 max = Math.floor(max); 231 return Math.floor(Math.random() * (max - min + 1)) + min; //The maximum is inclusive and the minimum is inclusive 232 } 233 234 var uid = ytid +'-'+ getRandomIntInclusive(0, 999); 235 while (window.__ytbg_index.hasOwnProperty(uid)) { 236 uid = ytid +'-'+ getRandomIntInclusive(0, 999); 237 } 238 239 window.__ytbg_index[uid] = { 240 elem: $elem[0], 241 ytid: ytid 242 }; 243 } 244 } 245 build(); 246 247 window.onYouTubeIframeAPIReady = function () { 248 //instance index iterate 249 for (var k in window.__ytbg_index) { 250 var entry = window.__ytbg_index[k]; 251 var $root = $(entry.elem).parent(); 252 253 ytp = new YT.Player(entry.elem, { 254 height: '1080', 255 width: '1920', 256 videoId: entry.ytid, 257 playerVars: { 258 'controls': 0, 259 'autoplay': params.autoplay ? 1 : 0, 260 'mute': params.muted ? 1 : 0, 261 'origin': window.location.origin, 262 'loop': params.loop ? 1 : 0, 263 'rel': 0, 264 'ecver': 2, 265 'showinfo': 0, 266 'modestbranding': 1 267 }, 268 events: { 269 'onReady': onVideoPlayerReady, 270 'onStateChange': onVideoStateChange 271 } 272 }); 273 274 $root.data('yt-player', ytp); 275 delete window.__ytbg_index[k]; 276 } 277 }; 278 279 if (window.hasOwnProperty('YT') && window.YT.loaded) { 280 window.onYouTubeIframeAPIReady(); 281 } 282 283 return $this; 284 }; 285})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.