feat(docs): updates for angularjs 1.2.7

BRACKING CHANGE Works only with angularjs 1.2+ compitible code ATTENTION Clear your old docs js and css folder on upgrade!
m7r · Jan 10, 2014 · 0eb8fa2 · 0eb8fa2
1 parent c168139
commit 0eb8fa2
Show file tree

Hide file tree

Showing 14 changed files with 3,724 additions and 345 deletions.
diff --git a/README.md b/README.md
@@ -2,6 +2,10 @@
 Grunt plugin to create a documentation like [AngularJS](http://docs.angularjs.org)
 NOTE: this plugin requires Grunt 0.4.x
 
+ATTENTION: grunt-ngdocs 0.2+ is for angularjs 1.2+
+If you use on older version stay with grunt-ngdocs 0.1+
+Please clear your old docs js and css folders after upgrade.
+
 ##Getting Started
 From the same directory as your project's Gruntfile and package.json, install this plugin with the following command:
 
@@ -116,10 +120,6 @@ Wraps the navbar image in an anchor tag with the provided URL.
 The best matching page for a search query is highlighted and get selected on return.
 If this option is set to true the best match is shown below the search field in an dropdown menu. Use this for long lists where the highlight is often not visible.
 
-####animation
-[default] 'false' or 'true' for the included angularjs, angularjs 1.1.5+ from CDN or a folder like /vendor/angular-1.1.5/angular.js.  
-Set to 'true' to enable animations in the sidebar.
-
 ####navTemplate
 [default] null  
 Path to a template of a nav HTML template to include.  The css for it 

diff --git a/src/templates/css/animations.css b/src/templates/css/animations.css
@@ -1,32 +1,20 @@
-.reveal {
-  -webkit-transition:1s linear all;
-  -moz-transition:1s linear all;
-  -o-transition:1s linear all;
-  transition:1s linear all;
-
-  opacity:0;
-}
-.reveal.reveal-active {
-  opacity:1;
-}
-
-.slide-reveal {
+.slide-reveal.ng-enter {
   -webkit-transition:0.5s linear all;
   -moz-transition:0.5s linear all;
   -o-transition:0.5s linear all;
   transition:0.5s linear all;
-  opacity:0.5;
 
+  opacity:0.5;
   position:relative;
   opacity:0;
   top:10px;
 }
-.slide-reveal.slide-reveal-active {
+.slide-reveal.ng-enter-active {
   top:0;
   opacity:1;
 }
 
-.expand-enter {
+.expand.ng-enter {
   -webkit-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
   -moz-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
   -o-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
@@ -36,12 +24,12 @@
   max-height:0;
   overflow:hidden;
 }
-.expand-enter.expand-enter-active {
+.expand.ng-enter-active {
   opacity:1;
   max-height:40px;
 }
 
-.expand-leave {
+.expand.ng-leave {
   -webkit-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
   -moz-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
   -o-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
@@ -51,26 +39,7 @@
   max-height:40px;
   overflow:hidden;
 }
-.expand-leave.expand-leave-active {
+.expand.ng-leave-active {
   opacity:0;
   max-height:0;
 }
-
-.example-animate-container {
-  position:relative;
-  background:white;
-  border:1px solid black;
-  height:40px;
-  overflow:hidden;
-}
-
-.example-animate-container > div {
-  padding:1em;
-}
-
-.animator-container.animations-off * {
-  -webkit-transition: none;
-  -moz-transition: none;
-  -o-transition: color 0 ease-in; /* opera is special :) */
-  transition: none;
-}
diff --git a/src/templates/css/doc_widgets.css b/src/templates/css/doc_widgets.css
@@ -15,7 +15,7 @@ ul.doc-example > li {
 
 ul.doc-example > li.doc-example-heading {
   border: none;
-  border-radius: none;
+  border-radius: 0;
   margin-bottom: -10px;
 }
 

diff --git a/src/templates/css/prettify.css b/src/templates/css/prettify.css
@@ -0,0 +1,51 @@
+.pln { color: #000 }  /* plain text */
+
+@media screen {
+  .str { color: #080 }  /* string content */
+  .kwd { color: #008 }  /* a keyword */
+  .com { color: #800 }  /* a comment */
+  .typ { color: #606 }  /* a type name */
+  .lit { color: #066 }  /* a literal value */
+  /* punctuation, lisp open bracket, lisp close bracket */
+  .pun, .opn, .clo { color: #660 }
+  .tag { color: #008 }  /* a markup tag name */
+  .atn { color: #606 }  /* a markup attribute name */
+  .atv { color: #080 }  /* a markup attribute value */
+  .dec, .var { color: #606 }  /* a declaration; a variable name */
+  .fun { color: red }  /* a function name */
+}
+
+/* Use higher contrast and text-weight for printable form. */
+@media print, projection {
+  .str { color: #060 }
+  .kwd { color: #006; font-weight: bold }
+  .com { color: #600; font-style: italic }
+  .typ { color: #404; font-weight: bold }
+  .lit { color: #044 }
+  .pun, .opn, .clo { color: #440 }
+  .tag { color: #006; font-weight: bold }
+  .atn { color: #404 }
+  .atv { color: #060 }
+}
+
+pre.prettyprint {
+  padding: 8px;
+  background-color: #f7f7f9;
+  border: 1px solid #e1e1e8;
+}
+pre.prettyprint.linenums {
+  -webkit-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
+     -moz-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
+          box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
+}
+ol.linenums {
+  margin: 0 0 0 33px; /* IE indents via margin-left */
+} 
+ol.linenums li {
+  padding-left: 12px;
+  font-size:12px;
+  color: #bebec5;
+  line-height: 18px;
+  text-shadow: 0 1px 0 #fff;
+  list-style-type:decimal!important;
+}
diff --git a/src/templates/index.tmpl b/src/templates/index.tmpl
@@ -26,6 +26,7 @@
       addTag('base', {href: baseUrl});
       addTag('link', {rel: 'stylesheet', href: 'css/bootstrap.min.css', type: 'text/css'});
       addTag('link', {rel: 'stylesheet', href: 'css/font-awesome.css', type: 'text/css'});
+      addTag('link', {rel: 'stylesheet', href: 'css/prettify.css', type: 'text/css'});
       addTag('link', {rel: 'stylesheet', href: 'css/docs.css', type: 'text/css'});
       addTag('link', {rel: 'stylesheet', href: 'css/animations.css', type: 'text/css'});
       <% _.forEach(styles, function(url) { %>
@@ -34,8 +35,10 @@
       <% _.forEach(scripts, function(url) { %>
         addTag('script', {src: '<%= url %>'}, sync);
       <% }); %>
-      addTag('script', {src: 'js/angular-bootstrap.min.js'}, sync);
-      addTag('script', {src: 'js/angular-bootstrap-prettify.min.js'}, sync);
+      addTag('script', {src: 'js/angular-bootstrap.js'}, sync);
+      addTag('script', {src: 'js/angular-bootstrap-prettify.js'}, sync);
+      addTag('script', {src: 'js/google-code-prettify.js'}, sync);
+      addTag('script', {src: 'js/marked.js'}, sync);
       addTag('script', {src: 'js/docs-setup.js'}, sync);
       addTag('script', {src: 'js/docs.js'}, sync);
 
@@ -150,55 +153,55 @@
           <div class="spacer"></div>
 
           <ul class="nav nav-list well" ng-show="pages">
-            <li ng-repeat="page in pages<%= trackBy('page.url', "'expand'") %>" ng-class="navClass(page)" class="api-list-item">
+            <li ng-repeat="page in pages track by page.url" ng-class="navClass(page)" class="api-list-item expand">
               <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
             </li>
           </ul>
 
-          <ul class="nav nav-list well" ng-repeat="module in modules<%= trackBy('module.url') %>" class="api-list-item">
+          <ul class="nav nav-list well" ng-repeat="module in modules track by module.url" class="api-list-item">
             <li class="nav-header module">
               <a class="guide">module</a>
               <a class="code" href="{{module.url}}">{{module.name}}</a>
             </li>
 
-            <li ng-repeat="page in module.others<%= trackBy('page.url', "'expand'") %>" ng-class="navClass(page)" class="api-list-item">
+            <li ng-repeat="page in module.others track by page.url" ng-class="navClass(page)" class="api-list-item expand">
               <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
             </li>
 
             <li class="nav-header section" ng-show="module.directives">
               <a class="guide">directive</a>
             </li>
-            <li ng-repeat="page in module.directives<%= trackBy('page.url', "'expand'") %>" ng-class="navClass(page)" class="api-list-item">
+            <li ng-repeat="page in module.directives track by page.url" ng-class="navClass(page)" class="api-list-item expand">
               <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
             </li>
 
             <li class="nav-header section" ng-show="module.filters">
               <a class="guide">filter</a>
             </li>
-            <li ng-repeat="page in module.filters<%= trackBy('page.url', "'expand'") %>" ng-class="navClass(page)" class="api-list-item">
+            <li ng-repeat="page in module.filters track by page.url" ng-class="navClass(page)" class="api-list-item expand">
               <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
             </li>
 
             <li class="nav-header section" ng-show="module.services">
               <a class="guide">service</a>
             </li>
-            <li ng-repeat="service in module.services<%= trackBy('service.instance.url', "'expand'") %>" ng-class="navClass(service.instance, service.provider)" class="api-list-item">
+            <li ng-repeat="service in module.services track by service.instance.url" ng-class="navClass(service.instance, service.provider)" class="api-list-item expand">
               <a ng-show="service.provider" class="pull-right" href="{{service.provider.url}}" tabindex="2"><i class="icon-cog"></i></a>
               <a href="{{service.instance.url}}" tabindex="2">{{service.name}}</a>
             </li>
 
             <li class="nav-header section" ng-show="module.types">
               <a class="guide">Types</a>
             </li>
-            <li ng-repeat="page in module.types<%= trackBy('page.url', "'expand'") %>" ng-class="navClass(page)" class="api-list-item">
+            <li ng-repeat="page in module.types track by page.url" ng-class="navClass(page)" class="api-list-item expand">
               <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
             </li>
 
             <li class="nav-header section" ng-show="module.globals">
               <a class="global guide">global APIs</a>
               &nbsp;
             </li>
-            <li ng-repeat="page in module.globals<%= trackBy('page.url', "'expand'") %>" ng-class="navClass(page)" class="api-list-item">
+            <li ng-repeat="page in module.globals track by page.url" ng-class="navClass(page)" class="api-list-item expand">
               <a href="{{page.url}}" tabindex="2">{{page.id}}</a>
             </li>
 
@@ -218,7 +221,7 @@
 
         <div id="loading" ng-show="loading">Loading...</div>
 
-        <div ng-hide="loading" ng-include src="currentPage.partialUrl" onload="afterPartialLoaded()" autoscroll class="content" ng-animate="{enter: 'slide-reveal'}" ></div>
+        <div ng-hide="loading" ng-include src="currentPage.partialUrl" onload="afterPartialLoaded()" autoscroll class="content slide-reveal"></div>
 <% if (discussions) { %>
         <div id="disqus" class="disqus">
           <h2>Discussion</h2>