Merge pull request #201 from fancycode/load_youtube_sandbox_lazily

Load YouTube sandbox lazily.

static/js/directives/youtubevideo.js

@@ -104,18 +104,23 @@ define(['require', 'jquery', 'underscore', 'moment', 'text!partials/youtubevideo
 			var isPaused = null;
 			var playReceivedNow = null;
 			var initialState = null;
+			var sandboxApi = null;
+
+			var createSandboxApi = function() {
+				if (!sandboxApi) {
 					var sandboxFrame = $("#youtubeplayer", $element)[0];
 
 					var template = sandboxTemplate;
 					template = template.replace(/__PARENT_ORIGIN__/g, $window.location.protocol + "//" + $window.location.host);
 					template = template.replace(/__YOUTUBE_SANDBOX_JS_URL__/g, restURL.createAbsoluteUrl(require.toUrl('sandboxes/youtube') + ".js"));
-			var sandboxApi = sandbox.createSandbox(sandboxFrame, template);
+					sandboxApi = sandbox.createSandbox(sandboxFrame, template);
 
 					sandboxApi.e.on("message", function(event, message) {
 						var msg = message.data;
 						var data = msg[msg.type] || {};
 						switch (msg.type) {
 						case "ready":
+							sandboxApi.postMessage("loadApi", {"url": $window.location.protocol + YOUTUBE_IFRAME_API_URL});
 							break;
 						case "youtube.apiReady":
 							$scope.$apply(function() {
@@ -152,13 +157,17 @@ define(['require', 'jquery', 'underscore', 'moment', 'text!partials/youtubevideo
 							break;
 						}
 					});
+				}
+			}
 
 			$scope.$on("$destroy", function() {
 				if (player) {
 					player.destroy();
 				}
+				if (sandboxApi) {
 					sandboxApi.destroy();
 					sandboxApi = null;
+				}
 			});
 
 			var errorIds = {
@@ -506,12 +515,8 @@ define(['require', 'jquery', 'underscore', 'moment', 'text!partials/youtubevideo
 				}
 			};
 
-			$scope.loadYouTubeAPI = function() {
-				sandboxApi.postMessage("loadApi", {"url": $window.location.protocol + YOUTUBE_IFRAME_API_URL});
-			};
-
 			$scope.showYouTubeVideo = function() {
-				$scope.loadYouTubeAPI();
+				createSandboxApi();
 				$scope.layout.youtubevideo = true;
 				$scope.$emit("mainview", "youtubevideo", true);
 				if (currentToken) {