Hopiu/angular.js
1
0
Fork 0
mirror of https://github.com/Hopiu/angular.js.git synced 2026-05-13 17:23:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(ngdocs): make jsFiddle and Plunkr links work with external AngularJS modules

Browse source
This commit is contained in:
Matias Niemelä 2013-07-26 18:41:39 -04:00 committed by Misko Hevery
parent 576269b1b7
commit 8d6bd51094
1 changed files with 87 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

111
docs/src/templates/js/docs.js
View file

@ -357,32 +357,85 @@ docsApp.serviceFactory.formPostData = function($document) {
}; };
}; };
docsApp.serviceFactory.openPlunkr = function(templateMerge, formPostData, angularUrls) {
return function(content) {
docsApp.serviceFactory.prepareEditorAssetTags = function(angularUrls) {
return function(content, options) {
options = options || {};
var includeLocalFiles = options.includeLocalFiles;
var html = makeScriptTag(angularUrls['angular.js']);
var allFiles = [].concat(content.js, content.css, content.html, content.json); var allFiles = [].concat(content.js, content.css, content.html, content.json);
angular.forEach(content.deps, function(file) {
if (file.name !== 'angular.js') {
var isLocal = false;
for(var i=0;i<allFiles.length;i++) {
if(allFiles[i].name == file.name) {
isLocal = true;
break;
}
}
if(!(isLocal && !includeLocalFiles)) {
var assetUrl = angularUrls[file.name] || file.name;
html += makeScriptTag(assetUrl);
}
}
});
if(includeLocalFiles) {
angular.forEach(content.css, function(file, index) {
html += makeCssLinkTag(file.name);
});
}
return html;
function makeScriptTag(src) {
return '<script type="text/javascript" src="' + src + '"></script>\n';
};
function makeCssLinkTag(src) {
return '<link rel="stylesheet" type="text/css" href="' + src + '" />\n';
};
};
};
docsApp.serviceFactory.openPlunkr = function(templateMerge, formPostData, prepareEditorAssetTags) {
return function(content) {
var hasRouting = false;
angular.forEach(content.deps, function(file) {
hasRouting = hasRouting || file.name == 'angular-route.js';
});
var indexHtmlContent = '<!doctype html>\n' + var indexHtmlContent = '<!doctype html>\n' +
'<html ng-app="{{module}}">\n' + '<html ng-app="{{module}}">\n' +
' <head>\n' + ' <head>\n' +
' <script src="{{angularJSUrl}}"></script>\n' + '{{scriptDeps}}';
'{{scriptDeps}}\n' +
' </head>\n' + if(hasRouting) {
' <body>\n\n' + indexHtmlContent += '<script type="text/javascript">\n' +
'{{indexContents}}' + '//this is here to make plunkr work with AngularJS routing\n' +
'\n\n </body>\n' + 'angular.element(document.getElementsByTagName(\'head\')).append(' +
'</html>\n'; 'angular.element(\'<base href="\' + window.location.pathname + \'" />\')' +
var scriptDeps = ''; ');\n' +
angular.forEach(content.deps, function(file) { '</script>\n';
if (file.name !== 'angular.js') { }
scriptDeps += ' <script src="' + file.name + '"></script>\n';
} indexHtmlContent += '</head>\n' +
}); ' <body>\n\n' +
'{{indexContents}}\n\n' +
' </body>\n' +
'</html>\n';
indexProp = { indexProp = {
module: content.module, module: content.module,
angularJSUrl: angularUrls['angular.js'], scriptDeps: prepareEditorAssetTags(content, { includeLocalFiles : true }),
scriptDeps: scriptDeps,
indexContents: content.html[0].content indexContents: content.html[0].content
}; };
var postData = {}; var postData = {};
var allFiles = [].concat(content.js, content.css, content.html, content.json);
angular.forEach(allFiles, function(file, index) { angular.forEach(allFiles, function(file, index) {
if (file.content && file.name != 'index.html') { if (file.content && file.name != 'index.html') {
postData['files[' + file.name + ']'] = file.content; postData['files[' + file.name + ']'] = file.content;
@ -399,13 +452,14 @@ docsApp.serviceFactory.openPlunkr = function(templateMerge, formPostData, angula
}; };
}; };
docsApp.serviceFactory.openJsFiddle = function(templateMerge, formPostData, angularUrls) { docsApp.serviceFactory.openJsFiddle = function(templateMerge, formPostData, prepareEditorAssetTags) {
var HTML = '<div ng-app=\"{{module}}\">\n{{html:2}}</div>', var HTML = '<div ng-app=\"{{module}}\">\n{{html:2}}</div>',
CSS = '</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> \n' + CSS = '</style> <!-- Ugly Hack to make remote files preload in jsFiddle --> \n' +
'{{head:0}}<style>\n​.ng-invalid { border: 1px solid red; }​\n{{css}}', '{{head:0}}<style>\n​.ng-invalid { border: 1px solid red; }​\n{{css}}',
SCRIPT = '{{script}}', SCRIPT = '{{script}}',
SCRIPT_CACHE = '\n\n<!-- {{name}} -->\n<script type="text/ng-template" id="{{name}}">\n{{content:2}}</script>'; SCRIPT_CACHE = '\n\n<!-- {{name}} -->\n<script type="text/ng-template" id="{{name}}">\n{{content:2}}</script>',
BASE_HREF_TAG = '<!-- Ugly Hack to make AngularJS routing work inside of jsFiddle -->\n' +
'<base href="/" />\n\n';
return function(content) { return function(content) {
var prop = { var prop = {
@ -415,8 +469,6 @@ docsApp.serviceFactory.openJsFiddle = function(templateMerge, formPostData, angu
script: '' script: ''
}; };
prop.head = templateMerge('<script src="{{url}}"></script>', {url: angularUrls['angular.js']});
angular.forEach(content.html, function(file, index) { angular.forEach(content.html, function(file, index) {
if (index) { if (index) {
prop.html += templateMerge(SCRIPT_CACHE, file); prop.html += templateMerge(SCRIPT_CACHE, file);
@ -425,6 +477,8 @@ docsApp.serviceFactory.openJsFiddle = function(templateMerge, formPostData, angu
} }
}); });
prop.head = prepareEditorAssetTags(content, { includeLocalFiles : false });
angular.forEach(content.js, function(file, index) { angular.forEach(content.js, function(file, index) {
prop.script += file.content; prop.script += file.content;
}); });
@ -433,9 +487,18 @@ docsApp.serviceFactory.openJsFiddle = function(templateMerge, formPostData, angu
prop.css += file.content; prop.css += file.content;
}); });
var hasRouting = false;
angular.forEach(content.deps, function(file) {
hasRouting = hasRouting || file.name == 'angular-route.js';
});
var compiledHTML = templateMerge(HTML, prop);
if(hasRouting) {
compiledHTML = BASE_HREF_TAG + compiledHTML;
}
formPostData("http://jsfiddle.net/api/post/library/pure/", { formPostData("http://jsfiddle.net/api/post/library/pure/", {
title: 'AngularJS Example', title: 'AngularJS Example',
html: templateMerge(HTML, prop), html: compiledHTML,
js: templateMerge(SCRIPT, prop), js: templateMerge(SCRIPT, prop),
css: templateMerge(CSS, prop) css: templateMerge(CSS, prop)
}); });