diff --git a/docs/app/src/docs.js b/docs/app/src/docs.js
index 03c70d8d9dc7..44524e38b771 100644
--- a/docs/app/src/docs.js
+++ b/docs/app/src/docs.js
@@ -1,13 +1,11 @@
angular.module('DocsController', [])
.controller('DocsController', [
- '$scope', '$rootScope', '$location', '$window', '$cookies', 'openPlunkr',
+ '$scope', '$rootScope', '$location', '$window', '$cookies',
'NG_PAGES', 'NG_NAVIGATION', 'NG_VERSION',
- function($scope, $rootScope, $location, $window, $cookies, openPlunkr,
+ function($scope, $rootScope, $location, $window, $cookies,
NG_PAGES, NG_NAVIGATION, NG_VERSION) {
- $scope.openPlunkr = openPlunkr;
-
$scope.docsVersion = NG_VERSION.isSnapshot ? 'snapshot' : NG_VERSION.version;
$scope.navClass = function(navItem) {
diff --git a/docs/app/src/examples.js b/docs/app/src/examples.js
index 1f0f2aa4e83e..0cae68b9ec93 100644
--- a/docs/app/src/examples.js
+++ b/docs/app/src/examples.js
@@ -22,15 +22,14 @@ angular.module('examples', [])
};
}])
-
-.factory('openPlunkr', ['formPostData', '$http', '$q', function(formPostData, $http, $q) {
-
+.factory('createCopyrightNotice', function() {
var COPYRIGHT = 'Copyright ' + (new Date()).getFullYear() + ' Google Inc. All Rights Reserved.\n'
+ 'Use of this source code is governed by an MIT-style license that\n'
+ 'can be found in the LICENSE file at http://angular.io/license';
var COPYRIGHT_JS_CSS = '\n\n/*\n' + COPYRIGHT + '\n*/';
var COPYRIGHT_HTML = '\n\n';
- function getCopyright(filename) {
+
+ return function getCopyright(filename) {
switch (filename.substr(filename.lastIndexOf('.'))) {
case '.html':
return COPYRIGHT_HTML;
@@ -41,29 +40,92 @@ angular.module('examples', [])
return COPYRIGHT;
}
return '';
- }
+ };
+})
+
+.directive('plnkrOpener', ['$q', 'getExampleData', 'formPostData', 'createCopyrightNotice', function($q, getExampleData, formPostData, createCopyrightNotice) {
+ return {
+ scope: {},
+ bindToController: {
+ 'examplePath': '@'
+ },
+ controllerAs: 'plnkr',
+ template: ' ',
+ controller: [function() {
+ var ctrl = this;
+
+ ctrl.example = {
+ path: ctrl.examplePath,
+ manifest: undefined,
+ files: undefined,
+ name: 'AngularJS Example'
+ };
+
+ ctrl.prepareExampleData = function() {
+ if (ctrl.example.manifest) {
+ return $q.when(ctrl.example);
+ }
+
+ return getExampleData(ctrl.examplePath).then(function(data) {
+ ctrl.example.files = data.files;
+ ctrl.example.manifest = data.manifest;
+
+ // Build a pretty title for the Plunkr
+ var exampleNameParts = data.manifest.name.split('-');
+ exampleNameParts.unshift('AngularJS');
+ angular.forEach(exampleNameParts, function(part, index) {
+ exampleNameParts[index] = part.charAt(0).toUpperCase() + part.substr(1);
+ });
+ ctrl.example.name = exampleNameParts.join(' - ');
+
+ return ctrl.example;
+ });
+ };
+
+ ctrl.open = function(clickEvent) {
+
+ var newWindow = clickEvent.ctrlKey || clickEvent.metaKey;
- return function(exampleFolder, clickEvent) {
+ var postData = {
+ 'tags[0]': "angularjs",
+ 'tags[1]': "example",
+ 'private': true
+ };
- var exampleName = 'AngularJS Example';
- var newWindow = clickEvent.ctrlKey || clickEvent.metaKey;
+ // Make sure the example data is available.
+ // If an XHR must be made, this might break some pop-up blockers when
+ // new window is requested
+ ctrl.prepareExampleData()
+ .then(function() {
+ angular.forEach(ctrl.example.files, function(file) {
+ postData['files[' + file.name + ']'] = file.content + createCopyrightNotice(file.name);
+ });
+ postData.description = ctrl.example.name;
+
+ formPostData('http://plnkr.co/edit/?p=preview', newWindow, postData);
+ });
+
+ };
+
+ // Initialize the example data, so it's ready when clicking the open button.
+ // Otherwise pop-up blockers will prevent a new window from opening
+ ctrl.prepareExampleData(ctrl.example.path);
+
+ }]
+ };
+}])
+
+.factory('getExampleData', ['$http', '$q', function($http, $q) {
+ return function(exampleFolder){
// Load the manifest for the example
- $http.get(exampleFolder + '/manifest.json')
+ return $http.get(exampleFolder + '/manifest.json')
.then(function(response) {
return response.data;
})
.then(function(manifest) {
var filePromises = [];
- // Build a pretty title for the Plunkr
- var exampleNameParts = manifest.name.split('-');
- exampleNameParts.unshift('AngularJS');
- angular.forEach(exampleNameParts, function(part, index) {
- exampleNameParts[index] = part.charAt(0).toUpperCase() + part.substr(1);
- });
- exampleName = exampleNameParts.join(' - ');
-
angular.forEach(manifest.files, function(filename) {
filePromises.push($http.get(exampleFolder + '/' + filename, { transformResponse: [] })
.then(function(response) {
@@ -71,7 +133,7 @@ angular.module('examples', [])
// The manifests provide the production index file but Plunkr wants
// a straight index.html
if (filename === "index-production.html") {
- filename = "index.html"
+ filename = "index.html";
}
return {
@@ -80,21 +142,11 @@ angular.module('examples', [])
};
}));
});
- return $q.all(filePromises);
- })
- .then(function(files) {
- var postData = {};
- angular.forEach(files, function(file) {
- postData['files[' + file.name + ']'] = file.content + getCopyright(file.name);
+ return $q.all({
+ manifest: manifest,
+ files: $q.all(filePromises)
});
-
- postData['tags[0]'] = "angularjs";
- postData['tags[1]'] = "example";
- postData.private = true;
- postData.description = exampleName;
-
- formPostData('http://plnkr.co/edit/?p=preview', newWindow, postData);
});
};
-}]);
+}]);
\ No newline at end of file
diff --git a/docs/app/test/docsSpec.js b/docs/app/test/docsSpec.js
index 477e6ddbca75..e8ebe2103997 100644
--- a/docs/app/test/docsSpec.js
+++ b/docs/app/test/docsSpec.js
@@ -3,7 +3,6 @@ describe("DocsController", function() {
angular.module('fake', [])
.value('$cookies', {})
- .value('openPlunkr', function() {})
.value('NG_PAGES', {})
.value('NG_NAVIGATION', {})
.value('NG_VERSION', {});
diff --git a/docs/config/templates/runnableExample.template.html b/docs/config/templates/runnableExample.template.html
index c01f1480b7d7..26d689c10ad5 100644
--- a/docs/config/templates/runnableExample.template.html
+++ b/docs/config/templates/runnableExample.template.html
@@ -2,9 +2,7 @@
is HTML and wrap each line in a - thus breaking the HTML #}