diff --git a/dist/angular-youtube-embed.min.js b/dist/angular-youtube-embed.min.js index 2d74588..05a0c56 100644 --- a/dist/angular-youtube-embed.min.js +++ b/dist/angular-youtube-embed.min.js @@ -2,4 +2,4 @@ angular-youtube-mb v1.3.1 https://github.com/brandly/angular-youtube-embed */ -angular.module("youtube-embed",[]).service("youtubeEmbedUtils",["$window","$rootScope",function(e,t){function r(e,t){return e.indexOf(t)>-1}function a(){t.$apply(function(){n.ready=!0})}var n={},i=/https?:\/\/(?:[0-9A-Z-]+\.)?(?:youtu\.be\/|youtube(?:-nocookie)?\.com\S*[^\w\s-])([\w-]{11})(?=[^\w-]|$)(?![?=&+%\w.-]*(?:['"][^<>]*>|<\/a>))[?=&+%\w.-]*/gi,o=/t=(\d+)[ms]?(\d+)?s?/;return n.getIdFromURL=function(e){var t=e.replace(i,"$1");if(r(t,";")){var a=t.split(";");if(r(a[1],"%")){var n=decodeURIComponent(a[1]);t=("http://youtube.com"+n).replace(i,"$1")}else t=a[0]}else r(t,"#")&&(t=t.split("#")[0]);return t},n.getTimeFromURL=function(e){e=e||"";var t=e.match(o);if(!t)return 0;var a=t[0],n=t[1],i=t[2];return"undefined"!=typeof i?(i=parseInt(i,10),n=parseInt(n,10)):r(a,"m")?(n=parseInt(n,10),i=0):(i=parseInt(n,10),n=0),i+60*n},n.ready=!1,"undefined"==typeof YT?(e.onYouTubeIframeAPIReady=a,console.log("Unable to find YouTube iframe library on this page.")):YT.loaded?n.ready=!0:YT.ready(a),n}]).directive("youtubeVideo",["$window","youtubeEmbedUtils",function(e,t){var r=1,a={"-1":"unstarted",0:"ended",1:"playing",2:"paused",3:"buffering",5:"queued"},n="youtube.player.";return e.YTConfig={host:"https://www.youtube.com"},{restrict:"EA",scope:{videoId:"=?",videoUrl:"=?",player:"=?",playerVars:"=?",playerHeight:"=?",playerWidth:"=?"},link:function(e,i,o){function u(){var t=Array.prototype.slice.call(arguments);e.$apply(function(){e.$emit.apply(e,t)})}function d(t){var r=a[t.data];"undefined"!=typeof r&&u(n+r,e.player,t),e.$apply(function(){e.player.currentState=r})}function l(t){u(n+"ready",e.player,t)}function y(t){u(n+"error",e.player,t)}function p(){var t=angular.copy(e.playerVars);t.start=t.start||e.urlStartTime;var r=new YT.Player(c,{height:e.playerHeight,width:e.playerWidth,videoId:e.videoId,playerVars:t,events:{onReady:l,onStateChange:d,onError:y}});return r.id=c,r}function f(){(e.videoId||e.playerVars.list)&&(e.player&&"function"==typeof e.player.destroy&&e.player.destroy(),e.player=p())}e.utils=t;var c=o.playerId||i[0].id||"unique-youtube-embed-id-"+r++;i[0].id=c,e.playerHeight=e.playerHeight||390,e.playerWidth=e.playerWidth||640,e.playerVars=e.playerVars||{};var s=e.$watch(function(){return e.utils.ready&&("undefined"!=typeof e.videoUrl||"undefined"!=typeof e.videoId||"undefined"!=typeof e.playerVars.list)},function(t){t&&(s(),"undefined"!=typeof e.videoUrl?e.$watch("videoUrl",function(t){e.videoId=e.utils.getIdFromURL(t),e.urlStartTime=e.utils.getTimeFromURL(t),f()}):"undefined"!=typeof e.videoId?e.$watch("videoId",function(){e.urlStartTime=null,f()}):e.$watch("playerVars.list",function(){e.urlStartTime=null,f()}))});e.$watchCollection(["playerHeight","playerWidth"],function(){e.player&&e.player.setSize(e.playerWidth,e.playerHeight)}),e.$on("$destroy",function(){e.player&&e.player.destroy()})}}}]); \ No newline at end of file +angular.module("youtube-embed",[]).service("youtubeEmbedUtils",["$window","$rootScope",function(e,r){function t(e,r){return e.indexOf(r)>-1}function a(){r.$apply(function(){n.ready=!0})}var n={},o=/https?:\/\/(?:[0-9A-Z-]+\.)?(?:youtu\.be\/|youtube(?:-nocookie)?\.com\S*[^\w\s-])([\w-]{11})(?=[^\w-]|$)(?![?=&+%\w.-]*(?:['"][^<>]*>|<\/a>))[?=&+%\w.-]*/gi,i=/t=(\d+)[ms]?(\d+)?s?/;return n.getIdFromURL=function(e){var r=e.replace(o,"$1");if(t(r,";")){var a=r.split(";");if(t(a[1],"%")){var n=decodeURIComponent(a[1]);r=("http://youtube.com"+n).replace(o,"$1")}else r=a[0]}else t(r,"#")&&(r=r.split("#")[0]);return r},n.getTimeFromURL=function(e){e=e||"";var r=e.match(i);if(!r)return 0;var a=r[0],n=r[1],o=r[2];return"undefined"!=typeof o?(o=parseInt(o,10),n=parseInt(n,10)):t(a,"m")?(n=parseInt(n,10),o=0):(o=parseInt(n,10),n=0),o+60*n},n.ready=!1,"undefined"==typeof YT?(e.onYouTubeIframeAPIReady=a,console.log("Unable to find YouTube iframe library on this page.")):YT.loaded?n.ready=!0:YT.ready(a),n}]).directive("youtubeVideo",["$window","youtubeEmbedUtils",function(e,r){var t=1,a={"-1":"unstarted",0:"ended",1:"playing",2:"paused",3:"buffering",5:"queued"},n="youtube.player.";return e.YTConfig={host:"https://www.youtube.com"},{restrict:"EA",scope:{videoId:"=?",videoUrl:"=?",player:"=?",playerVars:"=?",playerHeight:"=?",playerWidth:"=?"},link:function(e,o,i){function l(){var r=Array.prototype.slice.call(arguments);e.$apply(function(){e.$emit.apply(e,r)})}function y(r){var t=a[r.data];"undefined"!=typeof t&&l(n+t,e.player,r),e.$apply(function(){e.player.currentState=t})}function u(r){e.playerReady=!0,l(n+"ready",e.player,r)}function d(r){l(n+"error",e.player,r)}function p(){var r=angular.copy(e.playerVars);r.start=r.start||e.urlStartTime;var t=new YT.Player(f,{height:e.playerHeight,width:e.playerWidth,playerVars:r,events:{onReady:u,onStateChange:y,onError:d}});return t.id=f,t}function c(e){return void 0==e||null==e?!1:!0}function s(){e.player&&"function"==typeof e.player.destroy&&e.player.destroy(),e.player=p()}e.utils=r;var f=i.playerId||o[0].id||"unique-youtube-embed-id-"+t++;o[0].id=f,e.playerHeight=e.playerHeight||390,e.playerWidth=e.playerWidth||640,e.playerVars=e.playerVars||{},e.playerReady=!1,e.$watch(function(){return e.utils.ready},function(r){r&&!c(e.player)&&s()});var h=e.$watch(function(){return e.playerReady&&(c(e.videoUrl)||c(e.videoId)||c(e.playerVars.list))},function(r){r&&(h(),c(e.videoUrl)?e.$watch("videoUrl",function(r){e.videoId=e.utils.getIdFromURL(r),e.urlStartTime=e.utils.getTimeFromURL(r),e.player.loadVideoByUrl(r)}):c(e.videoId)?e.$watch("videoId",function(r){e.player.loadVideoById(r)}):c(e.playerVars.list)?e.$watch("playerVars.list",function(){e.player.loadPlaylist(e.playerVars.list)}):e.player.stopVideo())});e.$watchCollection(["playerHeight","playerWidth"],function(){e.player&&e.player.setSize(e.playerWidth,e.playerHeight)}),e.$on("$destroy",function(){e.player&&e.player.destroy()})}}}]); \ No newline at end of file diff --git a/package.json b/package.json index d245440..08a1175 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "angular-youtube-embed", - "version": "1.3.1", + "version": "1.3.2", "author": "Matthew Brandly", "license": "MIT", "main": "index.js", diff --git a/src/angular-youtube-embed.js b/src/angular-youtube-embed.js index cb7592d..7f46053 100644 --- a/src/angular-youtube-embed.js +++ b/src/angular-youtube-embed.js @@ -144,6 +144,7 @@ angular.module('youtube-embed', []) scope.playerHeight = scope.playerHeight || 390; scope.playerWidth = scope.playerWidth || 640; scope.playerVars = scope.playerVars || {}; + scope.playerReady = false // YT calls callbacks outside of digest cycle function applyBroadcast () { @@ -164,6 +165,7 @@ angular.module('youtube-embed', []) } function onPlayerReady (event) { + scope.playerReady = true applyBroadcast(eventPrefix + 'ready', scope.player, event); } @@ -177,7 +179,6 @@ angular.module('youtube-embed', []) var player = new YT.Player(playerId, { height: scope.playerHeight, width: scope.playerWidth, - videoId: scope.videoId, playerVars: playerVars, events: { onReady: onPlayerReady, @@ -190,50 +191,66 @@ angular.module('youtube-embed', []) return player; } - function loadPlayer () { - if (scope.videoId || scope.playerVars.list) { - if (scope.player && typeof scope.player.destroy === 'function') { - scope.player.destroy(); - } + function isExist (obj) { + if (obj == undefined || obj == null) { + return false + } + else { + return true + } + } - scope.player = createPlayer(); + function loadPlayer () { + if (scope.player && typeof scope.player.destroy === 'function') { + scope.player.destroy(); } + + scope.player = createPlayer(); }; + scope.$watch(function () { + return scope.utils.ready; + }, function (ready) { + if (ready && !isExist(scope.player)) { + loadPlayer() + } + }); + var stopWatchingReady = scope.$watch( function () { - return scope.utils.ready + return scope.playerReady // Wait until one of them is defined... - && (typeof scope.videoUrl !== 'undefined' - || typeof scope.videoId !== 'undefined' - || typeof scope.playerVars.list !== 'undefined'); + && (isExist(scope.videoUrl) + || isExist(scope.videoId) + || isExist(scope.playerVars.list)); }, function (ready) { if (ready) { stopWatchingReady(); // URL takes first priority - if (typeof scope.videoUrl !== 'undefined') { + if (isExist(scope.videoUrl)) { scope.$watch('videoUrl', function (url) { scope.videoId = scope.utils.getIdFromURL(url); scope.urlStartTime = scope.utils.getTimeFromURL(url); - loadPlayer(); + scope.player.loadVideoByUrl(url); }); // then, a video ID - } else if (typeof scope.videoId !== 'undefined') { - scope.$watch('videoId', function () { - scope.urlStartTime = null; - loadPlayer(); + } else if (isExist(scope.videoId)) { + scope.$watch('videoId', function (id) { + scope.player.loadVideoById(id); }); + // finally, a list - } else { + } else if (isExist(scope.playerVars.list)){ scope.$watch('playerVars.list', function () { - scope.urlStartTime = null; - loadPlayer(); + scope.player.loadPlaylist(scope.playerVars.list); }); + } else { + scope.player.stopVideo() } } });