forked from stamat/youtube-background
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathjquery.youtube-background.min.js
1 lines (1 loc) · 12.1 KB
/
jquery.youtube-background.min.js
1
var tag=document.createElement("script");tag.src="https://www.youtube.com/player_api";var firstScriptTag=document.getElementsByTagName("script")[0];function YoutubeBackground(t,e,i,s){this.is_mobile=this.isMobile(),this.element=t,this.ytid=i,this.uid=s,this.player=null,this.buttons={},this.state={},this.state.play=!1,this.state.mute=!1,this.params={},this.defaults={pause:!1,"play-button":!1,"mute-button":!1,autoplay:!0,muted:!0,loop:!0,mobile:!1,"load-background":!0,resolution:"16:9","inline-styles":!0,offset:200},this.__init__=function(){this.ytid&&(this.parseProperties(e),this.params.resolution_mod=this.parseResolutionString(this.params.resolution),this.state.playing=this.params.autoplay,this.state.muted=this.params.muted,this.buildHTML(),this.injectIFrame(),this.params["play-button"]&&this.generateActionButton({name:"play",className:"play-toggle",innerHtml:'<i class="fa"></i>',initialState:!1,stateClassName:"paused",condition_parameter:"autoplay",stateChildClassNames:["fa-pause-circle","fa-play-circle"],actions:["play","pause"]}),this.params["mute-button"]&&this.generateActionButton({name:"mute",className:"mute-toggle",innerHtml:'<i class="fa"></i>',initialState:!0,stateClassName:"muted",condition_parameter:"muted",stateChildClassNames:["fa-volume-up","fa-volume-mute"],actions:["unmute","mute"]}))},this.__init__()}function ActivityMonitor(t,e,i,s,a){this.timer=null,this.timeout=s||1e4,this.activity_timer=null,this.activity_timeout=i||1e3,this.last_activity=null,this.resetTimer=function(){this.timer&&(clearTimeout(this.timer),this.timer=null);var t=this;this.timer=setTimeout(function(){t.last_activity+t.timeout+t.activity_timeout>=(new Date).getTime()&&e&&e()},this.timeout)},this.logActivity=function(){this.last_activity=(new Date).getTime(),t&&t()},this.onActivity=function(){var t;this.activity_timer||((t=this).activity_timer=setTimeout(function(){t.logActivity(),t.resetTimer(),clearTimeout(t.activity_timer),t.activity_timer=null},this.activity_timeout))},this.__init__=function(){var t=this;a?"string"==typeof a&&(a=[a]):a=["click","mousemove","scroll"];for(var e=0;e<a.length;e++)document.addEventListener(a[e],function(){t.onActivity()})},this.__init__()}function VideoBackgrounds(t,o){"string"==typeof(this.elements=t)&&(this.elements=document.querySelectorAll(t)),this.index={},this.re={},this.re.YOUTUBE=/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/ ]{11})/i,this.__init__=function(){for(var t=0;t<this.elements.length;t++){var e=this.elements[t],i=e.getAttribute("data-youtube"),s=this.getYTID(i),i=this.generateUID(s),s=new YoutubeBackground(e,o,s,i);i&&(this.index[i]=s)}var a=this;this.initYTPlayers(function(){o&&(o.hasOwnProperty("activity_timeout")||o.hasOwnProperty("inactivity_timeout"))&&(this.activity_monitor=new ActivityMonitor(function(){a.playVideos()},function(){a.pauseVideos()},o?o.activity_timeout:null,o?o.inactivity_timeout:null,["mousemove","scroll"]))})},this.__init__()}firstScriptTag.parentNode.insertBefore(tag,firstScriptTag),window.hasOwnProperty("d0")||(window.d0={},d0.hasClass=function(t,e){return t.classList?t.classList.contains(e):new RegExp("\\b"+e+"\\b").test(t.className)},d0.addClass=function(t,e){t.classList?t.classList.add(e):d0.hasClass(t,e)||(t.className+=" "+e)},d0.removeClass=function(t,e){t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("\\b"+e+"\\b","g"),"")},d0.toogleClass=function(t,e){d0.hasClass(t,e)?d0.removeClass(t,e):d0.addClass(t,e)}),YoutubeBackground.prototype.initYTPlayer=function(){var e=this;window.hasOwnProperty("YT")&&(this.player=new YT.Player(this.uid,{events:{onReady:function(t){e.onVideoPlayerReady(t)},onStateChange:function(t){e.onVideoStateChange(t)},onError:function(t){}}}))},YoutubeBackground.prototype.onVideoPlayerReady=function(t){this.params.autoplay&&t.target.playVideo()},YoutubeBackground.prototype.onVideoStateChange=function(t){0===t.data&&this.params.loop&&t.target.playVideo(),-1===t.data&&this.params.autoplay&&t.target.playVideo(),1===t.data&&(this.iframe.style.opacity=1)},YoutubeBackground.prototype.parseProperties=function(t){if(t)for(var e in this.defaults)if(t.hasOwnProperty(e)){if(void 0!==t[e]&&null!==t[e]){switch(t[e]){case"false":i=!1;break;case"true":i=!0;break;default:i=t[e]}this.params[e]=i}}else this.params[e]=this.defaults[e];else this.params=this.defaults;for(var e in this.params){var i;if(null!=(i=this.element.getAttribute("data-ytbg-"+e))){switch(i){case"false":i=!1;break;case"true":i=!0}this.params[e]=i}}this.params.pause&&(this.params["play-button"]=this.params.pause)},YoutubeBackground.prototype.injectIFrame=function(){this.iframe=document.createElement("iframe"),this.iframe.setAttribute("frameborder",0),this.iframe.setAttribute("allow",["autoplay; mute"]);var t="https://www.youtube.com/embed/"+this.ytid+"?enablejsapi=1&disablekb=1&controls=0&rel=0&iv_load_policy=3&cc_load_policy=0&playsinline=1&showinfo=0&modestbranding=1&fs=0&origin="+window.location.origin;this.params.muted&&(t+="&mute=1"),this.params.autoplay&&(t+="&autoplay=1"),this.params.loop&&(t+="&loop=1"),this.iframe.src=t,this.uid&&(this.iframe.id=this.uid),this.params["inline-styles"]&&(this.iframe.style.top="50%",this.iframe.style.left="50%",this.iframe.style.transform="translateX(-50%) translateY(-50%)",this.iframe.style.position="absolute",this.iframe.style.opacity=0),this.element.parentNode.appendChild(this.iframe),this.iframe.parentNode.removeChild(this.element);var s=this;function e(){var t=s.iframe.parentNode.offsetHeight+s.params.offset,e=s.iframe.parentNode.offsetWidth+s.params.offset,i=s.params.resolution_mod;e/t<i?(s.iframe.style.width=t*i+"px",s.iframe.style.height=t+"px"):(s.iframe.style.width=e+"px",s.iframe.style.height=e/i+"px")}window.addEventListener("resize",e),e()},YoutubeBackground.prototype.buildHTML=function(){var t=this.element.parentNode,e=document.createElement("div");e.className="youtube-background",t.insertBefore(e,this.element),e.appendChild(this.element);t=this.element.id;this.element.id="",e.id=t;var i,s={height:"100%",width:"100%","z-index":"0",position:"absolute",overflow:"hidden",top:0,left:0,bottom:0,right:0};for(i in this.params["mute-button"]||(s["pointer-events"]="none"),this.params["load-background"]&&(s["background-image"]="url(https://img.youtube.com/vi/"+this.ytid+"/maxresdefault.jpg)",this.params["inline-styles"]&&(s["background-size"]="cover",s["background-repeat"]="no-repeat",s["background-position"]="center")),s)e.style[i]=s[i];return e.parentNode.style.position="relative",this.is_mobile&&!this.params.mobile||(this.params["play-button"]||this.params["mute-button"])&&((t=document.createElement("div")).className="video-background-controls",t.style.position="absolute",t.style.top="10px",t.style.right="10px",t.style["z-index"]=2,this.controls_element=t,e.parentNode.appendChild(t)),e},YoutubeBackground.prototype.play=function(){var t;this.buttons.hasOwnProperty("play")&&(t=this.buttons.play,d0.removeClass(t.element,t.button_properties.stateClassName),d0.addClass(t.element.firstChild,t.button_properties.stateChildClassNames[0]),d0.removeClass(t.element.firstChild,t.button_properties.stateChildClassNames[1])),this.player&&this.player.playVideo()},YoutubeBackground.prototype.pause=function(){var t;this.buttons.hasOwnProperty("play")&&(t=this.buttons.play,d0.addClass(t.element,t.button_properties.stateClassName),d0.removeClass(t.element.firstChild,t.button_properties.stateChildClassNames[0]),d0.addClass(t.element.firstChild,t.button_properties.stateChildClassNames[1])),this.player&&this.player.pauseVideo()},YoutubeBackground.prototype.unmute=function(){var t;this.buttons.hasOwnProperty("mute")&&(t=this.buttons.mute,d0.removeClass(t.element,t.button_properties.stateClassName),d0.addClass(t.element.firstChild,t.button_properties.stateChildClassNames[0]),d0.removeClass(t.element.firstChild,t.button_properties.stateChildClassNames[1])),this.player&&this.player.unMute()},YoutubeBackground.prototype.mute=function(){var t;this.buttons.hasOwnProperty("mute")&&(t=this.buttons.mute,d0.addClass(t.element,t.button_properties.stateClassName),d0.removeClass(t.element.firstChild,t.button_properties.stateChildClassNames[0]),d0.addClass(t.element.firstChild,t.button_properties.stateChildClassNames[1])),this.player&&this.player.mute()},YoutubeBackground.prototype.generateActionButton=function(e){var t=document.createElement("button");t.className=e.className,t.innerHTML=e.innerHtml,d0.addClass(t.firstChild,e.stateChildClassNames[0]),this.params[e.condition_parameter]==e.initialState&&(d0.addClass(t,e.stateClassName),d0.removeClass(t.firstChild,e.stateChildClassNames[0]),d0.addClass(t.firstChild,e.stateChildClassNames[1]));var i=this;t.addEventListener("click",function(t){d0.hasClass(this,e.stateClassName)?(i.state[e.name]=!1,i[e.actions[0]]()):(i.state[e.name]=!0,i[e.actions[1]]())}),this.buttons[e.name]={element:t,button_properties:e},this.controls_element.appendChild(t)},YoutubeBackground.prototype.parseResolutionString=function(t){var e=t.split(/\s?:\s?/i);if(e.length<2)return 16/9;t=parseInt(e[0],10),e=parseInt(e[1],10);return isNaN(t)||isNaN(e)?16/9:t/e},YoutubeBackground.prototype.isMobile=function(t){var e,i=!1;return e=navigator.userAgent||navigator.vendor||window.opera,(/(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(e)||/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(e.substr(0,4)))&&(i=!0),i},YoutubeBackground.prototype.error=function(t,e){window.hasOwnProperty("console")&&window.console.hasOwnProperty("error")&&console.error(t,e)},VideoBackgrounds.prototype.getYTID=function(t){if(null!=t){t=t.match(this.re.YOUTUBE);if(t&&t.length)return this.re.YOUTUBE.lastIndex=0,t[1]}return null},VideoBackgrounds.prototype.generateUID=function(t){function e(t,e){return t=Math.ceil(t),e=Math.floor(e),Math.floor(Math.random()*(e-t+1))+t}for(var i=t+"-"+e(0,9999);this.index.hasOwnProperty(i);)i=t+"-"+e(0,9999);return i},VideoBackgrounds.prototype.pauseVideos=function(){for(var t in this.index)this.index[t].pause()},VideoBackgrounds.prototype.playVideos=function(){for(var t in this.index)this.index[t].play()},VideoBackgrounds.prototype.initYTPlayers=function(e){var i=this;window.onYouTubeIframeAPIReady=function(){for(var t in i.index)i.index[t].initYTPlayer();e&&setTimeout(e,100)},window.hasOwnProperty("YT")&&window.YT.loaded&&window.onYouTubeIframeAPIReady()},window.hasOwnProperty("jQuery")&&function(i){i.fn.youtube_background=function(t){var e=i(this);return new VideoBackgrounds(this,t),e}}(jQuery);