youtube-chapters
Version:
A chapters markers generator plugin for a YouTube video, built using JavaScript.
10 lines (9 loc) • 12.2 kB
JavaScript
/*!
* youtube-chapters
* A YouTube chapter generator
* https://github.com/VD39/youtube-chapters
* @author Vijay Dubb
* @version 3.1.0
* Copyright 2013. MIT licensed.
*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("YTC",[],t):"object"==typeof exports?exports.YTC=t():e.YTC=t()}(this,function(){return function(e){function t(i){if(n[i])return n[i].exports;var r=n[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=3)}([function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0}),t.YouTubeChapters=void 0;var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),a=n(2),o=n(4),s=function(e){return e&&e.__esModule?e:{default:e}}(o),l=[],u=[];t.YouTubeChapters=function(){function e(t,n){i(this,e),this.options=(0,a.defaultOption)(n,{});for(var r=0;r<l.length;r+=1)if(l[r]===t)throw new Error("An instance of YouTubeChapters with element "+t+" already exists.");if(!t||"string"!=typeof t)throw new Error("Element has not been set, please set an element.");if((0,s.default)(t).length<1)throw new Error("Element "+this.element+" does not exsit.");if(this._interval=null,this._playerReadyFunction=[],this._readyFunction=[],this.element=t,this.ytc={},this.ytc.id=(0,a.defaultOption)(this.options.id,Math.floor(99999*Math.random())),this.ytc.element="youtube-iframe-"+this.ytc.id,this.ytc.player=null,this.ytc.options={youtubeId:(0,a.defaultOption)(this.options.youtubeId,"bHQqvYy5KYo"),loader:(0,a.defaultOption)(this.options.loader,(0,a.loader)()),fluid:(0,a.defaultOption)(this.options.fluid,!1),playerVars:(0,a.defaultOption)(this.options.playerVars,{}),width:(0,a.defaultOption)(this.options.width,"500px"),height:(0,a.defaultOption)(this.options.height,"350px"),showTime:(0,a.defaultOption)(this.options.showTime,!1),chapters:(0,a.sort)((0,a.defaultOption)(this.options.chapters,[]))},(0,a.checkIds)(this.options.chapters))throw new Error("All ID's must be unqiue");this._init()}return r(e,[{key:"_init",value:function(){l.push(this.element),this._buildStruture()._addChapterPoints()._addTextPoints()._addYouTubeVideo()}},{key:"_buildStruture",value:function(){var e=(0,s.default)(this.element);return e.addElement("div",{class:"loading"},this.ytc.options.loader).addElement("div",{class:"youtube-chapter-wrapper"}),e.find(".loading").width(e.parent().width()),e.find(".youtube-chapter-wrapper").addElement("div",{class:"youtube-wrapper",style:"max-width: "+this.ytc.options.width}).addElement("div",{class:"chapters-wrapper"}).addElement("div",{class:"text-wrapper"}).find(".youtube-wrapper").addElement("div",{class:"youtube-video "+(this.ytc.options.fluid?"fluid-wrapper":""),id:"youtube-video-"+this.ytc.id}).find(".youtube-video").addElement("div",{class:"youtube-iframe",id:this.ytc.element}),e.find(".chapters-wrapper").addElement("ul",{id:"chapters-wrapper-"+this.ytc.id}),e.find(".text-wrapper").addElement("ul",{id:"text-wrapper-"+this.ytc.id}),this}},{key:"_addChapterPoints",value:function(){var e=this,t=function(t){t.preventDefault(),e.seekTo(t.currentTarget.getAttribute("data-time"))},n=(0,s.default)("#chapters-wrapper-"+this.ytc.id);return(0,s.default)(this.ytc.options.chapters).each(function(t,i){n.addElement("li",{class:"chapter-point-wrapper",id:"chapter-"+i.id+"-"+e.ytc.id,dataTime:(0,a.convertTime)(i.time)}).find("li.chapter-point-wrapper").addElement("div",{class:"chapter-point",id:"chapter-point-"+i.id+"-"+e.ytc.id},i.title).find(".chapter-point").addElement("span",{class:"time"},e.ytc.options.showTime?i.time:"")}),n.find("li.chapter-point-wrapper").addEvent("click",t),this}},{key:"_addTextPoints",value:function(){var e=this,t=(0,s.default)("#text-wrapper-"+this.ytc.id);return(0,s.default)(this.ytc.options.chapters).each(function(n,i){t.addElement("li",{class:"text-point",id:"text-point-"+i.id+"-"+e.ytc.id},i.text)}),this}},{key:"_addYouTubeVideo",value:function(){var e=this;if(window.YT&&window.YT.Player?this._playerSetup(this.ytc):u.push(function(){e._playerSetup(e.ytc)}),!window.onYouTubeIframeAPIReady){var t=document.createElement("script");t.src="https://www.youtube.com/iframe_api";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n),window.onYouTubePlayerAPIReady=function(){(0,s.default)(u).each(function(e,t){t()})}}return this}},{key:"_complete",value:function(){var e=(0,s.default)(this.element),t=this.ytc.options.fluid?e.find("#youtube-video-"+this.ytc.id).height():this.ytc.options.height.replace("px","");return e.find(".chapters-wrapper").height(t),e.find(".youtube-chapter-wrapper").addClass("complete"),e.find(".loading").remove(),this}},{key:"_callPlayerReady",value:function(){return(0,s.default)(this._playerReadyFunction).each(function(e,t){t()}),this._playerReadyFunction.length=0,this}},{key:"_callReady",value:function(){return this._readyFunction.length&&this._readyFunction[0](),this}},{key:"_playerSetup",value:function(e){var t=this,n=function(){t._complete()._callReady()._callPlayerReady()},i=function(e){var n=(0,s.default)(t.element+" .chapter-point-wrapper"),i=t.ytc.player,r=function(){n.each(function(e,t){var n=(0,s.default)(t),r=(0,s.default)("#"+t.getAttribute("id").replace("chapter","text-point")),a=parseFloat(n.attr("data-time")),o=void 0;o=n.next().length>0?parseFloat(n.next().attr("data-time")):i.getDuration(),n.removeClass("current"),r.removeClass("current"),i.getCurrentTime()>a&&i.getCurrentTime()<o&&(n.addClass("current"),r.isEmpty()||r.addClass("current"))})};switch(e.data){case YT.PlayerState.PLAYING:t._interval=setInterval(r,250);break;case YT.PlayerState.UNSTARTED:case YT.PlayerState.BUFFERING:case YT.PlayerState.CUED:break;case YT.PlayerState.PAUSED:case YT.PlayerState.ENDED:clearInterval(t._interval);break;default:throw clearInterval(t._interval),new Error("Something went wrong.")}},r=function(e){var t=e.data;if(150===t||101===t)throw new Error("Error: An error has occurred while the video was loading.");e.target.stopVideo()};e.player=new YT.Player(e.element,{height:e.options.height,width:e.options.width,videoId:e.options.youtubeId,playerVars:e.options.playerVars,events:{onReady:n,onStateChange:i,onError:r}})}},{key:"_seek",value:function(e){this.ytc.player.seekTo(e),this.ytc.player.playVideo()}},{key:"ready",value:function(e){var t=this;if("function"!=typeof e)throw new Error("ready method must include a function.");return window.YT&&window.YT.Player?e.call(this):this._readyFunction.push(function(){e.call(t,t)}),this}},{key:"seekTo",value:function(e){var t=this,n=parseFloat((0,a.convertTime)(e));return window.YT&&window.YT.Player&&0===this._playerReadyFunction.length?this._seek(n):this._playerReadyFunction.push(function(){t._seek(n)}),this}},{key:"goToChatperId",value:function(e){var t=this,n=(0,a.getTime)(this.ytc.options.chapters,e);if(!n)throw new Error("No id with "+e+" found.");var i=parseFloat(n);return window.YT&&window.YT.Player&&0===this._playerReadyFunction.length?this._seek(i):this._playerReadyFunction.push(function(){t._seek(i)}),this}},{key:"pause",value:function(){var e=this;return window.YT&&window.YT.Player&&0===this._playerReadyFunction.length?this.ytc.player.pauseVideo():this._playerReadyFunction.push(function(){e.ytc.player.pauseVideo()}),this}},{key:"play",value:function(){var e=this;return window.YT&&window.YT.Player&&0===this._playerReadyFunction.length?this.ytc.player.playVideo():this._playerReadyFunction.push(function(){e.ytc.player.playVideo()}),this}}],[{key:"setup",value:function(t,n){return new e(t,n)}}]),e}()},function(e,t){},function(e,t,n){"use strict";function i(e,t){return e&&void 0!==e?e:t}function r(e){if(!e)return!1;var t=e.map(function(e){return e.id});return t.some(function(e,n){return t.indexOf(e)!==n})}function a(e,t){if(!e)return!1;for(var n=0;n<e.length;n+=1)if(e[n].id===t)return s(e[n].time);return null}function o(e){return/^\d+$/.test(e)}function s(e){if(o(e))return e;var t=e.replace(/ /g,"").match(/(\d+h)?(\d+m)?(\d+s)?/);return t[0]?3600*(parseInt(t[1],10)||0)+60*(parseInt(t[2],10)||0)+(parseInt(t[3],10)||0):(t=e.split(":"),t.length>2?3600*parseInt(t[0],10)+60*parseInt(t[1],10)+1*parseInt(t[2],10):60*parseInt(t[0],10)+1*parseInt(t[1],10))}function l(e){return e.sort(function(e,t){return s(e.time)-s(t.time)})}function u(){return'<div class="loading-wrapper"><p class="loading-text">Loading YouTube Video</p></div>'}Object.defineProperty(t,"__esModule",{value:!0}),t.defaultOption=i,t.checkIds=r,t.getTime=a,t.convertTime=s,t.sort=l,t.loader=u},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(0);n(1),window.YTC=i.YouTubeChapters.setup,t.default=i.YouTubeChapters.setup,e.exports=t.default},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),a=function(){function e(t){if(i(this,e),!t)return void(this.length=0);if(Array.isArray(t))this.element=t;else if(t.nodeType)this.element=[],this.element[0]=t;else if(this.element=[],"string"==typeof t)for(var n=document.querySelectorAll(t),r=0;r<n.length;r+=1)this.element[r]=n[r];this.length=this.element.length}return r(e,[{key:"addElement",value:function(t,n,i){var r=document.createElement(t);if(n&&new e(r).attr(n),i&&(r.innerHTML=i),this.element.length)for(var a=0;a<this.element.length;a+=1)this.element[a].appendChild(r);else this.element.appendChild(r);return this}},{key:"find",value:function(t){for(var n=[],i=0;i<this.length;i+=1){var r=this.element[i].querySelectorAll(t);if(r)for(var a=0;a<r.length;a+=1)n.push(r[a])}return new e(n)}},{key:"addEvent",value:function(e,t){for(var n=0;n<this.length;n+=1)this.element[n].addEventListener(e,t,!1);return this}},{key:"each",value:function(e){for(var t=0;t<this.length&&!1!==e.call(this.element[t],t,this.element[t]);t+=1);return this}},{key:"addClass",value:function(e){if(this.element.length>0)for(var t=0;t<this.element.length;t+=1)this.element[t].classList.add(e);return this}},{key:"removeClass",value:function(e){if(this.element.length>0)for(var t=0;t<this.element.length;t+=1)this.element[t].classList.remove(e);return this}},{key:"height",value:function(e){if(!e)return this.element[0].clientHeight;for(var t=0;t<this.element.length;t+=1)this.element[t].style.height=e+"px";return this}},{key:"width",value:function(e){if(!e)return this.element[0].clientWidth;for(var t=0;t<this.element.length;t+=1)this.element[t].style.width=e+"px";return this}},{key:"attr",value:function(e){var t=this;return"string"==typeof e?this.element[0].getAttribute(e):(Object.keys(e).forEach(function(n){for(var i=0;i<t.element.length;i+=1)n.indexOf("data")>-1?t.element[i].dataset[n.toLowerCase().replace("data","")]=e[n]:t.element[i].setAttribute(n,e[n])}),this)}},{key:"remove",value:function(){for(var e=0;e<this.element.length;e+=1)this.element[e].parentNode.removeChild(this.element[e]);return this.length=this.element.length,this}},{key:"next",value:function(){return new e(this.element[0].nextElementSibling)}},{key:"isEmpty",value:function(){return""===this.element[0].innerHTML.trim()}},{key:"parent",value:function(){return new e(this.element[0].parentNode)}}],[{key:"findSelector",value:function(t){return new e(t)}}]),e}();t.default=a.findSelector,e.exports=t.default}])});