aboutsummaryrefslogtreecommitdiffstats
path: root/docs/src/templates/index.html
diff options
context:
space:
mode:
authorVojta Jina2011-08-30 11:47:24 +0200
committerIgor Minar2011-09-26 23:51:53 +0200
commit13f92de6246a0af8450fde84b209211a56397fda (patch)
tree2e277d50a67f32dddcb1e7674ed8b1476881e014 /docs/src/templates/index.html
parent2bc39bb0b4f81b77597bb52f8572d231cf4f83e2 (diff)
downloadangular.js-13f92de6246a0af8450fde84b209211a56397fda.tar.bz2
feat(docs): use html5 history api for all routing in the docs app
- Configure our docs app to use new $location with html5 history api! - Update simple node web server to serve index.html for all links (rewritting). - Update .htaccess file to serve index.html for all links (rewritting). - At runtime determine the base href path and attach it to the DOM. We needed the absolute URL to get all browsers to work well. - Because of the above, we also need to dynamically determine all needed js/css resources and add them to the DOM. This was needed because FF6 would eagerly fetch resources with wrong URL since the base element is added to the dom at runtime. - All content html files were moved to the partials directory, because with the new html5 urls it was impossible to tell if request for http://domain/api/angular.filter.html was an html5 url for the html filter doc page, or an xhr/appcache request for the content html file for the html filter. f
Diffstat (limited to 'docs/src/templates/index.html')
-rw-r--r--docs/src/templates/index.html86
1 files changed, 63 insertions, 23 deletions
diff --git a/docs/src/templates/index.html b/docs/src/templates/index.html
index d5cfaed2..a2def7a6 100644
--- a/docs/src/templates/index.html
+++ b/docs/src/templates/index.html
@@ -5,23 +5,57 @@
doc:manifest>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title ng:bind-template="AngularJS: {{partialTitle}}">AngularJS</title>
<meta name="fragment" content="!">
- <link rel="stylesheet" href="docs-combined.css" type="text/css"/>
- <link rel="stylesheet" href="syntaxhighlighter/syntaxhighlighter-combined.css" type="text/css"/>
+ <title ng:bind-template="AngularJS: {{partialTitle}}">AngularJS</title>
+ <script type="text/javascript">
+ // dynamically add base tag as well as css and javascript files.
+ // we can't add css/js the usual way, because some browsers (FF) eagerly prefetch resources
+ // before the base attribute is added, causing 404 and terribly slow loading of the docs app.
+ (function() {
+ var indexFile = (location.pathname.match(/\/(index[^\.]*\.html)/) || ['', 'index.html'])[1],
+ rUrl = /(api|guide|misc|tutorial|cookbook|index[^\.]*\.html).*$/,
+ baseUrl = location.href.replace(rUrl, indexFile),
+ jQuery = /index-jq[^\.]*\.html$/.test(baseUrl),
+ debug = /index[^\.]*-debug\.html$/.test(baseUrl),
+ angularPath = debug ? '../angular.js' : '../angular.min.js',
+ headEl = document.getElementsByTagName('head')[0],
+ sync = true;
- <script>
- // GA asynchronous tracker
- var _gaq = _gaq || [];
- _gaq.push(['_setAccount', 'UA-8594346-3']);
- _gaq.push(['_setDomainName', '.angularjs.org']);
+ addTag('base', {href: baseUrl});
+ addTag('link', {rel: 'stylesheet', href: 'docs-combined.css', type: 'text/css'});
+ addTag('link', {rel: 'stylesheet', href: 'syntaxhighlighter/syntaxhighlighter-combined.css',
+ type: 'text/css'});
+ addTag('script', {src: 'syntaxhighlighter/syntaxhighlighter-combined.js'}, sync);
+ if (jQuery) addTag('script', {src: 'jquery.min.js'});
+ addTag('script', {src: angularPath, 'ng:autobind':''}, sync);
+ addTag('script', {src: 'docs-combined.js'}, sync);
+ addTag('script', {src: 'docs-keywords.js'}, sync);
- (function() {
- var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
- ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
- var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+ function addTag(name, attributes, sync) {
+ var el = document.createElement(name),
+ attrName;
+
+ for (attrName in attributes) {
+ el.setAttribute(attrName, attributes[attrName]);
+ }
+
+ sync ? document.write(outerHTML(el)) : headEl.appendChild(el);
+ }
+
+ function outerHTML(node){
+ // if IE, Chrome take the internal method otherwise build one
+ return node.outerHTML || (
+ function(n){
+ var div = document.createElement('div'), h;
+ div.appendChild(n);
+ h = div.innerHTML;
+ div = null;
+ return h;
+ })(node);
+ }
})();
+
// force page reload when new update is available
window.applicationCache && window.applicationCache.addEventListener('updateready', function(e) {
if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
@@ -29,6 +63,18 @@
window.location.reload();
}
}, false);
+
+
+ // GA asynchronous tracker
+ var _gaq = _gaq || [];
+ _gaq.push(['_setAccount', 'UA-8594346-3']);
+ _gaq.push(['_setDomainName', '.angularjs.org']);
+
+ (function() {
+ var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+ })();
</script>
</head>
@@ -45,11 +91,11 @@
<ul id="navbar">
<li><a href="http://angularjs.org/">AngularJS</a></li>
- <li><a href="#!/misc/started" ng:class="selectedSection('misc')">Getting Started</a></li>
- <li><a href="#!/tutorial" ng:class="selectedSection('tutorial')">Tutorial</a></li>
- <li><a href="#!/api" ng:class="selectedSection('api')">API Reference</a></li>
- <li><a href="#!/cookbook" ng:class="selectedSection('cookbook')">Examples</a></li>
- <li><a href="#!/guide" ng:class="selectedSection('guide')">Developer Guide</a></li>
+ <li><a href="misc/started" ng:class="selectedSection('misc')">Getting Started</a></li>
+ <li><a href="tutorial" ng:class="selectedSection('tutorial')">Tutorial</a></li>
+ <li><a href="api" ng:class="selectedSection('api')">API Reference</a></li>
+ <li><a href="cookbook" ng:class="selectedSection('cookbook')">Examples</a></li>
+ <li><a href="guide" ng:class="selectedSection('guide')">Developer Guide</a></li>
</ul>
<div id="sidebar">
@@ -100,11 +146,5 @@
<button id="cacheButton" ng:click="enableOffline()">Let me have them all!</button>
</div>
</div>
-
- <script src="syntaxhighlighter/syntaxhighlighter-combined.js"></script>
- <!-- jquery place holder -->
- <!-- angular script place holder -->
- <script src="docs-combined.js"></script>
- <script src="docs-keywords.js"></script>
</body>
</html>
generated by cgit v1.2.3 (git 2.25.1) at 2025-12-16 21:23:22 +0000